A good blog design is prudent and central to any popular blog. Popular blogs like Vandelay Design, Zen Habits stand testament to this. This certainly a lot of controversy surrounding the term web-design. So before we go further and explore the details let me share some interesting information with you.

When I set up my first blog at Blogger, I was too excited about blogging and designed my blog dark. Later as the viewership increased and the content became the focus, I found that dark backgrounds are not the most comfortable for reading. So I then switched my blog’s theme to a clean white one. Later when I moved to Binary Turf, I realized that the content had increased a lot and sadly the only way to reach for it was to use the search engine. Thus I created the navigation and a sitemap. Today as I look back I realize there was more happening under the surface than apparent.

I was slowly moving from a decoration oriented design to usability oriented design. And that brings us one step closer to my perception of web design.Web design has two elements - decoration and architecture. While decoration enhances the visual appeal of an interface, the architecture focuses on the usability element of the design. The purpose of the design is to bridge the gap between the gap between the visitors and the content (or the purpose of the site).

However, as you go deeper into the subject you’d realize there’s more to it than styling. And there are various elements like typography and incremental leading which come into play both on the decoration front as well as architecture. And it’s still debatable how much of it should suffice.

How much of it is right? While you could go on styling your site endlessly there’s always is a point beyond which things do not matter all that much to the visitors. If you have to focus on things like incremental leading and grid layout etc. it may be too much to be justified. While if you are trying to add the element of elegance, center layout this is the least you could offer your visitors. Your mileage may very depending on the purpose of the site.

What to focus on? Architecture or usability always comes first. It makes your site usable or accessible, searchable, navigable and more. The decoration element supplements the usability with appeal and elegance a site should have. If you count on either of them alone, it would not work for long. A good design is always primarily measured by its usability.

Should I redesign my site? Redesign is a big decision to make. You should know what your design lacks and what you are trying to achieve. You should also understand the investment (in terms of money or time - if you design yourself) required and envision how much of a difference it will make to the end-users. After all that’s what counts at the end of the day.

Photo by . SantiMB .

If you enjoyed this post, then make sure you subscribe to the RSS Feed. If not let us know how we can improve.

Share This

I am sketching out a design for a premium wordpress theme I’m designing. That inspired me to mention some of the basic elements used in design and the effect they render.While to the naked eye they all look what they are, their effect in combination and overall on the site brings some starking results.

Thus here are a few top elements used in web design and their effect.

• Borders

  Borders add definition to elements. If two elements have same or similar color, the effective use of border helps distinguish between the two bodies.

• Rounded shapes

  Rounded shapes (think curves) are naturally appealing. Most of our natural environment consists of shapes which are round. Trees, pebbles, sky, water, waves etc all have naturally perfect curves on the outlines. When effectively used with sharp defined edges they give the design a surreal look and feel.

• Gradients

  Gradients render a soft 3-d effect and make things look real and touchable. They highlight the impression as if they were carefully placed in a 3 dimensional space.

• Stripes and Patterns

  Stripes actually are a subset of a larger family of patterns. Patterns when used thoughtfully for the background give a nice textured feel to the overall design. They create an impression of various elements been placed over a surface.

• Colors

  Colors define the bodies of the elements themselves. A good color contrasts highlights the difference between two objects. Too much
  of it gives the design a cluttered look. A low contrast necessitates use of borders to enhance definition of surfaces.

• Space

  Space enhances the elegance and cleanness of a design. Used effectively it adds a distinct dimension to the elegance of your design that speaks volumes about itself. Sometimes a single element positioned as a subject on a spacious design looks more beautiful than anything else on the site. It’s like using a metaphor in a sentence which implies a lot of meaning within a few words.

If you enjoyed this post, then make sure you subscribe to the RSS Feed. If not let us know how we can improve.

Share This

Flashmint is running an interesting contest. They are inviting wordpress theme designs for their newly launched blog. The prize money is $500. So what is in it for bloggers? Well if you can send them some of your traffic you could win $300 for the first prize.

Flashmint  is basically into web design and has been in the business since 2004. They’ve recently launched their blog. The blog is pretty new thus has few subscribers as of now. Also the blog needs a design tailored to their requirements thus this contest.

I know as a blogger most of you would have come to terms with web design. But if not you could always provide them a link. You could win anything from $100 to $300. Even if you don’t they still will give you a free PR 4 backlink for your site.

Note that this is not a paid review. Nor is this my participation in the contest. I bring it to you so that those interested may participate and benefit. You can learn more about the contest in their blogpost here.

