This blog’s customized WordPress theme is finally updated with responsive web design elements. Reading a tutorial at w3schools.com, Responsive Web Design Introduction, encouraged me to implement responsive web design this week. The introduction is concise and actionable for someone with previous experience using HTML and CSS. Seeing their simple implementation using HTML div tags and CSS media queries to implement a responsive web page gave me the needed confidence to start updating this blog.
My customized theme is based on Michael Heilemann’s Kubrick. I wanted to adopt responsive web design techniques to allow this blog to be mobile-friendly or presented naturally by web browsers running on mobile phones or tablet devices. I also wanted to keep many of Kubrick’s design elements, such as the centered column for content and sidebar with a blue header containing the blog title and footer containing centered statistics, when the page is viewed from desktop browsers. According to Heilemann, Kubrick “may be the most widely used template ever designed, having been in used [sic] by millions of sites and ported to over thirty completely different platforms.” I desired maintaining such a recognizable theme for my blog. Implementing responsive web design techniques was a great exercise in adapting and reusing this site’s design.