Web Design Update: April 30, 2020

408 views
Skip to first unread message

Laura Carlson

unread,
Apr 30, 2020, 7:10:05 AM4/30/20
to webdev
+++ WEB DESIGN UPDATE.
- Volume 18, Issue 44, April 30, 2020.

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

++ISSUE 44 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: EVALUATION & TESTING.
04: EVENTS.
05: HTML.
06: JAVASCRIPT.
07: MISCELLANEOUS.
08: NAVIGATION.
09: TOOLS.
10: TYPOGRAPHY.
11: USABILITY.

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

[Contents ends.]


++ SECTION ONE: New references.

+01: ACCESSIBILITY.

WCAG 2.1 Checklist with Filter and Links
By Web Overhauls.
"Adapted from Paul Adam's WCAG 2.0 Checklist…"
https://codepen.io/weboverhauls/full/zYvopYE

Understanding SC 1.4.11 Non-text Contrast
By Sathish Kumar.
"Modern design practices heavily rely on visual presentations for
identification of active user interface components and dissemination
of data. But users with moderately low vision have difficulty…"
https://www.digitala11y.com/understanding-sc-1-4-11-non-text-contrast/

Creating Accessible Forms
By WebAIM.
"WebAIM has significantly updated is forms article to provide
additional details on using ARIA, autocomplete, placeholder, and
more."
https://webaim.org/techniques/forms/

Which Is the Best Automatic Captioning Tool for Video Calls?
By Meryl K. Evans.
"One good thing came out of COVID-19. It forced me to try video calls
again. The reason I don't love video calls is that I miss too much.
While I'm a strong lipreader, video calls have a few challenges…"
https://meryl.net/best-automatic-captioning-tool-for-video-calls/

7 Best Practices for Live Auto Captioning Quality
By Samantha Sauld.
"…As more people and organizations shift to online platforms for live
events, it's important to keep these 7 best practices in mind in order
to achieve high-quality live auto captions…"
https://www.3playmedia.com/2020/04/22/best-practices-for-live-auto-captioning-quality/

Why We Say Accessibility is Now More Important than Ever
By Jonathan Avila.
"…up until the recent pandemic there have been workarounds,
alternatives, and fallback approaches that could be used to meet
requirements such as the Americans with Disabilities Act and Section
504 of the Rehabilitation Act. As so many activities of daily life
have moved solely online, in many cases those alternatives and
workarounds are no longer an option…"
https://www.levelaccess.com/why-we-say-accessibility-is-now-more-important-than-ever/

Internet Anxiety with David Swallow (Podcast)
By UXPodcast.
"What makes you anxious when using the internet? We talk to David
Swallow about the ways in which websites can make us stressed,
irritated and cause serious problems for people with panic and anxiety
disorders…"
https://uxpodcast.com/235-internet-anxiety-david-swallow/

Inclusive Design 24 Returns September 17, 2020: Call for Speakers
By Deborah Edwards-Onoro.
"…Here's your opportunity to share what you've learned or discovered…"
https://www.lireo.com/inclusive-design-24-returns-september-17-call-for-speakers/

A Future Date Day 3 (Video)
By Many Accessibility Advocates.
"Track: Accessibility Programs…"
https://www.youtube.com/watch?v=qsifjAR2r14

Keeping Up With… Universal Design for Learning
By Robin Brown, Zach Wellhouse, and Amy Wolfe.
"Universal Design for Learning (UDL) is an educational movement
focused on changing our instructional practices to reach the maximum
number of students regardless of ability, disability, age, gender, or
cultural and linguistic background. Applying UDL to library
instruction means designing instruction that accounts for everyone's
abilities and differences. Library instruction needs to be presented
and accessed in several formats, to be adjustable to the various
styles of students, and to limit barriers for all learners. Designing
for accessibility benefits everyone, not just those with
disabilities."
http://www.ala.org/acrl/publications/keeping_up_with/udl

On the Hook: Website Developers may have ADA Liability for Inaccessible Websites
By Richard M. Hunt.
"Website developers and even remediation experts have reason to be
concerned about a recent decision from California…"
http://accessdefense.com/?p=5407


+02: CASCADING STYLE SHEETS.

Spacing in CSS
By Ahmed Shadeed.
"…I will cover everything you need to know about spacing in CSS, the
different ways of achieving that, and when to use a padding or margin.
Let's dive in…"
https://ishadeed.com/article/spacing-in-css/

Creating an Accessible Range Slider with CSS
By Lindsey Kopacz.
…I've always loved exploring how to make semantic, accessible elements
aesthetically pleasing. And yes, it is possible. Challenging myself to
do this has improved my CSS skills…"
https://www.a11ywithlindsey.com/blog/creating-accessible-range-slider-css

