Design effective Web 2.0 Label to use Webpage

This time we are going to create interesting and effective Web 2.0 label which we can use to advertise parts in our webpage. For example we could place this above new content.

Design Web 2.0 Label.

For this tutorial we need photoshop or similar, and the Web 2.0 layers and gradients pack which we can download from internet.

Step 1:

First we create large size canvas for lots of detail; the final image can be scaled down later.

Creating Large Size Canvas.

Step 2:

The next step is to draw our shape, this can be any shape. Use the preset shapes in Photoshop or download some new ones off the internet. It doesn’t matter what color it is.

Draw Shape.

Step 3:

Next apply a layer style to the shape, we using the Web 2.0 layers and gradients pack. Although we can make our own.

Using Web 2.0 layers and gradients pack.

Step 4:

As well as this suggest using a bevel and emboss. Use in large size and reduces the opacity of the shadow.

Using bevel and emboss.

Step 5:

Add text. We’ve used Trebuchet MS. Use the character palette to move the letters into a good looking spacing.

Adding text.

Step 6:

Again, use one of the white layer styles in the pack and apply this to the white text.

Apply White Layer Styles in white Text.

Step 7:

We now have a cool looking Web 2.0 label to add any web pages.

Cool Web 2.0 label to add in Webpage.

Step 8:

One optional step that we can add a drop shadow, this adds a lifted effect to the label.

Adding a Drop Shadow.

Step 9:

Flatten and remove the background and save as a .png. This can now be added to any web page.

Remove Background.

The final label.

Final Label.

As we can see it looks great on any web page.

Applied in Webpage.

For more about Web design and graphics help please visit Clippingimages.com.

-Credits: GreatDesignBlogspot.com