Live data from Hacker News

The ﹤main﹥ element

html5doctor.com

11–20 of 93 posts

Re: The ﹤main﹥ element

#11
post #4

Has anyone used all of the HTML5 tags in anger? I've tried a couple of times to build something fully "semantic". I struggle to create something that looks good semantically (ie just reading the HTML) and is also laid out on the page in the way I wanted it to be. There seem to be lots of situations, even in just mildly complicated web pages, where you need to write HTML code solely for graphics / layout reasons that…

I think that CSS is the biggest failure here. Let's say I have a blog, so for article page markup should be something like this:

    
        lorem ipsum
        
        search
        
    
That way screen readers, search engines, etc will get the important stuff first and less important stuff afterwards.

But since the common way of presenting blog is more like this:

            search
    
    
I either have to do some hacky position:absolute things, crazy floats with negative everything, or just reorder the markup. Crazy and hacky is not fun to maintain, so I have to reorder the markup. That's because CSS is made for changing fonts and colors, and not for layouts.

Re: The ﹤main﹥ element

#12
post #4

Has anyone used all of the HTML5 tags in anger? I've tried a couple of times to build something fully "semantic". I struggle to create something that looks good semantically (ie just reading the HTML) and is also laid out on the page in the way I wanted it to be. There seem to be lots of situations, even in just mildly complicated web pages, where you need to write HTML code solely for graphics / layout reasons that…

I think that CSS is the biggest failure here. Let's say I have a blog, so for article page markup should be something like this: lorem ipsum search That way screen readers, search engines, etc will get the important stuff first and less important stuff afterwards. But since the common way of presenting blog is more like this: search I either have to do some hacky position:absolute things, crazy floats with negative e…

I think you should try using WAI-ARIA standards[0] instead. That way you can keep your structure the same and give screen readers and such a better description of what's going on in your page.

[0]: http://www.w3.org/WAI/intro/aria

Re: The ﹤main﹥ element

#13
post #4

Has anyone used all of the HTML5 tags in anger? I've tried a couple of times to build something fully "semantic". I struggle to create something that looks good semantically (ie just reading the HTML) and is also laid out on the page in the way I wanted it to be. There seem to be lots of situations, even in just mildly complicated web pages, where you need to write HTML code solely for graphics / layout reasons that…

I think that CSS is the biggest failure here. Let's say I have a blog, so for article page markup should be something like this: lorem ipsum search That way screen readers, search engines, etc will get the important stuff first and less important stuff afterwards. But since the common way of presenting blog is more like this: search I either have to do some hacky position:absolute things, crazy floats with negative e…

Flexbox[1] addresses the issue you're talking about - of course, browser support is still a little lacking (No support for IE9 or below, and IE10 doesn't conform to the current spec).

[1]: https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Flexi...

Re: The ﹤main﹥ element

#14
post #4

Has anyone used all of the HTML5 tags in anger? I've tried a couple of times to build something fully "semantic". I struggle to create something that looks good semantically (ie just reading the HTML) and is also laid out on the page in the way I wanted it to be. There seem to be lots of situations, even in just mildly complicated web pages, where you need to write HTML code solely for graphics / layout reasons that…

Much of the graphical froufrou can be done using the before and after pseudo elements (which is one of the reasons I'm sort of disappointed that the HTML for the newer designs on the CSS Zen Garden has remained the same, complete with extra divs and spans strictly for styling).

Re: The ﹤main﹥ element

#15
post #4

Has anyone used all of the HTML5 tags in anger? I've tried a couple of times to build something fully "semantic". I struggle to create something that looks good semantically (ie just reading the HTML) and is also laid out on the page in the way I wanted it to be. There seem to be lots of situations, even in just mildly complicated web pages, where you need to write HTML code solely for graphics / layout reasons that…

I've tried and failed miserably (so far) to use the tags also. It seems they are optimized for a single use-case: single, magazine-style, pages or blog posts. Anything other than this and it starts to fall apart pretty rapidly.

The alternative would appear to be micro (macro) formats which would offer more flexibility but obviously the chances of standardization on a widespread basis would appear to be remote.

Given the diversity of web-page content perhaps the goal of a semantic web is simply unattainable - at least in the short-term.

Re: The ﹤main﹥ element

#17
Somewhat interesting, perhaps, is the fact that this page itself has the following markup:

    
        
        ...
I, too, have tried to use semantic markup. Unfortunately, except for the most straight-forward of layouts, it's very hard to do. Though I guess there was also a time when non-table-based layouts was considered harder than it was worth...

Re: The ﹤main﹥ element

#18
post #16
post #10

it's annoying that it can't be used more than once per page. It would be useful to also have a element, e.g. ... ... ...

It can be used more than once per page: http://www.whatwg.org/specs/web-apps/current-work/multipage/...

W3C states explicitly that it can't so this is yet another instance where whatwg and w3c disagree leaving developers wondering what to do. https://developer.mozilla.org/en-US/docs/Web/HTML/Element/ma...

Re: The ﹤main﹥ element

#20
Firefox 21, Chrome 26, and a WebKit r140374 have all implemented basic support for .

They have all mapped the ARIA role="main" to the element so assistive technologies can now recognise the element without issue.

Post reply on HN