+++ WEB DESIGN UPDATE. - Volume 17, Issue 07, August 9, 2018. An email newsletter to distribute news and information about web design and development. ++ISSUE 07 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: CASCADING STYLE SHEETS. 03: DRUPAL. 04: EVALUATION & TESTING. 05: EVENTS. 06: HTML. 07: INFORMATION ARCHITECTURE. 08: JAVASCRIPT. 09: MISCELLANEOUS. 10: NAVIGATION. 11: TOOLS. 12: USABILITY. 13: XML. SECTION TWO: 14: What Can You Find at the Web Design Reference Site? [Contents ends.] ++ SECTION ONE: New references. +01: ACCESSIBILITY. Exploring WCAG 2.1 - 1.4.11 Non‑text Contrast By Becky Gibson. "…The contrast of icons and graphical objects is just as important as that of text. Use sufficient contrast for all elements on the screen." https://knowbility.org/blog/2018/WCAG21-1411Contrast/ 1.3.4 Orientation By Rakesh Paladugula. "…1.3.4 orientation wants authors not to create any content or functionality that is restricted to one orientation…" http://www.maxability.co.in/ Are You Ready for WCAG 2.1 Accessibility Guidelines? By Jack Niland. "Jack Niland from Spacecraft, Jadu's web agency partner takes us through the new guidelines and how they may affect you and your website…" https://www.jadu.net/blog/TheJaduBlog/post/391/are-you-ready-for-wcag-2.1-accessibility-guidelines WCAG 2.1 and What the New Criteria Really Mean for Your Website By Corbb O'Connor and Erin Jones. "…the new version of W3C's Web Content Accessibility Guidelines, WCAG 2.1, has been released for nearly two months. If you're reading this blog, you could be asking yourself any number of questions…" https://siteimprove.com/en-us/blog/wcag-21-and-what-the-new-criteria-really-means-for-your-website/ Why I Love WCAG (And You Should, Too!) By Jessica Sanders. "…The internet has given us the world. We're a global community. And, as a global community, it'd be ideal if we could all access the same, necessary information. That's where WCAG comes in to play…" https://brailleworks.com/why-i-love-wcag-and-you-should-too/ Understanding SC 1.4.2 Audio Control By Raghavendra Satish Peri. "Automatic playing content distracts users, especially cognitive, screen reader users & will hinder in performing their tasks effectively…" https://www.digitala11y.com/understanding-sc-1-4-2-audio-control/ Accessible Comics By Hampus Sethfors. "…In this article we'll look at a case where a team has done great work to make their digital comic accessible to people with visual impairments…" https://axesslab.com/accessible-comics/ 'Never Assume Anything': The Golden Rules for Inclusive Design By Ellen Tannam. "Why should developers and designers have inclusivity at the forefront of every project…" https://www.siliconrepublic.com/companies/henny-swan-inclusive-design TTML Profiles for Internet Media Subtitles and Captions 1.1 By Pierre Lemieux, Editor. "This document was published by the Timed Text Working Group as a Candidate Recommendation. This document is intended to become a W3C Recommendation. Comments regarding this document are welcome…" https://www.w3.org/TR/2018/CR-ttml-imsc1.1-20180726/ Website Accessibility Lawsuit Calls Foul on the Miami Heat By Klein Moynihan Turco. "…Andres Gomez, the Plaintiff named in the website accessibility lawsuit against the Miami Heat, is alleging that, as a blind man, the Miami Heat's online store does not provide him with full accessibility…" http://www.kleinmoynihan.com/website-accessibility-lawsuit-calls-foul-on-the-miami-heat/ 11th Circuit Determines Informational Websites for Places of Public Accommodation Are Subject to ADA By Robert S. Fine. "…the 11th Circuit held 'the website is a service that facilitates the use of Dunkin' Donuts shops which are places of public accommodation. And the ADA is clear that whatever goods and services Dunkin' Donuts offers as a part of its place of public accommodation, it cannot discriminate against people on the basis of a disability, even if those goods and services are intangible.'…" https://www.gtlaw.com/en/insights/2018/7/11th-circuit-determines-informational-websites-for-places +02: CASCADING STYLE SHEETS. Being Aware of Initial Values in Your CSS By Louis Lazaris. "In CSS, every property has what's referred to as an initial value. Sometimes this is called the default value, but the spec uses the term initial, which I think is a slightly better term…" https://www.impressivewebs.com/being-aware-of-initial-values-in-your-css/ Save Time With the CSS 'grid' Shorthand Property By Ian Yates. "In this tutorial we're going to look at the shorthand property grid which quickly deals with all of the above in a single statement…" https://webdesign.tutsplus.com/tutorials/save-time-with-the-css-grid-shorthand-property--cms-31590 What Happens When You Create A Flexbox Flex Container? By Rachel Andrew. "In my ideal world, CSS Grid and Flexbox would have arrived together, fully formed to make up a layout system for the web. Instead, however, we got Flexbox first and, due to it being better at creating grid-type layouts than floats, we ended up with a lot of Flexbox-based grid systems. In fact, many of the places where people find Flexbox difficult or confusing are really due to this attempt to make it a method for grid layout." https://www.smashingmagazine.com/2018/08/flexbox-display-flex-container/ CSS Properties Index By Jens Oliver Meiert. "A continuously updated list of all CSS properties…" https://meiert.com/en/indices/css-properties/ +03: DRUPAL. Caring About Webform Accessibility By Jacob Rockowitz. "At Design4Drupal in Boston, caring about accessibility became the central theme for my presentation, titled 'Webform Accessibility'…" https://www.jrockowitz.com/blog/caring-about-accessibility Personalization & Accessibility with Drupal By Mike Gifford. "…'Fluid is an open, collaborative project to improve the user experience and inclusiveness of open source software.'…I was convinced of its usefulness. There was even an existing module for it in Drupal. Unfortunately, the module was abandoned and hadn't kept up with either Drupal or the Fluid project. We have now contributed code back to the community to address this in both Drupal 7 and 8. We want to see this pattern be more widely implemented on other sites…" https://openconcept.ca/blog/mike/personalization-accessibility-drupal +04: EVALUATION & TESTING. 15 Metrics for UX Benchmarking By Jeff Sauro. "A benchmark study tells you where a website, app, or product falls relative to some meaningful comparison…" https://measuringu.com/ux-benchmark-metrics/ +05: EVENTS. A11Y Talks with Dennis Deacon August 14, 2018. Online https://groups.drupal.org/node/534190 Accessible Presentations: How to Design and Deliver Content for Diverse Audiences August 21, 2018. Online. http://aem.cast.org/about/events/2018/08/design-and-deliver-content-diverse-audiences.html Better By Design August 23-24, 2018. Madison, Wisconsin, U.S.A. https://betterbydesignconference.com/ Digging in to Inclusive Design with Derek Featherstone August 28, 2018. Chicago, Illinois, U.S.A. https://www.meetup.com/a11ychi/events/253435305/ Inclusive Learning and Teaching Environments Starts September 3, 2018. Online https://www.futurelearn.com/courses/inclusive-learning-teaching/ Accessibility Camp Chicago 2018 September 8, 2018. Chicago, Illinois, U.S.A. https://www.a11ycampchi.org/ Online Video Accessibility September 20, 2018. Online https://www.accessibilityonline.org/ada-tech/session/?id=110664 +06: HTML. Enshrining Accessibility at Every Level By Michiel Bijl. "When I started to learn HTML, I began with basic elements like h1, p, div, and button. I learned about semantics, creating sections with headings, and styling elements with CSS. Unconsciously, I was laying a foundation of knowledge on how to build accessible websites…" https://moiety.me/thinks/enshrining-accessibility-at-every-level.html Nutrition Cards for Accessible Components By Dave Rupert. "A11Y Nutrition Cards is an attempt to digest and simplify the accessibility expectations when it comes to component authoring. Based on the WAI ARIA Authoring Practices Guide…" https://davatron5000.github.io/a11y-nutrition-cards/ +07: INFORMATION ARCHITECTURE. Ceci n'est pas une prototype By Katherine Olvera. "…A prototype is an internal communication tool, not a product. This was always clear while designing physical products because the final production medium was distant from the design tooling…" https://www.viget.com/articles/ceci-nest-pas-une-prototype/ +08: JAVASCRIPT. Fixing Variable Scope Issues with ECMAScript 6 By Brandon Gregory. "…But ECMAScript 6 introduced some new features to help give developers more control of variable scope. Browser support is pretty great and these features are ready to use for most developers today. But which to choose? And what, exactly, do they do?…" https://alistapart.com/article/fixing-variable-scope-issues-with-ecmascript-6 aria-colindex(property) Part 1 By Suman Damera. "…When aria-colindex property is set on the cell container of the table then screen readers would understand column index of that cell and announces the column index accordingly…" http://www.sumandamera.com/aria-colindexproperty_part1/ +09: MISCELLANEOUS. WorldWideWeb: Summary By Tim Berners-Lee. "…On 6 August 1991 @timberners_lee first invited the public to participate in the world wide web. 'The WWW project merges the techniques of information retrieval and hypertext to make an easy but powerful global information system.' He added: 'Try it'…" https://www.w3.org/People/Berners-Lee/1991/08/art-6487.txt Accessibility in Tech with Haben Girma By Mark Mandel and Melanie Warrick. "On this episode of the podcast we continue a conversation we started with Haben Girma, an advocate for equal rights for people with disabilities, regarding the value of tech accessibility. Melanie and Mark talk with her about common challenges and best practices when considering accessibility in technology design and development…" https://gcppodcast.com/post/episode-141-accessibility-in-tech/ Interview with Eric Meyer - Part 1 By Nicolas Steenhout. "Eric talks about accessibility, of course, and semantics, and frameworks, and more…" https://a11yrules.com/podcast/e51-interview-with-eric-meyer-part-1/ Securing Web Sites Made Them Less Accessible By Eric A. Meyer. "…The drive to force every site on the web to HTTPS has pushed the web further away from the next billion users-not to mention a whole lot of the previous half-billion…I saw, first-hand, the negative externality that was pushed onto people far, far away from our data centers and our thoughts." https://meyerweb.com/eric/thoughts/2018/08/07/securing-sites-made-them-less-accessible/ The Bullshit Web By Nick Heer. "…An honest web is one in which the overwhelming majority of the code and assets downloaded to a user's computer are used in a page's visual presentation, with nearly all the remainder used to define the semantic structure and associated metadata on the page. Bullshit - in the form of CPU-sucking surveillance, unnecessarily-interruptive elements, and behaviours that nobody responsible for a website would themselves find appealing as a visitor - is unwelcome and intolerable…" https://pxlnv.com/blog/bullshit-web/ +10: NAVIGATION. Removing Site Tracking By Charlie Owen. "In truth, Google Analytics has always been a bit of a childish self-validation crutch. 'Look how many visits I'm getting ma!' It doesn't really serve a purpose for me. I design my site for everybody, so I don't need to track where people are coming from. I design my site for every device, so I don't need to track OS and Browser. I have zero interest in the awfully revealing demographic data that GA exposes. I really have no need to see real-time data on visitors. It's all really for nothing…" https://sonniesedge.co.uk/posts/removing-tracking +11: TOOLS. Specificity Visualizer By Francesco Schwarz. "A visual way to analyze the specificity of selectors in CSS." https://isellsoap.github.io/specificity-visualizer/ +12: USABILITY. Self-Service UX: 'Cards' Dashboards Must Be Highly Consistent and Appropriately Styled By Edward Scott. "Cards can be effective at improving the scannability of the dashboard, as users should be able to quickly find the account feature they're looking for by scanning card headers or prominent card content (e.g., 'Your Lists', 'Purchase History', etc.). During testing, however, 'Cards' dashboards performed poorly when card content wasn't implemented with a very high level of consistency." https://baymard.com/blog/cards-dashboard-layout Keeping Digital Teams Happy Versus Keeping Customers Happy By Gerry McGovern. "…If you really want to deliver excellent customer experience, then measure use and usefulness. Measure how easy it is for customers to find and use the things they want to find and use." http://gerrymcgovern.com/keeping-digital-team-happy-versus-keeping-customers-happy/ Intelligent Assistants: Creepy, Childish, or a Tool? Users' Attitudes Toward Alexa, Google Assistant, and Siri By Page Laubheimer and Raluca Budiu. "Users assume that assistants have a low level of competence for complex tasks and find them to be socially awkward to interact with." https://www.nngroup.com/articles/voice-assistant-attitudes/ What is UX Strategy? By Charlie Martin. "As you can imagine, I get asked this question a lot. So, I thought I'd follow up my recent webinar on this topic with an article (a 5-10 minute read) on what UX Strategy is and how it can come together…" https://www.nomensa.com/blog/2018/what-ux-strategy 5 Ways to Lower Your Sites Barrier to Entry By Ezequiel Bruni. "All sites have a barrier to entry. The lower you can make that barrier, the most users you'll encourage to use your site, and the more successful your endeavors. We look at five ways to reduce barriers to entry on websites…" https://www.webdesignerdepot.com/2018/07/5-ways-to-lower-your-sites-barrier-to-entry/ What Can Bike Sharing Apps Teach Us About Mobile On-boarding Design? By Luke Wroblewski. "Given the proliferation of bike/scooter sharing services these days, I thought it would be interesting to compare the mobile app on-boarding experiences of the ones I could access. To do so, I went through the new customer flow for six of these services…" https://www.lukew.com/ff/entry.asp?1995 Designing a Complex Table for Mobile Consumption By Joe Caron. "When faced with overwhelming content, focusing on user behavior can help define the design approach…" https://uxdesign.cc/designing-a-complex-table-for-mobile-consumption-nom-7472f7b11fe6 +13: XML. Scalable Vector Graphics (SVG) 2 By W3C. "This specification defines the features and syntax for Scalable Vector Graphics (SVG) Version 2. SVG is a language based on XML for describing two-dimensional vector and mixed vector/raster graphics…" https://www.w3.org/TR/2018/CR-SVG2-20180807/ [Section one ends.] ++ SECTION TWO: +14: 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.]