Web Design Update: May 6, 2020

[Laura Carlson]

+++ WEB DESIGN UPDATE.
- Volume 18, Issue 45, May 6, 2020.

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

++ISSUE 45 CONTENTS.

SECTION ONE: New references.
What's new at the Web Design Reference site?
https://www.d.umn.edu/itss/training/online/webdesign/
New links in these categories:

01: ACCESSIBILITY.
02: CASCADING STYLE SHEETS.
03: COLOR.
04: EVALUATION & TESTING.
05: EVENTS.
06: INFORMATION ARCHITECTURE.
07: JAVASCRIPT.
08: NAVIGATION.
09: USABILITY.

SECTION TWO:
10: What Can You Find at the Web Design Reference Site?

[Contents ends.]


++ SECTION ONE: New references.

+01: ACCESSIBILITY.

Avoid aria-roledescription
By Adrian Roselli.
"…if the mis-use continues and screen readers are forced to override
specified behavior as a result, you can expect this attribute to be
deprecated in the future. In my opinion, that may be the best outcome
given where we are today."
https://adrianroselli.com/2020/04/avoid-aria-roledescription.html

Results of Labeling Lists
By Scott O'Hara.
"…Developers can label a list by using an aria-label or
aria-labelledby on the containing list element (e.g., ol, or ul).
Doing so will give the list an accessible name, which can be
situationally helpful (more on that later).
https://www.scottohara.me//note/2020/05/02/labelled-lists.html

Challenges with Accessibility Guidelines Conformance and Testing, and
Approaches for Mitigating Them
Janina Sajka and Michael Cooper, editors.
"This document explores how testability and page-based conformance
verification of the WCAG 2.0 and 2.1 accessibility guidelines are
challenging to apply to a broad range of websites and web
applications. It also explores approaches for mitigating these
challenges, to realize as accessible a site as possible…"
https://www.w3.org/TR/accessibility-conformance-challenges/

1.2.7 - Extended Audio Description (Pre-recorded)
By Luke McGrath.
"Provide extended audio description for pre-recorded videos…"
https://wuhcag.substack.com/p/127-extended-audio-description-pre

Accessible Datepickers Roundup
By Raghavendra Satish Peri.
"…Denis from Webaxe has a good collection here which I also listed
below… all of these date pickers seem to work well with JAWS & Chrome
browser& you might want to customize them further according to your
needs…"
https://www.digitala11y.com/accessible-datepickers-

A Future Date (Videos)
"That's a wrap! All twenty (yes, TWENTY) A Future Date sessions are now posted…"
https://www.youtube.com/c/AFutureDate/videos

Restaurant Website Accessibility Falls Short at a Critical Time
By Karl Groves.
"…Last week, we decided to do some research. We grabbed the URLs of
15,000 of the top-ranked restaurant websites in the United States. The
results were… interesting…"
https://blog.tenon.io/restaurant-website-accessibility-falls-short-at-a-critical-time

The Curve Has Flattened for Federal Website Accessibility Lawsuits
By Kristina M. Launey.
"We've sheltered in place and finished our tally. The numbers are in
for total website accessibility lawsuit filings in federal courts in
2019, they show a small decrease from 2018…"
https://www.adatitleiii.com/2020/04/the-curve-has-flattened-for-federal-website-accessibility-lawsuits/amp.html/

The Digital Accessibility Legal Summit 2020 (Video)
"…An update on the team putting together the Digital Accessibility
Legal Summit. This video features talks on the impacts of the Covid-19
pandemic on legal issues for people with disabilities working and
studying from home; new laws from Canada on digital accessibility and
their impacts for US-based practice; and on Inclusion trends in the
current marketplace…"
https://www.youtube.com/watch?v=BN4OaJDRTyM


+02: CASCADING STYLE SHEETS.

An Introduction to CSS Grid
By Chris Ferndinandi.
"CSS Grid is an insanely powerful way to build layouts. But because it
can do so much (and because most tutorials love to show you all the
fancy stuff it can do), learning the basics can feel overwhelming…"
https://gomakethings.com/an-introduction-to-css-grid/

A Complete Guide to CSS Functions
By Chris Coyier.
"In programming, functions are a named portion of code that performs a
specific task…"
https://css-tricks.com/complete-guide-to-css-functions/

No-Comma Color Functions in CSS
By Chris Coyier.
"…This is a nice change that makes CSS a bit more clear. Before, every
single color function actually needs two functions, one for
transparency and one without, this eliminates that need and brings the
syntax more-inline with CSS grammar overall…"
https://css-tricks.com/no-comma-color-functions-in-css/

A .Button is a Button is a Link
By Jonathan Snook.
"You're working on a project and in it you see a button. It looks like
a button, it acts like a button. It is a button. It is a <button>. It
is a .button. But is every <button> a .button? Is every .button a
<button>? Let's take a look at some very specific examples…"
https://snook.ca/archives/html_and_css/button-button-link

