HTML 5 has gotten lots of hype, and for good reason. It may be difficult to appreciate the benefits that a new version of HTML brings to the table. In short, what HTML 5 does is nothing less than transforming the web from a system for distributing documents, to a rich application platform for browser-based devices. Here are just some of the ways that HTML is changing the web as we know it.
Making the Web Work Everywhere
Historically, websites were viewed on two screen types. Browsers either ran on laptops with smaller screens, or sprawled across one or more large desktop monitors. As such, web developers wishing to create stunning websites only tested on a few different screen sizes and browser combinations.
The days of a few different screen sizes are long past. Today’s websites must look good on phone screens of several sizes, tablets, and even on small screens no bigger than watch faces. When screen orientations change, sites must flow to become smaller while using more horizontal space. Today’s web designers must build sites to shine on many device types in order to capture the most web traffic.
HTML 5 adds a number of technologies to improve site responsiveness. Features like CSS media queries let pages change their appearance based on screen characteristics. Further, HTML 5 establishes standard conventions for how sites are rendered, thus reducing complexity by ensuring more uniformity across browsers.
Beyond the Document
HTML has come far from its humble origins as a means of sharing research papers. It is now used to render rich user interfaces for networked applications. To achieve this, designers have contorted HTML’s document-based semantics to work for applications, but this adds complexity by obscuring developers’ and designers’ intents behind layers of technology used in ways for which it was not meant.
HTML 5 introduces a number of new elements for semantically marking up document content. Articles, dates, headers and footers can be uniquely marked, helping web browsers to determine how content might be rendered differently or enhanced. New input types for dates and other content let browsers present better user interfaces for filling out forms.
While not yet in the HTML 5 specification, the Web Components concept takes this notion even further. Designers can eventually develop applications not using HTML’s document semantics, but with elements like menus and panels. This significantly eases collaboration between designers and developers, enhancing HTML as a cross-platform app development runtime.
New JavaScript Capabilities
Prior to HTML 5, the JavaScript language was primarily used to enhance a page’s appearance or interactivity. JavaScript might fetch data from the network, change page content without a refresh, or enhance documents with animations. With HTML 5, JavaScript’s capabilities were expanded in ways that make websites significantly more powerful.
For instance, geolocation features let sites locate visitors and receive real-time position change notifications, making it easy to find nearby stores or businesses without user input of postal codes or addresses. The web RTC specification lets sites add video communication and calling features, enabling telecommunications capabilities normally available only in dedicated solutions. Push notifications let sites send messages even if the browser is closed, while even other APIs let sites continue to work without an internet connection.
Conclusion
Previous versions of HTML focused specifically on its use as a document format, granting it new capabilities to augment how text on a page is presented. HTML 5’s power originates with its departure from this approach. With its emphasis on responsiveness, transition to content beyond documents, and new JavaScript capabilities, HTML 5 is becoming the top choice for building sites and apps that transcend platforms and devices.
