Weekly Roundup of Web Design and Development Resources: October 23, 2015

In this week’s roundup of web design and development resources, you’ll learn how one company used Facebook as a platform for user research, find out why it’s important to have high contrast text over background images, discover how to clean up a hacked site, and more.

If you’re new to my blog, each Friday I publish a post with my favorite reads from the past week for user experience, accessibility, WordPress, CSS, and HTML.

Want more resources like these on a daily basis? Follow me @redcrew on Twitter.

This week’s photo is the Grand Island East Channel Lighthouse, as seen from the boat tour I took last week of the Pictured Rocks National Lakeshore along the shore of Lake Superior in Michigan. Aren’t the fall colors amazing?

Tweet of the Week

Learning without research is just guessing.@lauraklein #ux #leanux

— Agustain (@agustinesperon) October 19, 2015

User Experience

• Using Social-Media Tools to Connect with Users: A Case Study: In her UX Matters post, Linnea Smolentzov discusses how her team at Fell Swoop met the challenge of learning about marketing to Millennials and Gen Z marketing by using Facebook as a research platform.
• Ignite UX Michigan 2015 Videos Are Online: Videos from last month’s Ignite UX Michigan 2015 have been posted. Watch the eleven short (five-minute) videos at your leisure.

• Allow everyone in the company to easily submit new design ideas (via simple online form) – @designchemist #invisionwebinar #designculture

  — ☰ Mark Hazlewood ☰ (@MHazlewood) October 21, 2015

• Why we call it interaction design: Your thoughts? Andrew Travers argues against one role having ownership of the user experience in its title.
  

  Labels matter. ‘User experience designer’ unintentionally disenfranchises our content designers – particularly our content designers – but also our researchers, our product owners, our front-end developers.

• The Content Corner: Helping Your Content Contributors: While written for U.S. government agencies, the tips and advice shared in this post from DigitalGov applies to anyone working with and creating content for the web.

Accessibility

• Mind set: Everyone has different priorities, says Jeremy Keith, as he discusses two recent decisions that affect accessibility. Take time to see things from their perspective before criticizing. In other words, put on their shoes.

• #helloworld Twitter: please add affordances for alt text on images. We can tag people, yet we can't provide true alt text. #a11y

  — Marcy Sutton (@marcysutton) October 21, 2015

• Ensure High Contrast for Text Over Images: If you place text over a background image, make sure it’s readable and has high color contrast.
• My Slides from Accessibility Camp Toronto 2015: In his Fringe Accessibility Techniques presentation at Accessibility Camp Toronto last weekend, Adrian Roselli highlighted some less-discussed techniques for web accessibility: link underlines, heading usage, adding :focus to :hover styles, tabindex (don’t use tabindex > 0), and more.
• Accessibility Camp Toronto 2015 Recap: Shawn Hooper shares his top takeaways from last weekend’s Accessibility Camp Toronto. My favorite was Hooper’s summary of the usability testing for accessibility session with Linn Vizard and Heather Moore from Usability Matters.

WordPress

• Five of the Best WordPress Appointment Plugins: Joe Fylan takes a closer look at five popular appointment plugins, reviewing features and pricing.
• 4.4 Taxonomy Roundup: In the upcoming WordPress 4.4 release (expected in December 2015), you can expect improvements to term meta, the taxonomy roadmap, and a few other smaller changes.
• How I Cleaned Up My WordPress Site After It Was Hacked: You hope it never happens, but unfortunately it can happen to anyone. Your site gets hacked. Jenni McKinnon had it happen to her last week. Here’s how she cleaned up her site and got her site off the blacklist.
• WordPress Implementation: Starting out with WordPress? Get tips on themes, plugins, and code to create custom WordPress sites.

CSS and HTML

• Essential Tool: Firefox’s screenshot Command: This excellent walk-through of Firefox’s screenshot feature by Eric Meyer highlights two options you can’t live without: --selector which allows you to specify a CSS selector to an element and device pixel ratio.
• Reverse Text Color Based on Background Color Automatically in CSS: Love how Robin Rendel shows how to make this work with CSS only, no JavaScript. Though I saw it work earlier this week, now it’s not displaying correctly on my Chrome version 46.0.2490.71 m. Wish the mix-blend-mode property had better browser support.

• VW is no longer only an automotive supplier. #push15 #viewportwidth #css

  — Frau Hölle (@FrauHoelle) October 23, 2015

• 10 rules of best practice for responsive design: I think rule number 10 should be the first rule: Test your design on actual devices.
• Circular Images with CSS: If you’ve been working with CSS for a while, you’re familiar with the border-radius technique for creating circular images from square images. Rectangular images are a bit trickier.

What I Found Interesting

• Presenting Yourself with Credibility: Conference Notes: Did you know your tone, body language, and conversation technique affect your credibility as a presenter?
• Warning: That Email Habit is Costing You: Imagine your three-year-old child grabbing your smartphone out of your hand and throwing it across the room.
  

  I hate this thing! Pay attention to me!

• Playing with Type: Make the right decisions for choosing a great typeface, even if you’re not a designer, with this guide from Brian Krogsgard.
• Introducing Twitter Polls: Want to get feedback on something quickly? Instead of setting up a survey on your site, or a third-party site, you can now use Twitter’s new Poll feature.

If you like what you’ve read, why not share this post with your colleagues and friends?