Design Within Reach Tools For Living

10 tools web designers can't live without

Web design tools — Make your life easier with these 10 expert recommended tools

No matter how many times a system is updated and improved, there's always a better way of doing things, whether that's writing snippets for search engines or editing whiteboard photos.

To help make the lives of web developers easier, we've asked the experts for the tools they simply can't live without. So if you're looking to make your workload easier (and who isn't?) scroll through this list of top plugins and apps.

01. D3.JS

D3.JS is a useful JavaScript library that lets you manipulate documents based on the data they contain. Using HTML, SVG and CSS, data is brought to life with an emphasis on modern web standards.

"D3 works its way into any web application project that needs to keep track of data," explains data visualiser Rachel Binx. "The ability to bind data to DOM elements and dynamically update them allows me to build rich, responsive applications with significantly less code."

02. CodeKit

CodeKit is a tool that lets you build websites faster and better, and it's so successful it's already been used by Google and Barack Obama's campaign team.

"I use Sass on most projects, but running the Ruby command from the command line makes my Mac too slow," says Jen Simmons, host of The Web Ahead. "Plus, if I do it all manually, it's a lot of steps. CodeKit handles everything. It makes preprocessing idiot-proof."

03. SkyFonts

Want to try fonts before you buy them to see how they look and feel? By downloading SkyFonts you can do just that. Browse and access fonts for a limited time, and if you're not happy with them when the time's up they're automatically removed from your system.

"SkyFonts means I can explore the web fonts I want, in my static comps," reveals designer and author Katie Kovalcin. "You're essentially 'renting' the fonts for a brief period, which is enough to generate a deliverable for client approval. It also works with a variety of web font services."

04. Emmet

Improve your HTML and CSS workflow with Emmit, a plugin for popular text editors. In no time you'll be able to write code, wrap it with new tags, select important code parts and much, much more!

"Emmet is an incredible plugin for text editors, which enables you to quickly write CSS or HTML via a shorthand syntax and tabbing," says Una Kravets, a frontend developer at IBM. "It has completely changed the way I write code, and improved my speed and productivity."

05. Line-Length Bookmarklet

Crafting perfect online copy is hard enough, even without considering optimal line-lengths. But with this useful line-length bookmarklet you can tailor your text to fit into flexy widths containers.

"This handy bookmarklet saves time when testing for optimal reading line-length on different screen sizes," explains Petra Gregorová. "Hover and click on any text element, and the ideal character range is instantly highlighted in red. It's helpful for deciding where to introduce a new breakpoint or adjust font size."

06. Visual Studio Code

This redefined code editor is optimised for cloud and web applications, letting you build and debug with free code available across Linux, Mac, OSX and Windows,

"I moved from Sublime Text to this on both my PC and Mac," Microsoft tech evangelist Stacey Mulcahy says. "It's a really good-looking IDE, but the debugging tools that I leverage for Node.js are what makes it invaluable for me on a daily basis, along with the support for my everyday languages like Python and JS."

07. Office Lens

Just like having a scanner in your pocket, Office Lens lets you digitally record notes scrawled on whiteboards and blackboards. What's more, it can convert images to PDF, Word and PowerPoint files.

"An app with a boring name, made by Microsoft. I know – whaaaa? But hold up, because this thing is so good for taking pics of whiteboards, you'll never go back," says product designer Hannah Donovan. "If you do a lot of collaborative product strategy/sketching,  this is for you."

08. Feedly

With a clean, minimalist layout, Feedly lets users stay up to date with their favourite online publications, including blog posts, publications and YouTube videos. Feedly puts content into action by recommending further reading and alerting you to news and updates from the companies you follow.

"Since Google killed off Google Reader, I organise my blogs using feedly," explains product tester Kim Knup. "I have them categorised for easy topic-related reading. I can read about the latest trends in technology and software testing on the way to work, and then end the day reading about my hobbies such as sewing and photography."

09. Git Tower

The latest version of Git Tower focusses on simplifying Git's complexity while keeping its powerful festure set accessible. New features include a conflict wizard, support for the popular git-flow branching model and a service account manager.

"We utilise Git heavily in our workflow," reveals Salesforce lead developer Stephanie Rewis. "While everything can be done at the command line, I'm a visual person and I find managing multiple repos in Tower quick, simple and efficient. Tower keeps me productive."

10. Pocket

Keep track of your favourite content with Pocket, a sort of online bookmark that keeps your articles and videos ready to access whenever you want them.

"I love using Pocket," says creative director Jon Setzen. "I've tried a handful of other bookmarking apps and, for me, Pocket is just the best. I'm a sucker for anything one-click (when it's truly one-click) and the Pocket Chrome Extension makes it easy to save articles quickly."

"It's always nice to get on a plane and have a bunch of new things to read," he adds. "Especially when they're presented as beautifully and readably as Pocket does."

Have we missed any must-have tools off our list? Let us know in the comments!

Liked this? Read these!

10 essential responsive web design tools
Top web design trends for 2016
6 quick things developers can do to improve performance

Dom Carter is a freelance writer who specialises in art and design. Formerly a staff writer for Creative Bloq, his work has also appeared on Creative Boom and in the pages of ImagineFX, Computer Arts, 3D World, and .net. He has been a D&AD New Blood judge, and has a particular interest in picture books.