HTML5 Reference Poster

HTML5 is the hot cake today. Everybody in the community is making efforts to promote the language, and to make it easier to use and learn. W3C has even announced a new logo for HTML5 to give it a new face.

We have made a modest effort to create a HTML5 Reference Poster; we hope that this poster makes it easier to use HTML, for professionals with varied experience levels. As a thankful gesture to W3C, we have used the HTML5’s new logo.

HTML5 Reference Poster

Design

The poster is designed keeping in mind that it looks beautiful and professional in your office, your lab, the conference room, and why not in your living room if you are living HTML day in and day out!

Features

This poster covers all HTML5 tags (almost, because HTML5 is still in development). Each tag is followed by its semantic meaning, and all attributes supported by the tag. Tags and attributes, which are new to HTML5 are marked with color symbols, so that they are highlighted and easily distinguished from other tags.

Tags are grouped in 8 categorized tables to make it easier to find and manage them.

  • Metadata and scripting
  • Document sections
  • Grouping content
  • Text-level semantics
  • Forms
  • Tabular data
  • Interactive elements
  • Embedding content

The poster also covers icons of technology classes and their meaning, to make it easier for you to identify and understand the icons when you see the new HTML5 badge with these icons, on a website.

Bonus: In addition we have added a “HTML5 Document template” to help you start your next HTML5 document easily, and a list of HTML’s differences with HTML 4.01 and XHTML 1.x, and a list of new scripting APIs added in HTML5.

Update:

  • uprinting offers a poster printing service in U.S. and Canada.
  • mybigposter offers a poster printing service in Europe.
  • Contact us if you want us to send you a printed copy.

