Official website for Web Designer - defining the internet through beautiful design
FOLLOW US ON:
Author: Imagine Admin
31st May 2009

Design a trendy blog header with a retro styling

Handmade-looking graphics add a personal touch to a project and inspire a sense of nostalgia

final

Handmade-looking graphics add a personal touch to a project and inspire a sense of nostalgia. Wendy Ding examines how this can be done for a web banner in Illustrator and Photoshop

With the boom of blogs and social networking sites, the web is getting more and more personal. New websites are sprouting every day, and while it is handy to simply pick a template from the plethora of pre-existing ones, the aesthetics can easily become generic as the site loses its own personality. Too much repetition can lead to an overhaul of similar-looking websites and a diminished sense of individuality, thus adding to the “I swear I’ve already seen a site just like this!” factor.
Naturally, every company, business owner and individual is different from one another, and their websites may be used for different functions, such as an online store, a virtual kiosk for the company or a personal blog. Ideally, their websites should aim to project an accurate and engaging reflection without sacrificing too much individuality. This tutorial will demonstrate how to add a dash of personality that simultaneously highlights the function of the website.

01 Target audience

step1

We’ve created a banner for a cute and girly dessert shop for young and fun-loving females like myself. In order to maximise appeal, we picked visuals that will attract them (and myself in fact): heart shapes, pastel colours, fashionable patterns in a bright and cheery tone. The right look is essential in drawing in the right crowd.

02 Choosing visual elements

step2

A great exercise in choosing the right elements is to look at the selected images and see if it implies the correct idea. We chose four elements that best embodied the notion of dessert: icing, picnic tablecloth, hearts and cupcakes, because I couldn’t help but feel my mouth water every time I thought of them!

03 Colour palette

step3

Make sure that you use colour wisely, as it sets the overall mood of a website. While it is subjective to individual taste, some rules will always apply: black is bold and serious, white is light and airy, blue is cool and tranquil, and so on. We’ll go for a pink and red palette to emphasise femininity, playfulness and fun.

04 Title text

step4

Here we’ve chosen a fancy handwritten font to accentuate its delicateness. I also wanted it to emulate smooth chocolate and wrote it on a curved line. Create a curved line with the Pen tool, select the Type tool and click on the line to type. To change the placement, hover over it with the Direct Select tool and then drag.

Pages: 1 2 3

  • Tell a Friend
  • Follow our Twitter to find out about all the latest web development, news, reviews, previews, interviews, features and a whole more.