Being a ‘web designer’ (or web developer) is like being a surgeon, or a mechanic.
Not many people can critically assess your work. As long as the heart is beating, or the engine is running, most people have no choice but to assume you did a good job.
With this post I hope to change that. Consider this my attempt to set a bar and educate people of what makes a good web designer.
Difference between Web Designer and Web Developer
The terms web designer and web developer are often used interchangeably. Though many people use the two words interchangeably, there are several key differences that distinguish the two titles.
The most important one being, a web designer worries about the looks and lay-out of a website and doesn’t touch code. A web developer follows that design to create it.
Most people tend to use the title ‘web designer’ for anyone in the ‘website making business’. That’s why I will use it, too. Bear in mind that I technically mean ‘web developer’.
Over the years I’ve looked under the hood of a lot of different websites.
One thing I’ve learned is, that when it comes to speed optimization, the root cause of a slow site is usually a (few) bad choice(s) made by the ‘web designer’. Be it a professional or a 14-year-old nephew.
You can’t build a great building on a weak foundation. It’s no different for websites.
I’m not going to bore you with stuff you already know. We all know you shouldn’t use an excessive amount of plugins and use 3rd party services sparsely. I bet you’ve heard this before. If not from me, from your Pagespeed Score.
Now all that is out of the way, here’s a list of signs you’re
a terrible not a good web designer sorted from not smart to downright evil.
6. A Good Web Designer doesn’t use Inline Styles
And I don’t mean the Critical CSS as advised by Google or any dynamically added styles by a theme.
No, I mean the little
<style> blocks in the middle of a paragraph, because you couldn’t resist coloring a few words pink.
Just don’t. Emphasize phrases by using bold or italic. Nothing else.
5. You Shrink Images or don’t use Compression
I’ve seen websites (more than you’d think) loading a 1600x1200px (or bigger) image, only to show it as 320×240. Some even still use Bitmaps.
This should go without saying, but DON’T SHRINK IMAGES. Resize and/or crop them to the size you actually need them.
In other words, display them in the size they actually are.
And while you’re at it, save it as JPG, or 8-bit PNG (if you must.) Even better, use WEBP. Whatever you do, just forget that BMP even exists.
4. A Good Web Designer doesn’t use Page Builders
From a UX perspective, you shouldn’t decorate every page of a website differently.
That’s why the good people over at WordPress invented Page Templates. You should pick a few different formats and stick with them.
Page Builders were invented for DIY bloggers as a relatively cheap and easy way to build a fancy looking blog, without having to hire someone.
A cool concept, with a very important downside: code bloat.
Passionate WordPress web designers will not use page builders, because they know they’re sacrificing the quality of their product while doing so.
Some hobbyists start out with a page builder. Most will eventually move past it once they find out it falls short in performance.
A professionally delivered website should never include Page Builder plugins.
3. You overuse Google Fonts
I understand — I don’t, actually — that from an ‘artistic’ point of view, it’s really cool to use a different font for every phrase.
From a performance (and a UX) standpoint, though, it’s a terrible idea. Every font adds bloat to your page size.
Honestly, it’s a very cheap way to make a page look pretty. A stylish, modern look is established by simplicity and formatting. Not a million different fonts.
The world moved past WordArt after Office 97 and so should you.
Cool designers choose two and stick with them.
One for paragraphs and one for headers is more than plenty. Maybe, just maybe, use another font for your logo. Just make sure you add a text value.
The absolute creme de la creme here are loading Google Fonts inline, right before the sentence they use it on.
That’s just, no.
2. You use
display: none and
!important far too often
Or, you hide elements instead of removing them and, you force your styling overwrites instead of taking the time to load them in the right order.
The only valid situation to use
display: none in CSS is when this element is triggered to be displayed (
display: block) at some point.
The only valid reason to use
The most worrisome is the combination of the two:
display: none !important. Meaning: never display this element, even if a script says so. I’ve seen this happen to entire Login (modal) popups.
1. A good Web Designer doesn’t make changes directly in a Theme or Plugin
The absolute worst thing you can do (and another symptom of WDIS) is making changes directly in a theme or plugin, instead of overwriting it using a child theme or plugin.
This goes without saying, but doing this cripples your client in two ways:
- The most important one being: the ability to install updates. They can’t do that, cause they’ll lose your changes. I.e. regarding security, over time their website is as leaky as a sieve.
- The second being: lock in. You’ve basically taken your client hostage. While they absolutely should leave you, they can’t. You’re the only person in the world that knows where you’ve hidden your changes.
I think it’s clear that this is a very unethical — and terrible — way of doing business. Doing this doesn’t make you a bad web designer. It makes you downright evil.
As with every other product in the world: you get what you pay for.
If someone is charging you 5$/hour it’ll probably be the worst money you’ve ever spent and you’ll end up paying a specialist to clean up the mess.
In web development, like with most things, cheap is always terrible and expensive doesn’t necessarily guarantee quality.
With this post I hope to set a standard in what makes a good web designer. At the same time I hope to provide quantifiable pillars to which our quality can be measured.