Internet History: HTML Code Evolution 1.0 to 5.0 [INFOGRAPHIC] This HTML Evolution infographic takes a look at the transformation of web pages over the past 20 years, from HTML 1.0 to HTML 5.0. Prior to then, we’re just going to assume everyone played pong • HTML 1.0 debuts as a hybrid of SGML that includes the “href” tag marrying an already well-accepted text markup language with the ability to link documents. • The original release included only 20 elements, 13 of which are still a part of HTML 4.01. • This year also marked the debut of the Web as a publicly available service on the Internet. Berners-Lee posted a short summary of the World Wide Web project on the alt.hypertext newsgroup: “The WorldWideWeb (WWW) project aims to allow all links to be made to any information anywhere. [...] 2057 The Internet will be beamed directly into your brain from the cloud. Sources:
Avoiding common HTML5 mistakes Between curating sites for the HTML5 gallery and answering readers’ questions here at HTML5 Doctor, I see a host of HTML5 sites and their underlying markup. In this post, I’ll show you some of the mistakes and poor markup practices I often see and explain how to avoid them. Don’t use section as a wrapper for styling One of the most common problems I see in people’s markup is the arbitrary replacement of <div>s with HTML5 sectioning elements — specifically, replacing wrapper <div>s (used for styling) with <section>s. <! Now, I’m instead seeing this: <! Frankly, that’s just wrong: <section> is not a wrapper. With that in mind, here’s the correct way to mark up the above example using HTML5 and a couple of ARIA roles. <body> <header> <h1>My super duper page</h1> <! If you’re not quite sure which element to use, then I suggest you refer to our HTML5 sectioning content element flowchart to guide you along your way. Common mistakes with the figure element Ah, <figure>. Not every image is a figure <!
Designers: Learn To Code! Here's How To Start A friend, formerly a competitive fighter, once asked me: "Have you ever been punched in the face?" He and I were about to get in a bar fight. He needed to know if I could handle myself: Apparently, the fear of getting punched in the face holds you back from being effective in a fight. But once you’ve been punched in the face, you realize it’s not so bad—it’s easy to fling yourself into a fight without hesitating. Similarly, learning how to code can be intimidating if you’ve never done it before. But whatever you don’t know is bound to hold you back from learning. The first punch I want you to download Processing. If you want to just download the code, it’s here. Once you get it typed out, hit the play button and see what cool stuff you just made with the code. Playing around is fun, but how does this all relate back to your work? When you start playing with these tools and you understand how they work, you’ll start adding these things into what I call your "mental toolbox."
HTML Tutorial