Prehistory
The search for a topic indicated in the title led me to the task of creating a calendar for our reporting system. What is remarkable, my actions almost exactly repeated the actions of the author of the article, which I found and translated (under the cut).
Having risen to the task of creating a calendar, I, too, “thought anti-tabular,” and after not long deliberation I made a calendar from the list. But by the end of the working day and all the ordeals, I pereklinilo on the way home, too, as the author of the article - and what about the days of the week?
Along the way, I pondered this question and formulated a request for Google - calendar table or list.
The very first link attracted me and confirmed my views on the fact that the calendar is still a table and not a list.
I do not pretend to originality, of course, and perhaps this topic has already been raised, but it is precisely in this section that I have not yet met it. In the Russian-language part of the Internet, I somehow read the
Neutrino article about his experience in calendaring , then I was surprised at the proposed solution, but unfortunately then I thought about semantics a little)
To prevent possible future misconceptions, I decided to translate the found article, since it is quite convincing and reveals a fairly fully covered topic. I hope also to your criticism of the translation, as with the translation I have everything going wrong, in my opinion)
Often, when a developer first starts using HTML and CSS as intended for layout and design, he, or she, tends to abandon tables and avoid using them at all costs. Since they believe that such a path will allow the developer to find many creative approaches to the use of the newly acquired power of CSS. This can give someone a strong inconvenience.
Is this data tabular or not?
')
The next step for the developer is to start thinking about the meaning of the content being tagged, and choose the most semantic solution. If the data is tabular in nature, mark it like this, do not be afraid! The tables are not evil, it is not their fault that they have been abused for many years. When I first started using CSS, I was delighted with its capabilities and wanted to use them wherever possible. I came up with several solutions for simple problems, and I’m sure that other developers can say the same thing.
I say the calendar is a table
The fact is that it is tabular in kind data, and should be marked accordingly. One example that I would like to talk about is the monthly calendar. When, after learning CSS, I was asked to create a calendar, the first thing I wanted to use was an ordered list (OL). I thought “anti-public”, and spent the next few hours coming up with a fairly good-looking calendar based on an ordered list. The only trouble was semantics.
Then everything seemed right; the calendar really was just a list of days for the desired month, from first to last, how can it be a table? What I did not take into account is the items on the additional list above to create the days of the week. I also did not think about how the calendar will look like in a text browser. I was a CSS fanatic and didn’t want to see these tables again.
Why is the calendar a table?
In my opinion, the calendar should definitely be considered tabular data. Dates are placed in a specific place in the grid, based on what day of the week they are on. Only one day in a certain position on the grid, and they do not overlap. The name of the month and the days of the week can be included in the heading of the table, because this is what they are - headings. They give meaning to the data below, providing an explanation of which day of the week corresponds to the date.
Some notes about Accessibility
The “tabular” calendar also looks better in text browsers, unlike the list. When you see a calendar “on lists” in a text browser, you get a list of days, followed by arbitrary content related to a particular day. This is fine, but you are losing convenience, not knowing what day of the week this or that date corresponds to (the list of days of the week is now at the top, made a list). Displaying the “tabular” calendar in a text browser is the same as in a modern browser that works with CSS. Headings in the table make it easier to understand the content and information is organized as you need.
Considering that I do not have access to the voice browser, I am not sure that the “tabular” calendar is suitable for people with impaired vision. However, using the
Fangs we can make a great analysis. First, information is given directly regarding the table; description (summary), the number of lines, columns and headings of the table. Then you go by day. Unfortunately, we lose the advantage - to know on which day of the week this or that date falls.
What i'm trying to say
In general, I think that the signs of the calendar go well with what the tables offer. In my opinion, the calendar is semantically a table, and therefore should be marked accordingly. A calendar based on lists is not effective, if only because it requires the inclusion of additional items to create days of the week. The argument for this may be that you do not need the days of the week, since you, for example, have little space on the panel. Personally, I do not think this is a good excuse. If you do not need the headers of the days of the week, then set display: none for thead. Always have semantics in mind, it will be of great help, after all.