Tutorial: Creating a Test Blog for Designs

If you're designing your own website or blog, as a rule of thumb you should never design it on your live site. There are several reasons for this.

First of all, if you have already published your site to people and its likely to have traffic, its never good for customers/clients/readers to see a blog in a half designed state. If you're editing your HTML and CSS on your live site then there's a good chance someone will come along and see it when the layout is all over the place - but they wouldn't know that you were in the middle of designing - they may just assume thats all there was to your site, and leave and never come back.

Secondly, its very easy to make mistakes when you're designing, especially if you're new to it. With just a semi colon out of place, you might suddenly find that your whole layout is broken, and if you hadn't backed up your original design, you'd be stuck with a broken template and lots of work to either fix it or repersonalise an old template.

By using a test blog, you can safely make changes to your designs away from the eyes of the public, while keeping all your current content safe and avaialbe to view until your ready to switch over your design. You can also make as many changes as you like safe in the knowledge that if something went wrong, your original blog is still protected.

So what's the best way to do this?


First of, somewhat obviously, you'll need to create a new blog. On blogger you can do this by going to the blogger home page (click the logo in the top left hand corner), and quite simply pressing the 'new blog' button.

As you can see, I already have one Website Testing Blog, but as I am often working on more than one project at once, I'm going to create another one.

When I press that button, the following dialogue will come up.

You'll want to fill in the boxes with a suitable name for your testing blog, and choose a URL that will be easy to remember so that you can easily check out your test blog from any location. The Simple template is best to start off with, as so many designs are based on this template.

 After I complete that dialogue, Blogger will tell me that the blog has been created. If I click on the title for my new blog, I'll be taken to its homepage and be able to start writing posts.

All done? Not quite.

It's all very well having a blog to test designs on, but if you just have an empty blog, you could come up with nasty surprises when you start adding content. That's why for a test blog, its best practice to fill it up with filler content of all sorts to make sure your design has got everything covered.

Now you could write lots of posts, but that would be time consuming and would also distract from the design. You just want something to fill the space that you can design around. Which is why websites like http://www.dummytextgenerator.com are great.

You can ask it to generate paragraphs of text in either english nonsense, or 'Lorem Ipsum' - an old placeholder text used to imitate latin, but with no actual meaning. Its up to your personal preference which you use. What is important is ticking the boxes asking for html tags, bold and italic words, and random headings and subheadings, as this is the content you need to test for.

Go ahead and generate a few paragraphs and see what you come up with.

You should get an html paragraph, complete with headings and emphasis. Now we'll want start a new post, making sure you click HTML at the top, as opposed to compose. Copy the title in, without the h1 tags (it will automatically be a h1 by being the title). Then paste in the remaining text into the body.

Click on compose, and make sure everything looks ok, and then click publish.

You'll then want to repeat this process a couple of times with different lengths of text. It's also a good idea to paste in some images from your harddrive aswell, to make sure they display correctly.

Once you've done this a few times, you should have the perfect blog to test on. Plain, simple and full of design elements.

Tada!