Blogging Part Two: 10 Steps to Design

This is Part II of my blogging series, last week I gave you 20 basic blogging tips and today's post is about blog design, stay tuned for the last part next week on promotion. It can be a little daunting when you first set up you blog to decide on a look, especially if you've been reading blogs for a while.

1.Look at other blogs/websites;
This is a good place to start, go to your favourite sites, bookmark or make a pin board of the ones you feel work the best. Judge them on functionality and aesthetics, look at things like colour, layout, and what makes them unique. Finding what appeals to you is the first step in developing your own style. After all this is going to be your blog so you want it to represent you. You also need to figure out what your blog is for, is it crafts, technical, personal, or foodie? Knowing who your audience will be will help you direct the look of the site. The style needs to be appropriate to the topic; a technical one needs to be slick and professional, a craft blog should look textural and personal.

2.Keep your look Consistent:
If you are trying to brand yourself across multiple flat forms like facebook, etsy, blogspot make sure your aesthetic is the same for all your pages. People are visual creatures, and most readers will remember images more than a name. I read so many different blogs that I remember the banner and look of the site far more than the name. If you have your logo designed already make sure it's integral to the colour theme to your site.
In the past year I went through two big design overhauls on this site, to read about them go here and here.

3. Choosing a Template:
Since I'm working on blogspot that will be the focus of this discussion, but the ideas will still hold true for other platforms. Before you do anything you should choose your template. It's in your dashboard under 'template'. There will be an option to choose template, these are basic outlines, the colours and themes can be altered afterwards, so don't be put off by the palette. What you will be looking for is the way the tabs are laid out, are the corners rounded, are there floating transparent boxes? For this blog I used the second option on Picture Window.

4.Get Editing;
Now you can start getting rid of the ugly blogger preferences. Go down to 'backgrounds' and click the picture, this gives you the options to choose one of their images or to upload one of your own. It's nicer to get one of your own as it will make your site far more individual, I generated this polka dot one in Photoshop. You can also choose from endless free ones online like Shabby Blogs or Simply Fabulous (follow the sites instructions if it needs to be installed as a widget). After that go to 'adjust widths', this decides the proportions of your main window and your sidebar. I prefer a wide window as it looks less cluttered, but it's totally up to you. This is also related to 'layout' below, you need to decide if you want a three column or two column layout. Be careful not to have your site too fussy, this is why I go for a right aligned single sidebar, so that there are some gadgets but they don't over power my content. Work through the advanced section step by step picking your font's and colours, try to keep your palette consistent with your logo and background. click apply to blog to save all your changes.

5. Making your Banner;
Your banner should represent the ethos and content of your blog. Look at it like your etsy banner, or facebook cover page. People landing on your site will decide in a couple of seconds if they are going to stay, so try to make an impression. Depending on how wide you have set your width will have determined the size of your banner,to get the pixel size just go back into 'adjust width' in templates and note down the figure. Be careful not to make it too tall, people should still be able to see the top part of your first post before scrolling down. If you are handy with Photoshop spend some time playing around with some designs. I found a great site last week that is giving away free Photoshop templates designed to be Facebook cover images, but these would work perfectly . Alternatively you can use Picasa, Pixlr, or Picnik to edit a photo you have and add some text. I found these pretty free banners that you can add your own text to. Musings of a house wife has a great step by step guide, and for some cool fonts head over to Dafont. If you reach a dead end and aren't happy with what you have done you can pay someone to do it, there are loads of very reasonably priced designers on Etsy, here is one lovely one. When you have your image finished and saved as a jpg go to 'layout', near the top you will see 'header', click this and it will open a window. Click the option for instead of title and description and also tick the box shrink to fit, then save.

6.The Importance of Pages:
Pages are the tabs at the top used for things like 'about me' and 'contact'. It's good to keep all this very important information in an obvious place that is easy to find. It also helps to clear out some unnecessary info from your sidebar. Pages are how people will navigate through your side, so if you have a cookery blog it might be an idea to have an index of recipes here to make navigation easier, same being true for craft tutorials. Try to limit it to about /76 pages so that you can keep them in just one line. If it goes over this go back into template editor and alter the font size of your tabs/pages. Pages come under posts in your dashboard, this is where you can add new pages, either as text or direct links to other websites(be careful with this second option though as you don't want to send traffic away from your site). I only recently discovered that you can publish pages that are not visible on your tabs this is a great way to have information on your blog that you want to link to, but don't want to be visible initially.

7.Make Buttons;
Design some buttons to divide up the space in your sidebar, and to add to the consistent look of your site. I really don't like the appearance of Twitter and Facebook plugins so instead I designed my own buttons in Photoshop and loaded them as a picture gadget. Go to 'layout', 'add gadget', look for the picture option, then add your image making sure to add your Facebook link. I made similar buttons to break up the rest of the space using a links, categories, and Youtube button. Here is a good tutorial on designing your own.

8.Your URL:
Changing your URL isn't essential but I felt it was a very important step to get rid of the .blogspot in my address. This can now be done very easily on blogger and it only cost €10 a year, and don't worry you won't lose all your old fans and followers the traffic is redirected. Go to settings and basic, under blog address their should be add a custom domain. It's been a while since I did mine so I can't really remember, but  I do know it brings you through step by step.

9.Add a Favicon:
This is only a little touch but I feel like it takes you another step to being more professional and not just another Blogspot blog. A favicon is the tiny image that appears at the very top tab above the website address bar, Facebook have their 'F' and Blogger their orange 'B'. Go to layout and above header on the left you will see the favicon loading option. Chose something very simple as this is going to be tiny, I picked my sun and cloud logo.

10.Gadgets;
I know I've talked lots about cluttering up the sidebar, but you still need to have some stuff in their, you just need to decide what is important to you, and what is your order of preference. A search tool needs to be very near the top, it's the default place that people go if they are looking for something. If you are an Etsy seller it's important to have an Etsy Mini so people can see what you make at a glance, at the end of the day that's a large part of why you are blogging. It's also important to have an archive, it saves people trolling through 'older posts' options, and also gives a gauge of how regularly you post. Again these are all decisions you will have to make yourself, but don't worry if you are not happy with them you can just get rid of them later.

I hope these tips helped, if you have any more tips please add them in the comments section, I don't claim to know it all, so I'm sure I've missed loads!

Helpful Advanced Links:
Making an image based nav bar on blogger
How to make seamless wallpaper
Building a better blog