Hacker News Reader

Comment by c2prods | Hacker News Reader

You're entirely right. I'm just used to the old way, but I guess I'm a bit of an eccentric. I'll try to update the repo asap. (Anyway, I think the HTML architecture could be streamlined, my point was more to demonstrate the css possibilities)

View on HN

And you did a really great job with the CSS. But I know that many young people who are starting with HTML/CSS will be hugely impressed by your examples and will try to copy them. And because they see the div-soup in your examples they will assume that this is how you're supposed to write modern HTML. In the end they see the most modern look in the examples, so I wouldn't even blame them for thinking like that.

It would be sad if they learned to write non-semantic HTML and I think we all who write examples on the net should try to write great examples :)

And in fact we should do it with all the HTML which is online because we all learned HTML and CSS from right click "View Page Source" :D

You're 100% right. I don't have enough time to do that this evening (it's 8pm in France), so I'll give it a look tomorrow :)

Note that opinions differ on this. Personally I think semantic HTML is nothing but meeting-bait. If you try to be diligent about it you end up in discussions and meetings around whether a certain element should be a figcaption tag should be used or aside etc... And at the end of these types of discussions, regardless of the outcome, nothing that has any actual effect has been changed. It will make zero practical difference whether you use semantic HTML or not. The only thing seemingly affected are imaginary mobile devices that render <nav> differently than <div> or imaginary screen readers that can't read text unless it's in a <figcaption> tag.

It kind of sounds like saying: "Why should I learn math, I will never use it anyway." It might be true, but that is not a good excuse for not learning it. And it is not like using semantic HTML is in any way more work or something, it at least has the benefit of being easier to read and thus maintain.

The code is just cleaner with HTML5 markup. I've updated the project, it's more readable this way :)

That's very different. Because there are circumstances where not knowing or applying math is a barrier to accomplishing something. Saying "Why should I learn math, I will never use it anyway." means you're banking on the odds that you will never run into those circumstances.

However when it comes to semantic HTML there is no circumstance where you are unable to move forward because you used <div> instead of <figcaption>.

In fact thanks to the sometimes ambiguous descriptions of which semantic tag is appropriate you may find you used the wrong semantic tag which is arguably worse than not using a semantic tag at all.

And at the end of the day after carefully cross referencing and/or memorizing which semantic tag to use throughout your markup zero real world, practical effect has been gained. Only theoretical gains and memorization for memorization's sake.

It sounds like to be save one should only use <div> and <span> tags, style them with CSS and forget about semantics?

It is obvious to me that this is the wrong approach. And I have never said he should use <figcaption> I said he should use appropriate HTML5 tags. If something is obviously a header, use <header> if not, don't. But building everything out of <div>s like it was in his first example code is just making it more difficult to read, there is no gain in just using <div> for everything.

"It sounds like to be save one should only use <div> and <span> tags, style them with CSS and forget about semantics?"

Yeah exactly.

"It is obvious to me that this is the wrong approach."

Semantic HTML essentially boils down to "You should because you should."

"I said he should use appropriate HTML5 tags."

To what practical benefit aside from personal aesthetic preference?

"there is no gain in just using <div> for everything"

The gain is not having to memorize or reference which semantic tag goes where, nor having to go back and refactor or maintain semantic tags.

btw. I wonder if this would also work as smooth as it does now in webkit, when you would add all the -moz- to it and then test it on a Firefox OS phone.

Mmmh, I'd love to hear a feedback if someone does that. I don't have a firefox OS phone, so I can't tell, but I tested it on an iPhone 4 with iOS 7 beta 6 and I think it's a limit. Of course iOS 7 is not the lightest system on earth but even on more optimized OS like iOS 6, I think the weakest hardware will struggle to process it correctly.

I'm owning a geeksphone keon. Will try this tomorrow. :o)

Great! I'll be happy to know how it works :)

Works now on FFOS, see:

http://youtu.be/2Bhy2wvwDoU

Runs smooth, comparable with Firefox Desktop Browser. But the scrollMask doesn't fade nicely and I have no clue why this happens. You can reproduce it using regular Firefox Browser (use Tools > Web Developer > Responsive Design View).

Changes on github: https://github.com/c2prods/Project-Tyson/pull/4

Reply on news.ycombinator.com