+++ WEB DESIGN UPDATE. - Volume 22, Issue 25, December 13, 2023. An email newsletter to distribute news and information about web design and development. ++ISSUE 25 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. 12: WEBWASTE & SUSTAINABILITY. SECTION TWO: 13: What Can You Find at the Web Design Reference Site? [Contents ends.] ++ SECTION ONE: New references. +01: ACCESSIBILITY Not All Screen Reader Users Are Blind By Martin Underhill. "There's a common misconception that everyone who uses screen reader software is blind…" https://www.tempertemper.net/blog/not-all-screen-reader-users-are-blind Accessibility-Specific Tech Requirements? It Depends! By Nic Steenhout. "There are so many 'moving parts' to accessibility that it's hard to define specific technical requirements…" https://nicsteenhout.substack.com/p/accessibility-specific-tech-requirements It Depends, Indeed By Eric Eggert. "…We're partners in making a product accessible, and when we say 'it depends', we don't mean 'it is impossible to know', but 'let's figure out how we can fix this most efficient, together'…" https://yatil.net/blog/it-depends-indeed A Beginner's Guide to Accessible Text By Whitney Lewis. "Text makes up the entire web. How you write and format your text can make it more readable for everyone and more accessible for people with disabilities. Some text accessibility issues include underlined text, justified text, and very small text. Each of these is easy to avoid and fix." https://blog.pope.tech/2023/12/07/accessible-text/ Understanding SC 2.5.8 - Target Size (Minimum) By Sathish Kumar. "…The intent of this success criterion is to ensure the target of any UI element has 24 by 24 CSS PX target size or there is enough spacing provided between two targets that have undersize targets…" https://www.digitala11y.com/understanding-sc-2-5-8-target-size-minimum/ WCAG 2.2: What You Need to Know By AbiltyNet. "…This blog covers key changes in 2.2, considerations moving forward and how to comply with WCAG 2.2 guidelines…" https://abilitynet.org.uk/news-blogs/wcag-22-what-you-need-know The PDF Accessibility Checker: Strengths and Weaknesses By Alexander Lehner. "…are PDFs also accessible? The short answer: It depends…" https://www.oidaisdes.org/pdf-accessibility-checker.en/ Insights: Mobile Accessibility By Fable. "…We asked assistive technology users to choose the three barriers that cause them the most challenges on mobile devices. The most frequently mentioned accessibility barriers involve buttons and links. The top responses were…" https://makeitfable.com/insights/insights-mobile-accessibility/ Advancing Web Accessibility: A Guide to Transitioning Design Systems From WCAG 2.0 to WCAG 2.1 (PDF) By Hardik Shah. "…Upgrading a Design System from Web Content Accessibility Guidelines (WCAG) 2.0 to WCAG 2.1 signifies a considerable commitment to encouraging diversity and user-centric design in the changing field of digital accessibility…" https://arxiv.org/ftp/arxiv/papers/2312/2312.02992.pdf Screen Reader User Survey #10 By WebAIM. "The following survey is a follow-up to previous WebAIM Screen Reader User Surveys…" https://webaim.org/projects/screenreadersurvey10/ #FACILiti Will Get You Sued (Update) By Adrian Roselli. "…Koena Update: 6 December 2023. In depressing and disappointing news, a judge has ruled against Koena and ordered Koena to pay FACIL'iti 26,256€ ($28,302.86 USD as of 6 December 2023)…" https://adrianroselli.com/2022/03/faciliti-will-get-you-sued.html#KoenaUpdate01 Legal Update: Accessibility Overlay Edition (Updated) By Lainey Feingold. "…November brought bad news for open ethical conversation about the harms and limitations of one-line-of-code quick fix accessibility overlays. As reported above, in 2021 the French overlay company FACIL'iti took legal action against French accessibility firm Koena, a seven person shop led by Armony Altinier…" https://www.lflegal.com/2021/11/overlay-legal-update/#article-updates Accessibility Overlays By European Commission. "…Claims that a website can be made fully compliant without manual intervention are not realistic, since no automated tool can cover all the WCAG 2.1 level A and AA criteria…" https://commission.europa.eu/resources-partners/europa-web-guide/design-content-and-development/accessibility/testing-early-and-regularly/accessibility-overlays_en Blind Leader Wins $2 Million Settlement Over Inaccessible California Parks Website By Kristopher Nelson. "Settlement ranks as one of the largest resolutions of web access litigation in the U.S.…" https://trelegal.com/posts/cfca-unruh-settlement/ Great Outcome in California Whistleblower's Inaccessible Website Fraud Lawsuit (Updated) By Lainey Feingold. "…While this case is about procurement, it is also about fraud. When a web developer has a contract with a government agency to deliver an accessible website but instead delivers a site that disabled people can't use, the developer is fraudulently taking money from the government agency…" https://www.lflegal.com/2019/07/false-claim/#article-updates SCOTUS Punts on Whether ADA 'Testers' Have Standing in Acheson v. Laufer By Minh Vu & John W. Egan. "SCOTUS's refusal to clarify standing requirements for 'tester' plaintiffs in ADA Title III lawsuits means it's business as usual for the plaintiffs' bar…" https://www.adatitleiii.com/2023/12/scotus-punts-on-whether-ada-testers-have-standing-in-acheson-v-laufer/ +02: CASCADING STYLE SHEETS. Native or Custom? A Guide to Recognizing Focus Styles By Carolina Crespo. "…Identifying whether a visual indicator comes from the browser or comes from the developer's custom CSS makes a difference between whether that might count as a failure…" https://www.tpgi.com/native-or-custom-a-guide-to-recognizing-focus-styles/ CSS Wrapped: 2023! By Una Kravets, Bramus Van Damme, and Adam Argyle. "Wow! 2023 was a huge year for CSS…" https://developer.chrome.com/blog/css-wrapped-2023 Media Queries in HTML Video By Adrian Roselli. "…I made a video. Then I made alternate versions for assorted media queries. While this would be onerous for some organizations to do for many of their videos, I wanted to at least test both the support and the practicality for teams that can wrangle the budget to give this a shot…" https://adrianroselli.com/2023/12/media-queries-in-html-video.html +03: EVALUATION & TESTING. Understanding Your Audience With Research-Driven Personas By Clearleft. "This is the story of how we helped University College London better understand one segment of their audience…" https://clearleft.com/work/understanding-your-audience-with-research-driven-personas Five-Second Testing: Taking A Closer Look At First Impressions (Case Study) By Eduard Kuric. "…In this article, Eduard Kuric looks under the hood of how first impressions are affected by time, the test participant's cognitive abilities and the visual complexity of the tested picture, and how UX researchers and product owners can ensure that the user's first steps can get off on the right foot…" https://www.smashingmagazine.com/2023/12/five-second-testing-case-study/ Frameworks for Classifying UI Problems By Jeff Sauro and Jim Lewis. "…In this article, we review several frameworks for categorizing usability problems. For a categorization scheme to be effective, it needs to be reliable, valid, and not too difficult to implement. That is, evaluators should be able to consistently categorize the same issues and this categorization should lead to better products (something a lot harder to measure)…" https://measuringu.com/frameworks-for-classifying-ui-problems +04: EVENTS. Semantic Components and Custom Lint Rules for Improving the A11y Mindset December 13, 2023. Online https://a11ytalks.com/posts/2023-DEC/ Roma Komarov - A Peek Into the CSS Lab December 14, 2023. Online https://www.meetup.com/css-cafe/events/297788668/ Resilient and Maintainable CSS Dev with Miriam Suzanne February 26-March 12, 2024. Online https://smashingconf.com/online-workshops/workshops/modern-css-miriam-suzanne/ The Information Architecture Conference April 11-13 2024. Seattle, Washington, U.S.A. https://www.theiaconference.com/ devopsdays Denver April 28-30, 2024. Denver, Colorado, U.S.A. https://devopsdays.org/events/2024-denver/ +05: HTML. Template for Accessibility Guidelines By Steve Frenzel. "This template is opinionated and intended as a starting point for those who want to define how accessibility is dealt with in their company. It does not matter whether your title is developer, designer, project manager or something else…" https://www.htmhell.dev/adventcalendar/2023/10/ HTML: The Bad Parts By Mayank. "…I've decided to collect a few instances where HTML falls short, through accessibility issues or usability issues…" https://www.htmhell.dev/adventcalendar/2023/13/ Test-Driven HTML and Accessibility By David Luhr. "…I came across a tool called Web test runner from the team behind Open Web Components. Instead of running JavaScript tests in Node, Web Test Runner executes tests directly in the browser. This is a big deal for multiple reasons…" https://www.htmhell.dev/adventcalendar/2023/12/ Sizes="auto" Pretty Much Requires width and Height Attributes By Eric Portis. "…in addition to requiring loading=lazy, sizes=auto also basically requires that elements have width and height attributes…" https://ericportis.com/posts/2023/auto-sizes-pretty-much-requires-width-and-height/ Security Headers Using By Saptak Sengupta. "…The HTML tag helps in setting up two such security headers - Referrer Policy and Content Security Policy…" https://www.htmhell.dev/adventcalendar/2023/7/ The Hidden Depths of the Input Element By Phil Nash. "The element is the most fascinating element in HTML…" https://www.htmhell.dev/adventcalendar/2023/8/ The hidden Attribute in HTML By Ahmad El-Alfy. "…The hidden attribute allows us to hide HTML elements from the page…" https://www.htmhell.dev/adventcalendar/2023/11/ Web Components FTW! By Chris Ferdinandi. "Web Components are a collection of technologies that you can use to create reusable custom elements, with built-in interactivity, automatically scoped (or encapsulated) from the rest of your code…" https://www.htmhell.dev/adventcalendar/2023/6/ The Hellish History of HTML: An Incomplete and Personal Account By Jason Cranford Teague. "…In the beginning Tim Berners-Lee created the World Wide Web. This has made a lot of people very angry and - putting all of humanity in constant contact with each other - been widely regarded as a bad move…" https://www.htmhell.dev/adventcalendar/2023/5/ Three Decades of HTML By Eric A. Meyer. "A few days ago was the 30th anniversary of the first time I wrote an HTML document…" https://meyerweb.com/eric/thoughts/2023/12/06/three-decades-of-html/ +06: JAVASCRIPT. Custom events in Web Components By Chris Ferdinandi. "…Custom Events are events your library or Web Component emits that you can listen for with the addEventListener() method. They provide a way for developers to hook into your code and extend it in ways you might not anticipate, or do things it doesn't support out-of-the-box. They're one of my favorite ways to make a Web Component more developer-friendly…" https://gomakethings.com/custom-events-in-web-components/ What the Slot? By Egor Kloos (aka dutchcelt). "…Slots only exist in the Shadow DOM and are a way to get content from the document (i.e. a web page)…" https://www.htmhell.dev/adventcalendar/2023/9/ JavaScript: The First 20 Years (PDF) By Allen Wirfs-Brock and Brendan Eich. "How a sidekick scripting language for Java, created at Netscape in a ten-day hack, ships first as a de facto Web standard and eventually becomes the world's most widely used programming language. This paper tells the story of the creation, design, evolution, and standardization of the JavaScript language over the period of 1995-2015. But the story is not only about the technical details of the language. It is also the story of how people and organizations competed and collaborated to shape the JavaScript language which dominates the Web of 2020…" https://dl.acm.org/doi/pdf/10.1145/3386327 +07: MISCELLANEOUS. I Am a Poem I Am Not Software By Robin Rendle. "A personal website sits on the blurry line between a corporate entity and a skate park…" https://robinrendle.com/notes/i-am-a-poem-i-am-not-software/ How Should Regulators Think About "AI"? (Video) By Emily M. Bender. "…AI in fact this is a marketing term it's a way to make certain kinds of automation sound sophisticated powerful or magical and as such it's a way to dodge accountability by making the machines sound like autonomous thinking entities rather than tools that are created and used by people and companies. It's also the name of a subfield of computer science I'm concerned with making machines that in quote think like humans but even there it was started as a marketing term in the 1950s to attract research funding…" https://www.youtube.com/watch?v=eK0md9tQ1KY 26 Other Web Development Terms You May Not Have Heard Of By Jens Oliver Meiert. "Web development comes with literally thousands of terms and concepts. In this new episode of 'Web Development Terms You May Not Have Heard Of,' are you familiar with all of them?…" https://meiert.com/en/blog/26-other-web-development-terms/ +08: NAVIGATION. The Birth & Death of Search Engine Optimization By Xe Iaso. "…The reason I was inspired to write all this out was seeing this Twitter thread where they spelled out a 'SEO heist' that stole a bunch of traffic from a competitor using generative AI tools. The basic idea is that you use generative AI to systematically churn out articles about a given topic and then use A/B testing to eliminate the ones that don't 'work' on search engines in favor of the ones that do. This is a way to automate the process of creating content farms…" https://xeiaso.net/blog/birth-death-seo/ Link Styling: Underline Your Links. Test With Night Mode. Test in Greyscale By Nic Steenhout. "Links should be underlined. This is better from a usability perspective as well as from an accessibility perspective…" https://nicsteenhout.substack.com/p/link-styling-underline-your-links +09: TOOLS. WTFocus (Bookmarklet) By Ian Lloyd. "…When you run What The Focus, it goes through every focusable element on the page and collates that information and then reveals it as you focus. So now we can see what the accessible name is, the source of that accessible name, what the element's role is, is there a description, an accessible description. Plus we also have some more information such as what the HTML element is…Now, if I reveal this information here, more details, it'll also show you various other possible naming sources and which one provided it…" https://a11y-tools.com/bookmarklets/wtf/ Accessibility Checker for EPUB (ACE) By DAISY Consortium. "…the official graphical user interface for the EPUB accessibility checker…" (Windows, MacOS and Linux) https://daisy.github.io/ace/getting-started/ace-app/ +10: TYPOGRAPHY. User Interface Typography By Alex Baránov. "This book is about how to do good user interface typography, from basic things and principles to building layout and various design elements. The book has hundreds of illustrations that explain every nuance and principle…" https://imperavi.com/books/ui-typography/ The Most Accessible Font By Phillip Roth. "This article is not scientific in any way. I try to learn about accessibility for some time now and can just put my aggregated knowledge and my thoughts in here. So please feel free to criticise and correct me where I’m wrong. I will be sharing about accessible font myths, the audience and the actual letters in this article…" https://www.philliproth.de/the-most-accessible-font/ +11: USABILITY. User Feedback: 5 Guidelines (Video) By Anna Kaley. "Follow these five guidelines to enhance both the quantity and quality of feedback received from your users." https://www.nngroup.com/videos/user-feedback/ Communication Practices for Increasing UX Maturity By Tim Neusesser. "Improve your organization's UX maturity by increasing UX awareness and knowledge through purposeful UX-related communication." https://www.nngroup.com/articles/communication-practices/ +12: WEBWASTE & SUSTAINABILITY. Why Web Perf Tools Should Be Reporting Website Carbon Emissions By Fershad Irani. "…In this post, I aim to provide a counter take, that looks at the present and future. I hope to emphasise how web performance tools can start integrating website carbon emissions calculations into their platforms…" https://calendar.perfplanet.com/2023/why-web-perf-tools-should-be-reporting-website-carbon-emissions/ Big Tech Drives Overconsumption (Part 2) By Gerry McGovern. "As we fast approach 2030, it is clear we will not be even close to achieving the target reductions set out for CO2…" https://gerrymcgovern.com/big-tech-drives-overconsumption-part-2/ AI's Carbon Footprint is Bigger Than You Think By Melissa Heikkilä. "Generating one image takes as much energy as fully charging your smartphone…" https://www.technologyreview.com/2023/12/05/1084417/ais-carbon-footprint-is-bigger-than-you-think/ [Section one ends.] ++ SECTION TWO: +13: 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.]