10 web design tools for September 2017

[Rss Bot 1]

Our top picks for web designers this month are books: one by Laura Kalbag on the fundamentals of accessibility, and another by Rachel Nabors on using animation to improve UX. They’re great reads and both are concise books so they’re not hard to squeeze in.

A few great tools came out this month, too, including XRespond, which displays your design as it will appear on multiple screen sizes side-by-side, and GitHub Notifier, a Chrome extension for getting GitHub push notifications in your browser.

01. Accessibility for Everyone

Laura Kalbag wrote a book

Accessibility isn’t the easiest topic to get your head around, so it’s great news that Laura Kalbag has written this approachable book that explains the foundations in a way that’s easy to understand. She also points you in the direction of the best experts and resources that will help you to grow your knowledge and keep up to date. 

(You might have heard of this one: it was the subject of an awkward Twitter spat involving Kalbag, Erik Spiekermann and JK Rowling).

02. Pixelmator Pro

This new Mac tool reimagines the image editing workflow

This image editor for Mac has reimagined the editing workflow. It sports an intuitive interface and intelligent features that make life a bit easier. 

In particular, there’s an interesting approach to layout that should make it easier to put everything exactly where you want it.

03. Lozad.js

This lazy loader is pure JavaScript

Lozad.js makes use of the recently introduced Intersection Observer API to lazy load elements in an extremely performant way. 

It’s pure JavaScript, very lightweight, has no dependencies and also works with dynamically added elements.

04. Dead Domains

This site collects unused domain names

Did you buy the domain name for that super-cool project you’re definitely going to get around to building one day, only to have it sitting there doing nothing but eating up your money every month? So did a lot of people. Submit your unused domains to this site to give them a new lease of life. 

It's also a great space to browse for something you can use: graveparty.com, moonwok.com and nerdempire.com are all up for grabs, for example.

05. Animation at Work

Rachel Nabors imparts her animation wisdom in this book

“This book is everything I wish I’d known when I started working with web animation five years ago,” says Rachel Nabors, the cartoonist turned web pro who wrote Animation at Work. 

This concise ebook explains how you can use animation to “lighten the cognitive load”, making your sites easier and more enjoyable to use. You can get a taste of Nabors' expertise in her tutorial on how to Create storyboards for web animations.

06. Alembic

This plugin creates a colour palette based on the dominant shades in your images

This Sketch plugin extracts a whole colour palette from any layer that contains bitmap data (so that's patterned layers as well as solid filled images). 

Like all great modern inventions, the idea was prompted by a Tweet, and then brought to life by digital design and development agency Awkward. It's also an open source project, so you can see it on GitHub, too.

07. Font Review Journal

This site promises to demystify typography

Type lover Bethany Heck posts weekly font reviews on this site in a bid to “celebrate, analyse, demystify” typography. She explains that designing a typeface is a huge amount of work that’s often refined over a period of years, so each one has a detailed backstory and historical context that isn’t understood by the vast majority of people who use it. 

Heck wants to make this knowledge more accessible to users, and hopes that this site will serve as a bridge between the people who make typefaces and the people who use them.

08. XRespond

Preview how your design will look on different devices

XRespond is a tool to help you build responsive websites. Enter any URL and it displays that site as it will appear on a range of devices side-by-side, so you can work on each component at multiple screen sizes simultaneously.

09. GitHub Chrome Notifier

Instead of getting notifications in your inbox, this Chrome extension displays them in your browser. You can get real-time push notifications when someone creates an issue or comments on an issue, pushes code, creates a pull request, or forks or stars your repository.

Read more about how and why software developer Stacy Goh made this here.

10. White Hat UX

This book focuses on ethical and effective UX design

Many websites use dark patterns – design features that work to deceive users into doing things that they didn’t necessarily intend to do. Some of these patterns have become conventions, but this kind of design is ethically questionable and may well erode trust in your brand. 

This book by Trine Falbe, Kim Andersen and Martin Michael Frederiksen focuses on creating great experiences that treat your users with the respect they deserve.

Read more:

• The 30 best iPhone apps for designers
• Back to school: essential design kit for the new term
• 10 really useful responsive web design tutorials

View the full article