A tip from my side. They are a web design company. Such a company may appreciate clean “and” unique designs which also project them as an expert in the field (a moderately flashy design signifying their expertise but not overdone). Of course they have set out some expectations about the design they are looking for.

Photo bySpacePotato

If you enjoyed this post, then make sure you subscribe to the RSS Feed. If not let us know how we can improve.

Share This

The recently released version of the Wordpress theme - Thesis - is hot in the news especially in the blogger arena. It’s developed by Chris Pearson. The theme has been talked about at popular sites like ProBlogger and others and all the hype carried me to DIY Themes. Finally after taking a look (whatever I could do for free) at the theme, I have serious doubts whether a professional blogger would like to buy it. They say there’s nothing like bad PR (point 23). I believe that with all my heart and soul. So with all due respect to the developer here’s what I have to say about this theme.

1. Body font

   The first impression is lasting but not necessarily useful in the long run. It’s worse if you try to impress a web designer with this one. We are talking about the font-family here. The use of Georgia and serif font in the body text goes against the principles of typography. This makes the text harder to read while putting a lot of stress on your eyes. When you’ve chosen to purchase a premium them, you expect better. I seriously doubt any established web-designer would approve of such quirks to lure prospective customers claiming beautiful typography. Its lame.

2. The features

   Are there any at all? The claims point to the theme options or the configurations options panel feature. You can put the Google Analytics code and have your feeds redirected to feedburner. You can customize navigation from the options screen and put in a few images that cycle everything you reload the page. You even can add your custom CSS and images to a custom folder that comes with the theme. Guess what? I’ll give you some very easy alternatives for $999. And I’ll also give you an option not to pay at all

   • Get the feedburner feed redirection plugin from wordpress codex. That will take care of it for you.
   • Get the all-in-one SEO plugin to take care of Search Engine optimization.
   • Use the text widget from the widgets section and put in all your ads, tracking code there. You want to pay for that? You have my email.
   • And finally if you are so intent at customizing the CSS, navigate to the Theme Editor option under Deign in the default Wordpress theme. It will allow you to customize anything and everything without you needing a developer license. Put in a GPL license and you can even distribute on the newly gone public Wordpress Theme site. Customize it all you can.

3. The price

   $87 for a personal license and a $164 for a developer license. My take - I submit to you that if you are a developer, you start from scratch. Build some rocket-science features and then sell them for $10. That will only underline your authority as a developer and a creative one at that.If you are a blogger and more intent on using the theme, take a look at some of the best themes out there on the Wordpress Theme site. Also take a look at the free UBD Moneymaker Theme.

4. Accessibility

   You want to take another look at the Wordpress default theme? You can customize the header no end and it works on almost every known browser and mobile device. Pep it up a bit and it’s all yours to claim. There are better options than paying for this theme.

5. What it doesn’t have

   I’m also looking for some beauty and style here (other than threat created solely by the image rotator bore). I expect a lot of polish from a premium theme that I pay for. Gradients, colors, rounded corners, anyone?

6. The big problem

   Now you are left with (less or more) about a hundred some dollars. Well, you can forget about it or else send them to me.

Before I conclude, here’s another things I’d like to mention. They say “Great products polarize people”. So you are all free to buy and find the truth yourself. With that said, I’d like to hear what you have to say. And by the way if you are Chris Pearson don’t hit me please. Your comments go right here…

jakemohan

If you enjoyed this post, then make sure you subscribe to the RSS Feed. If not let us know how we can improve.

Share This

Design must serve the purpose

A clean and elegant design can have a direct impact on your readership. You must have noticed how some of the popular blogs out there have an elegant and beautiful layout. But they say that one size doesn’t fit all. What gives? You have a header, a sidebar, a footer and content (of course else what brings the readers in) -But how effectively is all this laid out? Is your layout aiding the visitors or standing as a barrier? Here are some power-points to let you decide.

The first thing you need is a SEO’d theme. SEO (as you must have guessed) stands for Search Engine Optimization. A theme that is search engine friendly makes it easier for the search engines to find information from your site. In this case these are the specific keywords that your content contains. People use search engines to find information. And they use keywords to search for the information they are looking for. A site which is optimized to search engines makes it easier for the visitors to find your content. Also keyword or content based advertising rests on the keywords in your content. So more relevant ads show up when the search engine has induced the keywords.

