+++ WEB DESIGN UPDATE. - Volume 12, Issue 11, September 9, 2013. An email newsletter to distribute news and information about web design and development. ++ISSUE 11 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: COLOR. 04: DRUPAL. 05: EVALUATION & TESTING. 06: EVENTS. 07: HTML5. 08: JAVASCRIPT. 09: MISCELLANEOUS. 10: TOOLS. 11: USABILITY. 12: XML. SECTION TWO: 13: What Can You Find at the Web Design Reference Site? [Contents ends.] ++ SECTION ONE: New references. +01: ACCESSIBILITY. Making an Accessible Form with ARIA, Part 2 By Lisa Seeman. "In this blog we are going to use ARIA to make an accessible form with validation checking; however, you can also use this as an example of how to use ARIA to make any dynamic content accessible." http://www.deque.com/making-accessible-form-aria-part-2 Accessibility Through Video Captions By Alastair Campbell. "Video captions are important for accessibility and search engines. Edit YouTube captions to prevent bloopers, says Alastair Campbell..." http://www.netmagazine.com/tutorials/accessibility-through-video-captions BPOW - Title Attributes By Joanna Briggs. "Title attributes seem to end up everywhere. And, you really don't need them because most of the time they're just creating redundant information. For people with screenreaders, they might hear the title and the text - or just the link text. But, title attributes also have an impact on low vision users who use screen magnification." http://simplyaccessible.com/bpow/title-attributes/ 3.2.3.2 The Title Attribute HTML 5.1 Nightly Spec. "...Relying on the title attribute is currently discouraged as many user agents do not expose the attribute in an accessible manner as required by this specification (e.g. requiring a pointing device such as a mouse to cause a tooltip to apear, which excludes keyboard-only users and touch-only users, such as anyone with a modern phone or tablet)..." http://www.w3.org/html/wg/drafts/html/master/dom.html#the-title-attribute Creating Accessible PDF Documents In Adobe Acrobat XI By National Center on Disability and Access to Education (NCDAE). Select Tools from the upper right corner, then select Action Wizard > Make Accessible from the sidebar. Select Start button. http://www.ncdae.org/resources/cheatsheets/acrobat-xi.php Accessible Mozilla - Tech Overview of Firefox 25 By Alexander Surkov. "...longdesc attribute is exposed in Firefox context menu (see bug) as "View description" menu item. Right click on the image having a longdesc allows you to see it in new tab..." http://asurkov.blogspot.ca/2013/09/accessible-mozilla-tech-overview-of.html Think About ARIA Roles When Choosing a WordPress Theme By Virginia DeBolt. "ARIA landmark roles are used to improve accessibility and provide useful navigation points that a screen reader recognizes and can find quickly..." http://www.webteacher.ws/2013/09/06/think-aria-roles-choosing-wordpress-theme/ +02: CASCADING STYLE SHEETS. The CSS Grid Layout Module - Flexible Structures for Content By Steven Bradley. "I often suggest that designing with a grid is a good idea. Developing them in html and css sometimes feels like a hack, though. Developers certainly build grids for use online and there are a variety of frameworks you can use that do the work for you. Still, wouldn't it be nice to have some native css for creating grids? That native css is on its way in the form of the CSS Grid Layout Module..." http://www.vanseodesign.com/css/grid-layout-module/ CSS Grids - Examples and Code for Common Layouts By Steven Bradley. "Earlier in the week I walked through the css grid layout module. There was a lot to cover and as the post grew long I saved some real examples for today." http://www.vanseodesign.com/css/grid-examples-and-code/ CSS3 Transformations 101 - What are Transformations? By Craig Buckler. "This is the first in a five-part series about CSS3 2D and 3D transformations. Each article can be read individually or out of order..." http://www.sitepoint.com/css3-transformations-101/ +03: COLOR. Update to Color Contrast Tester By Joe Dolson. "So, I originally wrote my color contrast evaluator in September of 2008. Now, 5 years later, there are some key differences that merit an update..." http://www.joedolson.com/articles/2013/09/update-color-contrast-tester/ +04: DRUPAL. Kevin Miller - Accessibility Testing, Tools, and QUAIL By Jeffrey McGuire. "I spoke with Kevin Miller, lead web developer at Cal State Monterey Bay. He's been working with Drupal for more than six years and is making great contributions, especially in the area of accessibility..." http://acquia.com/resources/podcasts/acquia-podcast-98-meet-kevin-miller-accessibility-quail A Video Introduction to Drupal 8 By Steve Burge. "...During the presentation, I give you a tour of the new features and admin interface changes in Drupal 8..." http://www.ostraining.com/blog/drupal/video-intro-to-drupal-8/ +05: EVALUATION & TESTING. The 6 Simplest Web Accessibility Tests Anyone Can Do "What if I told you that the WCAG 2.0 recommendation by the W3C is 36 pages, printed?..." http://www.karlgroves.com/2013/09/05/the-6-simplest-web-accessibility-tests-anyone-can-do/ Web Accessibility Testing Tools - Who tests the DOM? By Karl Groves. "Amazingly, of those which I could use, only two actually tested the DOM: SortSite and Opquast. In other words, if you're using a free online service to test your website's accessibility, use SortSite or Opquast..." http://www.karlgroves.com/2013/09/06/web-accessibility-testing-tools-who-tests-the-dom/ Website Accessibility Testing - Automated Testing vs. Human Evaluation By Access iQ. "A research paper that investigates the use of evaluation tools has shown the importance of using a mixture of testing methodologies in order to accurately assess the accessibility of a website. Such methods include the use of automated testing, manual expert evaluation and user testing." http://www.accessiq.org/news/news-features/2013/08/website-accessibility-testing-automated-testing-vs-human-evaluation Internet Activity Bias Causes Lumpy User Behavior By Jakob Nielsen. "Dramatic differences in how much people use the web on different days can distort simplistic interpretations of site analytics." http://www.nngroup.com/articles/internet-activity-bias/ Flexible Usability Testing - 10 Tips to Make your Sessions Adapt to Your Clients' Needs By Jakob Nielsen. "For testing assignments where client teams are ready, willing and able to take immediate action, being flexible with tasks within and between participants can offer better bang for your buck." http://www.nngroup.com/articles/flexible-usability-testing/ +06: EVENTS. W3C HTML5 Training September 30 - November 10, 2013. Online. http://www.w3devcampus.com/html5-w3c-training/ MobileCON October 16-18, 2013. San Jose, California, U.S.A. http://mobilecon2013.com/ Midwest UX October 17-19, 2013. Grand Rapids, Michigan, U.S.A. http://2013.midwestuxconference.com/ Big Design Events October 17-20, 2013. Dallas, Texas, U.S.A. http://bigdesignevents.com/ Web Development Conference (WDC) October 18, 2013. Bristol, England, United Kingdom http://2013.webdevconf.com/ The Realtime Conference October 18-19, 2013. Portland, Oregon, U.S.A. http://2013.realtimeconf.com/ User Interface 18 Conference October 21-23, 2013. Boston, Massachusetts, U.S.A. http://ui18.uie.com/ +07: HTML5. Homeopathic HTML Solutions By Christian Heilmann. "...In order to reap the rewards of clean and semantic markup, you need to think about meaning first and then about code or markup. Writing intelligent, beneficial HTML is an exercise in organising and describing; you could say labeling. It is not about using HTML as the tool to create things that look impressive..." http://christianheilmann.com/2013/09/03/homeopathic-html-solutions/ Working with Text in HTML By Elizabeth Castro and Bruce Hyslop. "This chapter from HTML and CSS: Visual QuickStart Guide, 8th Edition explains which HTML semantics are appropriate for different types of text, especially (but not solely) for text within a sentence or phrase." http://www.peachpit.com/articles/article.aspx?p=2124990 +08: JAVASCRIPT. JavaScript for Designers By Rachel Nabors. "We will cover...a handful of all the things: Vanilla JS and ECMAScript, objects, functions, the DOM..." http://rachelnabors.com/javascript-for-designers/ Progressive Enhancement. Still Alive and Kickin'. By Dan Mall. "...Step 1: write some HTML. This is already where a lot of people get it wrong; this is where problem #1 happens. Stop writing JavaScript controllers, don't worry about routing yet, put your database schema on hold. Create structural markup for the data..." http://danielmall.com/articles/progressive-enhancement/ JavaScript's Type System By Axel Rauschmayer. "This blog post examines JavaScript's type system. It answers questions such as: Is JavaScript dynamically typed? Weakly typed? What is coercion?..." http://www.2ality.com/2013/09/types.html ARIA Roles P-R By Rakesh Paladugula. "The following ARIA roles begin with the letters P and R. Click the link to jump to its detailed description..." http://www.maxability.co.in/2013/09/aria-roles-p-r/ +09: MISCELLANEOUS. Why Responsive Web Design Can Transform Higher Education Recruiting By Steffan Berelowitz. "...for higher education marketers, RWD is becoming mission-critical in helping recruit prospective students, keep current students engaged and provide value to alumni, particularly on mobile devices..." http://doteduguru.com/id9564-why-responsive-web-design-can-transform-higher-education-recruiting.html By Any Other Name By Jeremy Keith. I'm not a fan of false dichotomies. Chief among them on the web is the dichotomy between documents and applications, or more broadly, 'websites vs. web apps'..." http://adactio.com/journal/6246/ New Poll - Is There a Line Between Web Apps and Web Sites? By Chris Coyier. "Every once in a while I'll hear people say something along the lines of "well that's for web sites, but it's not really relevant for web apps." That implies there is some kind of line that separates the two. Different needs and rules that change the game and alter the conversation around them. Is it true?..." http://css-tricks.com/new-poll-line-web-apps-web-sites/ +10: TOOLS. Describler By Doug Schepers. "Describler allows you to make your SVG images accessible and reusable. It shows you all of the text content of your SVG in an editable list, including both visible text and metadata, and makes it easy for you to add descriptive content, or change the text that's already there. And you can use the 'audio preview' feature to hear how your SVG sounds in common screenreaders." http://describler.com/ Accessibility Audit and Element Properties (Chome extension) "This extension will add an Accessibility audit, and an Accessibility sidebar pane in the Elements tab, to your Chrome Developer Tools..." https://chrome.google.com/webstore/detail/accessibility-developer-t/fpkknkljclfencbdbgkenhalefipecmb +11: USABILITY. 5 Common Punctuation Problems to Avoid By Georgina Laidlaw. "...For those working on interfaces, typos can seem like the biggest text-related issue you'l face. Sadly, they're not. The partner in crime of the innocent typo is the punctuation error..." http://www.sitepoint.com/5-common-punctuation-problems-avoid/ +12: XML. Current State of Authoring Accessible SVG By Doug Schepers. "SVG has a few metadata features intended specifically for accessibility, and also provides the ability to use real text instead of images for textual content, just like HTML. This combination of text and metadata serves as one of the cornerstones of SVG's accessibility; there are other features, such as scalability and navigation features, but this post will focus on the descriptive capabilities of SVG." http://schepers.cc/authoring-accessible-svg [Section one ends.] ++ SECTION TWO: +13: 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 Dreamweaver Information. http://www.d.umn.edu/itss/training/online/webdesign/dreamweaver.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 Flash Information. http://www.d.umn.edu/itss/training/online/webdesign/flash.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.]