+++ WEB DESIGN UPDATE. - Volume 22, Issue 30, January 17, 2024. An email newsletter to distribute news and information about web design and development. ++ISSUE 30 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: TOOLS. 09: TYPOGRAPHY. 10: USABILITY. 11: WEBWASTE & SUSTAINABILITY. SECTION TWO: 12: What Can You Find at the Web Design Reference Site? [Contents ends.] ++ SECTION ONE: New references. +01: ACCESSIBILITY. Paris Web 2023: WCAGmire (Video) By Adrian Roselli. "Remember that talk I gave at #ParisWeb just a few months ago? The video is posted. Captions in French and English (I provided the English because I am picky)." https://www.paris-web.fr/2023/conferences/wcagmire.php Slides: https://adrianroselli.com/2023/09/paris-web-2023-wcagmire.html Understanding WCAG SC 3.2.6 Consistent Help (Level A) By Sathish Kumar. "The goal of this success criterion is to ensure that the users find the help to complete a task in a consistent location across a set of web pages…" https://www.digitala11y.com/understanding-wcag-sc-3-2-6-consistent-help-level-a/ Decoding WCAG 1.4.11 Non-text Contrast - Part 2 By Salim Khan. "…let's put our methodology to work right away on different non-text elements…" https://www.barrierbreak.com/decoding-wcag-1-4-11-non-text-contrast-part-2/ Get to WCAG 2.2 Faster With the GOV.UK Design System By David Cox. "There's a new update in town, and it's a big one! The GOV.UK Design System is ready to help service teams across the UK government meet the latest version of the Web Content Accessibility Guidelines: WCAG 2.2…" https://accessibility.blog.gov.uk/2024/01/11/get-to-wcag-2-2-faster-with-the-gov-uk-design-system/ Money Talks! Formatting Currency in Web Content By Ricky Onsman. "…given the increasing importance of financial transactions conducted on the web, as acknowledged by WCAG Success Criterion 3.3.4 Error Prevention (Legal, Financial, Data) (Level AA), web authors should take particular care in how they present money and currency to avoid confusing or misleading screen reader users." https://www.tpgi.com/money-talks-formatting-currency-in-web-content/ Buttons and Links - Common Misconceptions By Clive Loseby. "This issue is so common. One of the most common issues I encounter in my website accessibility audits. Buttons that look like buttons but are coded as links. Sometimes it is the other way around.…" https://accessbydesign.uk/buttons-and-links-common-misconceptions/ Dynamic Accessible Descriptions Reference By Darin Senneff. "A reference I created for myself to test support for changes to accessible descriptions, but then decided to make a public blog post…" https://www.darins.page/articles/dynamic-accessible-descriptions-reference Takeaways from Lainey Feingold's 2023 Digital Accessibility Legal Update By Jena Wallace. "At the end of each year, Lainey Feingold joins 3Play Media to share her annual digital accessibility legal update…" https://www.3playmedia.com/blog/lainey-feingolds-annual-digital-accessibility-legal-update/ States Need to Pay Attention to Oklahoma Mobile ID App Accessibility Court Case By Thomas Logan. "…In this episode of A11y Insights, Ken Nakata from Converge Accessibility and Equal Entry CEO and founder Thomas Logan talk about a decision in a lawsuit in Oklahoma regarding a mobile ID app…" https://equalentry.com/accessibility-oklahoma-mobile-id-app-court-case/ +02: CASCADING STYLE SHEETS. Designing Better Target Sizes By Ahmad Shadeed. "An interactive guide that is all about enhancing the target size area with CSS…" https://ishadeed.com/article/target-size/ Taking a Closer Look at @property in CSS By Brecht De Ruyte. "Browser support for @property nears completion, a great time to delve into some technical aspects of this CSS feature. While I've experimented with @property in demo settings before, I've never used it in a production environment. With the upcoming full browser support, let's take a look at the inner workings and uncover some of the benefits…" https://utilitybend.com/blog/taking-a-closer-look-at-property-in-css/ +03: EVALUATION & TESTING. Field Studies By Susan Farrell and Therese Fessenden "Field research is conducted in the user's natural setting. Learn the unexpected by leaving the office and observing people in their normal environments." https://www.nngroup.com/articles/field-studies/ Common Errors in Quantitative Research (Video) By Caleb Sponheim. "False positives and negatives are common errors in quantitative studies that can lead to harmful business decisions. To avoid these mistakes recruit large enough sample sizes, representative participants, and control for confounding variables." https://www.youtube.com/watch/QmTUJekkSis 10 Key Takeaways from the Latest Research on Thinking Aloud in Usability Testing By Jeff Sauro and Jim Lewis. "In Think Aloud (TA) testing, participants speak their thoughts while attempting tasks…" https://measuringu.com/ta-summary-2023/ Getting Started with AB Testing in 2024 By Paul Boag. "AB testing is simple to run, but comes with some challenges. What tool should you use, when should you use it and how should you organize yourself?…" https://boagworld.com/emails/getting-started-with-ab-testing-in-2024/ +04: EVENTS. University of Minnesota Call for Speakers: Global Accessibility Awareness Day Virtual Event February 7, 2024. (Application due) Online https://itss.d.umn.edu/articles/gaad-call-speakers-2024 Designing Content That Empowers, Includes and Cares February 13, 2024. Online https://www.eventbrite.co.uk/e/designing-content-that-empowers-includes-and-cares-tickets-749056126037 DeveloperWeek February 21-29, 2024. Online and San Francisco, California, U.S.A. https://www.developerweek.com/ devopsdays Salt Lake City March 13-14, 2024. Salt Lake City, Utah, U.S.A. https://devopsdays.org/events/2024-salt-lake-city/welcome/ Human-Computer Interaction (CHI) 2024 May 11-16, 2024. Honolulu, Hawaii, U.S.A. https://chi2024.acm.org/ Beyond Tellerrand Düsseldorf May 12-13, 2024. Düsseldorf, Germany https://beyondtellerrand.com/events/dusseldorf-2024 13th Global Accessibility Awareness Day (GAAD) May 16, 2024. Global https://accessibility.day/ Global Accessibility Awareness Day 2024: Built Without Barriers May 16, 2024. Online sessions via the University of Minnesota https://accessibility.umn.edu/gaad/2024 +05: HTML. Options for optgroup Labeling of Option's By Steve Faulkner. "An ugly truth is that there are still interoperability issues with some of the native HTML controls and Screen readers…" https://html5accessibility.com/stuff/2024/01/12/options-for-optgroup-labeling-of-options/ Using abbr Element with title Attribute By Adrian Roselli. "…Don't use with or without title. Exposure continues to be inconsistent across browsers and assistive technologies. Some set of users will always miss some piece of information. Explain abbreviations, acronyms, initialisms, numeronyms, etc. on first use and then feel free to fall back to the shortened form…" https://adrianroselli.com/2024/01/using-abbr-element-with-title-attribute.html Embed Slides, YouTube Videos, and More By Adrian Roselli. "There are plenty of use cases for embedding third-party content on a site, as well as local content that may not be in HTML…" https://adrianroselli.com/2024/01/embed-slides-youtube-videos-and-more.html The Road to HTMHell is Paved with Semantics By Vadim Makeev. "HTML semantics is a nice idea, but does it really make a difference? T…" https://pepelsbey.dev/articles/road-to-htmhell/ +06: JAVASCRIPT. ARIA, the Good Parts (Video) By Hidde de Vries. "The first rule of ARIA suggests it is better avoided if there is an HTML equivalent. Yet sometimes, the right use of ARIA can improve your UI better for end users. In this talk, we'll look at practical examples of effective ARIA usage and how they work in assistive technologies. Find out more about the patterns that have broad support and which ones to avoid. Let's look at ARIA, the good parts!…" https://www.paris-web.fr/2023/conferences/aria-the-good-parts.php React Server Components: the Good, the Bad, and the Ugly By Mayank. "React Server Components bring server-exclusive capabilities to React. I've been using this new paradigm within Next.js 13 and 14, and what follows is my honest assessment of it…" https://www.mayank.co/blog/react-server-components/ Let's Inspect a Phishing Site By Chen Hui Jing. "…the lesson learned here is, to be a good teammate and person who writes code that other people will end up reading, let's all try to name our functions well…" https://chenhuijing.com/blog/lets-inspect-a-phishing-site/ We Removed Advertising Cookies, Here's What Happened By Matt Henderson. "In this post, I'll share some early results and all of the pitfalls and triumphs that we've faced ever since removal of every advertising cookie and user tracking in July 2023. My hope is that this can give others a dos and don'ts list and best practices for the inevitable shift from cookies in 2024…" https://blog.sentry.io/we-removed-advertising-cookies-heres-what-happened/ Web Component Gotcha: Constructor vs connectedCallback By Nolan Lawson. "A common mistake I see in web components is this…" https://nolanlawson.com/2024/01/13/web-component-gotcha-constructor-vs-connectedcallback/ +07: MISCELLANEOUS. Meet the Team: Gez Lemon By TetraLogical. "…In the colourful landscape of web accessibility, Gez Lemon stands out as not just a seasoned professional but also as one of the greats…" https://tetralogical.com/blog/2024/01/10/meet-the-team-gez-lemon/ +08: TOOLS. Hover Contrast Bookmarklet By Joe Dolson. "A bookmarklet to trigger hover states and check the color contrast of hovered focusable elements…" https://github.com/joedolson/Hover-Contrast-Bookmarklet/tree/main Colourblind Colour Palette Maker By Christian Lawson-Perfect. "This is a thing for picking contrasting colours. I made it because I'm severely colourblind (protanopia) so need to be guided by numbers rather than just looking at colours…" https://colourblind-palette-maker.glitch.me/ +09: TYPOGRAPHY. A Comparative Study of Dyslexia Style Guides in Improving Readability for People With Dyslexia By Fonita Theresia Yoliando. "…This research was addressed to analyse the BDA Dyslexia Style Guides and perceive its effectiveness through a comparative study with other past research…" https://www.atlantis-press.com/proceedings/imdes-20/125947156 +10: USABILITY. If It's Not Usable, It's Not Accessible By Sarah Lavery. "A Conversation with TPGi's Chief Accessibility Officer, David Sloan…In UX, we tend to talk about creating 'delightful' experiences. And that's a nice goal. But for accessibility, sometimes the best user experience isn't one that's necessarily 'delightful.' It's an experience that's as friction-free as possible, one that people almost don't notice, because they were able to do what they needed to do without frustration and significant effort and move on…" https://www.tpgi.com/if-its-not-usable-its-not-accessible/ Sycophancy in Generative-AI Chatbots By Caleb Sponheim. "Large language models like ChatGPT can lie to elicit approval from users. This phenomenon, called sycophancy, can be detected in state-of-the-art models." https://www.nngroup.com/articles/sycophancy-generative-ai-chatbots/ What's New, What's Old in UX 2024 Jakob Nielsen (Video) By Jakob Nielsen. "I did a session with the Floxies Community ('an international community for women around the world who share a passion for UX/UI design and Webflow Development and support one another in their tech journeys') on the topic of What's New, What's Old in UX 2024…" https://www.youtube.com/watch?v=a3z2asQKL9I Dark Design Patterns Catalog By Jakob Nielsen. "New regulations from the Government of India prohibit the use of 12 common dark design patterns. These sneaky practices are unethical applications of established UX knowledge to make interface designs that harm users instead of helping them." https://jakobnielsenphd.substack.com/p/dark-design +11: WEBWASTE & SUSTAINABILITY. Vitaly Friedman Chat: Cleaner Web Design For a Better Environment By Gerry McGovern. "Web design has rarely taken the environment into account. Over the last decade, webpages have become ten times bigger, and up to 80% of the weight of a particular webpage can be waste-content and code that is not required for the page to function…" https://gerrymcgovern.com/vitaly-friedman-chat-cleaner-web-design-for-a-better-environment/ Sustainable Development Goals (SDGs) By United Nations. "The Division for Sustainable Development Goals (DSDG) in the United Nations Department of Economic and Social Affairs (UNDESA) acts as the Secretariat for the SDGs, providing substantive support and capacity-building for the goals and their related thematic issues, including water, energy, climate, oceans, urbanization, transport, science and technology…" https://sdgs.un.org/ Is Materialism Really Such a Bad Thing? By Tom Greenwood. "…we should remember that they are both creators and mirrors of our culture. No single business alone can create this cultural shift, but they can help create momentum toward it. A good first step could be to create durable, lovable, repairable products that stand the test of time and serve people's real needs in living a truly good life…" https://tomgreenwood.substack.com/p/is-materialism-really-such-a-bad [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 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.]