Anyone who’s searched for web design tools probably knows how endless the lists of products available are. How to choose the right ones?
It would take a far longer article than this to compare all of them, but here are a few recommendations.
- Photoshop CC — There’s a good reason why the classics are classic. With Photoshop, Adobe wrote the book on image manipulation, and the latest version remains at the cutting edge, with innovations such as automatic slicing and exporting image assets.
- Webflow — Any website that doesn’t incorporate responsive design is going to be useless, especially after Google introduces its new mobile search algorithm on 21st April. Webflow is a drag-and-drop editor for responsive design, which allows you to either use templates or create from scratch without any coding required.
- Coda 2.5 — The top Mac developer tool, Coda 2.5 is an all-purpose coding editor with everything from text editing to MySQL, as well as an app allowing you real-time displays on your iPad while you work on your Mac.
- Axure — With wireframing, prototyping and specification tools, Axure allows you to evolve your design from sketch to ready for development. By annotating wireframes, you can get Axure to automatically produce Word documents of specifications.
- Sublime Text — A text editor for code, prose and markup, Sublime Text is based on a custom UI toolkit designed to make the most of the functionality of whichever platform you use. It boasts features like a Command Palette to hold functionality, split editing and plenty of options for customising.
- Sketch 3 — Made for the Mac and winner of an Apple Design Award, Sketch 3 is a drawing and image manipulation program for both artists and web designers. It offers templates and responsive web design artboards, as well as allowing you to copy CSS Styles to clipboard.
- Macaw — A fairly new tool, Macaw has been working out a few bugs but promises to be useful. Particularly geared to responsive design, it allows you to draw and position elements onscreen, although it does assume a working knowledge of CSS and HTML.
- ImageOptimim — A free, open-source program, ImageOptimim optimises images (PNG, JPEG and GIF) by finding and applying the most appropriate compression parameters. You simply have to drag and drop the images in place, and the program will optimise them to help your website load more quickly.
- Hype2 — An OS X app, Hype2 produces animations that work as well on mobile devices as on desktops. Based on HTML5, CSS3 styles and JavaScript, it requires no coding, but allows you to get into the codes if you choose for more direct manipulation.
- Paper — So what’s that doing here? Well, we know how great technology is, but that doesn’t mean traditional solutions can’t still work sometimes. If you want to sketch out your ideas for designs, you can pay a lot for a program — or, for a fraction of the price, there are various notebooks with pages specially designed for the purpose.
There are hundreds of great web design tools out there, so feel free to share your favourite with us.
And as usual do get in touch with the web designers in our Hertford studio if you need help with a specific project.