Thoughts on an Implementable Path Forward for Container Queries
By David Barron.
"…To address the need for container queries, I'm proposing a feature
that both addresses container queries and also adds syntax for
scope-based cascading to CSS…"
https://github.com/dbaron/container-queries-implementability

First Public Working Draft: CSS Box Model Module Level 4
By W3C.
"The CSS Working Group has published a First Public Working Draft of
CSS Box Model Module Level 4. This specification describes the margin
and padding properties, which create spacing in and around a CSS box…"
https://www.w3.org/blog/news/archives/8452


+03: EVALUATION & TESTING.

Remote Moderated Usability Tests: How to Do Them
By Kate Moran and Kara Pernice.
"The key to good remote moderated testing is to be thoroughly prepared
and organized. Follow these 7 steps to ensure your study's success."
https://www.nngroup.com/articles/moderated-remote-usability-test/

Remote Usability Testing - Best Practices
By Vikas Kalwani.
"An important aspect of building world-class products is to take
feedback from users while you're building it. This is done to
constantly improve upon the product as per what the users want, which
ultimately helps in successfully crushing the business goals.
Usability testing deals with making users interact with your product
or website to evaluate its user experience. It helps in determining
whether users can use your product with ease or not and also know
about possible usability issues overlooked by designers, UX
researchers, developers, and product managers…"
https://usabilitygeek.com/remote-usability-testing-best-practices/

What's in a Name? How to Select a Name for Your Personas
By Andrew Schall.
"Just like real people, names matter and can influence the success or
failure of your personas…"
https://www.uxbooth.com/articles/whats-in-a-name-how-to-select-a-name-for-your-persona/


+04: EVENTS.

The Current State, Past Progress, and Future Prospects of Web Accessibility
May 1, 2020.
Online
https://eventbrite.com/e/the-current-state-past-progress-and-future-prospects-of-web-accessibility-registration-103740657098

WAVE - What's New and What's Coming?
May 6, 2020.
Online
https://zoom.us/webinar/register/WN_c1WIF-HYQPCTYjEpU1IKhA

Accessible Images When It Matters Most
May 14, 2020.
Online
https://accessibility.deque.com/accessible-images-when-it-matters-most

A11y Talks (May 2020):A11y Axioms - What are the basic truths about
digital accessibility?
May 28, 2020.
Online.
https://groups.drupal.org/node/535905

Higher Ed Digital Conference
June 3, 2020.
Online
https://higheredexperts.com/edu/course/higher-ed-digital-conference/

Quick Start to Captioning
June 4, 2020.
Online
https://go.3playmedia.com/wbn-qsc

UX Conference August
August 10-21, 2020.
Online
https://www.nngroup.com/training/august/

Paris Web
October 1-3, 2020.
Paris, France
https://www.paris-web.fr/

World Usability Day
November 14, 2020.
Everywhere
https://worldusabilityday.org/


+05: HTML.

WebDev Pro Tip
By Web Axe.
"to make a website accessible, make the code more simple and semantic.
Don't over-complicate code i.e. unnecessarily customizing native
behavior, unnecessarily duplicating content, overuse of ARIA, etc.
#a11y #ariaSerious…"
https://twitter.com/webaxe/status/1254486853282979841


+06: JAVASCRIPT.

Another One-Line NPM Package Breaks the JavaScript Ecosystem
By Catalin Cimpanu.
"An update to tiny 'is-promise' library impacted millions of
JavaScript projects…"
https://www.zdnet.com/google-amp/article/another-one-line-npm-package-breaks-the-javascript-ecosystem/

Gardened
By Ethan Marcotte.
"…Time and again, our industry chooses frameworks that weren't
designed for accessibility or for performance. And in the middle of a
global health crisis, I think it's time we talked about how the tech
industry-an industry responsible for providing life-saving information
and services, now more than ever-can be allowed to self-regulate. If
other industries follow building codes and regulations, why shouldn't
we?"
https://ethanmarcotte.com/wrote/gardened/

What I Wish I Knew About React
By Ire Aderinokun.
"A couple weeks ago I started working on my first React application.
Not only was it my first React application, but it was also my first
React Native application, so a lot was new to me all in one go…
https://bitsofco.de/what-i-wish-i-knew-about-react/

The Beauty of Progressive Enhancement
By Manuel Matuzović.
"…it's beautiful to see which shape an experience can take on
different devices, operating systems, and browsers. Progressive
Enhancement allows us to use the latest and greatest features HTML,
CSS and JavaScript offer us, by providing a basic, but robust
foundation for all. Enabling people who use browsers like Internet
Explorer 11 or Opera Mini to access content is essential. Don't rely
on browser statistics, think about who you're building websites for.
Our users are diverse, just like their physical abilities, personal
preferences, and the devices and browsers they're using."
https://www.matuzo.at/blog/beauty-of-progressive-enhancement/


