We’ve compiled a list of the best apps for web designers to increase productivity (and decrease stress) whilst on the daily grind.
Being a web designer can be draining and often not very rewarding. I mean, let’s face it, who in their right mind wants to spend half a day trying to find a problem that is caused by a missing comma?
Having access to the right tools can make the job a lot less frustrating.
The old favorite photo editing software that has stood the test of time! Photoshop is best when trying to come up with a design for your customer before you begin coding. Adding new layers to your image is really easy, which gives you the ability to compare layouts and designs. This is a godsend if your customer is fussy.
Like all photo editing software, to get the most out of it, you have to be careful not to use destructive patterns. Although there are many other (and newer) tools out there such as Sketch, we still prefer to use Adobe Photoshop when designing new web pages.
2. Google Chrome (duh!)
I’m not even sure we need a justification for this one. It’s not like you would use Internet Explorer…
Google Chrome has a great set of developer tools that can be used to troubleshoot all sorts of issues. The downside of using Chrome is that you forget that there are other web browsers out there that you need to cater for. Creating a website and only viewing it on Google Chrome and no other browser is bound to get a few angry reactions from your clients.
Ever tried to use Windows Notepad to edit a HTML document? Yeah, me neither.
Using a good text editor such as Sublime can substantially decrease the amount of time you spend looking for “the missing closing bracket”. Since everything in Sublime is color-coded, it makes finding things very easy.
It includes all the usual features of a text editor like “find and replace”, the ability to search the contents of a batch of files that are in a folder, and much more. With many great features, Sublime wins a thumbs up from us.
Web designers know that making email signatures is no easy feat. There are so many things to worry about…
Will it work with all email clients?
Can I easily change the signature for the customer later on?
Will the signature break when replying to an email?
With Gimmio’s email signature generator, you don’t need to worry about any of these things. Unlike other email signature generators, Gimmio was made specifically for web designers and their requirements. You can even white-label the whole app to make it match your company styling. Need to update 100 signatures? No problem, it takes 1 click.
With advanced functions to adjust spacing, colors, fonts and much more, it’s the perfect solution for web designers.
5. TinyPNG
If you aren’t already using this tool, you should be sacked as a web designer. Ok, maybe not sacked, but at least reprimanded.
TinyPNG losslessly compresses PNG and JPG files. When you compress images, your website loads quicker, and we all know Google loves fast websites!
There are also image compression tools available if you’re using a CMS platform such as WordPress. Some popular image compression plugins for WordPress are:
6. Codepen
Codepen is an amazing web app which helps you visually see what you’re making in real-time. For example, you can code up CSS and see the changes live as you’re writing them!
It’s an amazing solution if you’re coding something that you’ve never done and need to do some testing to get it right. It’s a real time saver!
7. LastPass
Lastpass has really changed the landscape of password management in the last few years. Gone are the days of keeping passwords hidden behind a password-protected Excel spreadsheet. With Lastpass, your username and password fields are automatically populated when you visit a website, or you can pick which credentials you want to use.
One slightly worrying aspect is that all your passwords are stored on LastPass servers, so if those servers were to get attacked by hackers, it could be painful for your business.
The great thing about LastPass is that you can create separate folders and designate access to each individual folder. Meaning, you have 20 folders (1 for each client) and you can give your staff members individual access to each of them.
8. Grammarly
Grammarly is an easy to install plugin for Google Chrome to check your spelling and grammar when writing content on a website or when blogging.
We use it on a daily basis and it has saved us many times from making embarrassing mistakes on our website. It’s like Microsoft Word’s spellcheck for your browser.
9. WhatFont
Ever browse a website and think “Wow, that’s a nice font” followed by “I wonder what it’s called”.
Wonder no more! Using WhatFont, you can quickly find out exactly what font is being used on a webpage. Simply click on the icon in Google Chrome, and point to any text on a webpage and it will tell you what font it is. Its a super handy app!
Mismatched colors can turn a great design into a very average one.
If you have a color in mind, you can use the Adobe color wheel to find out what colors will match.
Some of the color modes are:
Analogous
Monochromatic
Triad
Complementary (our favourite)
Compound
Shades
It’s really easy to use, you input one color, and it outputs the resulting color based on which mode you selected.