1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

About html & html5

Discussion in 'HTML & Website Design' started by khalil5172, Aug 17, 2013.

  1. #1
    Almost new designer (like me) ask a question i.e. what is the basic difference between html & html5? Is html over? should we learn html5 rather than html?
    So, I am looking for help. Thanks
    khalil5172, Aug 17, 2013 IP
  2. akselsson

    akselsson Member

    Messages:
    19
    Likes Received:
    4
    Best Answers:
    0
    Trophy Points:
    28
    #2
    HTML in itself is a markup language to make web pages. It's not a real programming language so it's usually very easy to learn. HTML5 is just the latest version of HTML. There are some additions to HTML5 that the older HTML4 doesn't have. That said, when you learn HTML(4), you'll pretty much learn HTML5 too, because the difference is not substantial. Mainly some tags and attributes for better media handling are new in HTML5. Don't sweat over them, just start learning the "conventional" HTML and you'll learn HTML5 also.

    By the way, you can tell the browser which version of HTML you are using on your website with the <DOCTYPE> tag. If you create a website with DOCTYPE HTML4 and validate the site as valid HTML4 and then change the DOCTYPE tag to HTML5 and revalidate, you'll probably still get valid code. That's because the differences are small between HTML4 and HTML5. Not saying it will be perfect HTML5 this way as the typical HTML5 tags such as <header> <footer> <nav> will be missing, but still working code.

    In essence, if you are in the beginning, I'd suggest to start learning the conventional HTML with HTML5 in mind. That's probably what you would do in any case because you can't just learn HTML5 from the scratch without knowing the basic HTML tags.
    akselsson, Aug 17, 2013 IP
  3. rajku

    rajku Member

    Messages:
    37
    Likes Received:
    3
    Best Answers:
    1
    Trophy Points:
    33
    #3
    Totally agree with Akselsson. If you want to get started with html or html5 then www.w3schools.com can be a good place to check out. It has some nice information regarding the same. I like the point that its quite brief in stuff and give you quite a view about what you are looking for. Cheers!
    rajku, Aug 19, 2013 IP
  4. khalil5172

    khalil5172 Member

    Messages:
    23
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    31
    #4
    Thank you for great reply! and I am also looking for what others saying.
    khalil5172, Aug 19, 2013 IP
  5. khalil5172

    khalil5172 Member

    Messages:
    23
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    31
    #5
    Thanks for giving importance the discussed issue and of course I am not opposed to you
    khalil5172, Aug 19, 2013 IP
  6. hostswinds

    hostswinds Member Premium Member

    Messages:
    10
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    36
    #6
    Much of what has been mentioned. HTML5 is the same thing as HTML, it is just the newest version. Hyper Text Markup Language is just the language used to code, program, and to an extent, design the websites. Another good tool to use for learning HTML/HTML5 would be codeacademy.
    hostswinds, Aug 19, 2013 IP
  7. khalil5172

    khalil5172 Member

    Messages:
    23
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    31
    #7
    Thanks
    khalil5172, Aug 19, 2013 IP
  8. Tim Gallant Creative

    Tim Gallant Creative Member

    Messages:
    50
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    28
    #8
    In the most technical sense, there is no such thing as HTML5, although on the ground everyone talks that way. It appears we've moved beyond version numbers to evolution of the specs. What gets called HTML5 is a dramatic advancement in the spec that had a public working draft in 2008 and in fact is still being tinkered with.

    Definitely learn HTML5, because the things that contribute to semantic sites are backward compatible. (HTML has always had the ability to display nonstandard tags as block elements, so the introduction of things like nav, section etc won't break anything.)

    Beyond those tags, however, you will need "shims" or "polyfills" to make older versions of browsers (especially Internet Explorer) fully support the new features.

    Some of the more experimental stuff, I wouldn't touch because it may change (and frankly most of that is not the sort of stuff that a new developer is going to use anyway), but a fair amount of it is pretty much set in stone. When in doubt, check the status of a given spec at the W3 site.
    Tim Gallant Creative, Aug 21, 2013 IP
  9. khalil5172

    khalil5172 Member

    Messages:
    23
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    31
    #9
    Thanks Tim Gallant, for your well justified opinion. What I have seen from others, most of them had tried to give a clear sense that html5 nothing more than old html. As you said, its big support to make old browser more interactive and functional. Another things you all have pointed it out that everything are in w3 site. Thanks again.
    khalil5172, Aug 21, 2013 IP
  10. deathshadow

    deathshadow Prominent Member

    Messages:
    5,976
    Likes Received:
    824
    Best Answers:
    144
    Trophy Points:
    395
    #10
    First, I hope when people say W3 site they mean the W3C and NOT W3Schools, a complete unrelated steaming pile of outdated, outmoded and outright rubbish nube predation... Of course since most people don't even know that W3C is an abbreviation for "World Wide Web Consortium"... Saying "World Wide Web" (W3) site is a bit vague/meaningless at best.

    Second, HTML 5 just adds new stuff to the existing HTML, and in doing so is adding a bunch of pointless idiotic REDUNDANT code bloat tags (SECTION, NAV, FOOTER, ARTICLE, ASIDE), presentational tags (MARK, ASIDE), tags that shouldn't even EXIST since they are useless without scripting and as such redundant to NOSCRIPT (CANVAS, PROGRESS, DIALOG, OUTPUT), serve so narrow a purpose there's no legitimate reason to use them 99% of the time people do (FIGURE, FIGCAPTION), piss all over accessibility and destroy logical document structure (go ahead, use H1 anywhere multiple times, the idiocy of HGROUP), moves crap client side that has NO BUSINESS CLIENT SIDE (keygen), or re-introduces redundancies that HTML 4 STRICT was trying to eliminate! (AUDIO and VIDEO), making 'optional' bits that actually served a legitimate purpose in the header, destroying the meanings of half the tags (CITE comes to mind) making them vague and encouraging misuse,

    Quite literally HTML 5 is the legitimization of the WORST pre- HTML 4 Strict coding practices, and is carefully crafted to satiate the wants and desires of the people who never pulled their heads out of 1997's backside - the people who until quite recently were sleazing out HTML 3.2 and slapping 4 tranny on it. Now they wrap 5's lip-service around it while crapping out the same idiotic outdated coding methodologies for zero net improvement in code clarity, functionality, usability or minimalism.

    It sure as shine-ola wasn't made for anyone who actually embraced HTML 4 Strict / XHTML 1.0 Strict, semantic markup, separation of presentation from content, proper leveraging of caching models, logical document structures, or any of the dozens of other improvements of the past decade and a half...

    ... which is why whenever someone calls HTML 5 "the future" I have to say "REALLY?!? Looks more like 1997 to 2001 to me!". Of course, since it's written for/by browser makers instead of people actually making websites, it's hardly a shock to see the same nonsense from the peak of the netscape vs IE feud re-introduced. Given the crap they've re-introduced, I'm waiting for them to greenlight the use of FONT and CENTER again -- that's how stupid it is!

    Despite the handful of actually useful bits like MANIFEST (which only matters if you're making crapplets) and CANVAS (which is only useful with scripting so should we REALLY have a tag for it?) overall it's some of the most idiotic half-assed garbage I've seen in a so-called "specification" -- tie in the idiotic halfwit nonsense of stripping versioning and being 'documentative' instead of 'authoritative' it takes giant brass monkey balls the size of the moon to even call it a 'specification'. Though that last part could be my engineering background talking!

    Praise be cars and buildings aren't built with the same level of ignorance, apathy and ineptitude.

    See the "HTML 5" link in my signature for a more detailed explanation of just why HTML 5 is idiotic halfwit nonsense I cannot fathom how anyone is DUMB ENOUGH to see significant merit in the use of it!

    WhatWG? Sounds more like "WhatTFWG" to me... Which is why I have ZERO plans to migrate past XHTML 1.0 STRICT for the forseeable future. MAYBE when "HTML 6" comes along and deprecates/obsoletes all the pointless bullshit added by 5, I'll give a look.
    deathshadow, Aug 23, 2013 IP
  11. deathshadow

    deathshadow Prominent Member

    Messages:
    5,976
    Likes Received:
    824
    Best Answers:
    144
    Trophy Points:
    395
    #11
    Uhm... no... oh **** no even?!? There's a reason the shiv for older IE has CSS to SET the new tags to display:block?"

    They are treated either as nonexistant/ignored (what every spec 4/earlier says they should be) or as inline-level. The ability to shiv them in legacy browsers by setting them to display:block is exploiting a BUG from the fallback to SGML, NOT anything the specification ever said about their handling.

    ... and without the shiv they sure as hell can break things, since wrapping block-levels in inline-level can trip all sorts of bugs and errors people end up hacking around (just like even comments between sibling level elements can) -- no matter what the re-re's behind HTML 5's creation claim! (even some of the more level headed dev's out there, like Paul O’Brien over at Sitepoint agree with me on this one)
    deathshadow, Aug 23, 2013 IP
  12. Tim Gallant Creative

    Tim Gallant Creative Member

    Messages:
    50
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    28
    #12
    You're way off base. It's divs that are non-semantic. Section, nav, article, aside etc all have semantic meanings. Even if it's going to take a bit to get everyone on board with best practices, it is a HUGE improvement over divs all over the place.

    By the way, hgroup was removed from the spec some time ago.
    Tim Gallant Creative, Aug 23, 2013 IP
  13. deathshadow

    deathshadow Prominent Member

    Messages:
    5,976
    Likes Received:
    824
    Best Answers:
    144
    Trophy Points:
    395
    #13
    You should use DIV or SPAN BECAUSE they do not change the meaning of what they are wrapping -- presentational hooks WITHOUT saying what that presentation IS. Those allegedly semantic new tags are REDUNDANT TO EXISTING SEMANTIC TAGS -- like numbered headings and HR. If people would get a blasted clue about what numbered headings ARE, how to use them IN A LOGICAL ORDER, and use HR when a numbered heading is unwarranted, NAV, SECTION, ARTICLE and even ASIDE are all just pointless code bloat -- in most cases being slapped around things that shouldn't have a DIV either. (NAV in particular is bad for that -- see all the folks who don't seem to realize that UL is a perfectly good block level container unto itsefl!) -- all it does is encourage people to slap in extra wrappers for no reason like they're still sleazing out their late '90's early '00's style HTML 3.2 with a 4 tranny on it.

    Which is why I consider the new allegedly semantic "structural tags" to in fact either be little more than code bloat, or just plain outright PRESENTATIONAL markup!

    We have MORE than enough semantic tags in HTML 4 -- the problem is nobody can be bothered to use them properly, when people can't be bothered to use h1..h6, hr, caption, legend, th, label or any of the other tags we already have properly, adding more tags to the equation is NOT THE ANSWER!!!

    Well, that's at least one bit of nonsensical BS down -- only two dozen more to go.

    -- edit -- Wait, couldn't have been THAT long ago... GiS... aha, April. So that's fairly recent. More recent that I'd have given flying purple fish about.
    Last edited: Aug 23, 2013
    deathshadow, Aug 23, 2013 IP
  14. Tim Gallant Creative

    Tim Gallant Creative Member

    Messages:
    50
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    28
    #14
    The previous tags were sufficient—IF all there was on a page was a self-contained article. Then indeed all you need are heading tags, paragraphs etc. But we all know that scarcely a web page on the face of the earth can suffice with a self-contained article. At the very least, it's going to have navigation and site identification etc. HTML4 tags did zero to indicate in the code what meant what. nav does. header does. footer does. Indeed, although possibility of misuse is there, article DOES have semantic, not presentational, meaning, as does section. I'll take all those tags in exchange for div every day of the week, no matter how badly other people are using them, because div is just markup crap.

    I'm ALL with you on the extra wrappers issue. But the problem is not with nav. That's doing exactly what it says, precisely what its name indicates. Frankly, it's far more semantic than calling a set of links an "unordered list," since the fact that there are multiple links is completely incidental and not of the nature of what navigation is. It would be like saying that if you have multiple paragraphs in your article, it should be set as an unordered list.

    The fact of the matter is that there will ALWAYS be people that write unsemantic code, just as there will always be people who mispronounce things, use bad grammar, have bad work habits, ad infinitum. That has nothing at all to do with whether the language (English or HTML) is good or bad.

    But I suspect you enjoy ranting, so it really doesn't matter much what anyone says. :)
    Tim Gallant Creative, Aug 23, 2013 IP
  15. Tim Gallant Creative

    Tim Gallant Creative Member

    Messages:
    50
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    28
    #15
    And I really mean that about extra wrappers etc. I haven't been using HTML5's structural tags all that long, but that's one of the things that really makes me happy about it. As I'm figuring things out, I'm rapidly approaching the place where I won't have to introduce anything except semantic markup except for the most complex of designs. (Here's a concrete example: http://thenashvillewebdesigner.com/css-experiments/all-semantic-no-wrapperdiv-layout/)

    The exception is the <span> tag, which I still find myself needing for subheadings, in particular. <hgroup> did attempt solve that, but I actually agree with you that its approach was a bad idea and in fact missed the point regarding what was obviously needed. Since when was a subheading a second-level heading? That's a brain fart. It seems plainly obvious (to be redundant) that what we need is an inline <subhead> tag that you could apply inside the heading tags (well, at least h1 and h2; it's hard for me to imagine needing subheadings on low level headings, but I suppose somebody would find a use).
    Tim Gallant Creative, Aug 23, 2013 IP
  16. deathshadow

    deathshadow Prominent Member

    Messages:
    5,976
    Likes Received:
    824
    Best Answers:
    144
    Trophy Points:
    395
    #16
    Which is why we have SIX heading levels, to indicate the start of subsections. H1 the page, h2 indicating starts of subsections of the page, h3's indicating the starts of subsections of the H2's. Articles either having their starts indicated

    Which is why we have SIX heading levels -- twice the number professional writing guides (as in magazine articles, term papers, essays, etc) say to use. The old writers rule "if in a self contained article your heading levels are more than three deep, your article is too complex for it's own good".

    Which you would skip past by going to the first content heading or HR. See Opera's "Heading navigation" or an actual PROPER implementation. (which of course is now missing in the steaming pile of manure known as Opera 15)

    Paragraphs for flow content, headings and HR to indicate start/ends of subsections... as such it DOES say what is what in MORE than a sufficient manner for delivery via screen, print, teletype, braille, aural, etc, etc... Search engines seem to work just fine without that crap -- so the only legitimate reason I can figure to need more is to give something to the data scraping asshats... in which case you're in the same category of bloated nonsense as the garbage the microformats junkies spank it all over the code for.

    Then you don't grasp what DIV is for... I'd be interested in seeing some of your code just for laughs; I've NEVER seen ANYTHING built with HTML 5 that wasn't inaccessible broken useless bloated crap... it's pissing away the usefulness (much less the speed and functionality) of most every site that's using that lip-service doctype -- or at the very least leaving it EXACTLY where it was a decade and a half ago for no improvement whatsoever.

    Entirely pointlessly redundant to a H1 before it and a H2 after it! ... or wedging it between your H2 and the P, NOT that headings aren't MORE than sufficient for on-page navigation past off-page navigation -- which is allegedly the reason NAV exists.

    Funny, I consider most site menus to be a LIST of CHOICES, usually in no particular order. What other tag would you use? Certainly better than the *** I've seem people doing of just slapping anchors with no block-level containers inside NAV -- basically making a run-on sentence! Since Anchors are just as semantically neutral in terms of the text it wraps as a SPAN!

    Are they short bullet points or a list of choices? If not, then no, it's NOT like saying that!

    The fact of the matter is that there will ALWAYS be people that write unsemantic code, just as there will always be people who mispronounce things, use bad grammar, have bad work habits, ad infinitum. That has nothing at all to do with whether the language (English or HTML) is good or bad.

    I'm just sick of seeing people being led down the garden path by the same halfwit bullshit as a decade and a half ago. There was already enough web-rot and outdated methodologies being preached by nube predators without crapping out a specification that at best is a return to the worst of the late '90's, and at best a sick buzzword to let professional lecturers put more buns in seats, let authors slap a new label on their decade out of date books, and give the sleazeball scam artists something to prey on the ignorance of the suits who think they can get sound technical advice from the pages of Forbes. Which as I've said many times is akin to getting Financial advice from Popular Electronics...

    People are dumber for things like this even EXISTING.
    deathshadow, Aug 23, 2013 IP
  17. deathshadow

    deathshadow Prominent Member

    Messages:
    5,976
    Likes Received:
    824
    Best Answers:
    144
    Trophy Points:
    395
    #17
    Taking a look at that page (do you mean the site, or the article on that site? If the former, that's EXACTLY the type of non-semantic pointless bloat I'm talking about!)

    ...but for now:

    Try "SMALL" -- much like B and I being for when you aren't applying emphasis and instead have a proper title, SMALL is used for de-emphasis, like in a subheading. Just put it inside the numbered heading.

    For example:
    Code (Text):
    1. <h1>
    2.   Site Title
    3.   <span>-</span>
    4.   <small>TagLine</small>
    5. </h1>
    The hypen being their for CSS off appearance, since of course you should ALWAYS write for CSS off FIRST. You can usually just set it to display:none for when you are styling the text as two lines, or you could set text-indent:-999em on it and use it as the hook for gilder-levin image replacement. Span serving a legitimate purpose by not actually changing the semantic meaning of what it wraps. SMALL on the other hand implies the text would be shown smaller as a written document, usually for de-emphasis... it is STILL part of the same HEADING, which is why garbage like <HEADING> is pointless and redundant to properly using H1..H6 or for wrapping elements for presentational, not semantic reasons.

    Since sooner or later you have to let the text do it's own damned job -- otherwise we'll end up ten years from now with extra tags for every blasted word.
    deathshadow, Aug 23, 2013 IP
  18. Tim Gallant Creative

    Tim Gallant Creative Member

    Messages:
    50
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    28
    #18
    deathshadow, you're stretching and you know it. It wouldn't matter if you had five hundred heading levels, you would never have enough to show their relationship to one another in the way that the HTML5 tags do. It's as simple as that. And it's just plain silly to say that anchors are semantically neutral when they are contained within a tag which has the identifiable import that nav does. Context is everything, which of course is why you insist that h3s support h2s which support h1s. By the nature of the case, nav is a block of links, and what the user should expect to find in them is... links.

    Frankly, your own post concedes the inadequacy of existing tags by implying that there is no tag suitable for navigation, so you start your headings after it so it doesn't get confused with the content. I'll leave aside whether it is optimal for navigation to be the first thing on every single page in the universe, and whether a long page (or large site) should only ever have one set of navigation. That still leaves us with what to do with other non-navigation, non-main-content items that legitimately appear on web pages. Unless of course you're on some mission to rid us of any sidebar content, or any page with multiple content items. Then I'll just be thankful that nobody died and left you as god. :)

    And surely you know that the fundamental significance of an unordered list is not to assemble a number of things to make a choice from, and even stretching ul that far, that's not the fundamental import of a navigation block. The fact is that ul for navigation is a hack, and always has been. Nobody knew what really was semantic for navigation—precisely because nothing WAS semantic for navigation—and somebody had a brilliant notion that it was a list of links.

    But there is no "list" character about navigation other than the fact that it generally has multiple links, and even if that were sufficient, the fact that the navigation is in a ul still leaves things where ul is too semantically vague to serve to note that this particular text has absolutely nothing to do with the page content and is in fact navigation. And no, the fact that the list is full of a tags still doesn't prove that, since I could easily have an unordered list of links within my main content, and that list would be in no sense navigational other than they might provide a convenient way for you to navigate the heck off my site. :)
    Tim Gallant Creative, Aug 23, 2013 IP
  19. Tim Gallant Creative

    Tim Gallant Creative Member

    Messages:
    50
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    28
    #19
    Using <small> is a pretty good idea, although it's really a presentational tag, so I tend not to use it.

    I don't know what you're talking about with <heading>. There is no such tag. Unless you're confused about the <header> tag, which has barely more to do with <heading> than it does with <head>. Most people put consistent page-to-page content such as navigation and site titles and theme images in headers, not headings.
    Tim Gallant Creative, Aug 23, 2013 IP
  20. Tim Gallant Creative

    Tim Gallant Creative Member

    Messages:
    50
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    28
    #20
    Heck, no, I was talking about the article. The main site is driven by WordPress, and even though I used a supposedly barebones template as a starting point, and trimmed back a LOT of extra code, it still generates a lot more crap than I would like. None of the HTML bloat is from my index.php or single.php etc; it's driven by the various functions pages and such that I borrowed. I cleaned them up a lot, but they're still loaded with unnecessary divs and stuff. (You should have seen the code before I got hold of it. Every h1 was wrapped in a bunch of heading nonsense, and every blog entry was assigned a footer etc etc.)

    Frankly, this is one of the reasons why I prefer to avoid WordPress for my own stuff. The CMS capabilities have all their own bloat, and then even the lean templates have a lot of unnecessary stuff. Maybe one day I'll build WP sufficiently from scratch to avoid that, but the HTML is so intertwined with the PHP (which I don't program) that it takes a long time to wade through.

    So, no. Look at the article. Something like that is what I would consider semantic, and semantic tags provide sufficient hooks for probably 80%+ of designs I do.
    Tim Gallant Creative, Aug 23, 2013 IP