- Semantic Tags: HTML5 semantic tags for most parts of the web page. There are headers, footers, sections and articles in the page now. Modernizr makes it work of IE too. The modernizr script is loaded using IE conditional comments to ensure that the newer browsers do no suffer the extra download.
- Microdata: I added hcard and itemprops to the appropriate sections. However, I am yet to see search engines utilize this data.
- SEO friendly: The earlier version of the site loaded content using Javascript. Though AJAX requests can be made crawlable, it it too much work given that the site has almost zero server side support. Hence, all pages are statically server and indexable.
- Domain Name: I finally configured the GitHub to use the CNAME file and redirect http://axemclion.github.com to http://nparashuram.com. There are problems due to this in shortened URLs of TrialTool pages and looks like there is no way around it.
- Jekyll templates: When I said that I had zero server support, I lied. I did use Github's builtin Jekyll support to add a basic skeleton (header, content, footer, etc) to all the pages. I tried creating dynamic pages with HTML templates, but more on that approach later.
- CSS Usage: CSS transitions, gradients, box shadows, text shadows using vendor pre-fixes when generously used. For IE, the filter property equivalents were used. I ensured that the page degraded gracefully in browsers that did not support these. I still need to nail the mobile browsers and plan to use media queries for that.
- HTML5 Video: What is a HTML5 if the videos are in flash. A lot of my projects had videos and I added iFrames from Youtube that would render HTML5 video or flash, depending on the browser capabilities.
- HTML5 Audio: The about page had a link next to my name that runs an audio clip on pronouncing my really long name, done with the audio tag. The mp3 file for Chrome/Webkit and ogg for Firefox and Opera run well.
- Performance: I also wanted to ensure the YSlow and PageSpeed give me decent results. All the javascript were at the bottom, but embedded in the page to remove that extra http request. Image tags have an src_defer instead of src for deferred loading. Some issues like CDN or cache could not be as I do not have control on the headers that are served.
I will also write a follow up post on the gotchas encountered during the entire process so follow this space.
And if you do not have a website, it may be time to make one - its easier than you think :)
