+++ WEB DESIGN UPDATE.
- Volume 18, Issue 36, March 6, 2020.

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

++ISSUE 36 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: DRUPAL.
04: EVALUATION & TESTING.
05: EVENTS.
06: HTML.
07: JAVASCRIPT.
08: MISCELLANEOUS.
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.2 in Development
By Alastair Campbell.
"The Accessibility Guidelines Working Group (AG WG) is happy to announce the First Public Working Draft of the Web Content Accessibility Guidelines (WCAG) 2.2…"
https://www.w3.org/blog/2020/02/wcag-22-in-development/

Decoding Label and Name for Accessibility
By WebAIM.
"…If you follow these principles closely, your websites will be much more screen reader and voice control friendly for users."
https://webaim.org/articles/label-name/

Focus Management Still Matters
By Sarah Higley.
"The fix is easy: always manage focus when you remove the active element from the DOM…"
https://sarahmhigley.com/writing/focus-navigation-start-point/

5 Things You Need to Know About Manual Accessibility Testing with the Keyboard and Screen Readers
By Madalyn Rose Parker.
"1. Keyboard testing is vital in ensuring a site is accessible…"
https://dev.to/madalynrose/5-things-you-need-to-know-about-manual-accessibility-testing-with-the-keyboard-and-screen-readers-3512

Missing Form Label - Site Search Example
By Jay Pope.
"…"Real world example on the Missing Form Label Error found on a site search form and possible solution…"
https://blog.pope.tech/2020/02/28/missing-form-label-search/

Why Accessibility is an Important Part of Customer Experience (CX)
By Alastair Campbell and Alex Metcalf.
"…what is digital accessibility at its core? What is it without discussing its benefits such as SEO improvements, development savings and legal risk management?…"
https://www.nomensa.com/blog/2020/why-accessibility-important-part-customer-experience-cx

Accessibility Matters - Minnesota IT Services (Video)
By Minnesota IT Services.
"We have all been presented with physical barriers. Have you ever thought about how digital barriers affect us?…"
https://www.youtube.com/watch?v=9dypgQOjV6I

Map Accessibility 
By Minnesota IT Services.
"…Maps tell a story. They tell us where we are, where we've been, and where we are going. Proper planning and design can make your story accessible to a wider audience…"
https://mn.gov/mnit/about-mnit/accessibility/maps/

Introduction to Creating Accessible Documents - Session 1 of 3 (Video and presentation materials)
By Shawn Wright.
"…In Part 1, we will cover introductory background information that can help you ensure accessibility when creating documents…"
https://idahotc.com/Resources/View/ID/636

6 Tips for Accessibility in Microsoft Word
By Lyssa Prince.
"You never know when an individual may need to read your documents with assistive technology (AT) such as a screen reader or an electronic braille device. That's why it's important to make all your documents accessible from the start. Luckily, Microsoft Word includes easy-to-use tools to increase access and readability for all…"
https://www.youtube.com/watch?v=CAoHFENiY4E
Lyssa's slides:
https://www.okabletech.org/wp-content/uploads/2019/01/6TipsWordAccessibility.pdf

PWAC + OZeWAI 2020 Conference Highlights
By Scott Hollier.
"This year the Perth Web Accessibility Camp hosted Australia's national accessibility conference OZeWAI to bring a fantastic combined event in my home city of Perth for the first time. Here's some of my personal highlights…" 
https://www.hollier.info/pwac2020/

State Websites Show Dozens of Accessibility Errors, May Violate Americans with Disabilities Act
By Amy Reid.
"Many Wisconsin state agency websites may be out of compliance with the Americans with Disabilities Act…'I really want to know, what are they going to do to serve people who need access now and can't wait six months to apply for a job'…"
https://www.channel3000.com/state-websites-show-dozens-of-accessibility-errors-may-violate-americans-with-disabilities-act/


+02: CASCADING STYLE SHEETS.

10 Ways to Hide Elements in CSS
By Craig Buckler.
"There are multiple ways to hide an element in CSS, but they differ in the way they affect accessibility, layout, animation, performance, and event handling.…"
https://www.sitepoint.com/hide-elements-in-css/

