Advice To Budding Web Designers & Developers

Note: This is a post I wrote an age ago but I thought a lot of it was still relevant so I’ve brought it back into my new site.

Lately at work we have been receiving a lot of emails from school/college/uni leavers wanting to get into the web design industry & I’ve been sending them back emails with bits of advice as best I can. Today I thought I would take all the best bits out & make a standard response & while I’m at it throw it up on my blog too.

So You Want To Be A Graphic Designer For The Web?

Of course you do, chicks dig designers, they all drive sports cars, it makes you the life of any party… What you have to remember is there is no right or wrong answer with design, it’s all subjective. Even so there are some things you should understand to help with the design process.

Typography – Have a good understanding of it & why it’s important. Text exists to be read & good typography should help , not hinder. There is a nice guide to web typography at ilovetypography.com.

Colour Theory – Colour can bring a website to life, it can also bury it in the dirt. Understanding how not only colours but also contrasts work together is essential for delivering your message with a punch.

Understanding Web Technologies – this one is seriously important when designing a website. There is no point in doing the most amazing design if it’s not possible, or not possible with our sacrificing web standards/accessibility. As a designer you should fully understand the medium you’re working with no matter what it is.

Usability – is commonly defined as having three core components: effectiveness, efficiency, & satisfaction. Basically make the interface easy for the end user to use as possible. If it looks good but is impossible to use then - FAIL.

There are a million other points to consider when designing any thing, I couldn’t possibly cover them all but these could help you out along the way. If you want to learn more about designing for the web, Graphic Design Colleges has
excellent training programs.

So You Want To Be A Web Designer?

Yes this is a whole different job to the other two, yes there is of course some over lap, & you will quite often find a graphic designer who is also a web designer or a developer who is also a web designer, & on a very very rare occasion you will find some one who is all 3, but that hardly ever happens.

Semantic HTML – Tables are out. Well formed semantic HTML is in. It brings you accessibility, usability & search engine optimisation. Make sure you don’t use any inline styles in your HTML, that’s best left for the CSS. If you are learning there are some really good HTML tutorials on htmldog.com, I also recommend reading HTML Mastery.

Well formed CSS – Important to understand CSS fully, adding class after class to a style sheet just to get some thing to look right is bad practice. There is a difference between knowing CSS & understanding it. Again there are some really good CSS tutorials on htmldog.com, I also recommend reading CSS Mastery.

Accessibility – The W3C (World Wide Web Consortium) have a set of guidelines that deal directly with accessibility on the web. It’s a very worth while read for any serious web designer. It can be found here.

Cross Browser Compatibility – All browsers are not equal. It’s important to try & get your message to as wider spread of people as possible. Different people use different browsers. Browser checking from the very second start developing your web application really will help with this. There is nothing worse than getting to the end of a project, & opening it up in IE6 to find than it doesn’t render correctly or worse won’t run at all. I like to check all my sites work as best they can in IE7+, Firefox 3+ & Safari (Mac & PC).

So You Want To Be A Web Developer?

Well who wouldn’t, what’s more impressive than telling your friends you’re a developer & its sure to woo the girls too. Read on for some points that a good developer should pay attention to.

Server Side Language – There is a huge choice of web technologies available today. Proficiency in at least one sever side language (eg. ASP(.net), PHP, Ruby On Rails) is important. Regardless of which you chose we recommend developing it in a text based editor (e.g. Notpad++ (PC) or TextMate (Mac), not a WYSIWYG editor (e.g. Dreamweaver (although the code editing section of its good)). This gives you much greater control over the outputted code which should lead to you fully understanding every aspect of your Website. This also applies when you are writing HTML & CSS.

Database Normalisation – Normalisation is the process of designing a database in a way that removes data redundancy. It keeps the database fast & efficient. Un-normalised databases generally end in tears.

Commenting Code – This is important especially when working in a team. Not only does it stop you from forgetting what part of your code does, but it helps others not to break stuff if they need to work on it too.

Further Reading:

  • A List Apart – Bit of every thing here, well worth following.
  • W3 Schools – Ok It doesn’t look nice but its fantastic for reference.
  • PSD Tuts, Vector Tuts, Net Tuts – Three fantastic sites with tutorials for doing all sorts of things.
  • Google DoctypeJamie reminded me about this one. Very good resource & it keeps growing. Defiantly worth looking though.

Got any more advice for the guys who will be replacing us in a few years? Leave a comment. :D

Edit:

My friend Jamie has just done an amazing post for current developers who don’t work in web related fields looking to get into web development. I would probably recommend n00bs looking to get in to web development full stop to have a read of it too. So go check it out!

Comments

Dave Kirk

Couple of other things I would reccommend is to keep up with what is going on in the industry. Podcasts, Blogs, EZines, etc and make contacts within the industry; through commenting on blogs / forums, attending conferences / meetups, etc

Well written article however!

nick

Good advice homeslice :P

I would add “get good at one of the big CMS or shop systems such as ExpressionEngine, Textpattern or Zencart”. Not everyone is ninja enough to make their own, and these things can be massive timesavers!

Nick

Jamie

Also, i forgot to mention http://www.quirksmode.org which i found invaluable back when i was first learning CSS. Lot’s of explanations of CSS bugs, hacks and acceptable workarounds. It’s where i learnt the simple art of the box-model, the negative margin, the ie peekaboo and the tantek and holly hacks. It’s the kinda stuff you don’t get in books.

Get Involved!