Web Design Update: June 19, 2018

lcarlson

6/19/18

+++ WEB DESIGN UPDATE.
– Volume 16, Issue 52, June 19, 2018.

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

++ISSUE 52 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: CASCADING STYLE SHEETS.
03: COLOR.
04: EVALUATION & TESTING.
05: EVENTS.
06: HTML.
07: JAVASCRIPT.
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.

Web Content Accessibility Guidelines (WCAG) 2.1 – Recommended
By Alastair Campbell.
“The latest update to the Web Content Accessibility Guidelines (WCAG)
has now been launched and version 2.1 is now the ‘recommended’ version
as of 5th June 2018.…”
https://www.nomensa.com/blog/2018/wcag-21-accessibility-recommended

New Web Content Accessibility Guidelines (WCAG) 2.1 – What, When, How
By Jason Taylor.
“What’s the difference between version 2.1 over 2.0?…”
http://blog.usablenet.com/new-web-content-accessibility-guidelines-wcag-2.1-what-when-how

W3C Updates Website Accessibility Standards
By Klein Moynihan Turco.
“For the past four years, the World Wide Web Consortium (‘W3C’) has
been working to update version 2.0 of the Web Content Accessibility
Guidelines (‘WCAG’) in order to keep pace with rapid developments in
the technology space…”
https://www.lexology.com/library/detail.aspx?g=419a91de-ae97-4036-9e28-1e1af87f6243

What’s New in WCAG 2.1?
By Ricky Onsman.
“WCAG 2.1 was published in its final form in June 2018…”
http://intopia.digital/articles/whats-new-in-wcag-2-1/

WCAG 2.1: What Does It Actually Mean?
By Robert DeLuca.
“Publication as a W3C Recommendation finalizes the development process
and indicates that the W3C considers the updated guidelines ready for
implementation on web content…”
https://frontside.io/blog/2018/06/14/what-is-new-in-wcag-2-1.html

Welcome, WCAG 2.1! The Web Content Accessibility Guidelines get an update.
By Becky Gibson.
“Knowbility welcomes the efforts of the W3C to update WCAG to improve
web accessibility for all. We are pleased to see the new WCAG 2.1
success criteria extend access to areas of disability not covered
before…”
https://knowbility.org/blog/2018/WCAG21-intro/

Smartphone Accessibility 201: Colors, Contrast, and Magnification, Oh My!
By Kara VanRoekel.
“This is article two of a series taking you through mobile
accessibility basics for Android and iPhone to help get you ready to
conduct an accessibility assessment on the mobile device of your
choice…”
https://www.levelaccess.com/part-2-colors-contrast-magnification/

Superior Court Rules Phone Calls, Email are Not Alternatives to an
ADA-Compliant Website
By Buckley Sandler.
“…In addition to awarding $4,000 in statutory damages, the court
issued an injunction to the defendants, ordering them to comply with
Web Content Accessibility Guidelines 2.0 AA to ensure their website is
ADA compliant.”
https://buckleysandler.com/blog/2018-05-31/superior-court-rules-phone-calls-email-are-not-alternatives-ada-compliant-website

BECU will Restore Accessibility for Blind Customers to Its Website and
Mobile Banking App
By Derek Hall.
“The change came after the National Federation of the Blind, its
Washington affiliate and three blind individuals warned they might sue
under the Americans with Disabilities Act and the Washington State Law
Against Discrimination…”
https://www.seattletimes.com/business/becu-will-restore-accessibility-for-blind-customers-to-its-website-and-mobile-banking-app/

+02: CASCADING STYLE SHEETS.

Resilient, Declarative, Contextual
By Keith J Grant.
“…I want to look at three key characteristics of CSS that set it apart
from conventional programming languages: it’s resilient; it’s
declarative; and it’s contextual. Understanding these aspects of the
language, I think, is key to becoming proficient in CSS…”
https://keithjgrant.com/posts/2018/06/resilient-declarative-contextual/