Responsive Grid Magazine Layout in Just 20 Lines of CSS 
By Keir Watson.
"…I want to make the grid do both: create a fully responsive fluid layout that includes responsively resizing multi-column elements as well…"
https://css-tricks.com/responsive-grid-magazine-layout-in-just-20-lines-of-css/

Negative Margins in CSS
By Peter-Paul Koch.
"I'm writing the Box Model chapter of the new book and came to the point where I had to treat negative margins. To my surprise, I found that there is no systematic treatment of negative margins anywhere. So I had to figure it out for myself. Below is my initial draft of the negative margin section…"
http://www.quirksmode.org/blog/archives/2020/02/negative_margin.html

Why is CSS Frustrating?
By Robin Rendle.
"Here's a great thread by Kevin Powell that's making the rounds. He believes so many folks see CSS as a frustrating and annoying language…"
https://css-tricks.com/why-is-css-frustrating/

Why Are We Talking About CSS4?
By Rachel Andrew.
"Around the web and within the CSS Working Group, there has been some discussion about whether we should specify a version of CSS - perhaps naming it CSS4. In this article, Rachel Andrew rounds up some of the pros and cons of doing so, and asks for your feedback on the suggestion."
https://www.smashingmagazine.com/2020/03/css4-pros-cons-discussion/

CSS Specification Timelines, Updated and Modernized
By Eric A. Meyer.
"Back in 2011, I decided to make a timeline out of CSS modules' version histories, where 'version history' means 'a list of all the various drafts that were published'…"
https://meyerweb.com/eric/thoughts/2020/03/03/css-specification-timelines-updated-and-modernized/


+03: DRUPAL.

A Sure-Fire Migration Approach to Drupal 8
By Matt Davis.
"A  good migration to Drupal 8 means you understand your Drupal 7 site very well so you know what to migrate over and what to avoid. That's the real key to success…"
https://www.thirdandgrove.com/insights/sure-fire-migration-approach-drupal-8/


+04: EVALUATION & TESTING.

3 of 5 Users or The Majority of Users?  (Video)
By David Travis.
"I answer the question, "When reporting the results of a usability test, should I say, '3 of 5 users experienced the problem' or 'The majority of users experienced the problem'?""
https://www.youtube.com/watch?v=mj1cL2S5fnw

What Does Good Discovery Research Look Like? (Video)
By David Travis.
"I answer the question, "I'm a product owner and I don't know a great deal about user research. I have a user researcher on the team who's doing Discovery research for us. He seems competent - but how do I know if his work is any good?""
https://www.youtube.com/watch?v=YXcm6csLAAY

Are you a Positivist or an Interpretivist User Researcher? (Video)
By David Travis.
"Do you believe that…"
https://www.youtube.com/watch?v=lB08VIaWGR8

Practices and Challenges of Using Think-Aloud Protocols in Industry: An International Survey
By Mingming Fan, Serina Shi, and Khai N. Truong.
"…UX practitioners often deal with the tension between validity and efficiency in their analysis and demand better fast-paced and reliable analysis methods than merely reviewing observation notes or session recordings…"
http://uxpajournal.org/practices-challenges-think-aloud-protocols-survey/

Cumulative and Combined: Analyzing Methods Use in a Human-Centered Design Mature Company
By Kaisa Savolaine and Sampsa Hyysalo.
"…This paper has investigated in detail the HCD methods usage in a company with a long and successful history of using HCD. The analysis of the method mixes of the company and its key individual employee profiles has been used to clarify how information about past and present users have been oriented to influence design and R&D activities…"
http://uxpajournal.org/methods-use-human-centered-design-company/

Usability Testing Questions: Tips & Examples
By Marina Yalanska.
"…In this article, we'll explore some guidelines for asking the right user testing questions (with examples along the way)…"
https://xd.adobe.com/ideas/process/user-testing/usability-testing-questions-tips-examples/

Things to Consider When Doing Usability Testing with Disabled People
By Peter van Grieken.
"Throughout the years, I've conducted several usability tests with disabled people. They are not only a great way to evaluate the accessibility of the interface, but they can also help to grow awareness of accessibility within the design and development team…"
https://frozenrockets.nl/articles/en/user-testing-with-disabled-people

