Hacker News new | ask | show | jobs
by nilved 4667 days ago
I was honestly a little baffled to come into this thread and discover people were having trouble with semantic HTML. It's not hard to use, you just need to be inventive with your CSS. A page without divs, spans, strongs and bigs should be everyone's goal.
1 comments
rorrr2 4667 days ago
Could you show us one of your websites "without divs, spans"?
link
verisimilitude 4667 days ago
Not easy, but doable, especially on a straightforward design: e.g. http://tumbledry.org/
link
talmand 4666 days ago
Straightforward design meaning a never-ending single column of content? I would be shocked for such a page to require any creative usage of divs/spans whatsoever.

Also, just curious, what's the point in having a footer that I can never properly see because new content is injected as I scroll down the page?

link
nickloewen 4666 days ago
Re: footer – if you turn js off, it means that a 'more' link appears at the end of the page, leading you to older pages.
link
talmand 4665 days ago
I would rather that the footer either be sticky or the injection of new content not happen. One shouldn't have to disable Javascript to see content, even if it is the footer.
link
Groxx 4666 days ago
Surprisingly readable, both human and machine. Thanks, that's enlightening :)
link
nilved 4666 days ago
I don't have any live right now, so you'll need to take my word when I say I'm been using semantic HTML for more than a decade (since I started coding.) My rules are no divs, no spans, no imgs (unless the image is part of the content rather than the presentation), no empty elements, no spacers, and no non-semantic classes or IDs. When you try it, remember that :after and :before give you the ability to add arbitrary content to a page, be it text or image.

If it sounds hard, remember that people said the same thing about making layouts without tables in the early 2000s. Semantic and compliant HTML means a more accessible website and that's more important than literally anything else in web development.

link
arcavorago 4666 days ago
Still under heavy construction and playing with the layout, so forgive the ugliness of the css at the moment, but here is my personal website which I am attempting to do with good semantics and html5/css3 only, (no js).

http://www.warriors-shade.net

The actual article area will (should) accommodate the semantic tags well (main, article, aside, figure, etc).

link
rorrr2 4666 days ago
That's pretty lame. It just navigation and some text dumped into the body.

I'm not 100% sure, but I think having <nav> outside of <body> is not up to HTML5 standards.

link
arcavorago 4666 days ago
I was just trying to show an attempt at no divs/spans in html, and even said it was ugly and a work in progress, so thanks for your kind assessment. That being said,

1) And what is particularly wrong with that? I said that the design was so that the html5 semantic elements would fit well into the body section, removed from the nav/footer. You might as well just say, "oh, that's just some text dumped into a div,section,etc hoho...".

2) Actually there is no standard regarding this. Maybe a best practice, but not a standard. http://www.w3.org/html/wg/drafts/html/master/sections.html#t...

So it sounds like you want someone to show a certain kind of design done semantically. If that's the case, then you should have said specifically what you were looking for in the first place. eg. 3 columns each with 4 rows without divs/spans, etc. In this case this could still be put into my page, just put classes or id's onto the articles or other elements and manage with css.

It should be noted this is a strange request as well, div's used in the correct way are perfectly valid with html5/css3, so you are unlikely to find anything much more than what I have just shown you...(and again, if that was your original point, you should of just said it in the first place.)

link
dragonwriter 4666 days ago
Implicit body element without an explicit tag as used in the page at issue is, IIRC, consistent with WHATWG HTML, not sure about W3C HTML5.
link
rorrr2 4666 days ago
No, he has this strange structure:

    <header>
        <nav>
        ...
        </nav>
    </header>
    <body>
    ...
    </body>
link
dragonwriter 4666 days ago
When I looked over the source (quickly) it looked like an implicit-body structure. I must have missed the body tags.
link
dukerutledge 4666 days ago
Currently only running in FF because of Fat Arrows and being under dev, but this page only uses divs for the js generated content in the simulation.

http://eborden.github.io/evolution-of-cooperation/

link