Does Masonry Belong in the CSS Grid Specification?
By Rachel Andrew.
"When I first began to demo CSS Grid to people, in particular the
dense packing mode, at a first glance it looked a bit like the layout
achieved by - most notably - the Masonry JavaScript plugin…"
https://rachelandrew.co.uk/archives/2020/05/05/does-masonry-belong-in-the-css-grid-specification

CSS Layout
By Rachel Andrew.
"CSS Layout has been transformed over the past years. We have you
covered with all you need to master this new world. If you want to
understand the technical details, or learn how to use new CSS
creatively, these guides can help…"
https://www.smashingmagazine.com/guides/css-layout/

CSS Tips for New Devs
By Amber Wilson.
"…I wrote down some of the CSS tips I've learned over a few years of
being a developer and put them in this post…"
https://amberwilson.co.uk/blog/css-tips-for-new-devs/


+03: COLOR.

EncycolorPedia
By Rosemarie Garganta.
"Hex Colors, Color Picker, Directory, Schemes, Paint Search & Conversions…"
https://encycolorpedia.com


+04: EVALUATION & TESTING.

How to Test the Usability of Documents
By Caroline Jarrett and Janice 'Ginny' Redish.
"Does usability testing work for documents? Our answer is a resounding
yes. In this column, we'll give you three techniques for having people
try out documents or any other stand-alone content. These techniques
apply whether your document is on paper or online-for example, as a
Web page or a PDF. They apply for both in-person and remote usability
testing—especially with moderated remote testing…"
https://www.uxmatters.com/mt/archives/2020/05/how-to-test-the-usability-of-documents.php

Benchmarking UX: Tracking Metrics
By Kate Moran.
"Quantitatively evaluate a product or service's user experience by
using metrics to gauge its relative performance against a meaningful
standard."
https://www.nngroup.com/articles/benchmarking-ux/

Consumer Software Usability & NPS Benchmarks (2020)
By Jeff Sauro and Jim Lewis.
"…This was an update to data we collected on a similar set of products
in 2017 using a similar methodology and it complements our
business-focused software article and report. The 41 software products
include a mix of popular productivity, storage, and security
software…"
https://measuringu.com/ux-consumer-software-2020/

Business Software UX & NPS Benchmarks (2020)
By Jeff Sauro and Jim Lewis.
"…The 19 business products include a mix of productivity and
communications software (both web and desktop)…"
https://measuringu.com/business-software-ux2020/

Usability Testing for Voice Content
By Preston So.
"It's an important time to be in voice design, but it's not without
its own challenges. Content in voice-driven interfaces can vary wildly
from that of traditional websites, which might leave many of us
wondering about our existing approaches to usability testing. Preston
So not only shows us how to reframe these challenges into
opportunities, but as advantages for the medium itself."
https://alistapart.com/article/usability-testing-for-voice-content/

Practices and Challenges of Using Think-Aloud Protocols in Industry:
An International Survey
By Mingming Fan, Serina Shi, Khai N. Truong.
"Think-aloud protocols are one of the classic methods often taught in
universities for training UX designers and researchers. Although
previous research reported how these protocols were used in industry,
the findings were typically based on the practices of a small number
of professionals in specific geographic regions or on studies
conducted years ago…"
http://uxpajournal.org/practices-challenges-think-aloud-protocols-survey/

Six 'COVID-19' Related E-Commerce UX Improvements to Make
By Edward Scott.
"…In this article we'll discuss the test findings from our large-scale
UX research related to why and how users are best reassured when it
comes to their general concerns over product availability, shipping,
returns, customer support, and similar topics…"
https://baymard.com/blog/covid-19-ux-improvements


+05: EVENTS.

What is Digital Accessibility and Why is It So Important? (With
Alastair Campbell)
May 11, 2020.
Online
https://www.nomensa.com/whitepapers/accessibility-webinar-uk/

Mobile Accessibility
May 12, 2020.
Online
https://levelaccess.zoom.us/webinar/register/4915880985807/WN_iZpLoN0cT1KVudP4OsJ6Jg

Intro to Agile Accessibility
May 21, 2020.
Online
https://accessibility.deque.com/intro-to-agile-accessibility

Basic Accessibility Fundamentals Bootcamp
May 21, 2020.
Online
https://accessibility.deque.com/basic-accessibility-fundamentals-bootcamp

Virtual Web Accessibility Training
June 24-25, 2020.
Online
https://webaim.org/training/virtual/

DrupalCon Global 2020
July 14-17, 2020.
Online
https://events.drupal.org/global2020

Smashing Conference - Austin TX
October 13-14, 2020.
Austin, Texas, U.S.A.
https://smashingconf.com/austin-2020/postponed

Smashing Conference - New York, NY
October 20-21, 2020.
New York, New York, U.S.A.
https://smashingconf.com/ny-2020/

Accessing Higher Ground
November 16-20, 2020.
Westminster, Colorado, U.S.A.
https://accessinghigherground.org/