34 COMMENTS

  1. James Trageser September 8, 2011 at 6:31 pm

    Awesome!  Thanks for sharing!  This is an excellent, very handy resource to have while learning the new HTML 5!

    Great work!

    Notice: Undefined variable: add_below in /home/ajain/www/www.xhtml-lab.com/htdocs/wp-content/themes/xhtml-lab/functions.php on line 55 Reply to James
  2. Saeed Neamati October 17, 2011 at 1:45 pm

    This is a single PDF file, which is gonna serve me for at least next 5 years. Great work. Thanks. I love HTML5.

    Notice: Undefined variable: add_below in /home/ajain/www/www.xhtml-lab.com/htdocs/wp-content/themes/xhtml-lab/functions.php on line 55 Reply to Saeed
  3. Rick November 2, 2011 at 6:28 pm

    Does this file have some sort of password protection when trying to blow it up to poster size? I took it to a printer this afternoon and they said they couldn’t blow it up because there was a password prompt. He was trying to place it in InDesign first before he sent it over though so I’m not sure he knew what he was doing.

    Notice: Undefined variable: add_below in /home/ajain/www/www.xhtml-lab.com/htdocs/wp-content/themes/xhtml-lab/functions.php on line 55 Reply to Rick
    • Jaspreet Kaur November 3, 2011 at 3:00 am

      This file is password protected for editing, so you can not open it in inDesign or any other editing software, you can print directly from PDF.

      Notice: Undefined variable: add_below in /home/ajain/www/www.xhtml-lab.com/htdocs/wp-content/themes/xhtml-lab/functions.php on line 55 Reply to Jaspreet
      • Rick November 15, 2011 at 9:12 pm

        The printer I took it to said they could only print to 11×17 from a PDF. They had to print it from within InDesign to get it to print to their poster printer. Not sure if that’s standard MO at print shops or they are doing it wrong.

        11×17 is too small to read so I still have a nice blank space on my wall where this poster would look nice.

        Notice: Undefined variable: add_below in /home/ajain/www/www.xhtml-lab.com/htdocs/wp-content/themes/xhtml-lab/functions.php on line 55 Reply to Rick
        • Jaspreet Kaur November 23, 2011 at 9:26 am

          Rick, i confirmed with my printer and he said it’s completely possible to print directly from PDF files on any size of paper.

          Notice: Undefined variable: add_below in /home/ajain/www/www.xhtml-lab.com/htdocs/wp-content/themes/xhtml-lab/functions.php on line 55 Reply to Jaspreet
  4. Ian Devlin January 12, 2012 at 4:23 pm

    Kudos for not lumping the W3C Geolocation API into your list of HTML5 APIs.

    Notice: Undefined variable: add_below in /home/ajain/www/www.xhtml-lab.com/htdocs/wp-content/themes/xhtml-lab/functions.php on line 55 Reply to Ian
  5. Matthew Potter January 12, 2012 at 8:42 pm

    @twitter-24367989:disqus Indeed, under the Document sections, they have most likely been using Illustrator or InDesign while creating this and had tried switching to the selection tool a couple of times. (We’re all used to this problem) The word “Heading” has been saved as vveading.

    Notice: Undefined variable: add_below in /home/ajain/www/www.xhtml-lab.com/htdocs/wp-content/themes/xhtml-lab/functions.php on line 55 Reply to Matthew
  6. Jaspreet Kaur January 12, 2012 at 9:47 pm

    Thank you all for pointing out all errors, i will fix them soon. Let me know if you have any other suggestions to improve the poster.

    Notice: Undefined variable: add_below in /home/ajain/www/www.xhtml-lab.com/htdocs/wp-content/themes/xhtml-lab/functions.php on line 55 Reply to Jaspreet
  7. Daniel Abramov January 12, 2012 at 11:35 pm

    Why use Courier New? It hurts my aesthetic sense and eyes as well.
    Please use Consolas for code instead.

    Notice: Undefined variable: add_below in /home/ajain/www/www.xhtml-lab.com/htdocs/wp-content/themes/xhtml-lab/functions.php on line 55 Reply to Daniel
  8. Jakub Rusinek January 14, 2012 at 7:52 pm

    Tried printing it.

    I only got mad at my printers (one says it lacks tint; another takes ages, can’t print marginless and crops printed documents).

    Quicker’d be to make such a poster myself. And it would be quite a lesson…

    Notice: Undefined variable: add_below in /home/ajain/www/www.xhtml-lab.com/htdocs/wp-content/themes/xhtml-lab/functions.php on line 55 Reply to Jakub
  9. Garry January 15, 2012 at 3:00 am

    Flipping awesome poster – trouble is can only print it in A4. Great for reference – thanks!

    Notice: Undefined variable: add_below in /home/ajain/www/www.xhtml-lab.com/htdocs/wp-content/themes/xhtml-lab/functions.php on line 55 Reply to Garry
  10. michaelyap January 16, 2012 at 7:25 pm

    Nice. thanks for all the hard work.
    To those speaking English elsewhere, the size is 594 x 841 mm.
    Its big, correct me if i’m wrong, i think that’s A3 width and A2 height

    Notice: Undefined variable: add_below in /home/ajain/www/www.xhtml-lab.com/htdocs/wp-content/themes/xhtml-lab/functions.php on line 55 Reply to michaelyap
    • Tony R. May 17, 2012 at 12:46 am

      . Install Inkscape (free) on your system, then import the PDF and scale the image to fit whatever sheet size you like.  Inkscape allows one to scale the x and y dimensions independently, so you can make it a little narrower and taller, or whatever.

      I tried it with Inkscape 0.48 and it works beautifully.  After scaling you can even re-export it as a new PDF.

      Notice: Undefined variable: add_below in /home/ajain/www/www.xhtml-lab.com/htdocs/wp-content/themes/xhtml-lab/functions.php on line 55 Reply to Tony
  11. Matthew Potter March 8, 2012 at 10:19 pm

    Can I ask for an update for printing? The document seems to have been created in RGB. All of the blacks are rich. If I send this to a professional printer, they will either convert the RGB black to a 98% grey (through pre-press processes) or scream at me to get a new file that not over saturated.

    Notice: Undefined variable: add_below in /home/ajain/www/www.xhtml-lab.com/htdocs/wp-content/themes/xhtml-lab/functions.php on line 55 Reply to Matthew
  12. Jaspreet Kaur May 17, 2012 at 8:06 pm

    Where do you see the issues with grid? It’s used as a pattern so it can’t be darker at some places. Also I have a printed copy of poster on my wall, and I do not see any issue with colors or readability of the poster.

    Notice: Undefined variable: add_below in /home/ajain/www/www.xhtml-lab.com/htdocs/wp-content/themes/xhtml-lab/functions.php on line 55 Reply to Jaspreet
  13. ช่างเหล็กภูเก็ต September 27, 2014 at 10:59 am

    I love your blog.. very nice colors & theme. Did you
    create this website yourself or did you hire someone to do it for you?
    Plz respond as I’m looking to construct my own blog and would like to find out where u got this from.
    thanks

    Notice: Undefined variable: add_below in /home/ajain/www/www.xhtml-lab.com/htdocs/wp-content/themes/xhtml-lab/functions.php on line 55 Reply to ช่างเหล็กภูเก็ต

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>