Here are my top 10 web design skills that you WILL need to master to become an effective web designer.
If you’re serious about mastering web design and marketing, check out the Pro Web Design Alliance. See how Jordan benefited from the course forum and Google hangout sessions to make his and his clients’ sites better. Look at Jordan’s site and the testimonials from his clients here. The personal interaction with Ben and fellow students while working on live sites makes the learn by doing course philosophy start generating money for you while you are still in the course.
Your priorities may be different (and my priorities may be different a few months down the line).
And I’d add that you don’t need all these skills in any particular measure to make it in web design. But to be a fully rounded web professional, this is my take on the ideal make-up.
- Writing & editorial
- Holistic circumspection
- Graphic design theory
- Listening & discernment
- Graphic design: original/creative graphics
- Web page production in HTML/CSS
- Business sense
#1. Writing & Editorial Skills
I’m convinced the #1 most important skill for a web designer is the ability to use words effectively. A truly effective web designer is more highly skilled with writing and editing copy than with producing graphics in Photoshop.
If you can craft a series of web pages into a conversation that communicates what you need to communicate, informs, and calls your visitors to take the actions you want, your web site can be a great success, even if it’s graphically plain – hey, even if it’s ugly!
Effective wording is of singular importance in several highly important factors in the success of web pages:
- Effective wording is key to brand communication. Effective branding on a web site is about ‘getability’ – how efficiently you can communicate what the site is, what it does, and for whom. It’s unusual to be able to do this without using words. The more effective your wording, the more getable your page, and the more people will believe your proposition is for them and choose to stick around to find what they want.
- It’s also vital for usability. Words are often the most effective labels to identify forward steps (links etc.); usually far more efficient than icons or other images. Words in navigation can tell you unequivocally where you are, where you can go, and what you can do. Well-crafted navigation makes a critical difference to any web site’s effectiveness, keeping visitors on board longer.
- SEO: Search engines look for meaning, which you communicate through content, which generally means writing. And people want to link to good content. The better your writing, the better your site will perform.
#2. Holistic Circumspection
What I mean by this is the ability to look at a problem from multiple angles at the same time, so that you can come up with a solution that balances appropriate all the various requirements, goal, and risk factors.
Web design isn’t a simplistic publishing exercise (what is?!): it requires an appreciation of who your target visitor is, what she wants to achieve when visiting a web site, what the competition is like and how to differentiate your site from them, the initial brand impression, choice of wording to communicate effectively, choice of imagery to create the right tone, how search engines work and how to take maximum advantage of that, difficulties and cost of getting a design to display correctly on very different browsers, accessibility to everyone regardless of disability, ease-of-use, technical integration issues, maintenance issues, brand constraints, etc. etc.
On top of all this, a really good web designer has the ability to step away from the design they’re working on, almost to pretend to be someone else and think like someone who’s never seen the site before.
How can you develop this ability? I honestly don’t know for sure, but experience helps, as does the opportunity to observe people using web sites (yours or others’).
#3. Graphic Design Theory
The discipline of graphic design works at many levels, from the surface effect to the core basics of layout and spacing.
I really believe that the core basics are far more important than the “higher” aspects.
The core basics include:
- Proportion and Balance
- Contrast and Colour
- Flow, and managing the Eye
These basics make a design basically work. Get them right, and your design will be effective, irrespective of the finish.
At the higher end, you’ve got the actual surface layer, which sits on top of the basic structure. These skills include:
- 3D effects
- Custom imagery
- Plus all the basic factors – applied together and to a finer degree
- and all the stylistic web design tricks we know and love.
Get both right, and you can have a compelling web page design that works on every level. Get the basics right, and your page will be fundamentally effective. Get just the surface finish, and you could end up with no result at all, other than the accolades of design tossers, which really is the wooden spoon.
#4. Listening & Discernment
To be a great web designer, you need to appreciate the whole environment. The most fundamental, radical requirement is: What does the client need?
To get to the bottom of what will actually constitute success for your client, you need to apply both good listening (which is pro-active and may be challenging) and discernment – good judgement, based on experience and common sense, which will help you and the site owner refine what the site needs to achieve.
Without good listening & discernment, you’ll end up with a web site whose purpose is just to be a web site up there. That’s no good to anyone. Great designers create web sites that are consciously, deliberately, boldly focused on achieving specific goals for the client (through delivering specific benefits to visitors with consistently satisfying experiences).
While direct prior experience is a clear advantage, you can get around lack of experience in any particular industry. The way to do that is to use facilitation skills: to keep asking probing questions, and working hard to stretch your understanding to accommodate what you’re learning, and helping to simplify the client’s purpose and any concepts to the point where you get it. If you can refine any proposition to one sentence, which your client can agree is true and accurate, you’ve done a good job.
Web design is one of the richest, most diverse domains you can choose. It’s a giant pile-on of visual design, technology, psychology, coding, human factors, all that jazz. And the technology doesn’t stand still from one day so the next. That’s what makes it so frustrating – and so fun! One thing’s for sure. If you want to perform well in this mental soup, you’ve got to be capable of learning on a daily basis. You need to pick up new styles, new techniques, and new constraints every time you sit down to work.
And because it moves so quickly, there’s no one who can teach you everything. The best designers, SEO guys, CSS geeks, hackers, copywriters, businesspeople, etc. they’re all learning every day, trying out new stuff, learning what works and what doesn’t. There’s not one of them who knows it all. In this industry, the moment you think you may know enough is the moment you drop off the pace. Just like the rest of life, I guess!
That doesn’t mean you have to Can you develop this skill? Well, you have to do it constantly, really; that’s the whole point. Here are some pointers:
- Research and bookmark trustworthy web sites as starting points.
- Subscribe to a few high-quality newsfeeds, or visit sites that focus on the latest news.
- Also build a network of other skilled people you can turn to to share questions and knowledge. Forums are also good for this, if the content-noise ratio works for you.
- Learn how to refine Google search results to focus on the information you really need in less time.
- Always remember you can’t know it all, that there are more answers out there, and get comfortable with the chaos. Be open to un-learning what you thought you knew about what works, about the best way to do stuff.
- Make it fun. Make regular time to read stuff that interests you.
- Take short cuts by going direct to the source of success. If someone’s getting it right, look at why, and look for ways you can apply similar techniques to achieve the same.
Optimising your pages for search engines is a vital element in web design!
Why? Because web design is the discipline of crafting effective communication. That means the whole process, end to end. And if no-one ever visits your web page, or the only people who do aren’t the ones who should, you ain’t communicating!
The first step in usability, in branding, in design – is search results. Your visitor’s experience of your site/brand begins with typing in a search term, and scanning the list of results to pick out the thing they believe is most likely to give them what they want.
If you want to be an excellent designer, you can’t ignore web page optimisation. The more I’ve learnt about this area, the more I’m thinking from the search engine’s perspective as I design a site’s information architecture, and even lay out my page designs.
What’s the sound of one hand clapping? If a tree falls in the forest with no one to hear it, does it make a sound? If no one visits your web page, is it design?
#7. Creative graphics
I’ve put original, creative graphics down the list from the theory of graphic design principles/basics, because I really believe you can make an effective web page without them! Not always, clearly. Some goals depend on getting a really tight, shiny, quality look. But that’s not the majority of sites, really.
There are lots of ugly sites out there that really work:
And there are lots more very simple or plain designs that deliver massive results day-in, day-out. Take ebay, Google, Wikipedia, and Craigslist for starters.
I know you’ll often get clients who are only happy when they get snazzy graphics. So you do often need to be able to pull the rabbit out of the hat, which is why this skill is in my top 10. However, it’s not entirely a necessity. As long as you’ve got enough clear vision, you can always brief someone else to do the graphics production for you, which you can’t say for all the items on this list.
I like to think that if I lost all my Photoshop skills in a bizarre drinking game, I’d still be able to turn out great web sites that transform people’s businesses.
#8. Page production using HTML & CSS
You can clearly outsource your web page production. There’s a growing niche of companies who can do this cost-effectively. So why’s it in this list?
The reason is that designing web pages with a working knowledge of what’s possible and what’s easy using xHTML & CSS is many times more efficient than to do designs out of ignorance to the constraints of the technology through which your vision will eventually be delivered.
I’ve worked with some really good designers who come from a print background, and who create visually appealing web pages that just don’t work very well. That’s simply due to not being intimate enough with the production methods to be able to wave the mouse with markup and stylesheets already in mind.
Aside from that, understanding what’s possible and doable in HTML & CSS is vital for SEO, usability, and accessibility.
#9. Business Sense
(I was going to put “usability” here, but frankly you can live without the ability to find out what actually works and what actually doesn’t. At least, you don’t have to experiment or learn this formally. You can just watch people using stuff, and learn to watch yourself as you use stuff.)
Frankly, if you’re going to make a go of being a web designer, whether you’re self-employed, freelance, part of a small company or large corporation, you’ll benefit from knowing the basics of how business works, and how to make sensible guesses when faced with business choices. If you’re responsible for creating marketing channels online for clients, however small, you’ve got to know what the purpose is. That’s all business is: common sense.
Can I sum it up in one paragraph?
The core of Business is basically Marketing: working out what people want and how to provide in a way that they choose you rather than something else or nothing.
Beyond that, it’s guesswork. There is no right answer. However, you can inform yourself a lot, by being brutally honest, creating tests & experiments and facing the facts they throw up. Even better, you can learn from other people’s tests and experiments, which is a lot less work, by reading what they’ve written and applying it sensibly to your own situations.
I’ve written a whole article on this topic. In brief, whatever you do, you’ll spend a lot of time at the keyboard. Most of my designs use more text than graphics, and all our HTML, CSS, PHP etc. are hand coded. The fact is that the faster I can type, the more stuff I get done in an hour.
If you can type fast, you can code fast, you can get your emails out of the way quicker, and you can blog or write books with the time you’ve saved.
The only reason not to learn to touch-type is if you can already type faster than you can think. Take the hit, go through the dip. Learn to type now, and feel the benefits every year to come!
How YOU Can Master Web Design
After 17 years as a web designer, developer, and consultant, I now spend my time coaching and teaching others how to make kick-ass websites (that get seen, get clicked, and get business!)
If you’re ready to raise your skills to professional level – whether you want to be a freelance web pro, or run your own sites for profit – check out:
- Pro Web Design Course – a comprehensive 6-month program that covers EVERY aspect of successful web design
- NEW! Pro Web Design Alliance – an exclusive membership organisation for pros committed to making the best websites.. Membership starts at $97/month and includes full access to the Pro Web Design Course.
Have your say
Do you agree with the list above? Let us know what you think the most important skill for a web designer is.
If your answer is other, please specify by leaving a comment below. Thanks!
(The numbers in brackets are Ben’s suggested ranking from this post.)[poll id=2]
Want To Be a Pro Web Designer? I’ll Help![includeme file=”includes/footer-promo-pwda.php”] [includeme file=”includes/footer-promo-stp.php”] [includeme file=”includes/footer-promo-seofs.php”]