Hi, I'm only starting to adapt to HTML, please tolerate my lack of knowledge, I'm trying to learn how to use its commands, tags, settings... Please be as kind as to advice me on the following... 1) DOCTYPE... As I've read, in HTML 5 it's enough if I simply put this in... is this correct? <!DOCTYPE html> Previously there were all sorts of versions, long codes we had to put in. But now, as I've seen from tutorials, in HTML it's just this. 2) I have been using this for charset.... <meta http-equiv="Content-Type" content="text/html" charset="UTF-8"/> Now I want to know if I can simply use this (below)? Without the "content-type" without the rest... <metacharset="UTF-8"> 3) How do I use the following correctly? I described under them how I am using them right now... <article> I simply wrapped my article content within the <article></article>. <aside> I use it to wrap the sidebar (vertical) inside it. Marks my side-content. <section> I am a bit confused about this one... I use <section> multiple times to mark different parts/sections of the page. Like: I use <section> to wrap a table in it, I use section to wrap around a photo thumbnail section, for a box of related links, for the commenting section etc. I use <section> both inside and outside <article>... <footer> I use this to wrap the footer, the bottom links, etc... <header> For the header: site logo, navigation buttons etc. <nav> I put the main navigation buttons inside it. But occasionally I also use it for location links (like links showing location, as they appear on any particular page: HOTELS > USA > LOS ANGELES > BURBANK) Is this correct? Am I using these tags correctly? Can I sue them multiple times and wrap one inside the other? I am not setting any classes whatsoever, but using the tags, as they are! Any other important tag I'm forgetting? Million thanks for your helpful kind opinions
You're using them correctly, Yes the doc type gets shortened to <!DOCTYPE html> and the meta tag has to have a space in it though so its, <meta charset="UTF-8">. The rest is fine, To define each of the sections you could give them an ID or class, if you have a specific one you would like to edit. Sections can also be used (more commonly) to wrap the header, main content and footer in it. So the header is a section, then you have the Main content section, and then the footer section.
Using <meta http-equiv="Content-Type" content="text/html" charset="UTF-8"/> is the better practice. It is a fail-safe against poorly configured web servers (Yeah, I know, but it does happen), and tells the browser to treat a file as an html document. IE has long tried to 'help' by setting the implicit MIME type by seeing what the file content 'looks like'. This is ok if the extension is one of the html extensions, but not if intended to be treated as the default text/plain. So, use the long form; it's a better practice. And, don't forget to set your editor to utf-8 (without the BOM, a MSFT screw up). Due to the almost universal lack of support for building an outline from the DOM, and the some-do/some-don't support for heading and sub-heading defaults by user agents, I don't recommend using section elements and the specced usage of heading 1-6 elements. (Neither does the W3C, see ยง4.3.3 The section element.) cheers, gary
First off, word of warning, I am NOT a fan of HTML 5, and consider it to be mouth-breathing halfwit BULL so far as being a markup specifications... My answers to your little list will show why. Yup, lip-service bull to save two dozen bytes; which of course is why 99% of the dipshits using HTML 5 crap all over their sites by immediately following it with a quarter-k or more IE conditionals thanks to Paul Irish's inspired idiocy. It wasn't that long -- if you thought it was long it's a miracle you can get through a post on a forums. It was pretty simple; declaring what version you were using as well as a link to a DTD file that at least in theory could be used to tell a user-agent (aka browser) how to treat the file. Of course, browser makers dragged their heels on implementing that latter part which is why they LOVE dialing the clock back to the worst of 1997 with the halfwit manure known as HTML 5. Really the charset is trumped by the HTTP headers on a website, the only time your charset declaration should be used is in situations where the file is sent without HTTP invovled, like in local access during testing or in a non-web deployment scenario; that's why Really there's nothing wrong with the new shorter declaration, other than it introducing a new pointless redundant tag to save a handful of bytes all the HTML 3.2 style practices of HTML 5 are just going to waste elsewhere. I'm going to hit these slightly out of order... <article> <section> <footer> <header> These four tags fall into the same basic trap of being redundant to numbered headings (h1..h6) and horizontal rules (hr) if you know ANYTHING about professional writing. They serve no legitimate semantic purpose other than code bloat, or at BEST being redundant to DIV. When most people can't be bothered to use the existing tags properly throwing more tags at it is not the answer, particularly when it's introducing painfully stupid redundancies (SECTION in particular) and pissing all over the structural rules. See how every time you open section you're supposed to change back to H1 level, basically throwing logical document structure out the window! Developers are dumber for any of that crap even existing. If it's ACTUALLY a header use a numbered heading so you have a LEVEL instead of relying on nesting tags you likely don't even NEED. If it's a footer disconnect it structurally with a HR, since a horizontal rule in professional writing does NOT mean "draw a line across the screen", it means "the start of a new subsection where a heading is unwanted or unwarranted" -- just like how numbered headings mean "the start of a subsection of the higher order/lower numbered heading before it" -- with H1 being "the heading under which EVERYTHING on the page is a subsection" -- of course that being why the SEO-tards who slap the H1 on the article when their h2..h6 are not subsections of it, or the dipshits who slap low-order headings like h5 or h6 before they even HAVE a H4 to be a subsection of aren't using HTML properly... usually out of the fact the specification was originally written on the assumption anyone making a website might actually know document structural rules and something about making professional documents. After all, TBL created HTML for the communication of scientific papers and the like. Then there's this gem -- the pinnacle of just how IDIOTIC HTML 5 is! ...or at least now ASIDE is king since the even dumber HGROUP was axed -- praise be for that decision! Using it to simply say "this text is off to one side" is NOT semantic -- that's as stupid AND as presentational as using the CENTER tag. The only meaning of the word that could possibly have ANY logical use for semantics would be a literary aside; where a character breaks the fourth wall and talks to you as if they are aware you are watching. Think Ferris Bueller's talking to us at the start of the movie about how he got a computer but his sister got a car. For it to be an aside it has to be related extra information to the main topic, something most of the stuff people just "slap in a sidebar" decidedly is not. IF ANYTHING, the only suitable usage for ASIDE would be two wrap an image or some extra text when FIGURE/FIGCAPTION is inappropriate -- which laughably is 99.99% of the time people are using FIGURE/FIGCAPTION since they aren't using it to wrap mathematical, scientific or engineering figures. :/ Using it just to slap a sidebar on the page is NOT semantically correct, and is in fact so mind-numbingly stupid with responsive layout in the mix (where said sidebar might not be a sidebar on all media targets!) I cannot fathom how/why anyone would use it. From a semantic standpoint used for what it means, ASIDE is about as limited in utility as ADDRESS is. ... and this is the runner up; the crown-prince of HTML 5 stupidity as you were. The ONLY reason you are supposed to use NAV is to wrap navigational elements at the start of the page before the content, so user-agents that are 'less capable' can skip past it to the content... and AGAIN isn't that redundant to why we have numbered headings? The H1 is the parent of the whole page, so the first H2 would be the start of the main subsecton of the page containing the main content? If you are using headings properly WHAT PURPOSE DOES THIS SERVE? Well, other than browser makers dragging their heels on actually using numbered headings properly either (Opera was the only one to do it right, and they've shitcanned that with the pathetically crippled and ultimately useless "ChrOpera") Of course, most of the halfwits out there don't even understand it's purpose, and try to use it to replace using lists (when you should still have the list inside it semantically!) or simply slapping it everyplace they had DIV around some links; usually in places where they didn't need the extra DIV in the first place. This is why I think the real purpose of NAV was simply to satiate the wants and desires of the people with their craniums up 1997's rectum wrapping every blasted element in DIV before they even start styling a page or using up what the tags inside that DIV can do on their own. Basically the tags you listed, I say don't use them. ANY of them. Like a LOT of developers I say write as HTML 4.01 STRICT or XHTML 1.0 STRICT, and if you REALLY need a specific HTML 5 "feature" like the idiotic halfwit "vendor lock-in" bullshit of VIDEO and AUDIO live with the validation errors on those elements and then slap the 5 doctype on it last-moment for deployment. The new "structural" tags serve no legitimate purpose other than encouraging sloppy outdated coding methods, slapping extra elements in the markup making the DOM slower when scripting, and satiating the wants and desires of data-scraping assholes MOST site owners usually are trying to keep OUT of their pages. It's the bleeding edge of 1997-style markup, and undoes ALL the progress of the past 18 years since 4 STRICT was introduced. This is hardly a shock since as one of the people formerly with the WhatWG explained, HTML 5 is based on how people WERE writing pages a decade ago, and NOT how pages SHOULD be written. No wonder it reeks of presentational nonsense with endless extra "wrappers for nothing". THANKFULLY anyone DUMB ENOUGH or ignorant enough to want HTML 5 on a website typically doesn't know what it actually is, what it provides, or what it means -- so you write normal HTML 4 STRICT and slap the doctype on it they are none-the-wiser. Not that most such drooling morons would ever be capable of being any wiser in the first place.