4 ms·

Could you show us one of your websites "without divs, spans"?

by rorrr2 13y ago

verisimilitude 13y ago
Not easy, but doable, especially on a straightforward design: e.g. http://tumbledry.org/ http://tumbledry.org/
- talmand 13y 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?
  - nickloewen 13y 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.
    - talmand 13y 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.
- Groxx 13y ago
  Surprisingly readable, both human and machine. Thanks, that's enlightening :)
arcavorago 13y 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 http://www.warriors-shade.net The actual article area will (should) accommodate the semantic tags well (main, article, aside, figure, etc).
- rorrr2 13y 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.
  - arcavorago 13y 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#the-nav-element 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.)
  - dragonwriter 13y 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.
    - rorrr2 13y ago
      No, he has this strange structure: <header> <nav> ... </nav> </header> <body> ... </body>
nilved 13y 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.
dukerutledge 13y 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/ http://eborden.github.io/evolution-of-cooperation/

Could you show us one of your websites "without divs, spans"?

by rorrr2 13y ago

Could you show us one of your websites "without divs, spans"?

verisimilitude 13y ago

Not easy, but doable, especially on a straightforward design: e.g. http://tumbledry.org/ http://tumbledry.org/

talmand 13y 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?
- nickloewen 13y 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.
  - talmand 13y 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.
Groxx 13y ago
Surprisingly readable, both human and machine. Thanks, that's enlightening :)

arcavorago 13y 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 http://www.warriors-shade.net The actual article area will (should) accommodate the semantic tags well (main, article, aside, figure, etc).

rorrr2 13y 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.
- arcavorago 13y 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#the-nav-element 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.)
- dragonwriter 13y 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.
  - rorrr2 13y ago
    No, he has this strange structure: <header> <nav> ... </nav> </header> <body> ... </body>

nilved 13y 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.

dukerutledge 13y 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/ http://eborden.github.io/evolution-of-cooperation/