This is part one of two in a series by Connor Wilson on getting into the web design ‘game’ as it were. This part will focus on the design part, and the part two will conclude with the client side coding end of things.

One of the hardest things about web design is getting over the first hurdle. Making your first design is one of them, and making it come to life is equally ground breaking for someone new to it all. As someone who has been through many websites in all kinds of levels, all kinds of techniques and styles, I’d like to share what I think is the best way to go. The following tips are mainly general and might not work for everyone but remember- you can succeed in this. You just have to give yourself and your talent a shot.

Take good advice.

When you come across articles like this where someone is offering advice and tips based on experience, read up. Be a sponge. You can never know enough in the web design world. Even the seasoned gods of web design learn new things everyday. Design is a funny thing. You can be from varying talents and techniques and everyone will always come up with a different design, and a different opinion on this:

Your overall skill to design (websites) is a mixture of pure, god given natural talent that can not be learned and the things you can learn, like the tools, techniques and tricks.

Finding your talent and a balance between the learning portions is important. You can’t just walk into this, unfortunately. If you’re the most talented designer this world has ever seen, you’re nothing without your tools. Photoshop (or your weapon of choice) is like a language. A language to communicate your talent and ideas with. Someone who comes to a foreign country with a Ph. D. can’t use their education without being able to speak a word of the language, can they?

So, how do I go about gaining these skills? Well, the aforementioned parts of design that you can learn are widely available on the internet. There are many ways to learn design. The way I went about it was back in the Photoshop 7 days, I would toot over to Good-Tutorials and soak up every cool looking technique I could. Abstract waves, grunge buildings, bubble gum text, you name it- I could do it. But how has all that helped me today? I actually couldn’t do that today if you asked me to. All that helped me learn Photoshop.

I may not be able to create amazing fantasy art work with all glowing and amazing effects, but 100% I am more comfortable with the Photoshop interface and all things associated. Shortcuts, options, panels, windows, I know it all. The only way you can know it all is by just doing it. Here’s a simple quote:

Just do it. – Nike

Now, it may seem cliche, but think about it. You can manufacture experience by just doing it. Make the coolest looking desktop around, and some awesome forum signatures. Learn how to use renders and popout signature effects. Join a graphics community. This all may have nothing to do with web design, but like I said- you can’t just walk into this.

Today when I see a bad design, and I mean realllly bad, I can assume one, or even both of the following things:

1. The person has not used Photoshop a day in their life, and this is what they can do. It’s their limit.
2. They have no design eye. They don’t have that talent.

I’ve been constantly referencing Photoshop here, but that’s only because Photoshop is my tool. Photoshop is my weapon of choice. It may not be yours- and thats perfectly fine. Fireworks, GIMP, paint- whatever. In the end we can all admit that it’s not how you do it, it’s what you do.

So after all this, and you’re into the entire graphics thing, and you can do all this nice stuff, and most of all you’re comfortable with your tool- it’s now time to dip your feet in the water.

First things first. Basic stuff to set up your document.

• Size: Around 1000×1000 is where I always start. 800×600 users obviously don’t care much about how a site looks anyways, right? Also, you’ll find in this market especially, the average user runs 1280×1024.
• Colour: RGB colour. Safest way to go when dealing with the web, and dithering problems for IE users (*spits*).

Alright, great, so now you have this huge blank space. This is where you explore your own creativity, but here are some common mistakes:

• Alignment: If things don’t line up, your design probably won’t look right. Structure is key. If you have to, create a ‘wireframe’ first. This is when you make little outlines of where every element will go before adding an colour, etc…
• Colours: When starting, try to stick to a one colour scheme. It’s best to not add more, because early on it gets a little messy. You’ll be surprised how fast you’ll find how colours match and clash, and even how it applies to clothes, paint, etc…
• Effects: While gaining the first little steps and getting them under your belt, feel free to go crazy with brushes, effects, renders, anything. You’re not going to walk into ‘web 2.0′ on your first day.

Your style is something that will develop over time, and will progress as well. If you’re not one with that talent, or eye, don’t worry about it. It’s not one of those things that you really see in yourself, but something that comes out and is quite obviously there.

You should be on a good path by now, but remember, all the things mentioned here won’t take you a day, a week or even a month for that matter. Give it time. Your designing is like a plant. It needs to grow. With proper nurturing and attention it will sprout up no problem, and people will notice it I leave you with this:

Respect your inspiration

Basically means don’t steal from those you look up to.

Filed under: Article, How To, Web Design