[webdev] Web Design Update: December 14, 2017

David P. Dillard


Date: Thu, 14 Dec 2017 06:33:36 -0600
From: Laura Carlson <>
To: webdev <>
Subject: [webdev] Web Design Update: December 14, 2017


- Volume 16, Issue 25, December 14, 2017.

An email newsletter to distribute news and information about web
design and development.


SECTION ONE: New references.

What's new at the Web Design Reference site?

New links in these categories:





05: HTML.




09: TOOLS.




12: What Can You Find at the Web Design Reference Site?

[Contents ends.]

++ SECTION ONE: New references.


Final WCAG 2.1 Working Draft

By Michael Cooper.

"The Accessibility Guidelines Working Group has published a final
Working Draft of Web Content Accessibility Guidelines (WCAG) 2.1 for
wide review…"

WCAG 2.1 and Silver (AG): What is Next for Accessibility Guidelines

By Glenda Sims.

"Are you staying on top of your digital accessibility game? Don't be
caught by surprise that a new version of W3C's Web Content
Accessibility Guidelines (WCAG) is on the horizon…"

WCAG 2.1: The Final List of Candidate Success Criteria is Here

By David MacDonald.

"After 4 years of work, much research and public input, we're
releasing our draft for wide review (this used to be called Final
Draft) befor moving into Candidate Recommendation for WCAG 2.1. We
will not be reviewing any more Success Criteria for WCAG 2.1…"

Future Accessibility: a First Look at WCAG 2.1 (Video)

By Alastair Campbell.

How to Design an Accessible Web

By Henny Swan.

"Discover how the Inclusive Design Principles make apps and sites more
usable for disabled users…"

Cognitive Accessibility Roadmap and Gap Analysis First Working Draft

By Michael Cooper.

"The Accessible Platform Architectures and Accessibility Guidelines
Working Groups have published a first Working Draft of Cognitive
Accessibility Roadmap and Gap Analysis…"

A Developer's Guide to Better Accessibility

By Melanie Sumner and Sean Massa.

"Sean Massa and Melanie Sumner illustrate some core best practices
that developers can take to make their work more accessible, test your
code while developing, and some support resources."

Web Accessibility: What You Say vs. What I Hear

By Mikey Ilagan.

"Issues identified through assistive technology such as screen readers
are often treated as bugs-backlogged and forgotten in lieu of new
feature development. Let me be clear: I think looking at accessibility
this way is all wrong…" web-accessibility-what-you-say-what-i-hear/

Shifting from Fear to Motivation when Talking about Digital Accessibility Law

By Lainey Feingold.

"Lainey Feingold illustrates how the law can help make accessibility
an integral way of doing business and how it is so much more than a
legal obligation." shifting-fear-motivation-talking-digital-accessibility-law/


Styling Components - Typed CSS With Stylable

By Bruce Lawson.

"There's been a lot of debate recently about how best to style
components for web apps so that styles don't accidentally 'leak' out
of the component they're meant for, or clash with other styles on the

Tweaking Text Level Styles

By Adrian Roselli.

"This post is building on the post Short note on making your mark
(more accessible) by Steve Faulkner at the Paciello Group blog…"

Design Systems and CSS Grid

By Stuart Robson.

"…Looking at the first couple of sketch files I felt this would be a
great opportunity to use CSS Grid, to me the newer components need to
be laid out on that page and grid would help with this perfectly…"

Debugging CSS Grid Layouts With Firefox Grid Inspector

By Chen Hui Jing.

"…One of the things I had to wrap my head around was the fact that the
grid we define on the grid container is not visible. You can apply
borders to your grid items, but you cannot apply a border to your grid
lines to see them. This is when a DevTools function like Grid
Inspector comes in really handy…"

Understanding CSS Layout And The Block Formatting Context

By Rachel Andrew.

"There are a few concepts in CSS layout that can really enhance your
CSS game once you understand them. This article is about the Block
Formatting Context (BFC)…" understanding-css-layout-block-formatting-context/

Getting Hardboiled with CSS Custom Properties

By Andy Clarke.

"Custom Properties have brought variables natively to CSS. How do you
write a custom property? It's hardly a mystery. Simply add two dashes
to the start of a style rule. Like this…"


Writing Automated Tests for Accessibility

By Marcy Sutton.

"…Marcy Sutton explains that while automated tests for accessibility
are no substitute for regular manual testing and testing with actual
users, they can help free up your team a bit while communicating code
quality to members of your team and potentially prevent regressions
from deploying to production."

Automating Your Accessibility Tests

By Seren Davies.

"Seren Davies reminds us that unlike Christmas, accessibility testing
should not come but once a year with a look at how to apply automated
testing. By configuring tests to run against each commit, you can
ensure that your site's accessibility compliance need not be left to

+04: EVENTS.

AssertJS Conf
February 22, 2018.
San Antonio, Texas, U.S.A.

ConveyUX '18
February 27-March 1, 2018.
Seattle, Washington, U.S.A.

