Web Development

Creating a theme for your website with Photoshop

Choosing a background theme

Fitting backgrounds, illustrations, images, graphics, and textual content are important for total web design look-and-feel, and visual appeal. Using backgrounds for body and content then blending them in with the real meaning and message of the website, and utilizing graphics design to its potential can take your site from ho-hum to amazing. (See the companion post to this gallery in the Web Master blog, "Backgrounds in web design: Creating a theme.")

In the example, I will create an elegant yet straightforward layout using Photoshop.

I will be using this image of old paper, available in png file format from Playingwithbrushes at Flickr. The old paper image will end up being our main content division, and I will use this as the source for snippets to create menu buttons. But before that, I am going to make a few modifications to the image file in Photoshop.


Selena has been at TechRepublic since 2002. She is currently a Senior Editor with a background in technical writing, editing, and research. She edits Data Center, Linux and Open Source, Apple in the Enterprise, The Enterprise Cloud, Web Designer, and...


let me try this it's so beautiful...


But I would have made the menu button more distinctive, a pinkish hue comes to mind. I also would desaturate the background a bit. It's a great color, texture and darkness, but draws the eye off a bit with the saturation. Maybe not only desaturate it but lighten up the foreground and saturate it a bit for greater focus on the content. Way cool design, though. I'm not that creative when it comes to the visual arts, but I am a critic, obviously. =|