A Comprehensive Guide to Flexbox Alignment
By Anna Monus.
“Alignment is probably the most confusing aspect of flexbox…”
https://webdesign.tutsplus.com/tutorials/a-comprehensive-guide-to-flexbox-alignment–cms-30183

The Firefox Shape Path Editor (Video)
By Jen Simmons.
“…The Firefox Shape Path Editor is a tool you can use in Firefox 62 or
later to help you edit the basic shape in CSS…”

Creating a RevealJS clone with CSS Scroll Snap Points
By Nicolas Hoffmann.
“I wanted to test this CSS module for a long time (and some other
things), I had the opportunity to do it with my slides for Sud Web
2018. Here is a return of experience…”
View at Medium.com

+03: COLOR.

Considering Colour Blindness in UX Design (with five examples)
By Lizzy Hillier.
“Despite it affecting approximately one in 12 men and one in 200
women, colour blindness is often disregarded when designing for
optimum user experience and accessibility…”
https://econsultancy.com/blog/70084-considering-colour-blindness-in-ux-design-with-five-examples/

+04: EVALUATION & TESTING.

The Three Essential Sources of Customer Insight
By Gerry McGovern.
“To truly understand customers it is essential to combine insights
from the following research methods: Quantitative, Observational,
Qualitative…”
http://gerrymcgovern.com/the-three-essential-sources-of-customer-insight/

How to Test Visual Design
By Kathryn Whitenton.
“When evaluating fonts, colors, and other visual details, assess both
aesthetic impressions and behavioral effects.”
https://www.nngroup.com/articles/testing-visual-design/

10 Things to Know About the SUPR-Q
By Jeff Sauro.
“The SUPR-Q (Standardized User Experience Percentile Rank
Questionnaire) is a standardized questionnaire that measures the
quality of the website user experience…”
https://measuringu.com/10-things-suprq/

+05: EVENTS.

Who Teaches About Accessibility in Computing Courses?
June 28, 2018.
Online.
http://easi.cc/clinic.htm

Summer of WCAG 2.1 (Part 2)
July 9, 2018.
Boulder, Colorado, U.S.A.

Summer of WCAG 2.1 (Part 2)

Monday, Jul 9, 2018, 6:00 PM

Boulder Digital Arts
1600 Range Street Boulder, CO

13 Members Went

Summer of WCAG 2.1!! With WCAG 2.1 officially a W3C Recommendation, for the months of June and July, we’ll be breaking up the 17 new WCAG 2.1 success criteria and discussing them as a group. For July we’ll pick up where we left off in June with SC 2.4.1 Character Key Shortcuts and continue on through Input Modalities and Status messages. If you hav…

Check out this Meetup →

Document Accessibility, Part 1: Word Accessibility and PDF
Accessibility, Fundamentals
July 17, 2018.
Austin, Texas, U.S.A.
https://www.microassist.com/instructor-led-training/accessibility-for-document-creators-2/

Putting WCAG 2.1 Into Practice
July 30, 2018.
Minneapolis, Minnesota, U.S.A.

Putting WCAG 2.1 Into Practice

Monday, Jul 30, 2018, 5:30 PM

Code42
100 South Washington Avenue Minneapolis, MN

41 Access Professionals Went

As of this MeetUp, WCAG 2.1 will have been published by the W3C. Thus, we will be continuing our discussion on what’s next with these guidelines. ATC MeetUp member, Billy Tyler, of Optum Health, will be presenting on the topic of extending WCAG beyond 3 digits and also discuss role-based analysis and other extensions to WCAG 2.0. We will then cont…

Check out this Meetup →

