-
3 ways you can start using HTML5 today
I finally read the “HTML5 For Web Designers” book this weekend. Not only did I learn a whole lot about HTML5, I started playing around with the new elements and features. There are a whole lot of new things you can do with HTML5, but without getting too deep in the conversation, here are 3 very simple ways you can start using HTML5 in your websites and web apps today.Shorten that Doctype
The Doctype (Document Type Declaration) is used to specify which type of markup a document is using. They’re not supposed to be 100% human readable, but they just pretty much state “This document is written in HTML 4.01” or “This document is written in XHTML 1”. HTML5’s doctype declaration is so easy to remember, you’ll be surprised.
Instead of using
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
Just use
<!DOCTYPE html>
You don’t actually need to supply the doctype. An HTML document that isn’t using the HTML5 doctype can still be valid HTML5.Loading Resources
With HTML5, you don’t need to supply the type attribute when loading external resources such as javascript and CSS files.
What you’re doing now
<script type=”text/javascript” src=”app/template/jquery.js”></script>
<script type=”text/javascript” src=”app/template/functions.js”></script>
<link href=”app/template/css/dtp_styles.css” rel=”stylesheet” type=”text/css” />
What to do when using HTML5
<script src=”app/template/jquery.js”></script>
<script src=”app/template/functions.js></script>
<link href=”app/template/css/dtp_styles.css” rel=”stylesheet” />
Remember, since HTML5 aims to remain backwards compatible with current content, you can still load resources the way you currently do it. They’ll still load properly.New input types
You can now have “email”, “url” and “tel” input types in your forms. These input types don’t function that well on regular desktop browsers, but when using MobileSafari on iOS for example, they work great. MobileSafari shows a different keyboard type for each one of the inputs. So if you supply the “email” input, MobileSafari will display the specified email keyboard. Remember, desktop browsers will just render the inputs as text - so you can start using these new input types right away.
-
nickthejam liked this
-
benckendorfs liked this
-
lady0death liked this
-
raphaelcaixeta posted this
