In this week’s web design and development news roundup, you’ll learn about the psychology of color and emotional design, find a checklist of 16 things to improve your website accessibility, discover how to use CSS Scroll Snap, and more.
If you’re new to my blog, each Friday I publish a post highlighting my favorite user experience, accessibility, WordPress, CSS, and HTML posts I’ve read in the past week.
Hope you find the resources helpful in your work or projects!
Want more resources like these on a daily basis? Follow me @redcrew on Twitter.
Tweet of the Week
I wish product teams would spend more time thinking about what to *remove* instead of thinking about what to add.
I want to focus more, not do more.
— John Saito (@saitojohn) March 12, 2020
User Experience
- There’s more to emotional design than delight, says Brian Cugelman in the psychology of color and emotional design. You need to understand the basic building blocks of emotions and feelings.
- User research is a crucial aspect of the design process. Oliver Lindberg asked 13 experts to share their tips for mastering the user research process.
A good research question is specific, actionable, and practical. This means that it’s within your means to answer the question well enough to base decisions on what you’ve learned.
- To come to the best design solution, UX designers need to talk with the developers who will implement the designs says Steven Hoober as he discusses the challenges of design and technology on a project team.
- If you’ve ever designed a dashboard, you’re aware of the challenges of data representation, relative scale, and other factors you need to consider. Creating clear dashboards is crucial for a good user experience, as Growth Design shows in their COVID-19 dashboard case study.
Accessibility
- Improving accessibility on your website doesn’t always involve coding. Many accessibility issues aren’t technical, they’re due to design or writing. Check out Bruce Lawson’s web accessibility checklist of 16 things to improve your website accessibility.
- Have you tried out this new Chrome accessibility feature?
New accessibility feature in @ChromeDevTools: simulate vision deficiencies, including blurred vision & various types of color blindness. 🔥
Find out how people with vision deficiencies experience your web app, and resolve contrast issues you didn’t even know you had! pic.twitter.com/QKLQmEhhMM
— Mathias Bynens (@mathias) March 10, 2020
- Not a day passes when I don’t read online content that includes abbreviations in their content, with no explanation of what they mean. Don’t make your acronyms and abbreviations a puzzle for readers to solve.
- When people see how a website creates barriers to user, they finally understand the importance of web accessibility. Becky Gibson calls it the “aha” moment as she explains how to create your own “aha” moment as you test sites.
WordPress
- With concerns about the COVID-19 pandemic, Andrea Middleton shared advice and recommendations for event organizers. Many meetup groups have moved to online events while several WordCamps have been canceled or postponed.
- While it’s heartbreaking for WordCamp organizers to cancel events they’ve worked on for months or close to a year, the cancellations have brought the WordPress community together in ways WordCamps and meetups never have.
- Not only for WordPress developers, you’ll find several tools in my friend Claire Brotherton’s post 25 free time-saving online tools for WordPress developers that are useful to every web developer.
- The second release candidate for WordPress 5.4 is available for testing and download. The 5.4 version is scheduled for release on March 31, 2020.
- One feature included in the 5.4 release was added after code freeze: the editor will default to fullscreen. In my opinion as a former release coordinator, it’s a poor management decision based on no data. The decision reflects badly on WordPress release leadership.
CSS and HTML
- If you want to control the scrolling of your website, you don’t have use a JavaScript library. Take a look at using CSS scroll snap, which has good browser support (you’ll need to use older version of the specs for Firefox and Internet Explorer).
- To prevent layout shifts and improve user experience, setting height and width on images is important again.
- Firefox 74 was released this week, with the long-awaited
text-underline-position
CSS property now enabled. - Looking for an SVG editor, but don’t want to use Adobe Illustrator or Inkscape? Thanks to Chris Coyier for compiling this list of browser-based SVG editors. Have you used any of them?
What I Found Interesting
- With the COVID-19 pandemic, many event organizers are canceling or moving their events online. Brian Rinaldi shares useful tips for running virtual meetups and events based on their own experience.
- The web we want works for everyone. On the World Wide Web’s 31st birthday, Sir Tim Berners-Lee says it’s up to us to make the web work for women and girls.
- Have you seen the Google Doodle for International Women’s Day? Learn about the artists behind it and their inspiration.
If you like what you’ve read today, share the post with your colleagues and friends.
Want to make sure you don’t miss out on updates? Subscribe to get notified when new posts are published.
Did I miss some resources you found this week? I’d love to see them! Post them in the comments below.