Web Design Update: November 18, 2020

[Laura Carlson]

+++ WEB DESIGN UPDATE.
- Volume 19, Issue 21, November 18, 2020.

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

++ISSUE 21 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: INFORMATION ARCHITECTURE.
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.

Your First Attempt at Making Anything Accessible Will Be Awful
By Sheri Byrne-Haber.
"Don't use this as an excuse. Even awful is better than 98 % of what
other people are doing…"
https://sheribyrnehaber.com/your-first-attempt-at-making-anything-accessible-will-be-awful/

Plain Language Writing - An Essential Part of Accessibility
By Andrew Pulrang.
"…An important way to provide greater cognitive accessibility is to
use 'Plain Language' writing. Here is an example of an original text,
followed by a Plain Language version…"
https://www.forbes.com/sites/andrewpulrang/2020/10/22/plain-language-writing---an-essential-part-of-accessibility/

ProPublica Experiments with Ultra-Accessible Plain Language in Stories
About People With Disabilities
By Sarah Scire.
"ProPublica's plain language experiment is a first for a mainstream
news organization. Disability experts say it shouldn't be the last…"
https://www.niemanlab.org/2020/11/propublica-experiments-with-ultra-accessible-plain-language-in-stories-about-disabilities/

Inclusive Design for Social Media: Tips for Creating Accessible Channels
By Katie Sehl.
"Inclusive design may seem like the domain of UX designers and web
developers. But social media marketers should practice it, too…"
https://blog.hootsuite.com/inclusive-design-social-media/

Using Alt Text to Make Science Twitter More Accessible for People with
Visual Impairments
By Domenico Chiarella, Justin Yarbrough, and Christopher A. L. Jackson.
"Scientists increasingly post images and photos on social media to
share their research activities. However, posting images and photos
could potentially exclude people with visual impairments. Here, we
outline actions that should be taken to foster accessibility and
inclusion in posting scientific images on social media…"
https://www.nature.com/articles/s41467-020-19640-w

WCAG 3.0 Progress
By Alastair Campbell.
Slides from Alastair's TechShare Pro presentation.
https://www.w3.org/2020/Talks/11-Techshare-AC/

Re: Help Please with Tagging Acronyms for Screenreaders
By Léonie Watson.
"The best thing to do is nothing. Screen readers use the same
heuristics as humans do to determine how to speak acronyms - and it
works…"
https://lists.w3.org/Archives/Public/w3c-wai-ig/2020OctDec/0047.html

accessiBe Options Weirdness (Video)
By Karl Groves.
"This quick video shows UX and accessibility issues with the accessiBe
product, including clear and obvious violations of the WCAG standard…"
https://www.youtube.com/watch?v=6gxyRl4CMf8


+02: CASCADING STYLE SHEETS.

How to Easily Understand Flexbox CSS - (Part 1)
By Alan Montgomery.
"In this mini-series, I will be taking you through how to use flexbox
CSS, in a simple, easy to understand way…"
https://blog.alanmontgomery.co.uk/how-to-easily-understand-flexbox-css-part-1

A Deep Dive Into CSS Grid minmax()
By Ahmad Shadeed.
"…In this article, we will deep dive into the minmax(), learn how,
when, and why to use it. At the end of the article, I expect that you
will have a complete understanding of it. Let's dive in…"
https://ishadeed.com/article/css-grid-minmax/

A Complete Guide to CSS Gradients
By Geoff Graham.
"Like how you can use the background-color property in CSS to declare
a solid color background, you can use the background-image property
not only to declare image files as backgrounds but gradients as well…"
https://css-tricks.com/a-complete-guide-to-css-gradients/


+03: EVALUATION & TESTING.

How to Use an Affinity Diagram to Organize UX Research
By User Testing.
"When it comes to categorizing information, nothing is obvious. The
way you perceive one bit of information can (and often will) differ
from the next person. Why? Well, explaining that is difficult because
it's a bit like trying to explain how your brain works. Rather than
getting to the bottom of neurons and synapses, UX researchers came up
with a method for categorizing and sorting information using an
affinity diagram, called affinity mapping…"
https://www.usertesting.com/blog/affinity-mapping

Are Sliders More Sensitive than Numeric Rating Scales?
By Jeff Sauro and Jim Lewis.
"Sliders are a type of visual analog scale that can be used for online
surveys including our MUIQ platform…"
https://measuringu.com/are-sliders-more-sensitive/


+04: EVENTS.

