This Theme Is Now Responsive

Previously, I’ve used WordPress plugins to style this blog’s view on mobile devices, but with all the buzz about multi-device display and publishing, I decided to switch themes to a completely responsive theme.

Because I use minimalistic themes, switching from one minimalistic theme to another is almost unnoticeable. But so you can see the difference, resize your browser to a smaller size. As you resize it, you’ll see the navigate bar suddenly switch to another style. On your mobile device, the text will still be readable. You can read the content on mobile, tablet, and desktop computers. Even the print looks good (hit Ctrl+P).

I didn’t manually style the theme. I’m using Canvas, a theme from Woothemes. Canvas is more like a minimalistic, responsive theme framework than anything else. Hands-down it is the most popular and flexible theme from Woothemes, and with all the responsive styling built-right in, it’s a good choice for a blog theme.

Interestingly, the main stylesheet for Canvas defines the mobile display. An additional stylesheet, layout.css, makes adjustments for a desktop display. In other words, the designers prioritized mobile first, rather than adjusting for mobile after designing for a desktop display.

In the layout.css stylesheet, you’ll see various media queries. These media queries tell browsers to style the content a certain way for specific device sizes:

@media only screen and (max-width: 1000px)

@media only screen and (max-width: 768px)

@media only screen and (min-width: 768px)

That third media query targets the desktop display, and if you look at the styles, you’ll see about 50 styles in that section, compared to only about 5 styles in the previous two sections.

I think responsive themes tend to be more minimalistic to accommodate this flexibility across devices. And when it comes to minimalism, I’ve always felt that content is much more important than design. I choose my blog themes like I choose my glasses — I want the nearly frameless glasses that let people focus on my eyes rather than my frames.

I was recently listening to Joe Sokohl’s STC Summit presentation, Destroying the Box. He talks about Frank Lloyd Wright’s architectural philosophy as an inspiration for UX design. In the presentation, Joe quotes Lau Tzu, who says, “The reality of the building does not consist of the roof and walls, but the space within to be lived.” I gravitate toward the same philosophy with blog themes. I want to make it clean and open enough for my content to breathe.

Adobe RobohelpMadcap Flare

This entry was posted in general, WordPress on by .

By Tom Johnson

I'm a technical writer working for The 41st Parameter in San Jose, California. I'm primarily interested in topics related to technical writing, such as visual communication (video tutorials, illustrations), findability (organization, information architecture), API documentation (code examples, programming), and web publishing (web platforms, interactivity) -- pretty much everything related to technical writing. If you're trying to keep up to date about the field of technical communication, subscribe to my blog either by RSS or by email. To learn more about me, see my About page. You can also contact me if you have questions.

4 thoughts on “This Theme Is Now Responsive

Comments are closed.