Three Questionnaires for Measuring Voice Interaction Experiences
By Jim Lewis and Jeff Sauro.
"…In this article, we discuss the history and psychometric properties of the Mean Opinion Scale (MOS), the Subjective Assessment of Speech System Interfaces (SASSI), and the Speech User Interface Service Quality (SUISQ)…"
https://measuringu.com/voice-interaction/


+05: EVENTS.

Introduction to Accessibility in Adobe PDF, March 24, 2020.
Basics of Remediating an Inaccessible PDF, April 21, 2020.
Accessible Tables in PDF, May 19, 2020.
Accessible PDF Forms, June 16, 2020. 
Online
https://www.at3center.net/repository/callswebinars

Hands on Training Accessibility Testing Workshop
April 2, 2020.
Online
https://knowbility.org/services/training/hands-on-training-accessibility-testing-workshop/

AHEAD 2020, Equity and Excellence International Conference
July 20-24, 2020.
Palm Desert, California, U.S.A.
https://www.ahead.org/events-programming/conferences/2020-equity-and-excellence

DevOps MSP
August 6-7, 2019. 
Minneapolis, Minnesota, U.S.A.
http://www.devopsmsp.org/


+06: HTML.

Why the GOV.UK Design System Team Changed the input Type for Numbers
By Hanna Laakso.
"…Although we have user research from 2017 that didn't flag any major issues with <input type='number'>, we identified many usability problems with this input type…"
https://technology.blog.gov.uk/2020/02/24/why-the-gov-uk-design-system-team-changed-the-input-type-for-numbers/

Inclusive Inputs
By Oscar Braunert.
"An exploration into how to make inputs more accessible…"
https://www.ovl.design/text/inclusive-inputs/

HTML: The Inaccessible Parts
By Dave Rupert.
"…I'm going to start rounding up those HTML shortfalls in this here post as a little living document that I can personally reference every time I write some HTML…"
https://daverupert.com/2020/02/html-the-inaccessible-parts/

5 Ways to Improve Table Accessibility
By Rachele DiTullio.
"I recently came across this example of an HTML table that was marked up correctly, for the most part, but lacked some of the important coding nuances needed to make a table truly accessible."
https://www.fishyux.com/2020/03/5-ways-to-improve-table-accessibility/

Stop Using 'Drop-down'
By Adrian Roselli.
"…Stop using the word drop-down. Instead choose a term that accurately describes the control you want…"
https://adrianroselli.com/2020/03/stop-using-drop-down.html

More Accessible Defaults, Please!
By Hidde de Vries.
"Useful HTML elements like date inputs and <video> could make the web a much better place, if browser accessibility bugs in their implementations were prioritized…"
https://hiddedevries.nl/en/blog/2020-03-01-more-accessible-defaults-please

A Basic HTML5 Template For Any Project
By Louis Lazaris.
"As you learn HTML5 and add new techniques to your toolbox, you're likely going to want to build yourself a boilerplate from which you can begin all your HTML5-based projects. We encourage this, and you may also consider using one of the many online sources that provide a basic HTML5 starting point for you."
https://www.sitepoint.com/a-basic-html5-template/


+07: JAVASCRIPT.

Cheat Sheet: Classes in Plain JavaScript  
By Axel Rauschmayer.
"…This section is a cheat sheet for class definitions in plain JavaScript…"
https://2ality.com/2020/03/class-definitions-typescript.html#cheat-sheet%3A-classes-in-plain-javascript


+08: MISCELLANEOUS.

The Markup.
By Julia Angwin.
"Big tech is watching you. We're watching big tech…"
https://themarkup.org/

Web Browser Privacy: What Do Browsers Say When They Phone Home? (PDF)
By Douglas J. Leith.
"We measure the connections to backend servers made by six browsers: Google Chrome, Mozilla Firefox, Apple Safari, Brave Browser, Microsoft Edge and Yandex Browser, during normal web browsing. Our aim is to assess the privacy risks associated with this back-end data exchange.  We find that the browsers split into three distinct groups from this privacy perspective. In the first (most private) group lies Brave, in the second Chrome, Firefox and Safari and in the third (least private) group lie Edge and Yandex…"
https://www.scss.tcd.ie/Doug.Leith/pubs/browser_privacy.pdf