Inclusive Design 24 (#ID24)
October 11, 2018.
Online.
https://www.inclusivedesign24.org/

ARIA: What, Why and When
Online.
October 11, 2018.
http://www.accessibilityassociation.org/content.asp?contentid=520

Interact London
October 17, 2018.
London, England, United Kingdom
https://2018.interactconf.com/

World Usability Congress
October 17-18, 2018.
Graz, Austria
https://worldusabilitycongress.com/

+06: HTML.

Anatomy of Accessible Forms! Placeholder is a Mirage
By Raghavendra Satish Peri.
“…we will see why using a placeholder is not great from the
accessibility stand & what needs to be done to use a placeholder
attribute successfully…”
https://www.digitala11y.com/anatomy-of-accessible-forms-placeholder-is-a-mirage/

+07: JAVASCRIPT.

Hiding Complexity Through JavaScript Show/Hide Elements
By Tom Johnson.
“Principle: If you can’t delete information to reduce complexity, look
for ways to hide less-used information on the screen through
JavaScript techniques, such as show/hide elements, expand/collapse
toggles, navtabs, tooltips, and more…”
http://idratherbewriting.com/simplifying-complexity/hiding-complexity.html

+08: NAVIGATION.

5 Steps for Effective Diary Studies in Customer Journey Research (Video)
By Kim Flaherty.
“Diary studies are a longitudinal research method used to understand
user interactions at different touchpoints, which is especially useful
for omnichannel user research. Participants record their reactions as
experiences unfold throughout the customer journey. ”
https://www.nngroup.com/videos/5-steps-diary-studies/

Show Me the Way to Go Anywhere – Navigation for Mobile Applications
By Interaction Design Foundation.
“It doesn’t matter how great the functions and content, that your
mobile apps serve, are – if your user can’t find them, they aren’t
going to contribute to a great user experience…”
https://www.interaction-design.org/literature/article/show-me-the-way-to-go-anywhere-navigation-for-mobile-applications

+09: TOOLS.

Color Tool
By Material Design.
Create, share, and apply color palettes to your UI, as well as measure
the accessibility level of any color combination.
https://material.io/tools/color/

+10: TYPOGRAPHY.

Golden Rules of Typography on the Web
By Richard Rutter.
“Typography is what comes between the author and the reader. This is
as true on the web as it is in any other medium. If a text has
anything at all significant to say, it needs a typographer’s care,
which will in turn be repaid by the reader’s attention. If you design
websites or use CSS then you are a typographer whether you know it or
not…”
https://noti.st/rar/mz1rIY

+11: USABILITY.

Personalization versus Customization (Video)
By Lexie Martin.
“Users expect that the content they see will be relevant to their
individual needs. Personalization and customization are techniques
that can help you ensure that users see what matters to them.”
https://www.nngroup.com/videos/personalization-customization/

The Impact of Voice in UX Design: And What To Do About It
By Jolina Landicho.
“…for web and application designers, voice interaction represents,
perhaps, the biggest UX challenge since the dawn of the touchscreen
age…”
http://www.uxbooth.com/articles/impact-of-voice-in-ux-design/

How You Can Aid User Scanning by Using Eyebrow Headlines
By Anthony Tseng.
“An eye-tracking study found that most users don’t read entire
headlines. Instead, they scan the left sides of headlines and only
read the first few words…”
http://uxmovement.com/content/how-you-can-aid-user-scanning-by-using-eyebrow-headlines/

My Head Hurts! Cognitive Friction in the Age of Mobile
By Interaction Design Foundation.
“…Cognitive friction occurs when the cues don’t match our
expectations. Learning to avoid cognitive friction in UI design can
help make the user experience (UX) of products greater…”
https://www.interaction-design.org/literature/article/my-head-hurts-cognitive-friction-in-the-age-of-mobile

Experiments in Loading – How Long Will You Wait?
By Ian Tate.
“…Despite some individual variation, novel loaders as a whole had a
higher wait time and lower abandon rate than generic ones…”
https://www.viget.com/articles/experiments-in-loading-how-long-will-you-wait/

[Section one ends.]

++ SECTION TWO:

+12: 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.]

Advertisements
Web Design Update: June 19, 2018

Leave a Reply

Please log in using one of these methods to post your comment:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s