Explore the Articles

HTML5

Making Websites Location Aware With HTML5 Geolocation

Assumption can be a risky business in the world of UX, but some assumptions can enable you to deliver a more tailored user experience to your visitors. Aaron Lumsden is going to look at enhancing the user experience by making your websites location aware. Around the same time that HTM5 was announced, another API was introduced from W3C. He's pretty sure you may have heard of it; the Geolocation API. This allows your site to receive geographic positioning information using JavaScript.

Read More
HTML5

Build a Threaded Comment Block with HTML5 and CSS3

Jake Rocheleau is going to look at building a simple HTML5 and CSS3 threaded comments layout. He won’t be using any jQuery effects on the comment blocks (although it is possible to extend this functionality). He will look into structuring the HTML5 document and how to position elements using CSS. From this base template it should be easy for developers to pick up their own customizations and implement a threaded comment block into any website layout.

Read More
HTML5

Create Drag and Drop Features in HTML5

Before HTML5, if you wanted to implement drag and drop features in the browser you had to use libraries such as jQuery and MooTools. Now you have HTML5 Drag and Drop, which gives you the ability to drag, drop, and transfer data natively within the browser. While Drag and Drop is a new API included in HTML5, it was – amazingly – first implemented in IE5, back in 2005 when Ian Hickson worked on the HTML5 API.

Read More
HTML5

The Importance Of HTML5 Sectioning Elements

Whatever you call them - blocks, boxes, areas, regions - you’ve been dividing your Web pages into visible sections for well over a decade. The problem is, you’ve never had the right tools to do so. While the interfaces look all the world like grids, the underlying structure has been cobbled together from numbered headings and unsemantic helper elements; an unbridled stream of content at odds with its own box-like appearance. Now that HTML5 has finally made sectioning elements available, many of you greet them with great reluctance.

Read More
HTML5

Introducing the HTML5 Datalist Element

Imagine you have a form and you want a user to input a string of text, like their name for example. You have the <input type="text" /> element, which will allow the user to type whatever he or she pleases. Imagine then that you want the user to enter his or her country of residence; you’d likely use a <select> element. This would limit the results to the options available (sometimes a good thing) and would also present the user with a potentially huge list to choose from. But what if you want the user to be free to enter what they please and at the same time being given some suggestions? This is where datalist comes in.

Read More
HTML5

Accessibility and the Main Element

HTML5 has a set of elements that make page structure more accessible to assistive technologies (ATs). The <header>, <footer>, <nav>, <article>, <aside> and <section> elements make it possible for ATs such as screen readers to identify the purpose of chunks of content on the page. But a growing school of thought says that there is one element missing from this set of semantically important tags.

Read More
HTML5

All You Need to Know About the HTML5 Data Attribute

Prior to HTML5 we had to rely on using class or rel attributes to store little snippets of data that you could use in your websites. This sometimes led to problems and could cause conflicts between the styling and functionality of websites. The advent of HTML5 introduced a new attribute known as data. In this article Aaron Lumsden is going to be looking at some examples of how he would use this attribute as well as how it should be used correctly.

Read More
HTML5

Using Inline SVGs With HTML5

It goes without saying that SVG isn’t as widely used as many people in the web development community might believe it should be. Setting the debate aside, in this tutorial, Sue Smith will demonstrate how to use inline SVGs, covering a range of techniques and exploring the interaction between web page and graphic. When used in conjunction with other emerging standards in HTML5, JavaScript and CSS3, inline SVGs can significantly add to the user experience.

Read More
HTML5

Getting Started With Web Workers

One of the many design goals of the JavaScript language was to keep it single-threaded and, by extension, simple. Though Agraj Mangal must admits that, given the idiosyncrasies of the language constructs, it is anything but simple! But what he means by being “single-threaded” is that there is only one thread of control in JavaScript; yes, sadly, your JavaScript engine can do only one thing at a time. Now, doesn’t that sound too restrictive to make use of multi-core processors lying idle on your machine? HTML5 promises to change all of that.

Read More
HTML5

5 HTML5 Tags for SEO

The advent of HTML5 has created a new set of opportunities for web developers and site architects. The new system has also forced those unfamiliar with its origins to reassess how they view their site design, especially when it comes to questions of search engine optimization. How will HTML5 interact with the current search engine spiders, such as Googlebot and Bing, and how will those crawlers evolve in this dynamic environment?

Read More
Newer articles Older articles