+++ WEB DESIGN UPDATE. - Volume 17, Issue 49, May 29, 2019. An email newsletter to distribute news and information about web design and development. ++ISSUE 49 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: EVALUATION & TESTING. 04: EVENTS. 05: HTML. 06: MISCELLANEOUS. 07: NAVIGATION. 08: STANDARDS, GUIDELINES & PATTERNS. 09: TYPOGRAPHY. 10: USABILITY. SECTION TWO: 11: What Can You Find at the Web Design Reference Site? [Contents ends.] ++ SECTION ONE: New references. +01: ACCESSIBILITY. Contextually Marking up Accessible Images and SVGs By Scott O'Hara. "…there are various methods that can be used to provide an accessible name to an image or SVG element…depending on the markup pattern and the method used, the accessible name may not be exposed as expected, due to quirks or gaps in implementations. This means that without testing, graphics may not be exposed in the manner in which you might expect…" https://www.scottohara.me/blog/2019/05/22/contextual-images-svgs-and-a11y.html The Difference Between Keyboard and Screen Reader Navigation By Léonie Watson. "…Whether someone is a keyboard user or a screen reader user, the importance of HTML cannot be emphasised enough. Without well-formed HTML that uses the appropriate element for the purpose, screen reader navigation breaks down completely, and keyboard navigation is at a high risk of doing the same…" https://tink.uk/the-difference-between-keyboard-and-screen-reader-navigation/ Accessible Icon Buttons By Sara Soueidan. "An icon button is an icon that triggers some sort of action on the page…" https://www.sarasoueidan.com/blog/accessible-icon-buttons/ Tabindex: It Rarely Pays to be Positive By Scott O'Hara. "HTML's tabindex attribute may be used to modify whether an element can receive keyboard focus, or not…" https://www.scottohara.me/blog/2019/05/25/tabindex.html 2.1.4 Character Key Shortcuts - WCAG 2.1 - Level A By Rakesh Paladugula. "If a keyboard shortcut is implemented in content using only letter (including upper- and lower-case letters), punctuation, number, or symbol characters, then at least one of the following is true…" https://www.maxability.co.in/2019/05/27/2-1-4-character-key-shortcuts-wcag-2-1-level-a/ Dragon and Accessible Names on the Web (Video) By Eric Wright. "A brief demonstration of "What You See Is What You Say" in a web browser, and how interaction changes when I only have to say part of an element's accessible name. Elements should be named carefully to enable intuitive interactions…" https://www.youtube.com/watch?v=p5WqhltSlE0 Here are 23 Terms You Should Know to Better Understand Accessibility By Julie Zeglen, Jonah Freedman et al. "Audism, multi-modality and Section 508: We built a glossary based on local experts' suggestions of the terms they think everyone should learn…" https://technical.ly/philly/2019/05/24/accessibility-terms-glossary-technology/ A Model for WordPress Accessibility By Adrian Roselli. "I am going to propose a way to increase the overall accessibility of the WordPress ecosystem…" http://adrianroselli.com/2019/05/a-model-for-wordpress-accessibility.html +02: CASCADING STYLE SHEETS. Digging Into The Display Property: Grids All The Way Down By Rachel Andrew. "Continuing a series on the display property in CSS, this time Rachel Andrew takes a look at what happens when you use grid as a value of display, with added information about how subgrid changes that behavior…" https://www.smashingmagazine.com/2019/05/display-grid-subgrid/ +03: EVALUATION & TESTING. Questionnaire Design: An Interview with Annie Pettit (Podcast) By Gerry Gaffney. "My guest today is a market research methodologist who specializes in survey design and data quality…" https://uxpod.com/questionnaire-design-an-interview-with-annie-pettit/ Macro & Microconversions as Metrics in Analytics (Video) By Kathryn Whitenton. "The most desired user actions (macroconversions) may be too rare to generate enough analytics data for fast design iteration, so we can also analyze smaller user actions (microconversions) that are more frequent and are connected to bigger goals." https://www.nngroup.com/videos/macro-microconversions-metrics-analytics/ +04: EVENTS. Web Accessibility Evaluation for Non-Technical Users (3-part course) June 10, 12, and 14, 2019. Online. http://disability.illinois.edu/academic-support/accessible-it-group/badging#nontech Minnesota Assistive Technology (AT) and Accessibility Summit June 13-14, 2019. St. Paul, Minnesota, U.S.A. https://www.regonline.com/builder/site/default.aspx?EventID=2564241 Web Accessibility Evaluation for Technical Users (3-part course) June 17, 19, and 21, 2019 Online. http://disability.illinois.edu/academic-support/accessible-it-group/badging#tech Access Technology Higher Education Network (ATHEN) Virtual Conference June 21, 2019. Online https://athenpro.org/content/athen-virtual-conference IndieWeb Summit June 29-30, 2019. Portland, Oregon, U.S.A. https://2019.indieweb.org/summit Audio Description Institute July 10-12, 2019. Rochester, New York, U.S.A. https://acbconvention.org/account/adp/login.php Chicago UX Conference September 7-13, 2019, U.S.A. Chicago, Illinois, U.S.A. https://www.nngroup.com/training/chicago/ Accessibility Scotland October 25, 2019. Edinburgh, Scotland https://accessibility.scot/ +05: HTML. What Have HTML5 Elements Ever Done for Accessibility? (Slides) By Graham Armfield. "It's a story of good intentions that haven't always been carried through into a good implementation." https://speakerdeck.com/coolfields/what-have-html5-elements-ever-done-for-accessibility Placeholder: The Piss-Take Label By Steve Faulkner. "The reasons why use of the placeholder attribute as the only means of providing a user readable prompt for a form control is deficient UX, are voluminous…" https://codepen.io/stevef/post/placeholder-the-piss-take-label +06: MISCELLANEOUS. Plain Text vs. HTML Emails: Which Is Better? [New Data] By Niti Shah. "…Although people say they prefer HTML-based and image-based emails, in reality, simpler emails perform best -- and plain-text emails perform best of all…" https://blog.hubspot.com/marketing/plain-text-vs-html-emails-data +07: NAVIGATION. How Many Items in a Navigation Menu? (Video) By Page Laubheimer. "A key question in information architecture (IA) is to decide the number of items in navigation menus (including global menus and local menus). 4 main factors determine the answer, but it's not 7, despite a common myth." https://www.nngroup.com/videos/number-items-navigation-menu/ +08: STANDARDS, GUIDELINES & PATTERNS. W3C and WHATWG to Work Together to Advance the Open Web Platform By Jeff Jaffe. "…Motivated by the belief that having two distinct HTML and DOM specifications claiming to be normative is generally harmful for the community, and the mutual desire to bring the work back together, W3C and WHATWG agree to the following terms…" https://www.w3.org/blog/2019/05/w3c-and-whatwg-to-work-together-to-advance-the-open-web-platform/ +09: TYPOGRAPHY. Typography Terms Cheat Sheet By Therese Fessenden. "Typography concepts can sometimes get lost in translation between researchers, developers, designers, and stakeholders. Use this cheat sheet to help you decode the meaning of common or often mistaken typography terms." https://www.nngroup.com/articles/typography-terms-ux/ The State of Fluid Web Typography By Matej Latin. "Fluid typography gives us so many opportunities to better design the reading experiences on the web but, at the same time, it introduces problems of font sizes scaling uncontrollably and potential accessibility issues. Is fluid web typography ready to be used?…" https://betterwebtype.com/articles/2019/05/14/the-state-of-fluid-web-typography/ font-display is Incompatible with Icon Fonts By Zach Leatherman. "There are myriad problems with icon fonts…" https://www.zachleat.com/web/font-display-icon-fonts/ +10: USABILITY. User Needs, and Why Your Organization Doesn't Care About Them By Padma Gillen. "We are excited to share this excerpt from GatherContent's book Lead with Content…" https://www.uxbooth.com/articles/user-needs-and-why-your-organization-doesnt-care-about-them/ 'About Us' Information on Websites By Anna Kaley and Jakob Nielsen. "Users expect About Us sections to be clear, authentic, and transparent. They compare corporate content with third-party reviews to form a holistic opinion of a company before initiating business or applying for jobs." https://www.nngroup.com/articles/about-us-information-on-websites/ [Section one ends.] ++ SECTION TWO: +11: 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.]