Our Love Affair With WordPress: Part 4 Episode 1 - Your Blog Design

October 29th, 2007 · No Comments · Category: (Web) Technology · Blogging · Design · Our Love Affair w/ WP · WordPress

Step 2. Get Sexy, Set the Mood

So, now that you know why your blog exists, the concept and the goals your blog must meet to be successful, let’s turn down the lights and set the mood. Or, if you like the lights on, by all means, whatever turns you on. Set the mood that not only defines your purpose and vision, but that also speaks to your target audience. Foreign independent film enthusiasts tend to be more cerebral and worldly folk. They cherish good content and don’t usually care for mainstream things so the mood of your blog can be a bit moody and vibrant, showing contrast and uniqueness. Blues mixed with yellows. Oranges mixed with grey hues. Fun mixed with intelligence. Or, sexy with brainy. You get my meaning. Whatever the mood, just like the content make it relevant and make it mean something.

Step 3. Design the Information Architecture

I won’t go too much into detail about information architecture here only because it can be very complex full of technical gibberish. Ultimately, what you want to achieve in arranging the information on your blog is to arrange the content, sections and pages in such a way that your target audience led around your blog in a way that’s most beneficial to them (and you). If the film reviews in your foreign independent films community blog is the main section, then the post should have pictures, be in the largest column and have a big header. And because interactivity is a main goal for you, you’ll want the comment link to be prominent for each post, the forum link in the main navigation bar (probably on the top) and you’ll want to offer two subscriptions options (by feed or by email) that are prominently featured on each page in a sidebar navigation scheme or the top main navigation and the footer. The footer is an especially important section when it come to pointing your visitors to something your really want them not to miss on every page outside the main navigation if for whatever reason that element doesn’t belong in the main navigation.

The great thing about WordPress is that its structure is separate from its style. Not only is it separate but the the structure is cut up in sections so that you can arrange information more easily or change the style on one page of the same structure on another page. For example, say you have a right side navigation bar on all pages but you want the color schemes to be different depending on what page the user is on. You can do that by editing just one template file (the sidebar) and the CSS file (stylesheet) rather than each individual page.

Step 4. Design the Visual Elements

This step is basically where the blog design starts to become cohesive. The visual elements are all the images, buttons and typography of your blog design. All these elements should come together to support the mood and concept of the blog so nothing clashes or puts off your blog visitors. Perhaps you have a specific navigation scheme in mind with little illustrated images of film related icons representing the main areas of your blog. Perhaps, given the cerebral, moody and unique audience, your font styles may be a mix of Arial or other sans-serif font in different shapes, colors and sizes. Perhaps all the images of the films reviewed may be stylized with a Photoshop filter or just have a single fat border of a certain color. These elements all come together to support how your blog design looks and feels.

Again, because WordPress rocks, different pages can show different visual elements to highlight aspects you want your visitor to notice. For example, lets say you have 7 pages in the sub section “films by continent” where each page has the title of the continent at the top. Suppose you want a little graphic image of the country next to each title. This can be done with not too much effort.

Where to find your visual elements?

  1. Buy your images from clipart and stockphoto sites like istockphoto.com
  2. Create your own images using Photoshop or Illustrator
  3. Hire a graphic designer or a web icon designer to create graphic elements for your navigation or original images for your blog
  4. Hire a graphic designer or a website designer to help you determine what font families to use and how
  5. Hire Poles Apart Design to do all these things for you!

Step 5. Build the Site

Now with all the visual elements designed, bought or found and the information architecture constructed, all you have to do is build the damned thing. If you know coding, you’re good, but if you don’t, hire someone. There’s no sense in learning HTML, CSS or PHP if you don’t have the time or desire. Hire a website designer or developer (like Poles Apart Design *wink*). WordPress makes it easier than many other content management systems to design blogs without having to know PHP, though it does help. I designed my first blog without knowing a lick of PHP (I knew HTML and CSS and JavaScript). It’s not too difficult but it does take time. If you got the time, by all means. Also, later in this Love Affair With WordPress series, I will show you how little or how much you need to know in order to edit the PHP, HTML and CSS coding on your own if you’re the DIY type.

Pages: 1 2 3

back to top


Leave a reply

back to top