5 Simple Rules for a Better Blog Design
When I started working on the new Woork Up I spent some days thinking about how the layout of the new interface of this blog should have been.
Before even getting my hands into the CSS code I identified five guidelines for the new layout, the same I want share with you in this post.
1: Rethinking the home page as a set of focused information readily available at a glance and not as a long vertical list of posts organized by date.
For the home page of Woork Up I wanted to create something different from the typical blog layout we’re used to see. The result is a “compact” home page with a main section which contains the current featured article and a left column that lists some less recent featured articles.
2: Organizing the page elements so that their disposition quickly directs the readers to the contents which must have greater emphasis and visibility.
On the post page I added a section on the left of the text which contained a list of articles related to the current post and some recent featured articles.
The sidebar contains a “popular posts” section whit a list of the most recent popular post on Woork Up. The main section contains only the text of the article and the comments area.
3: Optimizing the number of links on pages
Too much information is equal to none. Do not fill your page with links.
4: Reducing the number of social buttons to share posts on social networks and integrating them harmoniously with the design of the page.
Social buttons are useful to make articles popular on social networks and drive more traffic on a website. The only problem is not all social network are appropriate for all websites. In my experience Twitter, Delicious and Facebook are the best sources of traffic for Woork Up. That’s why in the new layout of this blog I decided to add only three social buttons, integrating them with the style of the page.
5: Making advertising elements minimal and deleting every kind of advertising from the body of the articles.
Advertisement is fundamental to monetize the contents of websites. But I admit, as a reader, I hate pages full of banners and in general all kind of invasive advertisement on a website. So I decided to limit advertisements only on the sidebar: this position is perfect for your advertisers and your readers will love you!
What do you think about this topic? Do you have other useful suggestions to improve blog layout? Share your ideas with a comment.
Samsung Galaxy Nexus video review: il migliore smartphone Android di sempre
Hey dude, i love the old them of your page, and this one i just cant express how much i love it. and ass you say the first time i see it i agree whit a friend that you have the point on it becuase you give the main attention to what you want: The content. And you do get it, also the web page are complete unique and that great.
Am also traing to do my own unique theme and the main problem i have its that google craller do his job good, and that its what donut happens whit the theme i do. i have to see how to do or solve that problem.
I will really expect to see the about css of this new theme to learn things. And am crazy to know how do you do to make the header background go all true the header and pass the wrapper.
Take care and of your i will be here in this blog ofthen.
Hi Hector, thanks for your comment and for your support!
Love the new design, it really works out well.
On your point about ads:
In general, ads integrated in to the content have a higher click-through, but it’s also important to keep the users in mind, and most users don’t like ads breaking up the content.
It’s always about finding the middle ground where most (not everybody) are happy, and I think having the ads gathered on the side works on this site and makes for an elegant solution.
This time we wanted to improve user experience (and style of course) before anything else.
If the users are happy, we are. :)
Thanks for sharing your thoughts!
You talk about only the content part. What about the header and footer part. Header and Footer is also important part of blog. Could you please share some idea about header and footer design.
That could be the topic of a future post! :)
Stay tuned
Hi Dude
Thanks for sharing your ideas on blog layout.
I keep on looking for effective blog design pages.
I also like the idea you have on advertising and would definitely want to use that.
Hey Antonio,
Great Advice. As always a very informative post. Keep up the good work. Cheers!
Hi Antonio, I like the design…
I love this insight “Too much information is equal to none” – That was enlightening my brain :D thanks – Great work
Thanks a lot Andre :)
I love it! I especially love the way your “other articles” appear in the left column. Much to learn from this post!
Thanks Brandon :)
In Latin america we are like ads blinds, its mean that no matter how much adds you have in one web page, we are able to surfer like if there are not there, like if its a non existing part of a web, i thing its not only Latin america whit that aidier of adds but whit the time they have to redesign the way add reach to users.
And also in design more its lest, and whit this theme you just hit of the right place. not to much add, not to much design and a lot of content. what else would a user want.
Might be you sacrifice adds earning for loyal readers.
Awesome tips!
Good redesing, really enjoyed it!
Although my blog is not setup like this, I’m going to keep this in mind when I start to rearrange my sidebars, ads, and content. Thanks for the tips.
I’ve recently started playing around with designing my own WordPress Themes–well using a WordPress Theme Framework to make this easier.
I have to admit that I do love this design. It’s a clean, minimalistic design that’s still functional and appealing.
I stumbled on a subtle element of this design from my own experimentation. The thin gray line to the right of the main post section is key when using a white background design without borders to orientate the reader as they scroll down the page. Without it, things just look disorganized.
As well, I agree that the front page should be used to in innovative ways to display content. I personally prefer clean designs that don’t rely on CSS images, so this design fits well with my own preferences.
cheers!
Nice redesign.
However I have a suggestion regarding main navigation. It gives impression that main navigation is related to sub-nav and when we will click on diff. main-nav item we will get diff. items in sub-nav which is not so. Hope I’m clear.
Nice post n nice blog…happy blogging, Sir.:)
I agree with you as a reader that I hate ads in the content area.
Best place for me is the sidebar.