+06: INFORMATION ARCHITECTURE.

The Importance of Information Architecture to UX Design
By Anastasia Stefanuk.
"…A well-designed, user-friendly information architecture ensures that
users spend less time and effort searching for information and are
successful in finding what they need…"
https://www.uxmatters.com/mt/archives/2020/05/the-importance-of-information-architecture-to-ux-design.php


+07: JAVASCRIPT.

Test Driven Accessibility with Erin Doyle
By Joel Hooks.
"At first, React looked like it might have been a fad, and JSX seemed
weird. But, it didn't take long for people to see the power and beauty
of it. React makes reuse easy, which makes accessibility a lot
easier…"
https://egghead.io/podcasts/test-driven-accessibility-with-erin-doyle


+07: NAVIGATION.

Journey Mapping: 2 Decisions to Make Before You Begin (Video)
By Kate Kaplan.
"Customer journey maps come in two flavors: current-state and
future-state mapping. Mapping can be based on hypotheses or on real
user data."
https://www.nngroup.com/videos/journey-mapping-decisions/

Creating Clear Menus and Links
By Gerry McGovern.
"A link is a promise. A menu is a selection of promises. Without the
link there is no Web. From links we build the Web. Links. So often
forgotten in the design process. So often neglected…"
https://gerrymcgovern.com/creating-clear-menus-and-links/


+08: USABILITY.

Designing for Progressive Disclosure
By Steven Hoober.
"…Hypermedia means not just simply linking two things together, but
giving the user an easy way to get more information about almost
anything, with one click or tap…"
https://www.uxmatters.com/mt/archives/2020/05/designing-for-progressive-disclosure.php

Virtual UX Conference Q&A With Jakob Nielsen (Video)
By Jakob Nielsen.
"At the first Virtual UX Conference, Jakob Nielsen answered
participant questions about topics ranging from user-experience
careers and skill development to foldable smartphones and the future
of user interfaces."
https://www.nngroup.com/videos/virtual-ux-conference-qa-jakob-nielsen/

The Author of 'Don't Make Me Think' Discusses UX Design's 20-Year Evolution
By Jeff Link.
"Technology has evolved. Users haven't…"
https://builtin.com/design-ux/simplicity-ux-steve-krug-interview


[Section one ends.]


++ SECTION TWO:

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

Accessibility Information.
https://www.d.umn.edu/itss/training/online/webdesign/accessibility.html

Association Information.
https://www.d.umn.edu/itss/training/online/webdesign/associations.html

Book Listings.
https://www.d.umn.edu/itss/training/online/webdesign/books.html

Cascading Style Sheets Information.
https://www.d.umn.edu/itss/training/online/webdesign/css.html

Color Information.
https://www.d.umn.edu/itss/training/online/webdesign/color.html

Drupal Information.
https://www.d.umn.edu/itss/training/online/webdesign/drupal.html

Evaluation & Testing Information.
https://www.d.umn.edu/itss/training/online/webdesign/testing.html

Event Information.
https://www.d.umn.edu/itss/training/online/webdesign/events.html

HTML Information.
https://www.d.umn.edu/itss/training/online/webdesign/html.html

Information Architecture Information.
https://www.d.umn.edu/itss/training/online/webdesign/architecture.html

JavaScript Information.
https://www.d.umn.edu/itss/training/online/webdesign/javascript.html

Miscellaneous Web Information.
https://www.d.umn.edu/itss/training/online/webdesign/misc.html

Navigation Information.
https://www.d.umn.edu/itss/training/online/webdesign/navigation.html

PHP Information.
https://www.d.umn.edu/itss/training/online/webdesign/php.html

Sites & Blogs Listing.
https://www.d.umn.edu/itss/training/online/webdesign/sites.html

Standards, Guidelines & Pattern Information.
https://www.d.umn.edu/itss/training/online/webdesign/standards.html

Tool Information.
https://www.d.umn.edu/itss/training/online/webdesign/tools.html

Typography Information.
https://www.d.umn.edu/itss/training/online/webdesign/type.html

Usability Information.
https://www.d.umn.edu/itss/training/online/webdesign/usability.html

XML Information.
https://www.d.umn.edu/itss/training/online/webdesign/xml.html

[Section two ends.]


++END NOTES.


+ SUBSCRIPTION INFO.

WEB DESIGN UPDATE is available by subscription. For information on how
to subscribe and unsubscribe please visit:
https://www.d.umn.edu/itss/training/online/webdesign/webdev_listserv.html
The Web Design Reference Site also has a RSS 2.0 feed for site updates.


+ TEXT EMAIL NEWSLETTER (TEN).

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:
http://www.headstar.com/ten


+ SIGN OFF.

Until next time,

Laura L. Carlson
Information Technology Systems and Services
University of Minnesota Duluth
Duluth, MN U.S.A. 55812-3009
mailto:lcar...@d.umn.edu


[Issue ends.]