Michael-Li.com

Michael Li Picture
See my vision and experience my life as a young entrepreneur wtih ambition to learn and experience this wonderful world.
M.Li

LockerPulse is Bigger, Faster, Stronger

Filed in: Design,HTML5,LockerPulse,Responsive Design

In the end of May we launched a revamped LockerPulse with a fresh new look and a bunch of improvements. New features and improvements include better fantasy player tracking, video highlights, additional soccer coverage, improved site speed, and the list continues. You can visit the LockerPulse Product Blog for the complete list of improvements and features.

LockerPulse Homepage - More Sports. Less Time.

On the design side of things we also implemented HTML5 and responsive design to take advantage of the most up to date techniques to build the new and improved LockerPulse. We ran into new and unique obstacles on our way to the final design, but in the end we came out with a fully responsive design that works across all devices with a modern browser. For details how we used HTML5 and responsive design please see Making HTML5 and Responsive Design Work for Web Apps Like LockerPulse post that goes through everything in in depth details. For more information you can also check out my post about HTML5 and responsive design when we redesigned the Pure Adapt site.

Adam also guest posted on the popular design site SpeckyBoy.com explaining “Why We Chose HTML5 Over Native Apps“.

I personally think responsive design is the bomb diggity because it just makes sense to be able to build one site that works across different devices. Like the HTML5 slogan says “I’ve seen the FUTURE It’s in my BROWSER”. They even have t-shirts for it and Adam and I both have one.

HTML5 t-shirts

Go check out the new LockerPulse for yourself and feel the power!

07/20/2012 Comments (0)

New Pure Adapt Site Design – HTML5

Filed in: Design,HTML5,Web Design

HTML5 Logo

In a previous post I wrote about the CSS3 we used in the new Pure Adapt site and now I want to post about new HTML5 elements we used.

The HTML5 elements that we used are relatively easy to understand since they were in a way already being used. For example instead of naming to containing div id=”footer” HTML5 now has a dedicated tag for the footer. Simple as that. Here are the new elements we used in the redesign.

<header> – For an introduction of a document or section, could include navigation

<nav> – For a section of navigation

<section> – For a section in a document. Such as chapters, headers, footers, or any other sections of the document

<footer> – For a footer of a document or section, could include the name of the author, the date of the document, contact information, or copyright information

Definitions via w3schools.com

The elements we used are pretty straight forward, but HTML5 has much more exciting new elements to offer like the <video> tag where a link to the source can add a video to your webpage without embedding video code. Now for more information on HTML5 please visit one of my go-to sites for development, w3schools.com.

I’ve talked about the CSS3 and HTML5 that we used in the redesign, but there’s one more post about the design of Pure Adapt site featuring responsive design techniques coming. New Pure Adapt Site Design – Responsive Design post is coming soon.

11/16/2011 Comments (1)

    Flickr Image Link

    X