A Guide to HTML

Further Reading

HTML Developer Guide at MDN
The MDN is the Mozilla Developer’s Network, maintained by the Mozilla Foundation (creators of Firefox, among other things). Their network contains tutorials, examples, and references for lots of web technologies, and they’re all pretty good.
HTML Web Platform Docs
The WebPlatform.org website is jointly maintained by the W3C and a coalition of industry stewards (Adobe, Apple, Facebook, Google, HP, Intel, Microsoft, Mozilla, Nokia, and Opera). Its aim is to provide easy-to-read tutorials, articles, and reference material for web developers across the world. The site is a work in progress, but the section on HTML is fairly complete, and very good.
Web Style Guide
This book (now in its third edition) is a guide to creating websites that are usable, accessible, and SEO-friendly. It focuses on design concepts, not on coding techniques; chapters are dedicated to such topics as site structure, page design, or editorial style. In my opinion, everyone who creates web content should read it.

The entire book is available online (though not under an open license). You can also buy a paper copy from pretty much any online retailer, or directly from Yale University Press.

HTML5 Doctor
As the name suggests, the site is devoted to HTML5 semantics, with an emphasis on using HTML5 tags immediately (sometimes before the standards are finalized). So, the team of authors make it a point to stay up-to-date on the latest W3C working drafts and WHATWG living standards. The site also maintains a very good index of HTML elements, often with links to articles on usage (“our prognosis”) that are updated if the specifications change.
Dive Into HTML5
This book’s main focus is on media tags in HTML5, and how to manipulate them using JavaScript. So, you will need JavaScript knowledge to get the most out of it. It is still worth reading, even if you don’t know JavaScript, to get a general feel for the new media tags. It was originally written by Mark Pilgrim, and is now maintained by the community. It is licensed under a CC-BY license, and the online version is free, though you may want to pay for a paper copy.
HTML at W3Schools
This site has become a kind of de facto standard for beginners to learn about client-side Web technologies, including HTML, CSS, and JavaScript. The site is not without its detractors, and I personally wouldn’t pay for one of their certificates. But their reference section is pretty good.

Thank You

I’d like to thank Ben Drasin, who pointed out some issues with the section on attribute minimization.

Advertisements

About Karl

I live in the Boston area, and am currently studying for a BS in Computer Science at UMass Boston. I graduated with honors with an AS in Computer Science (Transfer Option) from BHCC, acquiring a certificate in OOP along the way. I also perform experimental electronic music as Karlheinz.
This entry was posted in HTML and tagged , . Bookmark the permalink.

4 Responses to A Guide to HTML

  1. Ben says:

    You probably know this, but the self-closing-ness of your tags are likely to be totally ignored by the browser unless you set the mime type to xhtml! For example, in most browsers this
    This is a paragraph
    will render exactly the same as this:
    This is a paragraph

    A common gotcha is thinking that you can use a self-closing script tag, e.g.

    instead of

    More on this on stackoverflow:
    http://stackoverflow.com/questions/69913/why-dont-self-closing-script-tags-work

    So there can be arguments for doing this for style or tool support, but the browser really doesn’t care.

    • Ben says:

      wow, looks like wordpress doesn’t escape tags. Sorry, but hopefully the stackoverflow article explains well enough

      • Karl says:

        Also, about the tags – nope, WordPress does not excape HTML; you can use it to mark up comments (as I did just now), so it really can’t do that. For HTML tags, you have to use the < and > escape sequences. I also had to do this when I wrote the article, so I know how much of a PITA it is.

    • Karl says:

      Ben: First of all, thanks for taking the time to read the article. I need all the help I can get…

      The “self-closingness” issue applies only to tags that do not represent empty elements, and that includes the <script> tag. It’s supposed to contain text data (the actual JavaScript code). Trying to make these tags self-closing is not valid XHTML, and browsers will consider it “tag soup.”

      If the tag is actually self-closing – like the <br /> or <input /> tags – then the XHTML standard demands that they be properly terminated, or they won’t validate. The HTML standard (even HTML5) does not, but since XHTML is the one that has been used for years, I think it’s better to include the terminating slash.

      However, the Stack Overflow post did show something else that I wasn’t aware of: the <p> tag cannot contain other block-level tags, like <div>. (Inline tags are fine.) If you try to do this, the browser will consider it “tag soup” and automatically treat it as a tag with empty content. In other words, <p><div>Hello, world!</div></p> will turn into <p></p><div>Hello, world!</div><p></p>.

      I’ll update the article with this info. So, thank you for pointing this out. Please let me know if you find anything else in the article that needs work.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s