On Making a Web Site – Initial Photoshop Design

Series: On Making a Web Site

  1. On Making a Web Site – Getting Started
  2. On Making a Web Site – Tools
  3. On Making a Web Site – Initial Photoshop Design

So now you’ve got all your tools set up — you have a test platform for Wordpress, a graphics editor, and everything else you need to get going with web design. You’ve also come up with a basic layout and have decided what you want to present.

Next to actually deciding what you want to accomplish, this is the toughest step. You need to figure out what your web site should actually look like. Yes, this takes creativity, but more than that it takes perseverance. It’s hard to be struck by inspiration when you need to be. It’s much better to just suss it out and let inspiration strike organically in the process. I’ll illustrate this as we progress.

I am not a very creative person. My strength lies in taking something that someone has created and enhancing it. I can play another’s music. I can strengthen another’s writing. And I can assemble another’s artwork. You could say that I’m a good editor. I’m not good at coming up with that first step, but I excel at taking it to a polished end. I mention this to show you how you too don’t have to be an artist to make excellent web sites.

Okay, preamble over, let’s get going on the tutorial. I’m going to show you how I began work for this web site in Photoshop (this will be Windows Photoshop specific, sorry GIMP users).

I usually start working on a web site in Photoshop first instead of making a mock-up in html/css. I’m comfortable in Photoshop and usually inspiration will visit me and while I’m working graphically and change my html layout in the end anyway.

For this site I tried a couple things before I ended up with this design. This is normal. I usually try a couple ideas, see if they work or fail and then overhaul, then tweak. It was no different here.

If you’re reading this via a feed, there are more pages on the web site. If you’re already on the web site, IGNORE THIS!

Other Posts in this Series


Leave a Reply

You must be logged in to post a comment.