Manage Your Privacy Settings: Links to Devices and Popular Services
By Deborah Edwards-Onoro. 
"…With the National Cyber Security Alliance privacy policy links for common devices and online services, it was a lot faster for me to review and update privacy policy settings on my accounts…"
https://www.lireo.com/manage-your-privacy-settings-links-to-devices-and-popular-services/

Brave Browser and the Wayback Machine
By Mark Graham.
"Working together to help make the Web more useful and reliable…"	
https://blog.archive.org/2020/02/25/brave-browser-and-the-wayback-machine-working-together-to-help-make-the-web-more-useful-and-reliable/

Speaker's Story: Bruce Lawson, HTML5 Spec Editor and Musician
By Karl Hughes.
"…Read on to hear about Bruce's wide-ranging experience from music to acting to accessibility, and some of his tips for new speakers…"	
https://www.cfpland.com/blog/speaker-bruce-lawson/


+09: TOOLS.

Google Lighthouse (FireFox Extension)
By Google.
"Lighthouse is an open-source, automated tool for improving the performance, quality, and correctness of your web apps…"
https://addons.mozilla.org/en-US/firefox/addon/google-lighthouse/


+10: TYPOGRAPHY.

The Typeface with Parkinson
Creative director Morten Halvorsen.
"My mother was diagnosed with Parkinson's eight years ago. And her handwriting has changed in the years since. I created this font to preserve her handwriting, and enable her to continue to write with her own letters."
https://writewithparkinsons.com/

Cross-Cultural Design
By Senongo Akpem.
"…What I would like to do, however, is examine some of the ways culture and identity influence our perception of type and what typographic choices designers can make to help create rich cross-cultural experiences…"
https://alistapart.com/article/cross-cultural-design/


+11: USABILITY.

Dualities of User Experience (Video Keynote)
By Jakob Nielsen.
"Many issues in the user-experience field don't have a simple answer. Rather there's a tension between two good answers that are often polar opposites. Both extremes can be useful perspectives, and both have their advocates when people debate UX. How do we resolve these differences? This was Jakob Nielsen's keynote at the UX Conference in Las Vegas."
https://www.nngroup.com/videos/dualities-user-experience/

Stop Using Material Design Text Fields
By Matsuko Friedland.
"I recently started working on a project built with Google's Material Design UI library, and noticed quite a few usability and accessibility issues…"
https://www.matsuko.ca/blog/stop-using-material-design-text-fields/

Slips vs. Mistakes (Video)
By Aurora Harley.
"User errors while using computers take two forms: slips (right intent, wrong action) and mistakes (wrong intent). Understanding the differences between the types of user error will help you design to prevent or minimize these problems."
https://www.nngroup.com/videos/slips-vs-mistakes/

Usability Diverges, Media Converges, Design Remerges
By Gilbert Cockton.
"…UX work does not need to diverge further into design territory that is already productively occupied. It needs to remerge with strategic, creative, critical design practices. UX does not need to up its game-instead it needs to work with other design roles to up a shared game."
http://uxpajournal.org/usability-media-design/

5 Principles of Visual-Design in UX
By Kelley Gordon.
"The principles of scale, visual hierarchy, balance, contrast, and Gestalt not only create beautiful designs, but also increase usability when applied correctly."
https://www.nngroup.com/articles/principles-visual-design/

CX vs. UX (Video)
By Kim Flaherty.
"Customer Experience (CX) and User Experience (UX) are two common terms that mostly mean the same thing, but have different connotations. Whatever your preferred term, it's important to consider design at 3 levels of experience."
https://www.nngroup.com/videos/cx-vs-ux/

Why 543 KBs Keep me Up at Night
By Manuel Matuzovic. 
"The question how good good enough is and at which point a website is ready to go online is keeping me busy lately. The web is in bad shape and it's because we're making it too easy on ourselves. 'It's online and works in most browsers' is not enough - we have to be much more considerate of what we're putting online…"
https://www.matuzo.at/blog/why-543kb-keep-me-up-at-night/


[Section one ends.]


++ SECTION TWO:

+12: 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:lcarlson@d.umn.edu 


[Issue ends.]