SitePoint Sponsor

User Tag List

Page 1 of 3 123 LastLast
Results 1 to 25 of 58
  1. #1
    SitePoint Wizard bronze trophy
    Join Date
    Oct 2001
    Location
    Vancouver BC Canada
    Posts
    2,029
    Mentioned
    5 Post(s)
    Tagged
    0 Thread(s)

    HTML5 Best Practices...

    Ok,.. I'm not jumping all over the HTML5 bandwagon and I don't care to debate why "it's seriously the best thing since mosaic" or "why it's a giant step backwards in standards". I've listened to arguments from both camps and have my own ideas/misgivings about HTML5. What I have done is come to accept that it isn't a matter of if I will use HTML5, it's more of a matter of when will I use it in my development.

    HTML5 with all it has to offer will allow us to do amazing things somewhat easily in modern browsers but what about the not-so-modern browsers that maybe the majority of regular people use? How are we going to develop websites using HTML5 so that when older browsers default back to HTML4 standards there isn't a hole where the media, animations etc... exist?

    I'm really interested in how we're going to roll out our shiny HTML5 websites they will cater to both cutting edge browsers and the older set.

    Thanks,
    Andrew
    Andrew Wasson | www.lunadesign.org
    Principal / Internet Development

  2. #2
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,786
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    As with prior versions of the standards - you have to wait for enough people to use browsers that support the features before you can use them.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  3. #3
    om nom nom nom Stomme poes's Avatar
    Join Date
    Aug 2007
    Location
    Netherlands
    Posts
    10,271
    Mentioned
    50 Post(s)
    Tagged
    2 Thread(s)
    and I don't care to debate why "it's seriously the best thing since mosaic" or "why it's a giant step backwards in standards".
    You mean why
    "it's srsly teh BESTUS THING since Sl1ceD BreaD!!1!!!!1" or "destr0yz teh wereld & cauzez Tsunam1s".

    How are we going to develop websites using HTML5 so that when older browsers default back to HTML4 standards there isn't a hole where the media, animations etc... exist?

    I'm really interested in how we're going to roll out our shiny HTML5 websites they will cater to both cutting edge browsers and the older set.
    Well, by only using the stuff that degrades.
    -short doctype
    -short metas
    -new form element types (they default back to text)
    -canvas if you're just using it for retarded stuff like unicorn rainbows that follow your mouse (srsly tho don't do like that site where if you try to "read" text with your mouse (like people do with their index fingers) you get distracted with srsly retarded canvas stuff behind the text)

    I can't get behind the "wrap the new elements in divs with ids" thing. Since nobody is actually getting any semantic benefit from the newer tags yet (and the one group you may actually care about, screen readers, can haz roles and still they are hiccupping on new HTML5 elements + roles so stick to HTML4 + roles), I don't see the point in repeating everything twice just so you can say "I've got HTML5 elements! Weeeee!" But that's me: you can see Roger Johansson does this on 456bereastreet.com.

  4. #4
    Robert Wellock silver trophybronze trophy xhtmlcoder's Avatar
    Join Date
    Apr 2002
    Location
    A Maze of Twisty Little Passages
    Posts
    6,316
    Mentioned
    60 Post(s)
    Tagged
    0 Thread(s)
    Like Stephen said, you have to wait first before it becomes mainly normative and then another several years before browser market share alters enough makes it feasible. Then scratch your head and ask if JavaScript really means markup, and then realise you'd be mainly still better off using HTML 4.01 for most things.

  5. #5
    om nom nom nom Stomme poes's Avatar
    Join Date
    Aug 2007
    Location
    Netherlands
    Posts
    10,271
    Mentioned
    50 Post(s)
    Tagged
    2 Thread(s)
    Meh, you can totally get away with the stuff I listed above in all currently-used user agents. Lynx included. With some of the new form elements, you get stuff like type="email" bringing up an @ key in iWhatevers and some easier CSS hooks and JS hooks (so long as you don't mind older browsers not getting those styles or scripts).

  6. #6
    SitePoint Wizard bronze trophy
    Join Date
    Oct 2001
    Location
    Vancouver BC Canada
    Posts
    2,029
    Mentioned
    5 Post(s)
    Tagged
    0 Thread(s)
    Really? So for all the fan fair and discussion about HTML5, nobody has come up with a set of specifics on how we can integrate it into the real world without leaving the majority of web users in the dust?

    That sounds like a golden opportunity for a new Book
    Andrew Wasson | www.lunadesign.org
    Principal / Internet Development

  7. #7
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,112
    Mentioned
    448 Post(s)
    Tagged
    8 Thread(s)
    Quote Originally Posted by awasson View Post
    nobody has come up with a set of specifics on how we can integrate it into the real world without leaving the majority of web users in the dust?
    They have. It's done with JavaScript, but it amazes me that even standaristas are using this approach, as it seems to unravel all the work done in the area of graceful degradation / progressive enhancement. Rather than a new book, we just need a new term: "Disgraceful Degradation".
    Facebook | Google+ | Twitter | Web Design Tips | Free Contact Form

    Forum Usage: Tips on posting code samples, images and more

    Forrest Gump: "IE is like a box of chocolates: you never know what you're gonna get."

  8. #8
    om nom nom nom Stomme poes's Avatar
    Join Date
    Aug 2007
    Location
    Netherlands
    Posts
    10,271
    Mentioned
    50 Post(s)
    Tagged
    2 Thread(s)
    It's done with JavaScript,
    And this is why it's 100% fail for me. A user agent should really not have to be required to use a script simply to read markup. It automatically locks out all non-scripting user agents who don't understand HTML5 (and while many newer user agents understand many of the newer HTML5 tags, still not one builds a document-structure correctly based on HTML5). Which breaks the whole wonderfulness of the basic idea from Tim Berners-Lee: that various devices and user agents, no matter who or what or where they are, have access to this central repository of information, by understanding a basic markup language wrapped around the content. Call me a bleeding hippy.

    If my pages can't work with Lynx, they are not web pages. They are something else. So far, our insurance sites are the ONLY ones I could find (of all our competitors) that actually lets you just simply buy vehicle insurance with Lynx. If it works there, it works everywhere. As it should. My company has no business telling customers which software they must use to do something stupid simple that, in decades past, they could do on the phone, through the mail, or in person. If the internet is going to replace these methods (and it slowly is: see banking, commerce), then it must be broadly (not narrowly) accessible.

    I'm so obviously not talking about games or entertainment. That's fun, but not required in daily life. I'm talking about real websites that Do Something People Need.

    For stuff like, My Personal Design Site, go use Remy's shiv. For experiments, use Remy's shiv.
    For games, videos, fun-stupid-timewaste, use Remy's shiv.

    or shim, or whatever people are calling it these days.

    Code:
    <!--[if lt IE 9]>
    <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->

  9. #9
    SitePoint Wizard bronze trophy
    Join Date
    Oct 2001
    Location
    Vancouver BC Canada
    Posts
    2,029
    Mentioned
    5 Post(s)
    Tagged
    0 Thread(s)
    @Stomme poes, I have to agree with you there... Using Javascript as a method to ensure compatibility seems to be a bit of a catch-22 and what I would deem as a decades old hack at best.

    I was more interested in seeing more real world industrial strength solutions like Video For Everybody. The beauty of that is that it relies on the browser's support for HTML (and various mime types). I'm not sure how it will degrade to browsers like Lynx or Konqueror and of course it is depending on browser support for Flash on non HTML5 browsers but if it works for 99% of visitors that's pretty good.

    I stil think this would be a timely topic for a book on doing HTML5 right and not leaving older browsers in the dust.
    Andrew Wasson | www.lunadesign.org
    Principal / Internet Development

  10. #10
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,786
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by awasson View Post
    I stil think this would be a timely topic for a book on doing HTML5 right and not leaving older browsers in the dust.
    And of course if someone were to spend the time writing such a book it would correspond to the period when the HTML5 draft undergoes huge changes with half the current proposals being dropped and several new ones being proposed so that the book will be out of date before it is published. That is just about guaranteed to happen when someone tries to write a book covering a preliminary draft.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  11. #11
    om nom nom nom Stomme poes's Avatar
    Join Date
    Aug 2007
    Location
    Netherlands
    Posts
    10,271
    Mentioned
    50 Post(s)
    Tagged
    2 Thread(s)
    I agree with Felgall that such a book would be best off waiting a bit. I mean, they're actually still fighting over codecs somewhere, and <hgroup> is getting strong opposition... I mean, some stuff is pretty stable but enough isn't that it's a good idea to wait (unless you mean an online book about what someone can try to do today, assuming they're ok with changing/updating that code in 6 mos or so... I mean, right now I've got Bruce&Remy's HTML5 book and it's already so contradicting what they recommend in so many places. Paper was maybe not the best idea there).

    Though hopefully anyone seeing this thread who know more about stuff like that Video for Everyone it would be nice to have some kind of repository of links.

    I suppose such a resource would also of course include Remy's shim/shiv/jive/Clyde.

  12. #12
    SitePoint Wizard bronze trophy
    Join Date
    Oct 2001
    Location
    Vancouver BC Canada
    Posts
    2,029
    Mentioned
    5 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by felgall View Post
    And of course if someone were to spend the time writing such a book it would correspond to the period when the HTML5 draft undergoes huge changes with half the current proposals being dropped and several new ones being proposed so that the book will be out of date before it is published. That is just about guaranteed to happen when someone tries to write a book covering a preliminary draft.
    Well you basically describe every .NET book I've ever bought

    Practices are practices... We know that various elements of HTML5 don't work in older non-HTML5 browsers, that will never change regardless of a spec in draft or not. What I'm proposing will not become obsolete because older browsers are here and well documented. You can look at the various elements of HTML5 and document workarounds for older browsers. I don't see the problem.

    Actually, I see a valuable resource

    Quote Originally Posted by Stomme poes View Post
    Though hopefully anyone seeing this thread who know more about stuff like that Video for Everyone it would be nice to have some kind of repository of links.

    I suppose such a resource would also of course include Remy's shim/shiv/jive/Clyde.
    Exactly!
    Andrew Wasson | www.lunadesign.org
    Principal / Internet Development

  13. #13
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,786
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by awasson View Post
    We know that various elements of HTML5 don't work in older non-HTML5 browsers, that will never change regardless of a spec in draft or not.
    That's true but that wasn't what I was referring to.

    HTML5 is still an early draft and therefore greatly subject to change. THe current draft contains lots of new tags that are not actually necessary. Once enough people try them out and see how unnecessary they are they'll be dropped from the draft. Any book that references those tags will then be referring to tags that are not a part of HTML 5.

    A similar thing happened with an actual web browser with regard to CSS 2. Internet Explorer 5 decided to implement a large part of CSS 2 while it was still an early draft. In between their making that decision and releasing IE5 the draft changed how the box model was supposed to work. IE5 implemented the draft version as it existed at the time the programmers wrote the code and thus quirks mode was born to represent web pages that expected browsers to handle the box model according to the early abandoned draft rather than the correct was according to the standard.

    Any reference to HTML5 at this point in its development is guaranteed to be out of date before it is even published. The review copies would go out and all the reviews would appear saying something along the lines of "well written book, pity HTML 5 no longer has all those useless features and an even bigger pity that the book doesn't cover the many useful features that HTML 5 just adopted".
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  14. #14
    SitePoint Wizard bronze trophy
    Join Date
    Oct 2001
    Location
    Vancouver BC Canada
    Posts
    2,029
    Mentioned
    5 Post(s)
    Tagged
    0 Thread(s)
    I don't think so...

    We have more than one browser that support the fairy dust tags you're referring to and we have influential tech corporations who are pushing HTML5 both in developer communities and in public announcements (read Apple, Google, MSFT).

    I remember all to well Netscape layers and IE5.5 CSS behaviours fiasco however this isn't a competition about one browser supporting a set of tags against another. This time there it appears to be a more consistent rush to support the same set of tags (regardless of whether they are in draft). Have a look at video, audio, source & canvas all of which have partial or full support (even Inline SVG has near full support): Comparison of layout engines (HTML5) - Wikipedia, the free encyclopedia

    So, what's to become of browsers in the wild that currently support and partially support these tags?
    Andrew Wasson | www.lunadesign.org
    Principal / Internet Development

  15. #15
    SitePoint Wizard bronze trophy
    Join Date
    Jul 2006
    Location
    Augusta, Georgia, United States
    Posts
    4,139
    Mentioned
    16 Post(s)
    Tagged
    3 Thread(s)
    My best practices for HTML5 when forced is validate under HTML 4.01 strict and switch the doctype for the reasons already mentioned. I mean… section, aside, nav, header, footer are neat and all but in my opinion they get in the way. Besides, the draft isn't even complete so its not even worth the possible issues down the line since I would be the one updating the code years from now if written to HTML5 and the draft significantly changed – no thanks. I'm fine with using a HTML5 doctype and my mark-p not being as semantic as it could with the extra elements still in draft stage.
    The only code I hate more than my own is everyone else's.

  16. #16
    Non-Member bronze trophy
    Join Date
    Nov 2009
    Location
    Keene, NH
    Posts
    3,760
    Mentioned
    23 Post(s)
    Tagged
    0 Thread(s)
    You almost answered your own question -- which is DON'T. I mean look at Oddz answer -- which is don't, then slap the short doctype on it for.. well, who can figure out why. I mean, if it's valid 4 strict ONLY, what's the point of the retard lip service doctype.

    HTML5 really offers little practical benefit over HTML4 (once you strip away all the stuff CALLED HTML 5 that has nothing to do with markup) -- I still say that's one of it's greatest shortcomings. Sure some of the form stuff is neat, but since ALL of that needs to be checked again server side (since you cannot EVER trust client side validation) what's the point? Apart from that, all the interesting bits and pieces of it fall into two categories...

    1) Offer no real benefit over HTML 4.

    2) Have NOTHING to do with markup... like CANVAS (which being useless without javascript shouldn't even HAVE a tag), scripting controls for AUDIO and VIDEO (which again make me ask why the devil isn't that on OBJECT), etc, etc...

    So the proper answer at this point is DON'T. It's cute to play with, but don't use it for deployment yet... if ever.

  17. #17
    om nom nom nom Stomme poes's Avatar
    Join Date
    Aug 2007
    Location
    Netherlands
    Posts
    10,271
    Mentioned
    50 Post(s)
    Tagged
    2 Thread(s)
    I remember all to well Netscape layers and IE5.5 CSS behaviours fiasco however this isn't a competition about one browser supporting a set of tags against another.
    Heh, you've been missing how much each browser proclaims how much HTML5 they support. It's a race, it's a competition, it's a war.

    Yeah, browser wars. Again.

    I mean, if it's valid 4 strict ONLY, what's the point of the retard lip service doctype.
    Cause the minimalist look is in. See current browsers' chrome setups. Abtholutely fabulouth.

    Besides, if we're only using that doctype for the validators, then why not use a shorter doctype? It's not like browsers give a rat's...

    Sure some of the form stuff is neat, but since ALL of that needs to be checked again server side (since you cannot EVER trust client side validation) what's the point?
    Every time someone f's up a form, their chances of leaving the site increase (everyone who researches shopping carts has seen this).
    Whether it's Javascript or new form tags, the point is to help the user put the right information in the right form in the right place the FIRST time. Ideally your back-end validation runs, but just once.

    Offer no real benefit over HTML 4.
    Today, this is true. However I'll concede that if we end up with a bunch of user agents who understand both the newer tags AND the new "HTML5 document structure" (maybe this is an if rather than a when), then these newer tags could indeed make markup more semantic.

    Then again, people have trouble with the current tags, so, meh.

  18. #18
    Non-Member bronze trophy
    Join Date
    Nov 2009
    Location
    Keene, NH
    Posts
    3,760
    Mentioned
    23 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Stomme poes View Post
    Every time someone f's up a form, their chances of leaving the site increase (everyone who researches shopping carts has seen this).
    Whether it's Javascript or new form tags, the point is to help the user put the right information in the right form in the right place the FIRST time. Ideally your back-end validation runs, but just once.
    True to an extent, but if the form and data are so big it takes long enough to send/recieve to the server that such a problem has an effect, the problem likely lies with a fat bloated page of nothing with a 100:1 page to content ratio -- so throwing more code at it isn't the answer.

    Which admittedly is more of an issue for the people using javascript now -- something HTML5 DOES address with it's validation stuff; it's sure as shine-ola going to kick a lot of stuff people are throwing scripting at for no good reason to the curb -- But I'm not convinced it's the proper solution in most cases.

    Kind of ties into this... fear developers seem to have of page refreshes now. It was cute on things like quick-replies in forums, but it's increasingly being thrown at EVERYTHING when frankly, it's taking MORE bandwidth and LONGER thanks to the need for more code to make it work in the first place, and it's just not as useful.

    But again, if your markup is so bloated and your so reliant on scripts to even get the page to render that it takes too long for a simple server refresh, throwing more code at it is NOT the answer.

    That's how we end up with the people out there using 1.2 megabyte pages in 100 separate files to deliver 10k or less actual content.

  19. #19
    SitePoint Wizard bronze trophy
    Join Date
    Oct 2001
    Location
    Vancouver BC Canada
    Posts
    2,029
    Mentioned
    5 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Stomme poes View Post
    Heh, you've been missing how much each browser proclaims how much HTML5 they support. It's a race, it's a competition, it's a war.

    Yeah, browser wars. Again.

    And we come round full circle to the reason I posted this topic.

    The spec might still be in draft but it's already supported and the industry... "leaders" have been proclaiming it as the second coming for more than a year now. Some online "authorities" (note the use of quotes) are urging developers to start using HTML5 right now however the question still remains, how can we do that and still support backwards compatibility?
    Andrew Wasson | www.lunadesign.org
    Principal / Internet Development

  20. #20
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,786
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by awasson View Post
    however the question still remains, how can we do that and still support backwards compatibility?
    The answer to that is the same as it has always been. Don't expect all browsers to support the new features and make sure the page still works without them.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  21. #21
    SitePoint Wizard bronze trophy
    Join Date
    Jul 2006
    Location
    Augusta, Georgia, United States
    Posts
    4,139
    Mentioned
    16 Post(s)
    Tagged
    3 Thread(s)
    Quote Originally Posted by deathshadow60
    you almost answered your own question -- which is DON'T. I mean look at Oddz answer -- which is don't, then slap the short doctype on it for.. well, who can figure out why. I mean, if it's valid 4 strict ONLY, what's the point of the retard lip service doctype.
    The people upstairs would like to here new things are being created in HTML5 – don't ask.
    The only code I hate more than my own is everyone else's.

  22. #22
    SitePoint Wizard bronze trophy
    Join Date
    Oct 2001
    Location
    Vancouver BC Canada
    Posts
    2,029
    Mentioned
    5 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by felgall View Post
    The answer to that is the same as it has always been. Don't expect all browsers to support the new features and make sure the page still works without them.
    That's my point

    I realize that even if all of the vendors next update supports the entire HTML5 draft there will be millions of browsers that don't. Has anyone on the HTML5 cheerleading squad come up with methods to support backwards compatibility or even philosophized how that may occur?

    What we have so far is:

    Andrew Wasson | www.lunadesign.org
    Principal / Internet Development

  23. #23
    om nom nom nom Stomme poes's Avatar
    Join Date
    Aug 2007
    Location
    Netherlands
    Posts
    10,271
    Mentioned
    50 Post(s)
    Tagged
    2 Thread(s)
    Quote Originally Posted by Crusty
    Kind of ties into this... fear developers seem to have of page refreshes now.
    I know, it starts with an A and ends with a JAX.

    If a form is really that long and complicated, even I will start thinking of breaking up sections in separate pages (I usually hate that, stringing the user along, but here you can get submissions and validation for each "chunk" of data). You can layer your ajaxy junk on top of that if the boss insists on the pretty spinny-gif and new form questions appear under the last-answered one (a la twitter, duckduckgo, facebook).

    Quote Originally Posted by awasson
    The spec might still be in draft but it's already supported and the industry... "leaders" have been proclaiming it as the second coming for more than a year now.
    The second coming indeed. This has a name: hype. Doesn't mean there's nothing behind it, but c'mon, the job ads I've been seeing lately make the milk squirt out of my nose from lawlz. XHTML has been replaced with HTML5, CSS has been replaced with CSS3, and Javascript has been replaced with jQuery. Blargle.

  24. #24
    I solve practical problems. bronze trophy
    Michael Morris's Avatar
    Join Date
    Jan 2008
    Location
    Knoxville TN
    Posts
    2,022
    Mentioned
    62 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by felgall View Post
    As with prior versions of the standards - you have to wait for enough people to use browsers that support the features before you can use them.
    Or you're lucky like me, write pages for a corporate Intranet, and get to dictate which browser the users have available.

    Course jerks that preceded me dictating IE 6 started a lot of this mess.

  25. #25
    SitePoint Member
    Join Date
    Jul 2010
    Location
    Bolton - UK
    Posts
    23
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    On the website I'm developing at the moment I've decided to go the HTML 5 route. I don't think that using the shiv is that much of a concession really. Especially when it's just for the one browser - IE 8 and below.

    The new elements work in the other browsers out of the box, you just simply need to apply display:block to them (header, footer, section etc). The only browser I've hit a roadblock with is the Playstation 3. I don't have a solution for that browser yet though. I don't know of any conditional comments you can use for it etc.

    Obviously I do think backward compatibility is important but a javascript fix to fix an issue with one browser (a browser that's held back standards long enough already) isn't that bad of a solution. I'd prefer it if I didn't need to apply a javascript fix but I think it's worth the effort to use it.

    I know I'm currently in the minority there but there we go. Likewise I'm using some of the new CSS3 styling to provide a better experience for those using newer browsers. I think doing corners with CSS is much better solution than trying to do it with images or javascript.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •