+++ WEB DESIGN UPDATE. - Volume 19, Issue 36, March 3, 2021. An email newsletter to distribute news and information about web design and development. ++ISSUE 35 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: COLOR. 04: EVALUATION & TESTING. 05: EVENTS. 06: HTML. 07: INFORMATION ARCHITECTURE. 08: JAVASCRIPT. 09: MISCELLANEOUS. 10: TOOLS. 11: USABILITY. 12: WEBWASTE & SUSTAINABILITY. 13: XML. SECTION TWO: 14: What Can You Find at the Web Design Reference Site? [Contents ends.] ++ SECTION ONE: New references. +01: ACCESSIBILITY. Accessible Naming for Screen Reader Compatibility By Alicia Evans. "An accessible name is the programmatic name that assistive technologies use to identify an element on the page to users…" https://knowbility.org/blog/2021/whats-in-a-name/ Much Ado About Captioning Videos with Meryl K. Evans, a Digital Pro Who is Deaf (Video) Meryl's February 25th presentation is now available. https://atlassian.zoom.us/rec/play/eTwIVypW-WWBvwZyywTLzDaQEgIQZmJUc6xDFsBsrUDZfi0SPj1_PHr0484kkIM-jbE5PasabfFUePh5.cxB0T7mWzHZ168ok Would You Publish an Article on Your Website if It has Typos and Other Errors? By Meryl K. Evans. "Before reading on, please post your answer in the comments…" https://www.linkedin.com/posts/activity-6770040460221186048-Xtww Material Design Text Fields Are Badly Designed By Adam Silver. "Where to put the label in a web form? In the early days, we talked about left-aligned labels versus top-aligned labels. These days we talk about floating labels. Let's explore why they aren't a very good idea, and what to use instead…" https://www.smashingmagazine.com/2021/02/material-design-text-fields/ Microsoft Word By WebAIM. "WebAIM's Word article has been significantly updated to reflect accessibility improvements in Office 365." https://webaim.org/techniques/word/ How We Improved the Accessibility of Our Single Page App Menu By Luke Denton. "I recently started working on a Progressive Web App (PWA) for a client with my team…" https://css-tricks.com/how-we-improved-the-accessibility-of-our-single-page-app-menu/ Accessibility on the Clearleft Podcast By Jeremy Kieth. "The latest episode is on a topic close to my heart: accessibility. But I get out of the way early on and let much smarter folks do the talking. In this case, it's a power trio of Laura, Cassie, and Léonie. It even features a screen-reader demo by Léonie…" https://adactio.com/journal/17853 Axe-con: Free, Online Digital Accessibility Conference on March 11-12, 2021 By Deborah Edwards-Onoro. "The inaugural axe-con, an open and inclusive digital accessibility virtual conference hosted by Deque Systems, launches March 10 to 11, 2021 with over 90 speakers from around the world…" https://www.lireo.com/axe-con-digital-accessibility-conference-2021/ Should I Use An Accessibility Overlay? By Michael Spellacy. "The consensus of many people with disabilities, the web design and development community, and legal voices in this space, are that accessibility overlays are not useful on a website for the following reasons…" https://shouldiuseanaccessibilityoverlay.com/ COVID-19 Vaccine Websites Violate Disability Laws, Create Inequity for the Blind By Lauren Weber and Hannah Recht. "Many COVID vaccination registration and information websites at the federal, state and local levels violate disability rights laws, hindering the ability of blind people to sign up for a potentially lifesaving vaccine, a Kaiser Health News investigation has found…" https://www.latimes.com/california/story/2021-02-25/covid-19-vaccine-websites-violate-disability-laws-create-inequity-for-the-blind Accessibility of COVID-19 Vaccine Pages and Barriers to Individuals with Disabilities By Jared Smith. "WebAIM contributed to an article authored by Kaiser Health News and republished in the LA Times regarding the accessibility barriers posed by vaccine registration pages in the US…" https://webaim.org/blog/accessibility-of-vaccine-pages/ Looking Ahead to Potential Developments in Online Accessibility Law By Jason P. Brown. "…This blog will summarize a few developments over the last few years and also forecast some potential developments for the remainder of 2021 and beyond…" https://www.natlawreview.com/article/looking-ahead-to-potential-developments-online-accessibility-law +02: CASCADING STYLE SHEETS. Hiding Content Responsibly By Chris Coyier. "Allow me to do a have a pretend conversation walking through my thought process here…" https://css-tricks.com/hiding-content-responsibly/ Diving into the ::before and ::after Pseudo-Elements By Will Boyd. "The ::before and ::after pseudo-elements are incredibly versatile tools in the CSS toolkit. Understanding them can help you craft practical CSS to solve all sorts of situations. Or you can take things further and use them to create impressive feats of CSS trickery…" https://codersblock.com/blog/diving-into-the-before-and-after-pseudo-elements/ Award-Winning Websites Should Honor the 'reduce motion' Preference By Šime Vidas. "…All these websites are highly dynamic and show full-screen motion on load and during scroll. Unfortunately, such animations can cause dizziness and nausea in people with vestibular disorders. Websites are therefore advised to reduce or turn off non-essential animations via the prefers-reduced-motion media query, which evaluates to true for people who have expressed their preference for reduced motion (e.g., the 'Reduce motion' option on Apple's platforms). None of the winning websites do this…" https://css-tricks.com/weekly-platform-news-reduced-motion-cors-whitehouse-gov-popups-and-100vw/#award-winning-websites-should-honor-the-reduce-motion-preference +03: COLOR. High Contrast Mode and Dark Theme Accessibility Testing By Accessibility at Minnesota IT Services. "Mobile applications and operating systems increasingly use dark themes and high contrast modes. As more options for changing modes, themes, and specific colors have become available, both users of technology and digital accessibility testers are asking the question…" https://mn.gov/mnit/about-mnit/accessibility/news/#/detail/appId/1/id/469250 +04: EVALUATION & TESTING. Nine Words to Watch for When Writing Survey Questions By Jeff Sauro and Jim Lewis. "…In this article, we call attention to nine words that may cause trouble. These aren't necessarily problematic words, but before you use one, you should double-check that it's the best word to unambiguously capture the concept you intend to measure…" https://measuringu.com/nine-watch-words/ Cultural and Linguistic Variables in Usability Testing: A Canadian Evaluation of International Students By Joanie Ouellet, Jin Kang, and Audrey Girouard. "…Our work suggests that researchers should recruit and understand participants from multiple cultural and linguistic backgrounds to ensure the reliability and reproducibility of usability test results and protocols…" https://uxpajournal.org/cultural-linguistic-usability-testing/ User Experience by the Numbers By Chris Kiess. "…What do we minimize when we put metrics in place? Usually, it is the user experience…when we put metrics in place that ultimately alter the user's experience without adequately informing them, it becomes an ethical issue…" https://uxmag.com/articles/user-experience-by-the-numbers Writing an Effective Guide for a UX Interview By Maria Rosala. "Preparing a guide for a user interview ensures that topics relevant to your research questions are covered, and that the interview captures in-depth information about people's lives and needs. https://www.nngroup.com/articles/interview-guide/ +05: EVENTS. Web Day 2021 March 4, 2021. Online https://www.ugidotnet.org/e/1938/Web-Day-2021 Accessible Virtual Reality for People with Limited Mobility March 12, 2021. Online https://www.meetup.com/a11yvr/events/276468858/ Accessibility is Hard, and Other Myths March 17, 2021. Online https://groups.drupal.org/node/536319 How to Determine If A Company Knows About Digital Accessibility? March 18, 2021. Online https://equalentry.com/register-for-how-to-determine-if-a-company-knows-about-digital-accessibility-webinar/ React Finland Vodcast #2 - Accessibility with Nicolas Steenhout, Eeva-Jonna Panula, and Amy Carney March 29, 2021. Online https://react-finland.fi/blog/vodcast-02/ Accessibility Twin Cities March MeetUp March 29, 2021. Online https://www.meetup.com/Accessibility-Twin-Cities/events/275607499/ Review of the Revised 508 Standards (Part II): Requirements for Hardware and Software March 30, 2021. Online https://www.accessibilityonline.org/cioc-508/session/?id=110892 Social Media Accessibility April 5, 2021. Online https://www.csun.edu/universal-design-center/events/social-media-accessibility-1 +06: HTML. HTML Test Cases By Russ Weakley. Russ is running a series of tests on different combinations of screen readers and browsers. So far forms and accessible names are included. https://russmaxdesign.github.io/accessible-forms/index.html The Future of Web Software is HTML-over-WebSockets By Matt E. Patterson. "The future of web app development is taking shape, and it's changing the way we think about server-side app architecture. In this article, Matt E. Patterson shows why a new WebSockets-driven approach is catching developers' attention, and how it can mean faster, easier development that results in an experience just as rich as client-side SPAs." https://alistapart.com/article/the-future-of-web-software-is-html-over-websockets/ The New HTML Element is in Development By Šime Vidas. "On January 21, Melanie Richards from the Microsoft Edge web platform team posted an explainer for a proposed HTML element (the name is not final)…" https://css-tricks.com/weekly-platform-news-reduced-motion-cors-whitehouse-gov-popups-and-100vw/#the-new-html-popup-element-is-in-development +07: INFORMATION ARCHITECTURE. Enhancing Card Sorting Dendrograms Through the Holistic Analysis Of Distance Methods and Linkage Criteria By José A. Macías. "Card sorting has been widely used in information architecture to analyze and improve web content and navigation…" https://uxpajournal.org/card-sort-dendrograms/ +08: JAVASCRIPT. Immutability with Multidimensional Arrays and Objects in Vanilla JS By Chris Ferdinandi. "Yesterday, we learned about immutability with arrays and objects in JavaScript. The approaches we discussed work great for simple arrays and objects. But they have some shortcomings when working with multidimensional arrays and objects. Today, we're going to learn how to address that…" https://gomakethings.com/immutability-with-multidimensional-arrays-and-objects-in-vanilla-js/ Issues with Looping over an Object, the Object.hasOwnProperty() method, and the Object.create() method in Vanilla JS By Chris Ferdinandi. "Last week, Pablo Marques pointed out an issue with my freeze() helper function caused by looping over objects created with Object.create(null). Today, I wanted to look at the issue, the cause, and how to avoid it. Let's dig in…" https://gomakethings.com/issues-with-looping-over-an-object-the-object.hasownproperty-method-and-the-object.create-method-in-vanilla-js/ +09: MISCELLANEOUS. The F-Word: Safari Extensions, Cascading Layers of CSS, What's New in WCAG 3 By Bruce Lawson and Vadim Makeev. "Hello, and welcome to the F-Word. The F-Word of course stands for Front-end. The wonderful world of web development…" https://css-tricks.com/weekly-platform-news-reduced-motion-cors-whitehouse-gov-popups-and-100vw/ +10: TOOLS. Tenon-UI By Karl Groves et. al. "Tenon's accessible React components library…" https://www.tenon-ui.info/ AccessiBe Gone By Stephen Clower. "…How to block the AccessiBe domains…" https://sclower.github.io/accessibegone/ +11: USABILITY. Learning to Recognize Exclusion By Lesley-Ann Noel and Marcelo Paiva. "Who do we exclude unintentionally or intentionally in the work that we do as designers and researchers?…" https://uxpajournal.org/learning-recognize-exclusion/ When Does Iconography Start to Become Useless? By Craig Sullivan. "…Icons can give structure and improve the visual hierarchy of content but if they aren't learned, they are just a fancy bullet point…" https://uxdesign.cc/crimes-of-ux-3-useless-iconography-5bf06ef9fed UX in Scrum (Video) By Anna Kaley. "UX professionals should engage in all Scrum ceremonies. Here are tips for what UX should contribute to stand-ups, backlog refinement, sprint planning, spring review, and retrospectives." https://www.nngroup.com/videos/ux-scrum/ +12: WEBWASTE & SUSTAINABILITY. Moving Beyond the Cult of Volume (Part 2) By Gerry McGovern. "…In digital, we are trapped in a monotonous, relentless process of change for change's sake, of newness that is rarely useful and very often damaging but must be embraced because it's new…I have noticed that over the last year, a number of clients we work with have dumped the hamburgers and gone back to the 'traditional' navigation structure. The result? Better task success rates. There is always something 'new' out there, although few stop to ask the question: 'Is it really better?'…The road to complexity is paved with good intentions, and at a certain point complexity becomes your master. 'We started getting these Frankenstein monsters where we were not sure if we switched it off what would happen,' Liam states. So we produce and add and we never subtract. And so we feed the monster." https://gerrymcgovern.com/moving-beyond-the-cult-of-volume-part-2/ +13: XML. Cistercian SVG By Adrian Roselli. "Compared to the React-powered SVG experiments, which deliver 40 to 60 kilobytes of script over multiple requests to dynamically generate new SVG shapes, this effort is 804 bytes of script to style a 2.1 kilobyte SVG, all over a single request and without requiring the browser to compile a full library. Plus this one is accessible.…" https://adrianroselli.com/2021/02/cistercian-svg.html [Section one ends.] ++ SECTION TWO: +14: 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 WebWaste & Sustainability Information. https://www.d.umn.edu/itss/training/online/webdesign/webwaste.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.]