Blogging, tips

Elements of a Good Blog Part I: Design & Template

33 Comments 04 October 2011

 

The other day in the office we were having a rousing discussion about what makes up a truly good blog. Not necessarily one that is monetarily successful, widely read, or  even hugely popular, just – what makes it good. We came up with a core list of elements, and decided this would make great fodder for a series of posts on IFB. From aesthetics to content to usability, we’re going to break down the characteristics for you one-by-one.

 

To kick things off, let’s start with the bare bones of a blog: its design and template. Whether you use a pre-made template provided by your platform or hire a web designer to create a custom experience, how your blog looks is what everyone will notice first.

 

The buzz-word with blog design? Simplicity. Let me get specific:

 

Color

 

  • Your background should be white. Or, at the very most, off-white. End of story. If you look at pretty much every successful publication since the dawn of the printing press, there’s been a pretty unwavering use of neutral pages with dark text, because it’s pleasing to the human eye. I won’t make any calls now, but I don’t think you’re going to be the revolutionary to change that.
  • Your text should be dark, to contrast your nice, clean white background. Black is a go-to favorite, but if you must be daring and different, navy, charcoal grey or blackish-brown could also work.
  • If you include hyperlinks in your text, they should be a different color than the main body text, so that your readers can easily see them. Still, this color should not be electric green. Try a dove gray, maybe dark purple or blue.
  • In addition to being aesthetically pleasing and easy on your audience’s collective peepers, keeping your color scheme muted is a sign of professionalism.
  • The best place to add color on your blog is through photos and collages. I suggest these rather stark color guidelines because that way, the images you use will stand out and receive the attention they deserve from your readers.

 

Text

 

  • Try to envision your blog like you’re running a glossy magazine. Think of the uniformity of their pages, and how easy they make it to take in their content. Magazines, newspapers and books all use similar and seriously simple fonts.
  • I think you can go two ways with your main body font, and either is acceptable: Serif or Sans-Serif. Traditional media typically leans towards Serif fonts like Times New Roman; but I also find sans-serif fonts like Trebuchet MS to be visually pleasing.
  • As far as sizing, a standard 12 pt or 10 pt font should be used in the body, while you may want to make your post title fonts larger so they’re easy to distinguish.
  • Post titles are a good place to play with font if you feel so inclined. Try out different sizes and looks, but remember to keep consistency in mind. Having different font sizes and styles for your blog heading, titles, main body and side column widgets will look complicated and sloppy. I would say a maximum of two different fonts is acceptable.

Layout

 

The layout of your blog is where things become more specific and personal. Ideally, it will be a reflection of your taste, the depth of your content, as well as your grasp of your platform’s capabilities. The easiest way to format your blog is to use a pre-designed template provided by your platform. Within that template you can usually customize the fonts, colors and exact layout to your specifications.

  • Columns: A side column is crucial in blog layout. It’s where you can put all kinds of information, links, widgets, contact information, archives, a search bar, possibly ads… I could go on, but as a fellow blogger I’m sure you know what I’m talking about. Most likely you only need one column, and it should be on the right-hand side of your page.
  • Post Width: I have my post width set almost as wide as it can go, so that I can make my images as large as possible within each post. Using Blogger, you can customize this in the design tab, under Template, then Adjust Widths.
  • Pages: The process for adding pages is different for each platform, but a quick search of the internet (or a little trial-and-error on your part) will familiarize you very quickly with this design element. Pages you might want to add to your blog could include an “About” page, and/or a “Contact” page.

 

Banner

 

So after all my above cut-throat standards of simplicity and uniformity, here’s where I change my tune. Your banner is your calling card! It should grab the attention of your visitors, and keep them on your site.

  • There are a few different ways you can go about creating a custom banner for your blog. I created my banner using Powerpoint. I arranged the images and text how I wanted them (in a rectangle that would sit nicely along the top of the page) and then just did a screen grab of the composite which saved as an image on my desktop. (On a Mac, this is the Shift + Command + 4 tool).
  • Other tools you can use to create a banner include Picnik, Photoshop, or even the “drawing” tab in your Google Documents window.
  • Don’t be afraid to let simplicity reign in this aspect of your blog as well, many of my favorite blogs use text only in their banner. Again, it looks clean and professional.

 