UX Immersion: Interactions
March 5-7, 2018.
Newport Beach, Califorina, U.S.A.

ConFoo Montreal
March 7-9, 2018.
Montreal, Quebec Canada

+05: HTML.

Role="text" is (presently) Kinda Not a Thing, Sorta.

By Scott O'Hara, Nicolas Steenhout.

"It's a perfect example of a developer trying to make something
accessible (appreciate the effort), but unfortunately it widely misses
the mark on what one should be doing with ARIA attributes."


How to Avoid Bias in Card Sorting (Video)

By Kathryn Whitenton.

"The items included in card sort studies affect results. Avoid bias by
choosing items that proportionately represent your offerings."

12 Wireframe Examples from Some of our Favorite UX Designers

By Kristin Hillery.

"At the very beginning of the design process, we know it's tempting to
dive right into picking fonts and colors. But there are a ton of
benefits to kicking things off with wireframing-it saves time, makes
it easier to spot usability issues, and lets designers focus on
creating a solid user experience…"


Origin Story

By Jeremy Keith.

"…To say that the web was made for sharing documents is like saying
that the internet was made for email. It's true in the sense that it
was the most popular use case, but that never defined the limits of
the system…"

How to Deal With Bad Design Suggestions

By Kara Pernice and Kathryn Whitenton.

"Gracefully respond to unsolicited design ideas, and prevent them from
derailing good design. Turn them into UX learning experiences."

Meet Bruce Lawson, the British Web Warrior Who Draws his Inspiration from India

By Alok Soni.

"Bruce Lawson is sometimes known as Salman Khan of the UK in the tech
community, owing to his love for Bollywood…"

How Accessibility Saved My Professional Life

By Dennis Deacon.

"Dennis Deacon shares the story of his journey into accessibility and
the life-changing moments that altered his professional career in a
positive way."


How To Use Underlined Text To Improve User Experience

By Nick Babich.

"…In this article, I'll explain the concept of underlining and provide
a few tips on how to use it to improve the web experience…"

+08: TOOLS.

Focus Order Favlet

By Jonathan Avila.

"Indicates focus order of the current document (excludes content
inside iframes). Add the link below to your favorites or bookmarks --
in Chrome you can drag and drop it onto the bookmarks toolbar."


Accessibility in Resizing Text

By Tim Wright.

"Tim Wright discusses the impact that preventing text resizing on your
sites has on mobile commuters and how small touches and looking at a
problem a little differently can often be the difference between users
returning and not coming back."

Web Fonts are Critical to the Online User Experience - Don't Hurt Your
Reader's Eyes

By Interaction Design Foundation.
"Bill Gates said; 'Content is King' and when it comes to the online
user experience it is the 100% truth. Delivering a great user
experience doesn't just mean delivering great content - it also means
providing that content in a usable and useful format that encourages
reading and interaction rather than clicking out of the site because
it's unreadable…"


How Do You Convince a Company that Tames Dinosaurs to Design Inclusively?

By Dominic Berry.

"Dominic Berry presents accessibility from an unlikely industry, and
how to get the word out that accessibility makes usability better." convince-company-tames-dinosaurs-design-inclusively/

Usability Heuristics That All UI Designers Should Know

By Steven Douglas.

"As UI designers, we are confronted with design problems every day.
Knowing how best to tackle these issues means investigating,
analysing, testing and prototyping solutions until we get the answer
that fits our user's needs…"

Variations on Practiced Patterns Cause Mistakes

By Aurora Harley.

"Past experiences and repeated practice inform user expectations.
Deviations from a learned routine lead to user errors."

A Crash Course in Content Design

By Melanie Seibert.

"…Content Design is when we are designing any type of content for the

World Usability Day 2017 (Videos)

By University of Minnesota.

Videos and slides from the University of Minnesota's Usability Day are
available online. The theme was "Inclusion through User Experience".

[Section one ends.]


+11: What Can You Find at the Web Design Reference Site?

Accessibility Information.

Association Information.

Book Listings.

Cascading Style Sheets Information.

Color Information.

Drupal Information.

Evaluation & Testing Information.

Event Information.

HTML Information.

Information Architecture Information.

JavaScript Information.

Miscellaneous Web Information.

Navigation Information.

PHP Information.

Sites & Blogs Listing.

Standards, Guidelines & Pattern Information.

Tool Information.

Typography Information.

Usability Information.

XML Information.

[Section two ends.]



WEB DESIGN UPDATE is available by subscription. For information on how
to subscribe and unsubscribe please visit:

The Web Design Reference Site also has a RSS 2.0 feed for site updates.


As a navigation aid for screen readers we do our best to conform to
the accessible Text Email Newsletter (TEN) guidelines. Please let me
know if there is anything else we can do to make navigation easier.
For TEN guideline information please visit:


Until next time,

Laura L. Carlson

Information Technology Systems and Services

University of Minnesota Duluth

Duluth, MN U.S.A. 55812-3009

[Issue ends.]