For those who don’t know, HTML is the standard language used to build web pages. HTML stands for “Hyper Text Markup Language,” and it’s not going anywhere anytime soon. New technologies are arriving as we speak, with HTML5 and CSS3 busily changing how you interact with web sites.
The Basics of HTML and CSS
Since the early days of the internet, the tools for building a web site have been HTML and… Not much else. For web designers, trying to design a web site with only HTML made it repetitive and restricting. This is where CSS came into play.
CSS stands for Cascading Style Sheets; they are files that tell web browsers how to display an HTML page. Basically, HTML is the basic framework of a web page, while a CSS document specifies how the specific elements of a page should look. CSS gives you control over the fonts, font colors, background styles, and so on, of an HTML page.
Essentially, CSS makes it easier for designers to map out and build a web site. Before CSS, designers using HTML had to specify how all individual headers and components of a page looked and acted. There were ways around this, but HTML was often misused and the web developer would have to go in and individually change every element of every page. But CSS made it less complex and less time consuming to change the styles on a web page so that, finally, editing web pages became more efficient: you could make a change to one document, and then apply the change across your entire web site.
What’s New?
Now, HTML5 and CSS3 are the latest and greatest of markup programming. HTML5’s new video element, which makes it easier to add video to a web page, has been getting a lot of attention. But that’s just one of the many features HTML5 offers that will put it in the forefront of web design, making it significant for users and web developers alike.
Flash-Free Video and Animation
So why is everybody talking about the new video feature? Well, HTML5 allows you to watch videos without using plugins like Flash or Silverlight. This can help immensely, because a plugin like Flash can slow down your computer since it runs by using up system resources. Using HTML5, however, the video feature is built right in, making the process faster and less tedious. What’s more, it’s free.
But as of now, the HTML5 video is still inconsistent between browsers. Safari, Chrome and Internet Explorer 9 support HTML5 video that uses the H.264 format. But Firefox is on a different page, supporting only HTML5 videos that use the Ogg Vorbis format. The people over at Mozilla justify this by stating that the use of the H.264’s closed source nature could create possible problems with licensing in the future. Truly, only time can tell what will happen or how these “licensing issues” may develop.
Regardless, web designers are going to enjoy using HTML5 and CSS3 because it’s easier for them to create animations and interactive games without using Flash. Additionally, there are numerous games and animations on the web that are now using HTML5 and CSS3, and all you have to do is search for them. But even though these two could have tons of potential, they haven’t been able to replace Flash entirely, just yet.
Offline Storage
Some of the new features in HTML5 are helping to improve web applications, which are becoming more and more complex. HTML5 gives web apps the ability to store information and internet utilities that you can use anytime. This means you can preserve and access data through the web apps, even when you’re not online. Then, when you log back online, the web apps can load faster by using the saved work that you did offline, since the structure of the page has been saved in your browser’s cache. Thus, all the work that you did offline should be there when you log back on. Wasn’t that easy?
The offline storage feature allows you to specify which sites you want your browser to frequently cache without having to save each page. In other words, without this feature, you would have to go to each page and click “File-Save As” so that they would be stored while offline. Using HTML5, you can set your browser to automatically save certain types of pages, so they will already be in memory. This increases the loading speed when you’re browsing online, so you don’t have to wait for the entire page to load. Again.
New Design Tools
HTML5 and CSS3 help to make for more attractive web apps and websites. For example, the features in CSS3 are highly dynamic and decorative features, compared to the simple HTML page. It provides exciting, brand new features such as:
- Rounded corners
- Multiple backgrounds
- Direct web fonts
- Wrapping to the text
- Stroke and shadow to the text
- 2D transformation to the object, animations
- Gradients
- Opacity
- HSL and HSLA color
- Background clipping
- Outline
- Box resizing
- Box shadow
- Top-right- left-bottom navigation
- Attribute selector
- Overflows x and y
… And even more; all helping to create a more eye catching web page, and probably something closer to how the designer actually wants the page to look, instead of having to mimic images to get the look they want.
The Compatibility
With HTML5 and CSS3 just recently being released, the face of the web is already changing. Some the current browsers such Internet Explorer 9, Firefox, Chrome, and Safari are supporting most of the features that come with HTML5 and CSS3, and some even more than others. Even still, most of the older browsers, such as Internet Explorer 8 and Firefox 3.6, are not as compatible as the new browsers.
But this direction and these developments look like great news for present and upcoming web designers. HTML5 and CSS3 both provide “less write, more gain” kind of potential for web designers. This means that we can be bothered with writing far fewer lines of code, and instead have considerably more playtime with significantly more features.
In short, HTML5 Web Design is the future.