HTML5/CSS3… The crossover

So, briefly, I created an independent study class that focuses on web design and front-end development, a.k.a the love of my life. Ignoring how creepy that is, I decided to start this semester off with transitioning over to HTML5 & CSS3. Which, for those of you who don’t know, is one of the greatest things to happen to all things web AND mobile. HTML5 is compatible with mobile devices, so not only are there a TON of new gizmos and whatnots to use on websites, but they will work on your phone too. Also, we can now create application with HTML5 and JavaScript instead of learning yet another language, such as C++.

Here’s a cool, short vid I watched when beginning this week just to explain the awesomeness.

Anyways, the best way I like to learn is trial and error, guess and check, visually create and watch how it doesn’t work (the last one is probably the closest comparison).  With that said, I transitioned my old personal profile site (which is rather ugly and completely unfinished) and changed it over to HTML5/CSS3. Yah me!

The biggest transition are the tags. HTML5 requires less information for the webpage to work (DOCTYPE) and the tag used in the site require less ‘divs’ more specify better to the function of information put onto the site.  So, instead of naming a div class “head” for my header, all I need is <header>.  Absolutely brilliant!

Working through my old site I realized I was already transitioning over to HTML5 without knowing. This was probably due to Google searches and the most recent information popping up that I need was the new and improved HTML5.

Also, I transitioned all stylesheets, minus the jQuery files, into one. Do I need to explain why? Less work people!

If you’re looking to see how these websites work, check out this gallery. All the sites you see are created in HTML5, and if my site were prettier I would be on there to.

Anyways, if you want to see my site, go here for the HTML5 version or here for the old version.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s