Bear in mind, this is all advice for your blogging starter-kit. Having a strong, simple foundation will allow you to go back once you’re comfortable with your platform and make changes, add flare, and really let your personality shine.

Here are some examples of blogs that we think exemplify great design:

Your Comments

33 Comments so far

  1. A says:

    Great tips, thanks. It’s sometimes difficult to know what will appeal to readers and not just me.

  2. lisa says:

    What a great idea for a new blog post series! I admit, sometimes I have doubts about my blog design because it’s a standard Blogger template with some slight tweaks. But reading your tips, I feel somewhat vindicated. Simplicity really is best!

  3. Felicia says:

    This is great info. Like Lisa, I also have a simple, clean format and feel vindicated by the advice you’ve given here.

  4. Ishea says:

    These tips were like the music to my ears! I just started my blog and tried to give it a magazine-like and a bit classic look. Now, I see I’ve accomplished most of what you advise, but hoping to improve it even more now after reading this!

  5. I don’t know about how I feel about this. I mean all the blogs look the same. White background with some pictures. I get that you want the focus to be pictures, but sometimes the background can add interest and individuality to the actual blog. I like blogs that have a sort of design and aren’t just set up a flicker site. But then again, I am a newbie so what do I know!

  6. dottieb says:

    I took your advice about using a white background, thanks for the post..very informative!

  7. Perhaps it’s me but I tend to favor a blog with a bit more personality. Sure the white background/black text is simple and easy to read but I also get bored when every single blog looks the same. Aside from Cupcakes & Cashmere it is a little hard to distinguish one blog from the next in the list mentioned. I think a colorful banner is a good thing, it leaves no question of who’s blog I’m looking at and makes for a memorable site.

    • I agree! As long as the colour palette is coherent and tasteful and you try to keep the text, photos and layout coordinated, I see no problem with making it slightly less neutral. We’re not all The Sartorialists… :) (And I don’t mean it as something bad, I absolutely love his work and check it out every day!)

  8. I totally agree with you. I get so irritated by cluttered blogs and like them as simple as possible. On my own blog I’m constantly updating the sidebar and trying to simplify everything to make it as clean as possible.

    I do find that it’s hard to find simple but graphic themes that are all ready to go. I think at least some of the best blogs have someone design their site. Personally I use woo themes because they have a few really simple ones that I like.

    Heather

  9. I am not ashamed to say that I “tick” all the requirements. I think the blog should also be written for a specific audience – so cute kawaii stuff for some teenagers and plain white design for more grown-up approach. I know that this is very judgmental, but I hope you know what I mean.

    http://www.mademoiselle-lala.com

  10. lika says:

    i found your post helpfull, thanks. although i agree with slow southern, sometimes blogs are too clean and they all look the same. lika

  11. Jaida says:

    This is great advice to keep in mind! Thanks so much for these tips!

  12. Cassie says:

    great advice! I am definitely taking a second look at my design now.

  13. Samantha says:

    Its so good to know what works best and has been tried and tested but I guess with me, Ive approached it from a visual perspective.

    I actually prefer dark backgrounds and I think that may have something to do with the type of fashion designer I am.

    Great advice to know and thanks for the tips

  14. Dnuneziii says:

    I find the tips really useful. Thanks a lot~ It applies to every kind of blog may it be personal or professional :D

  15. Great tips thank you!

    Reassuring to know I’m applying most of them but just downloaded a plug-in to make my fonts more uniform (:

  16. Daniel Dunt says:

    These are some great points; I have to say, the layout of a blog is something which really attracts me to it, meaning a good layout = more readers! – I have developed my blog over a long period of time, and currently I’m extremely happy with the outcome of my work – http://www.tsnewyork.com – feedback would be appreciated; good or bad! – Daniel

  17. jel says:

    i liked this post and look forward to more like it. I am happy to see that i’ve already got every single one of your suggestions implemented on my blog. one thing you left out was how wide your blog should be… i personally don’t like it when a blog is larger than the computer screen and you have to scroll sideways to view the whole thing.

  18. kimmiepooh says:

    I’ve done some consulting and these are pretty much the exact same tips that I give when it comes to blog design. I’m still trying to find ways to make mine look better (cupcakes & cashmere was a reference when I first sarted).

    I know that some people get bored with the simple white background but I look at it the same way that I look at a magazine.

    Play around with your header but keep the rest clean: the content that you post is what I’m coming for and if your blog is too convaluted with bells, whistles, flashing lights and neon colors, sadly, I won’t return.

    Another great post. I love being a part of IFB!

  19. Dimples says:

    Great tips! I am still developing my blog. Everything I do I’m always considering how it might look on different browsers and such, or if something is too much, and etc. One of my important things I like when looking at other blogs is the banner. I love unique simple banners it can really give you insight on the blogger sometimes and pursued me to read.

  20. Pink Breezy says:

    OMG!!! This is exacatly what I needed! My blog has alreaday been created but it needs much nurturing! I am not a graphic designer by far but this post is about to really set me on my way! THNX XOXOX!!!

  21. Joy says:

    I wish more people will now change the look of their websites. I hate to be mean but there are too many ugly blogs out there to count!

  22. Kristina says:

    I actually have all the points you mention in my blogdesign :) still i doubt sometimes, if my design is goodlooking enough and appears to my readers..

  23. alicia says:

    Great advice all around. I just gave my site a facelift a few weeks ago to correct some of these problems.

  24. Cameron says:

    My blog was black until today. I also used Google Fonts for everything.

    Now, I’ve changed my blog’s appearance, use Trebuchet MS, and changed my header image among other (ongoing) updates.

    It was painful to let go of all of that. I suppose it needed to happen sooner or later, though.

  25. Anna Breault says:

    This post is simply awesome! It helps me think what way should I do to make my site more beautiful! Thanks

    Heidelberg Printing Press

  26. Sean says:

    Thanks for the tips – if you get bored and decide to see what’s out there, feel free to stop by Fruitpunch and let me know how it is! I’ve had trouble finding an audience, I think because I’m a male blogger and particularly because a lot of the strength and continuity of the blog comes from the written content, which isn’t necessarily the draw for many other fashion blogs. Le sigh…any advice? Checking out the other parts in this series now!

  27. I think you make some great points here, but I also think that individuality is another hallmark of strong design. You referenced some fantastic blogs with excellent content, but when viewed one right after another that way, they look like almost the very same blog.

    Part of what I enjoy about being an independent blogger is being able to design to please my own eye. In a poll, my readers overwhelmingly preferred my graphic background to a white one, so I guess you just need to know your audience.


