Web Design Update: August 12, 2020

[Laura Carlson]

+++ WEB DESIGN UPDATE.
- Volume 19, Issue 07, August 12, 2020.

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

++ISSUE 07 CONTENTS.

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

01: ACCESSIBILITY.
02. BOOKS.
03: CASCADING STYLE SHEETS.
04: COLOR.
05: DRUPAL.
06: EVALUATION & TESTING.
07: EVENTS.
08: HTML.
09: JAVASCRIPT.
10: USABILITY.

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

[Contents ends.]


++ SECTION ONE: New references.

+01: ACCESSIBILITY.

Web Content Accessibility Guidelines (WCAG) 2.2 Draft for Review
By Alastair Campbell.
"The Accessibility Guidelines Working Group (AG WG) is happy to
announce it has published a new draft of the Web Content Accessibility
Guidelines (WCAG) 2.2 for wide review…"
https://www.w3.org/blog/2020/08/wcag22-wide-review/

What's New in WCAG 2.2
By Adrian Roselli.
"The latest (and probably last) WCAG version 2 point release is in
draft and the W3C is asking for comments and feedback by 18 September
2020 either via GitHub or via email…"
https://adrianroselli.com/2020/08/whats-new-in-wcag-2-2.html

The Internet is Everything. But Is It Accessible?
By Kimberly Adams with Nicolas Steenhout.
"…Nicolas Steenhout, a web accessibility consultant and trainer, said
some products that claim to help actually make things worse. Here is
an edited transcript of our interview…"
https://www.marketplace.org/shows/marketplace-tech/internet-access-accessibility-americans-with-disabilities-act-screen-readers-type-with-voice/

Equal Entry Website Called Out as Inaccessible
By Heather Burns. (Hat Tip to Meryl K. Evans)
"On July 2, 2020 a visitor to the Equal Entry website left us the
following message…"
https://equalentry.com/equal-entry-website-called-out-as-inaccessible/

Source Order Viewer in Canary
By Adrian Roselli.
"…In the accessibility inspector in the dev tools is a section, Source
Order Viewer, and there is a checkbox for Show source order. The
Microsoft Edge team added this as a result of my years' long campaign
for a source order viewer to be built into the browser dev tools…"
https://adrianroselli.com/2020/08/source-order-viewer-in-canary.html

A11y is Web Accessibility
By Eric Bailey.
"For better or worse, I spend a decent amount of time on social media…"
https://ericwbailey.design/writing/a11y-is-web-accessibility

6-Step Mobile App Accessibility Checklist
By Luca Boskin.
"The following mobile app accessibility checklist can help
organizations easily factor accessibility into their iOS and Android
app projects, but first…"
https://blog.usablenet.com/mobile-app-accessibility-techniques-for-inclusive-design-part-1

Common PDF Accessibility Mistakes to Avoid
By Leslie Janek.
"Here are a few common issues known to cause challenges with PDF documents…"
https://www.microassist.com/software-tips/common-pdf-accessibility-mistakes-to-avoid/

Goodbye Accessible Zen
By David A Kennedy.
"Seven years ago, I released a public WordPress theme that paved the
way to new things for me. It taught me about accessibility…"
https://davidakennedy.com/blog/goodbye-accessible-zen/

Honor the ADA: Avoid Web Accessibility Quick-Fix Overlays
By Lainey Feingold.
"This is a post about software that promises to make websites
accessible. Companies promise that a website will work for disabled
people if the software is installed. Companies also promise that using
the software will prevent a website from being sued because it is not
accessible. Lainey does not agree. True accessibility is about
including disabled people in the digital world. These tools do not
stop lawsuits. They do not create long lasting access. And their own
websites have barriers."
https://www.lflegal.com/2020/08/quick-fix/

Sidestepping Ableist Language
By Ashley Bischoff.
"What is ableist language? 'retarded', 'crazy', 'lame', 'insane', 'derp'…"
http://www.friendlyediting.com/assets/notsoableist/index.html


