People have 100’s of options to read about a topic and the first thing they notice is the design, if they do not like the design they will try to read about the same topic on another website, here are a few tips to make you blog design more attractive.
1. People Judge Your Blog Based On The Design
If somebody knows you well, they don’t care about your looks that much. If they see you for the first time, looks matter a lot.
The content of your blog is always more important than the design, but you need to woo people with your design first. You draw them in with design, and keep with content.
“Design is not just what it looks like and feels like. Design is how it works.” — Steve Jobs
Here comes advice how to design a better blog. The following advice will help you design a better blog and this in turn will help you sell more (doesn’t matter whether you’re selling free sign-ups, coaching sessions, products or whatever).
2. Function Always Before Aesthetics
Who is your site for? What are they looking for? 76% of people want it to be easy for them to find what they want.
What kind of blog layouts are they used to using? Remember, people spend most of their time on OTHER websites, not yours & prototypical websites are almost always rated as more beautiful.
Avoid totally new and never-seen-before layouts. Your car isn’t unique, and your house might not be either.
For return visitors search is vital. Make sure your search box is clearly visible (above the fold), at least 27 characters wide and that search can actually find relevant stuff. WordPress’s built-in search sucks, it lists the results by date, not relevance. Use a plugin like Relevanssi to improve it tremendously.
3. Reduce your blog’s page bloat
According to Web Performance Today, the average size of a webpage is around 1246 KB, and it continues to grow every day. Despite the upward trend, larger webpages are bad for both users and site owners as they cause slower performance and larger bandwidth costs. Kissmetrics states that 40% of users leave a website if it doesn’t load after three seconds. Performance issues are a problem particularly for mobile device users, for whom a larger website can take many seconds to load over a 3G connection. There are some easy things you can do to reduce your blog’s page bloat.
One of the most common causes of slow performance is images. When low-bandwidth devices access your website, the images on your website with resolutions for a desktop monitor will load slowly and unnecessarily increase your bandwidth costs. You can find several scripts online, such as Adaptive Images, which will detect the screen size of your visitors and deliver re-scaled versions of your website’s images. You can customize the script to set the browser-caching and image quality.
Use gzip to compress your website’s resources. Check your JavaScript and CSS code to remove any redundant line breaks. See if you can take out any page elements you don’t need. For instance, maybe you have social sharing buttons on every single one of your webpages. This may be unnecessary. Check to see if there are any pages that are not likely to be shared on a social network and remove the social sharing buttons from those pages. Cut out all the plugins that don’t significantly contribute to your website. By reducing the amount of information being sent to users, you’ll easily improve their navigation while minimizing your bandwidth costs.
4. Make content evergreen
Some visitors will click on a site they’ve found on a search they made, notice that it was written years earlier, and leave your website if they notice that the information is outdated. When you make posts, try to write them in a way that will remain relevant in the future. By making your content evergreen, we don’t simply mean removing date-specific facts. Rather, if all possible, try to write in a way that will remain both factually correct and interesting in the future.
If there’s anything on your blog that’s out-of-date, take the time to see if there’s anything you can do to make it current again. Ask yourself if there is any new information on the old post’s topic such as a new statistic. Perhaps you can add some new insights to your post. Once in a while, go through your archives to see what can be updated.
5. Keeping Your Blog’s Grid Small
One of the easiest places to start achieving a clean and organized design is by utilizing a grid system, a technique that’s been used widely throughout print layouts such as newspapers, magazines, etc.
This technique has been applied to web design to help provide a consistent experience for users due to the variety of screen sizes users view your content on.
Similar to a research paper stretching 11 inches in content width, blogs with grid widths that are too large (especially if users are on larger screens) will create readability trouble for your users. It risks them losing their place as they read line to line, while also making your content appear shorter and awkwardly spaced.
Since the vast majority of users are using monitors that are 1024px screen widths, your grid width for your content should range from around 900px – 1100px, with 1024px being the ideal.
This technique also gives you a healthy amount of whitespace throughout your blog. Using it helps users differentiate elements throughout your blog (sidebars, headers/body text, images) from one another. The grids effectiveness in organizing your blog’s information is the foundation for keeping your content under control.
6. Navigation
Once again, as with any site, intuitive site navigation is an important element for the sake and sanity of the reader. Now as the designer you are not necessarily dictating what other pages will be included with the blog, but you do set how to get to and from them, and this important usability interface can be integral to the blog design.
In fact, what is the point of having other pages, if you are not going to showcase them to your readers in some form or fashion, and the navigation is an important part of that. Just creating the access is a big first step.
Navigation, while an important element that needs to be accessible and clearly marked, does not have a lot of restrictions as to how you can achieve this effectively and creatively.
One tip for over-delivering on this element, and thereby demonstrating its importance, is through a multi-layered approach. Not only having the main site navigation that is styled to match and fit in with the blog design, but you can easily include a simple secondary text-based nav element just below the footer of the blog. This is a quick addition to the site that will aid both your client and their readers.
7. Site Search
Given that blogging seeks to be engaging and does so through its content, let your design highlight this through the inclusion of a site search element as well.
Site searches give some users more comfort and familiarity than trying to use the navigation or archives to find what it is they are looking for on your site. They may also have come to your site via another and may want to just browse for a particular keyword that is not apparent on whatever page of the blog they have landed. A site search can address easily these concerns.
This can be done as subtly and unobtrusively as you wish, or you can go to more garish and bold places with it, but however you do it, just do it. Both the client and the readers will be appreciative of this thoughtful inclusion.
And as said, if you are into a much more minimal approach and the thought of yet another element to add makes you cringe, this is certainly not a cringe-worthy addition as much as it is a necessary one.
Besides the site search is easily worked into a minimal style as it can be tucked away nearly anywhere given that you determine its dimensions and the way it blends into the background. And as long as it does not detract from the blog design, why not make it that much easier for readers to surf the site?
8. Make your site mobile-friendly
More and more people are browsing their internet on their phones and tablets, and many companies and individuals have adapted their websites accordingly. Now people expect websites to be optimized for mobile viewing. If you don’t do so, don’t expect visitors to stick around for very long. It is very difficult for viewers to navigate through websites that aren’t mobile-friendly. They have to zoom in to see your text at all and then constantly scroll left and right to continue reading. Or, they may not be able to zoom in at all. They might accidentally click on the wrong link. All in all, it’s a headache that few are willing to endure.
If you’re not familiar with code, you can find a variety of services online that will make your website mobile-friendly for you. If your website isn’t very complex, the cost of adapting your desktop site for mobile use won’t cost you a lot. However, you should still pay attention to the quality of the service before you sign up. A cheap-looking mobile-friendly site with inadequate content and limited functionality will cost you many potential visitors.
9. Always Improve Signup Forms
- put the form labels above the input box (not next to it),
- give clear reasons to take action,
- have the submit button say what’s coming next,
- ask for as little amount of data as possible – email address is enough in most cases.
The more fields people have to fill, the less people do it. Email personalization by name is not working as well anymore anyway, so might as well not ask for it.
If you offer people what they want, they are happy to sign up.
10. Know the bounce rate
This brings us to our last tip. If you have any ads on your blog, then of course you will want some users to leave your website to access your advertisers’ websites. Kissmetrics has an interesting infographic that shows you the standard bounce rates for different types of sites.
If your bounce rates are ridiculously high, it may be high time to consider whether your website’s usability has anything to do with it. You might want to consider an overhaul in your blog’s design.