thanks Sarah - I’ll take up your advice. Any recommendations on a good book/text covering the design concepts you mentioned? I obviously keen to have a crack at this otherwise I wouldn’t have posted, so thanks for taking the time with you answer.
Start looking at design. Lots of design. It’s everywhere; pay attention to it – what works, what doesn’t, and why.
Learn basic composition & art principles.
Search for “CRAP” on Google.
For general typographic principles:
“The Elements of Typographic Style” is practically a bible
“Stop Stealing Sheep” is much shorter & a better introduction to the art of typography.
Typography for the web is a pain in the ass. Stick to the web-safe ones:
http://www.angelfire.com/al4/rcollins/style/fonts.html
Unless you implement sIFR, which is great but sometimes a pain itself, and can only really be used for headlines.
I prefer to set my main body font-size to xx%, and base all other font sizes in ems. This creates the most consistent font sizing while still allowing browsers to increase/decrease font sizes.
http://webtypography.net/ is a great resource.
Design Theory:
I HIGHLY recommend “The Elements of Graphic Design”, which is short & very readable but presents lots of good principles & applications.
“The Non-Designer’s Design Book” comes highly recommended but I’ve never read it myself.
The Universal Principles of Design is a fantastic book about the over-arching principles of design as applied to all kinds of different disciplines, but is probably something you only want to get into if the design bug bites hard.
http://www.usask.ca/education/coursework/skaalid/theory/cgdt/designtheory.htm gives a general overview of design principles.
http://poynteronline.org/column.asp?id=47&aid=37529 talks about grid structures. Also try “Making and Breaking the Grid”.
Search for the Golden Spiral and the Golden Rectangle.
For more web-specific stuff:
http://www.webdesignfromscratch.com/ is a great site about making websites.
http://developer.apple.com/internet/webcontent/bestwebdev.html describes best practises for website design.
Run your designs through the W3’s standards-compliance tools, and test cross-browser/cross-platform. A few tools to test browser compatibility, if you don’t have the resources:
http://ipinfo.info/netrenderer/
http://v03.browsershots.org/
http://www.browsercam.com/
http://www.designmeltdown.com is a great discussion of design trends & a good source of inspiration.
http://platea.pntic.mec.es/~jmas/manual/english/sitemap.html is a pretty comprehensive design manual, though not all that accessible.
http://www.alvit.de/handbook/ is a whole mess of links to other resources.
BTW - Another good link I found (via digg) was this one.
There’s a million tutorials out there like this, about how to make Aqua-style buttons, Web 2.0 buttons, reflections, gradients, etc. Basically it’s all just making use of PS’s Layer Styles (in the layer pallet, click the button at the bottom that looks like the Flash logo, and play especially with the “Bevel and Emboss” and “Gradient Overlay” and the various inner/outer glow option). Your best bet is to just go in & play around with layer styles, experimenting until you get a feel you like – you can get a lot of interesting effects this way, and it’s an easy way of adding depth to otherwise flat graphics. To reuse an effect, simply right-click on the layer with the styles attached, choose “Copy Layer Style” from the drop-down, then r-click on a different layer & select “Paste Layer Style”. You can also save layer styles as sets but I can’t remember off the top of my head how to do this.
Good luck, and if I can help out, do let me know!