Trackbacks/Pingbacks

  1. Elements Of A Good Blog Part II: Content Editing | Independent Fashion Bloggers - 11. Oct, 2011

    [...] (See Elements Of A Good Blog Part I: Design & Template) [...]

  2. Elements Of A Good Blog Part III: Widgets | Independent Fashion Bloggers - 18. Oct, 2011

    [...] the third installment of our ‘Elements of a Good Blog’ series! Now that we’ve got design and template as well as content editing under our belts, lets move on to some of the helpful extras, shall we? [...]

  3. Elements Of A Good Blog Part IV: 7 Finishing Touches | Independent Fashion Bloggers - 25. Oct, 2011

    [...] down the elements of a good blog each Tuesday. [For reference, here's the past three posts on Design & Template, Content Editing & [...]

  4. How To Blog Like A Journalist | Independent Fashion Bloggers - 31. Oct, 2011

    [...] you’ve read some of my past posts on IFB, such as my post on design and template, or about how to blog about a fashion show you didn’t attend, you’ve probably gotten [...]









The IFB News

Blogger Poll

What platform do you blog from?

View Results

Loading ... Loading ...



© 2012 Independent Fashion Bloggers. Powered by Wordpress.

Independent Fashion Bloggers, by Coveted Media, Digital Influence Agency

More in Blogging, tips (323 of 998 articles)


  Because I've had a blog for a little over two years, I've spent a fair amount of time browsing ...