+++ WEB DESIGN UPDATE. - Volume 17, Issue 38, March 13, 2019. An email newsletter to distribute news and information about web design and development. ++ISSUE 38 CONTENTS. SECTION ONE: New references. What's new at the Web Design Reference site? http://www.d.umn.edu/itss/training/online/webdesign/ New links in these categories: 01: ACCESSIBILITY. 02: BOOKS. 03: CASCADING STYLE SHEETS. 04: COLOR. 05: EVALUATION & TESTING. 06: EVENTS. 07: HTML. 08: JAVASCRIPT. 09: MISCELLANEOUS. 10: TOOLS. 11: USABILITY. SECTION TWO: 12: What Can You Find at the Web Design Reference Site? [Contents ends.] ++ SECTION ONE: New references. +01: ACCESSIBILITY. State of Accessibility in U.S. Higher Ed Institutions By Jiatyan Chen. "This paper will discuss the requirements and environment surrounding accessibility in Higher Ed institutions in the U.S., and their attempts to tackle these challenges…" https://docs.google.com/document/d/1k0DohIigCy_EwYQq9-EIosxoMhZYanI8V_bFwQmd1_I/ Improving the Keyboard Accessibility of Embedded CodePens By Manuel Matuzovic. "I'm a huge fan of CodePen (No, they didn't pay me to write this). I'm using it for prototyping, experimenting, sharing code, and in my latest blog post, The Dark Side of the Grid, I'm also making use of their Embedded Pens…" https://www.matuzo.at/blog/improving-the-keyboard-accessibility-of-codepen-embeds/ What We Can Learn From the 'WebAIM Million' By Sheri Byrne-Haber. "…If you haven't run WAVE or a paid accessibility analysis tool from one of the industry leading vendors like Accessibility Oz, Deque, or Level Access on your main site and microsites, do it…WAVE results are what lawyers who make millions from filing accessibility lawsuits use to decide who to sue…" https://medium.com/@sheribyrnehaber/this-week-in-accessibility-what-we-can-learn-from-the-webaim-million-2c11540fd46d See No Evil: Hidden Content and Accessibility By Paul Hebert. "When I first started learning web development I thought hiding content was simple: slap display: none; onto your hidden element and call it a day. Since then I've learned about screen readers, ARIA attributes, the HTML5 hidden attribute, and more…" https://cloudfour.com/thinks/see-no-evil-hidden-content-and-accessibility/ Accessibility Checklists - Just say No By Sheri Byrne-Haber. "…Checklists might be thought of as handy, but are abused and frequently used inappropriately…" https://medium.com/@sheribyrnehaber/accessibility-checklists-just-say-no-c9a68c8f2c90 BingO Bakery: Headings, Landmarks, and Tabs (Video) By Microsoft. "In this fun animated video, learn how someone using a screen reader may use landmarks, headings and tab stops to navigate a web page…" https://www.youtube.com/watch?v=HE2R86EZPMA Why Human Captioning? (Video) By Mirabai Knight. "This talk will address the current state of the art in automated live captioning and discuss why a qualified human captioner is still the most appropriate choice in nearly all circumstances. It will also indulge in a little speculation about the future of live captioning and how the human and automated realms are likely to intersect going forward…" https://www.youtube.com/watch?v=XKe1O7ppyqQ +02: BOOKS. Gay, Greg et al. Web Accessibility for Developers, Ryerson University Pressbooks, 2019. https://pressbooks.library.ryerson.ca/wafd/ +03: CASCADING STYLE SHEETS. Using CSS Grid the Right Way By Violet Peña. "Use names. Use frs. Don't use a grid system. Wait, what…" https://vgpena.github.io/using-css-grid-the-right-way/ Content-Based Grid Tracks and Embracing Flexibility By Hidde de Vries. "Something I love about CSS is that it lets us define visual design for unknown content. This is kind of magic. We can even size things based on content, with min-content, max-content and auto. This post is about how that works in CSS Grid Layout, and what usage in real projects would mean…" https://hiddedevries.nl/en/blog/2019-02-23-content-based-grid-tracks-and-embracing-flexibility Designing An Aspect Ratio Unit For CSS By Rachel Andrew. "The CSS Working Group have designed an aspect ratio unit for CSS. While this isn't in browsers yet, this article takes a look at the process of designing a new sizing method and explains how it will work…" https://www.smashingmagazine.com/2019/03/aspect-ratio-unit-css/ +04: COLOR. Tips to Create an Accessible and Contrasted Color Palette By Stéphanie Walter. "…In this article, I will present you two tools and some quick tips to easily create an accessible color palette for your designs…" https://stephaniewalter.design/blog/tips-create-accessible-color-palette/ +05: EVALUATION & TESTING. Effects of Labeling the Neutral Response in the NPS By Jeff Sauro. "…Let's take a look at the research on neutral point labels on the NPS…" https://measuringu.com/labeling-nps-effects/ Getting an Accessibility Audit By GOV.UK. "Getting an expert audit can help find any accessibility problems with your service and make sure it meets accessibility requirements…" https://www.gov.uk/service-manual/helping-people-to-use-your-service/getting-an-accessibility-audit +06: EVENTS. WCAG 2.1 Primer May 20, 2019. Minneapolis, Minnesota, U.S.A. https://www.meetup.com/Accessibility-Twin-Cities/events/258337730/ San Francisco UX Conference June 1-7, 2019. San Francisco, California, U.S.A. https://www.nngroup.com/training/san-francisco/ Enterprise UX June 3-5, 2019. San Francisco, California, U.S.A. https://rosenfeldmedia.com/enterprise2019/ ADA Symposium June 16-19, 2019. Dallas-Grapevine, Texas, U.S.A. http://www.adasymposium.org/ M-Enabling Summit June 17-19, 2019. Washington, D.C., U.S.A. http://www.m-enabling.com/ Smashing Magazine Conference June 25-26, 2019. Toronto, Canada https://smashingconf.com/toronto-2019/ Webstock June 25-28, 2019. Wellington City, New Zealand https://www.webstock.org.nz/ +07: HTML. Short note: The Abbreviation Appreciation Society By Steve Faulkner. "The HTML element is deceptively familiar and attractive, its been around forever (1999) and thus people assume that it does what it does and does it well…" https://developer.paciellogroup.com/blog/2019/03/short-note-the-abbreviation-appreciation-society/ +08: JAVASCRIPT. Accessible Custom Select Component (Video) By Gerard K. Cohen. "…In this presentation, Gerard Cohen leads you down the path of engineering a custom select and the reasons it was necessary. Starting with the official ARIA pattern and native select on various platforms, he demonstrates the practical reasons for deviation, the pitfalls he ran into, and ultimately a working demo of an accessible and usable custom select widget that works on desktop and mobile…" https://www.youtube.com/watch?v=ug1elgso_8A Slides: https://unfetteredthoughts.net/slides/technica11y/index.html Vue a11y By Vue A11Y Community. "Vue.js community project to improve web accessibility…" https://vue-a11y.com/ Building accessible-app: The Shopping Cart and aria-live Regions By Marcus Herrmann. "…this post is about the topic I wanted to cover initially - the shopping cart…" https://marcus.io/blog/a11y-app-shopping-cart-with-aria-live The 'Backendification' of Frontend Development By Mike Taylor. "Asynchronous JavaScript in the form of Single Page Applications (SPA) offer an incredible opportunity for improving the user experience of your web applications…the person with the most to gain from using CSS framework is the person least capable of maintaining CSS…" https://hackernoon.com/the-backendification-of-frontend-development-62f218a773d4 +09: MISCELLANEOUS. Tim Berners-Lee: 'Stop Web's Downward Plunge to Dysfunctional Future' By BBC. "Global action is required to tackle the web's "downward plunge to a dysfunctional future", its inventor Sir Tim Berners-Lee has told the BBC…" https://www.bbc.com/news/technology-47524474 Web Turns 30, Seems Popular By Adrian Roselli. "The world wide web has officially lasted 30 consecutive years, which means it's catching up to its parent, the Internet, which itself is bearing down on 50. That's an important distinction. The Internet is not the web; it is the foundation on which the web was born…" http://adrianroselli.com/2019/03/web-turns-30-seems-popular.html Happy 30th World Wide Web By John Allsopp. "Today CERN is marking the 30th anniversary of the World Wide Web…" https://www.webdirections.org/blog/happy-30th-world-wide-web/ HMTL, CSS and JS in an ADD, OCD, Bi-Polar, Dyslexic and Autistic World By Timothy Smith. "…Despite all the challenges I have faced, I feel I have mastered HTML and CSS and have a baseline grasp on JavaScript…Without CSS, all websites are perfectly responsive and look great on any device or screen size. We break them with CSS, then need to fix them…ponder that a bit…" https://css-tricks.com/hmtl-css-and-js-in-an-add-ocd-bi-polar-dyslexic-and-autistic-world/ +10: TOOLS. Contrast Analysis Widget. By Ada Rose Edwards. "…bookmarklet so you can run it on almost any site provided the Content Security Policy allows…" https://ada.is/contrast-widget/ +11: USABILITY. Filled-in vs. Outline Icons: The Impact of Icon Style on Usability By Curtis P. Arledge. "This study sought to determine whethersingle-color, 'flat' icons would be more quickly and accurately selected by users when presented in either a filled-in or outline style…" https://cdr.lib.unc.edu/indexablecontent/uuid:e7ece0ee-c1ea-48c2-bb01-108122686e5c User Interfaces: Hiding Stuff Should be a Last Resort By Adam Silver. "Many of the components we design for the web are made to save space. It's interesting that we work so hard to save space on a medium where we have infinite space to work with." https://adamsilver.io/articles/user-interfaces-hiding-stuff-should-be-a-last-resort/ 5 Simple Rules For Using Images More Effectively By Nick Babich. "…The process of creating or selecting visual content for your app is time-consuming. But there are a few tricks and tools you can use to simplify this task…" http://babich.biz/images-in-design/ Internet of Things (IoT) and User Experience (Video) By Kara Pernice. "The Internet of Things (IoT) poses many challenges and the current user interfaces since these systems rarely follow even basic usability guidelines. UX professionals have many opportunities for contributing to this new generation of devices and solutions in a major way." https://www.nngroup.com/videos/iot-user-experience/ Designing For Children By Feifei Liu. "Designers should consider the physical and mental abilities of children, as well as utilize existing UX conventions. Here are 3 guidelines to consider when designing UX for children, based on our user research with users aged 3-12 years." https://www.nngroup.com/videos/designing-children/ [Section one ends.] ++ SECTION TWO: +12: What Can You Find at the Web Design Reference Site? Accessibility Information. http://www.d.umn.edu/itss/training/online/webdesign/accessibility.html Association Information. http://www.d.umn.edu/itss/training/online/webdesign/associations.html Book Listings. http://www.d.umn.edu/itss/training/online/webdesign/books.html Cascading Style Sheets Information. http://www.d.umn.edu/itss/training/online/webdesign/css.html Color Information. http://www.d.umn.edu/itss/training/online/webdesign/color.html Drupal Information. http://www.d.umn.edu/itss/training/online/webdesign/drupal.html Evaluation & Testing Information. http://www.d.umn.edu/itss/training/online/webdesign/testing.html Event Information. http://www.d.umn.edu/itss/training/online/webdesign/events.html HTML Information. http://www.d.umn.edu/itss/training/online/webdesign/html.html Information Architecture Information. http://www.d.umn.edu/itss/training/online/webdesign/architecture.html JavaScript Information. http://www.d.umn.edu/itss/training/online/webdesign/javascript.html Miscellaneous Web Information. http://www.d.umn.edu/itss/training/online/webdesign/misc.html Navigation Information. http://www.d.umn.edu/itss/training/online/webdesign/navigation.html PHP Information. http://www.d.umn.edu/itss/training/online/webdesign/php.html Sites & Blogs Listing. http://www.d.umn.edu/itss/training/online/webdesign/sites.html Standards, Guidelines & Pattern Information. http://www.d.umn.edu/itss/training/online/webdesign/standards.html Tool Information. http://www.d.umn.edu/itss/training/online/webdesign/tools.html Typography Information. http://www.d.umn.edu/itss/training/online/webdesign/type.html Usability Information. http://www.d.umn.edu/itss/training/online/webdesign/usability.html XML Information. http://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: http://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.]