+02. BOOKS.

Coolidge, Doner, Robertson, and Gray. "Accessibility Toolkit - 2nd
Edition", BCcampus 2020.
https://opentextbc.ca/accessibilitytoolkit/


+03: CASCADING STYLE SHEETS.

Digging Into the Flex Property
By Ahmad Shadeed.
"…In this article, I will go through the shorthand and the longhand
properties in detail, and explain when and why to use them with
practical and visual examples…"
https://ishadeed.com/article/css-flex-property/

Maintaining Focus Outlines for Windows High Contrast Mode
By Ben Myers.
"If you're overriding browsers' default focus styles with outline:
none;, consider using outline: 3px solid transparent; instead. This is
a quick and easy way to remove the outline for most viewing modes,
while preserving it for Windows High Contrast Mode users…"
https://benmyers.dev/blog/whcm-outlines/

font-weight: 300 Considered Harmful (and a Fontconfig Workaround)
By Tomáš Janoušek.
"Many web pages these days set font-weight: 300 in their stylesheet.
With DejaVu Sans as my preferred font, this results in very thin and
light text that is hard to read…"
https://work.lisk.in/2020/07/18/font-weight-300.html

Naming Layout Components
By Andy Clarke.
"…It's been a long time since I worried about semantics for my
component names. Now, I name components for the project I'm working
on…"
https://stuffandnonsense.co.uk/blog/naming-layout-components

content-visibility: The New CSS Property that Boosts your Rendering Performance
By Una Kravets and Vladimir Levin.
"Improve initial load time by skipping the rendering of offscreen content…"
https://web.dev/content-visibility/

Drop-Shadow: The Underrated CSS Filter
By Michelle Barker.
"If you're familiar with CSS, you probably know all about the
box-shadow property. But did you know there is a CSS filter,
drop-shadow, that does a something similar…"
https://css-irl.info/drop-shadow-the-underrated-css-filter/


+04: COLOR & CONTRAST.

Nailing the Perfect Contrast Between Light Text and a Background Image
By Yaphi Berhanu.
"Have you ever come across a site where light text is sitting on a
light background image? If you have, you'll know how difficult that is
to read. A popular way to avoid that is to use a transparent overlay.
But this leads to an important question: Just how transparent should
that overlay be…"
https://css-tricks.com/nailing-the-perfect-contrast-between-light-text-and-a-background-image/


+05: DRUPAL.

Drupal Accessibility: Why It's Worth It
By Matthew Tift.
"People who build websites sometimes choose Drupal because of its
reputation for accessibility…"
https://www.lullabot.com/articles/drupal-accessibility-why-its-worth-it

Accessible Navigation with Drupal Core's Menu System
By Mike Herchel.
"New to Drupal 8.9 and 9.0 is the ability to create the HTML <button>
element within a native Drupal menu that can be used to toggle
secondary menus (such as drop-downs or mega-menus) in a usable and
accessible way…"
https://www.lullabot.com/articles/accessible-navigation-drupal-cores-menu-system

Building a More Inclusive Drupal Website (PDF)
By Evolving Web.
"One of the reasons we love Drupal is that it's accessible
out-of-the-box. But for a Drupal site to stay accessible, everyone
from the content editors to the designers to the developers have to be
onboard. A culture of accessibility means everyone is prioritizing
making the website inclusive. Accessibility isn't just about having a
checklist, it's about caring about your users and understanding how
users with different disabilities use your website…"
https://f.hubspotusercontent40.net/hubfs/2935247/Building%20a%20More%20Inclusive%20Drupal%20Website%20-%20Your%20Accessibility%20Guide.pdf


+06: EVALUATION & TESTING.

Catching Cheaters and Outliers in Remote Unmoderated Studies (Video)
By Kate Moran.
"In remote usability studies, it's hard to identify test participants
who should not be in the study because they don't fit the profile or
don't attempt the task seriously. This is even harder in unmoderated
studies, but it can (and should) be done."
https://www.nngroup.com/videos/cheaters-outliers-remote-unmoderated-studies/