+07: MISCELLANEOUS.

What is a Resilient Website? with Jeremy Keith (PodCast)
By @ed_the_coder and @thomashazledine.
"This week we're joined by Jeremy Keith, a web developer and author
who's had a massive influence on at least one of our hosts. Jeremy
introduces us to the concept of "resilient" websites, and has loads of
advice for developers new to the field…"
https://aquestionofcode.com/60-what-is-a-resilient-website-jeremy-keith/


+08: NAVIGATION.

Three Key SERP Features: Featured Snippets, People Also Ask, and
Knowledge Panels
By Kate Moran and Cami Goray.
"These elements of search-engine results pages can direct attention,
help people reformulate their queries, and influence users'
information needs."
https://www.nngroup.com/articles/key-serp-features/

Remove "Click Here" From Your Copy
By Eric W. Bailey.
"You might tap, not click. Or press a key. Or vocalize a command. Or
let your gaze dwell. Or nod your head. Or puff some air. Always strive
to disambiguate."
https://twitter.com/ericwbailey/status/1255160136366260229


+09: TOOLS.

WAVE Webinar and Intro Video
By Jared Smith.
"…To help newcomers to WAVE, we have recently released this
introduction video that provides an excellent overview of WAVE and how
to use it in your accessibility testing…"
https://webaim.org/blog/wave-webinar-and-intro-video/

SAS Graphics Accelerator for Google Chrome
Offered by: sas-chrome-admins.
"Enables users with visual impairments or blindness to create,
explore, and share data visualizations…"
https://chrome.google.com/webstore/detail/sas-graphics-accelerator/ockmipfaiiahknplinepcaogdillgoko?hl=en

Accessible Data Visualizations Using SAS Graphics Accelerator (Video)
By Ed Summers.
"…learn how to: 1.) Use Google Maps to create maps that contain points
of interest such as intersections, buildings, bus stops, restaurants,
and non-visual landmarks that facilitate orientation. 2.) Use SAS
Graphics Accelerator to convert those maps into accessible digital
maps that can be explored using non-visual methods. 3.) Share
accessible digital maps via email or publish them on your website…"
https://support.sas.com/accessibility/webinars/2020-3/index.html


+10: TYPOGRAPHY.

Test that Text Sizes and Zooms Correctly
By National Health Service UK.
People use their browser to change the size of content, and people
with low vision may use that to a more extreme level. The guidelines
specify a level of 320 (CSS) px wide. That is equivalent to 400% for a
1280px wide browser.
https://service-manual.nhs.uk/accessibility/development#test-that-text-sizes-and-zooms-correctly

Accessible Font Sizing, Explained
By Andrés Galante.
"The Web Content Accessibility Guidelines (WCAG), an organization that
defines standards for web content accessibility, does not specify a
minimum font size for the web. But we know there's such a thing as
text that is too small to be legible, just as text that can be too
large to consume. So, how can we make sure our font sizes are
accessible…"
https://css-tricks.com/accessible-font-sizing-explained/


+10: USABILITY.

UX Design Glossary: 84 Key Terms To Help You Get Started
By Andrew Wilshere.
"…In the rest of this UX design glossary post, we'll work through some
of the terms the UX designer is likely to encounter in their daily
work. This is part 1 of a 2-part series-next time we'll be covering
some more advanced terminology…"
https://trydesignlab.com/blog/ux-design-glossary-key-terms-getting-started/

Improving UX Writing
By Punam Saxena and Samiksha Chaudhuri.
"To ensure a good user experience, it is essential to design
user-interface text to be accessible to users with different
abilities…"
https://www.uxmatters.com/mt/archives/2020/04/improving-ux-writing.php

Mapping the 'Information' Genome for COVID-19
By Gerry McGovern.
"It's never been more important for people to have speedy access to
the right information…"
https://gerrymcgovern.com/mapping-the-information-genome-for-covid-19/

The User Experience Of Meeting Software
By Jeff Sauro and Jim Lewis.
"…Our most recent 2020 benchmark report, which included meeting
software, concluded at the end of 2019, right before the surge in
usage from the pandemic. In this unusual time, we wanted to see
whether people's attitudes have changed. To find out, we conducted
another benchmark study, this one focused on meeting software…"
https://measuringu.com/meeting-software-2020/


[Section one ends.]


++ SECTION TWO:

+11: 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.]
Reply all
Reply to author
Forward
0 new messages