Blue Beanie Day
November 30, 2020.
Global
https://en.wikipedia.org/wiki/Blue_Beanie_Day

Practical Tips for Accessible Content and Multilingual Websites
December 3, 2020.
Online
https://digital.gov/event/2020/12/03/practical-tips-for-accessible-content-and-multilingual-websites/

The CSS Layout Masterclass with Rachel Andrew
@rachelandrew
February 16-17, 2021.
Online
https://smashingconf.com/online-workshops/workshops/rachel-andrew-feb

DevNexus Professional Developers Conference
February 17, 2021.
Online
https://devnexus.com/

DeveloperWeek
February 18-19, 2021.
Online
https://www.developerweek.com/

ConFoo Montreal
February 24-26, 2021
Montreal, Canada
https://confoo.ca/en

World IA Day
February 27, 2021.
Global
https://www.worldiaday.org/

36th CSUN Assistive Technology Conference
March 8-12, 2021.
Online
https://www.csun.edu/cod/conference/sessions/

Axe-con
March 10-11, 2021.
Online
https://www.deque.com/axe-con/


+05: HTML.

Front End Devs - Learn And Understand HTML
By Nicolas Steenhout.
"Then you'll avoid this:
<div role="button" tabindex="-1">
And you won't have to wonder why you can't tab to the fake button.…Use
native HTML instead. I swear, it'll be simpler, and you won't have
code bloat, and you'll get a BUNCH of "free" accessibility built-in.
<button>
Unless it goes somewhere. Then use a link (<a href="">)"
https://twitter.com/vavroom/status/1326604969311498241

My Resume
By Steve Faulkner.
"…the devil is in the <details>…"
https://cdpn.io/stevef/debug/dyGeywr

Upgrade Your HTML II: 10 More Examples to Improve Your Markup (PDF)
By Jens Oliver Meiert.
A sample chapter "Cut the Fat" from the book "Upgrade Your HTML II: 10
More Examples to Improve Your Markup" is available.
http://samples.leanpub.com/upgrade-your-html-2-sample.pdf


+06: INFORMATION ARCHITECTURE.

Remote Card Sorting (Video)
By Katie Sherwin.
"5 steps for conducting a card sorting study remotely, to discover how
users group items together. This is useful when designing your IA."
https://www.nngroup.com/videos/remote-card-sorting/


+07: JAVASCRIPT.

The Lean Web (Video)
By Chris Ferdinandi.
Chris' WordCamp Los Angeles 2020 presentation. "The web in 2020 is a
bloated and over-engineered mess! Many modern web development 'best
practices' are making the web worse. This thought-provoking talk
shares ideas on how to fix the problem as it explores an alternate set
of best practices."
https://wordpress.tv/2020/10/29/chris-ferdinandi-the-lean-web/

Converting the React Todo App Demo to Vanilla JS
By Chris Ferdinandi.
"Over the last few weeks, I’ve been converting jQuery plugins and Vue
components into vanilla JS, and recording myself in the process.
Today, I wanted to try doing the same thing with one of the React demo
apps…"
https://gomakethings.com/converting-the-react-todo-app-demo-to-vanilla-js/

JavaScript-Still a Ghost
By Paul Kinchla.
"…In this post I am going to expand on the ideas of progressive
enhancement I wrote about in JavaScript is a Ghost and hopefully
convince you that JavaScript frameworks and web pages that work
without JavaScript not only are not at odds, but can actually
compliment each other well…"
https://paulkinchla.com/blog/javascript-still-a-ghost/

Web Development for Beginners - A Curriculum
By Azure Cloud Advocates at Microsoft.
"Azure Cloud Advocates at Microsoft are pleased to offer a 12-week,
24-lesson curriculum all about JavaScript, CSS, and HTML basics. Each
lesson includes pre- and post-lesson quizzes, written instructions to
complete the lesson, a solution, an assignment and more. Our
project-based pedagogy allows you to learn while building, a proven
way for new skills to 'stick'…"
https://github.com/microsoft/Web-Dev-For-Beginners

Does WAI-ARIA Even Work with WebXR?
By Thomas Logan.
"Roland Dubois and I recently started weekly meetings where we are
working collaboratively to investigate and advance the state of
accessibility in Web XR experiences.…"
https://equalentry.com/does-aria-even-work-with-webxr/


+08: MISCELLANEOUS.

