Web Design Header 2.0

What are the componants of a website header?

What Photoshop skills are needed to manipulate, transform, and combine images?

What are the various option settings in Photoshop that can be adjusted to transform the images used in the design?

FattaCast™ Library 


.

.



.

Using images you find online create a series of web page headers that combine two photos. Use the imagery as a point of departure, manipulating the images in a variety of Photoshop effects and filters.


.

In Photoshop create a document that is about 18 inches wide and about 1 inch high. Select the area of the photograph you wish use with the Marque tool. Make the selection using the same proportion or shape of the header document and paste the picture into the header document. In the designs to the right, the cropped area of a corvette is used. Other images like the checkered flag was added, feathered using an Eraser with a softened edge. In another, the ring of fire was placed over the wheels with the center erased for the rim to show.

 
.

.

After creating your headers, identify some of the colors within the header image to use within your background idea. Use one color for the navigation and a second color for the body of the site.


.

Incorporate text onto the page by creating a title or placing text in the navigation. Try to match the style of text with the images and colors evident within the header.


Click to view webpage.

Take it a step further by adding an image to the background area with enough transparency to be able to read the text on it. Here the checkered flag is place over the background with the Opacity set to a mere 35%.

Make the finishing touches to your template by adding Lorum ipsum text ( google Lorum ipsum text to find a sample).