Pick and Mix Demo Websites

I’ve built a range of demo websites to show how little changes can alter the look of a site, even when it uses the same theme – i.e. my favourite theme, GeneratePress (note that this is an affiliate link, as described on my privacy and cookies page).

Here’s a quick summary of the differences between the styles.

Standard

This is a flat design with a solid coloured menu bar.

The style is clean and straightforward with plain, circular bullet points and simple, flat buttons.

 

Here’s a link to the demo site: Standard style (self hosted WordPress)

Classic

A feature of this style is the narrow borders under the menu and above the footer widget area.

Buttons also have a narrow border – created using CSS.

I’ve included an example of a post separator, but you could substitute a different image for the one I’ve used.

Demo site  for the Classic style: Classic style (self hosted WordPress)

Boxed

The navigation menu is on the left of the screen, rather than across the top and the site uses the ‘separate containers’ layout.

I’ve used the FooGallery plugin to demonstrate some ways to create a photography portfolio.

The blog uses a ‘masonry’ layout.

This style can be seen here: Boxed style

Doodled

This is really just an example of how the look of a website can be changed by using various decorative graphical elements. I’ve chosen a hand-drawn effect but you could also use watercolour, vintage, fabric, cartoon, art deco, futuristic… etc, etc.

It’s important to be reasonably subtle and not overdo whichever look you are going for.  You can choose decorative display fonts for headings, but it’s best to use a plainer, easy to read font for most of the text on the site. I have used paper effect background images on sections of the website.

I used images for the read more link, post separators, bullet points and back-to-top button.

    

You could also use an image for buttons, although I used CSS code in this case.

Here’s a link to my demo site: Doodled style (self hosted WordPress)


These styles are intended to give you some ideas about how you could develop your own website.  Any of them could be adapted to make your site unique, and you could mix and match elements from different styles if you prefer (hence the term “pick and mix”)


What I need from you…

Leave a comment