1. Accessibility

   The web is no more limited to the desktops or the laptops. It can be accessed by any and all devices which have an internet connection. This brings in an interesting angle. These new devices are not computers in the complete sense. They are largely evolving and bring with them a gamut of technologies and pot-holes. What does your site look like when viewed in a smartphone? The variety of screenings can play havoc with your theme. So open up your site in a mobile device and take a look. Or you can use one of the mobile emulators like the Opera-mini demo at http://www.operamini.com/demo/.

2. Customization

   Until and unless you are a designer, developer or a coder of some sort, you don’t wait to be messing up with the code every now and then to make minor changes. Use plugins or theme options to manage your theme, layout, design, widgets. You must have enough customizability at your disposal so that you spend less time managing and focus more on blogging.

3. Features

   The term can have as many meanings as its context. Here we are talking functionality. Plug-ins are nifty killer tools that can transform the way you blog or the way visitors use them. If your CMS supports them, take out some time to review some plug-ins you can use to ease up things and fire up your blog.

4. Layout

   There’s no one single layout that fits everyone’s purpose. A 2-column 3-column 4-column or a single column _they all work with varying degrees of success. Take the minimalist approach (there are good chances that you’ll still land up with some clutter). A header for the logo, a sidebar for the navigation, ads and widgets and a footer for other links, copyright information. Yes, we missed the obvious. The content has to be there by default (unless we are talking about 404 pages). With all this stuff here’s a sketch of what the final thing will look like. From a minimalist layout, your flog shall accumulate a lot over the time. Once in a while, just take off all the clutter and see if you really need it.

   

   A minimalist layout

   

   More regions

   

   Maximum regions

   You of course can try all permutations and combinations like a sidebar on each side or both on the right side etc.

5. Simplicity

   Your blog should be as simple to use as it can get. Now that you can manage it well and focus on content creation, time to empower the readers to make use of your biog. Keep a familiar design. Fancy designs no matter how attractive they are, only distract visitors from the content. I remember when I was on blogger in very early days and I created this fancy dark design and posted about Firefox. The first comment on that post was “nice design”. Make sure content always remains the primary focus. Bogs are meant for reading, so visualize a newspaper or a book and bring that ease and feel into the design. This is the definition of design.

There can be many more in the list. But it would be interesting to know what tops your list and what works for you. Have something to say?
Image Courtesy: dullhunk

If you enjoyed this post, then make sure you subscribe to the RSS Feed. If not let us know how we can improve.

Share This

1. Out-of-the-box approach

   The way others have done it is not the only way it’s done. There’s always a newer way. And there’s always a better way. Give it a careful thought. There is a better way to indicate a link than to underline on hover. It could be a combination of effects instead of a single one. There’s a lot of scope of creativity when you plan a design initially. Later on the foundation is paved and you are more or less restricted. So start with a brand new approach. This could mean doing a small research on the latest and the greatest of the designs or even retouching the very basics and even question them.

2. Elegance

   Nothing works better than this one. If it’s elegant, it’s worth it. If anything come at the cost of elegance, it’s not worth it. So steer clear of things which in anyway could compromise the elegance of a
   design. Be it layout or even the content. Elegance is more than neatness, plan, grace or beauty put together. Elegance brings with it a newness, an approach to implementation and conceptualisation of a unique design. And elegant is more-often-than-not unique.

3. Simplicity

   This is a tricky one. A good design is everything but simple. But here the term simple is used as in simple for the end-user. A distracting or a very attractive design could work against the purpose. Simplicity is a win-win deal for you and the end-users. Being simple is being elegant.

4. Cleanliness

   Some of the most unique designs out there are unique because the designer could balance utility vs. creativity. Its a fine balance between the two. There could be situations where a simple design would do and a more appealing design could fail. So start out by setting target(s) for your design and prioritising them suitably. There are designs to impress and there are designs for ease. There could be situations which warrant a design for a fresh overall feel. So pave a scope for effectiveness and elegance and eliminate clutter.

5. Difference

   Well, this is what they are. After the design is finished, it’s time to rethink what’s different about it. Is it just another one of the impressive designs or is there something unique about it? Does it bring with it a newness or does it make an impression of of being different? This perhaps is a never-ending cycle of feedback and refinement and further feedback. This requires careful evaluation of the design and the target you set in point 1. Look for any missing links or improvements in the existing implementation or scope for enhancements. This is one thing that will assist you in measuring the success of your design.

If you enjoyed this post, then make sure you subscribe to the RSS Feed. If not let us know how we can improve.

Share This