My Website - Some Gotchas

My last post was about the things that I had done to get my website,,  running. I thought that I should dedicate a post to write about the interesting problems that I encountered while building it, so here it is.

Anchors as block level elements

On firefox, the articles page looks bad at times. I noticed that the divs inside the anchor tags break out and are displayed as siblings to the anchor tag. Once the page is refreshed, the layout falls in place. Hence, I have removed all the blocks on that page as anchors and made them divs, losing the "links" in the process.

Order of audio tag source
I recorded the audio using Windows sound recorder and converted it to OGG and MP3 using Super and VLC. I noticed that the VLC-OGG did not play on Firefox, but worked well on Opera and Chrome. Though Chrome plays Oggs, Super-OGG did not work on Chrome. Hence, I added the MP3 source before the OGG for chrome to pick up the former. Firefox and Opera ignore the MP3 and play the OGG. For IE, I just opened the mp3 file in a new window that would trigger the default action for such files.

Box Shadows
Box and text shadows combined with opacity can lead to some cool effects, like the garage door on the projects page. However, I noticed that the though the animation is very smooth on Chrome, it is jittery on Firefox. For IE9, it is even worse, leaving lines as it animates. I had to add an IE specific CSS to remove box shadows for IE9.

Microdata and SEO
Though there have been promises that Microdata will show up as special snippets in search engines, I have not seen it happen. Sticking to good old title and opening lines looks like the way to go for now.