Why User-Based Testing Is Important to Successful UX Tests
By Alyse Falk.
"When website visitors come to your website, you have only up to eight
seconds to influence them…"
https://www.loop11.com/why-user-based-testing-is-important-to-successful-ux-tests/


+07: EVENTS.

Using Screen Readers and Testing Tools to Evaluate the Accessibility
of a User Journey
August 19, 2020.
Online
https://zoom.us/webinar/register/9515956054531/WN_aM_TjAnJRQibfj9dzVSpew

Agile Accessibility Requirements at Scale: How PNC incorporates
accessibility requirements into agile practice
August 20, 2020.
Online
https://accessibility.deque.com/pnc-agile-accessibility-requirements-scale-webinar

Accessibility & Inclusive Design Q&A with Derek Featherstone
New date: August 20, 2020 (was August 6).
Online
https://levelaccess.zoom.us/webinar/register/4915954452977/WN_OZppBGSiTqigXyRB2MIoJg

2020 Virtual Leadership Briefing
September 15, 2020.
Online
https://m-enabling.com/2020-virtual-leadership-briefing/

W3C Technical Plenary / Advisory Committee (TPAC) Event
October 12-16 / 26-30, 2020.
Online
https://www.w3.org/2020/10/TPAC/Overview.html

Smashing Austin Conference
October 13-14, 2020.
Online
https://smashingconf.com/austin-2020

Web Accessibility for Drupal
November 2 and 4, 2020.
Online
https://www.eventbrite.ca/e/web-accessibility-for-drupal-live-online-training-tickets-112130104160


+08: HTML.

ARIA in HTML
W3C Working Draft 11 August 2020
Steve Faulkner and Scott O'Hara, editors
"…It is NOT RECOMMENDED for web developers to set the ARIA role and
aria-* attributes to values that match the implicit ARIA semantics
defined in the table. Doing so is unnecessary and can potentially lead
o unintended consequences…"
https://www.w3.org/TR/html-aria/

HTML for Subheadings and Headings
By Chris Coyier.
"Let's say you have a double heading situation going on…"
https://css-tricks.com/html-for-subheadings-and-headings/


+09: JAVASCRIPT.

Offline First with Service Workers and Vanilla JS
By Chris Ferdinandi.
"…Today, we're going to look at a strategy called 'offline-first'…"
https://gomakethings.com/offline-first-with-service-workers-and-vanilla-js/


+10: USABILITY.

Improving the Usability and Accessibility of a Healthcare Website by
Being Mindful of Reading Level
By Eric Bailey.
"Improving the reading level is often overlooked or downplayed as
unglamorous work. Yet it is one of the most effective things you can
do to make a product more usable…"
https://thoughtbot.com/blog/improving-the-usability-and-accessibility-of-a-healthcare-website-by-being-mindful-of-reading-level

PDF: Still Unfit for Human Consumption 20 Years Later
By Jacob Nielsen and Anna Kaley.
"Research spanning 20 years proves PDFs are problematic for online
reading. Yet they are still prevalent and users continue to get lost
in them. They're unpleasant to navigate and remain unfit for
digital-content display."
https://www.nngroup.com/articles/pdf-unfit-for-human-consumption/

Learnability vs Efficiency in User Interface Design (Video)
By Alita Joyce.
"Two of the most fundamental usability metrics are learnability (the
user's ability to use a new design they have not seen before) and
efficiency (the speed with which people do tasks after they have
learned the interface)."
https://www.nngroup.com/videos/learnability-efficiency-ui-design/

Complex Application Design: A 5-Layer Framework
By Kate Kaplan.
"Various contexts of Complexity should be considered by UX designers
and researchers designing complex applications, including complexities
of integration, information, intention, enviornment, and institution."
https://www.nngroup.com/articles/complex-application-design-framework/

[Section one ends.]


++ SECTION TWO:

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

XML Information.
http://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:
http://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.]