The JAWS Song (Video)
By Texas School for the Blind and Visually Impaired Short Term
Programs, Kat Heitman, Eva VanHouten, and the Spinrockers.
https://library.tsbvi.edu/Player/B1Ahi3Dc

How Thousands of People With Disabilities Shape the Technology You
Probably Use Every Day
By Vanessa Ho.
"You may not know Eugene Flaherty, an IT expert in Massachusetts who
loves science fiction and has cerebral palsy, or Anne McQuade, a
former software tester in Georgia who runs two book clubs and has low
vision. Maybe you don't know anyone who has called the Microsoft
Disability Answer Desk or is known as a 'Trusted Tester.'…"
https://news.microsoft.com/features/how-thousands-people-disabilities-shape-technology-you-probably-use-every-day/

How to Boost SEO with Podcast Transcription
By Claire Sanford.
"…Transcription offers your listeners the best of audio and written
content. It makes your content more accessible and improves your
site's Google Search rankings. Let's look into the importance of SEO
and how you can use podcast audio transcription to boost SEO…"
https://www.rev.com/blog/how-to-boost-seo-with-podcast-transcription

Moving Fast Breaks Things
By Gerry McGovern.
"In the physical world, there are certain speed limits beyond which
there is a huge jump in energy requirements and a major jump in
dangers for humans…"
https://gerrymcgovern.com/moving-fast-breaks-things/


+09: TOOLS.

Easy Chirp Announcement
By Dennis Lembrée.
"I regret to announce that the Easy Chirp app is no longer being
maintained. It was a great run. Cheers, Dennis… My code on GitHub is
now public…"
https://twitter.com/EasyChirp/status/1328033101587521536

Mortise: Pushing Issues into Jira (Video)
By Karl Groves.
This quick video is a demonstration of a new feature from the Mortise
Accessibility Assurance Platform: Exporting issues into Jira…"
https://www.youtube.com/watch?v=qfKqBAnDg3o

CSS Stats
By Adam Morse, Brent Jackson, John Otander, et al.
"Writing CSS is hard, especially at scale. CSS Stats provides
analytics and visualizations for your stylesheets. This information
can be used to improve consistency in your design, track performance
of your app, and diagnose complex areas before it snowballs out of
control…"
https://cssstats.com/


+10: TYPOGRAPHY.

The Reason Comic Sans is a Public Good
By Drake Baer.
"…Interestingly, it's the idiosyncrasy of Comic Sans that makes it accessible…"
https://www.thecut.com/2020/08/the-reason-comic-sans-is-a-public-good.html


+11: USABILITY.

How to Write Microcopy That Improves the User Experience
By Betsy Mikel.
"The small bits of copy you see sprinkled throughout apps and websites
are called microcopy. As content designers, we think deeply about what
each word communicates…"
https://blog.mozilla.org/ux/2020/11/how-to-write-microcopy-that-improves-the-user-experience/

Return Users to the Same Place in the Product List When Returning from
the Product Page (13% Don't)
By Mark Crowley.
"…Returning users to the same place in the product list on returning
from the product details page, therefore, speeds up product finding,
and is particularly helpful to mobile users. Finally, it's one of the
recommended ways to support 'Back' button use and has widespread
support across our benchmark sites, making it a 'web convention' users
have come to expect - breaking this expectation makes a site seem
especially 'clunky' or hard to navigate for users."
https://baymard.com/blog/return-same-place

UX Win: Digital.gov Online Event Confirmation Message
By Deborah Edwards-Onoro.
"…What event organizers can do: follow Digital.gov's example by
providing specific details in the confirmation message on when
attendees will receive the details…"
https://www.lireo.com/ux-win-digital-gov-event-confirmation-message/

Abandoning Best Practices in UX (Video)
By Jakob Nielsen.
When should one abandon best practices in user experience, and what
does it take to declare that something is a best practice?
https://www.nngroup.com/videos/abandoning-best-practices-ux/

The Cognitive Overload Happening on Your Screen Right Now
By Michal Malewicz.
"How app icons are fighting for our lower attention spans…"
https://uxdesign.cc/the-cognitive-overload-happening-on-your-screen-right-now-deee2a913393

3 Steps for Getting Started with DesignOps
By Kate Kaplan.
"Treat your goal to implement DesignOps like a design problem: Collect
evidence that demonstrates where the true design-team challenges lie
and align DesignOps efforts accordingly."
https://www.nngroup.com/articles/start-designops/


[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:lcar...@d.umn.edu


[Issue ends.]