[webdev] Web Design Update: October 18, 2012

Laura Carlson lcarlson at d.umn.edu
Thu Oct 18 06:19:58 CDT 2012 

+++ WEB DESIGN UPDATE.
- Volume 10, Issue 17, October 18, 2012.

An email newsletter to distribute news and information about web
design and development.

++ISSUE 17 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.
02: COLOR.
03: EVALUATION & TESTING.
04: EVENTS.
05: JAVASCRIPT.
06: MISCELLANEOUS.
07: NAVIGATION.
08: STANDARDS, GUIDELINES & PATTERNS.
09: TOOLS.
10: USABILITY.


SECTION TWO:
11: What Can You Find at the Web Design Reference Site?

[Contents ends.]


++ SECTION ONE: New references.

+01: ACCESSIBILITY.

HTML5 Ranked Headings for Screen Readers
By Leonie Watson.
"Leonie Watson of Nomensa talks you through getting ranked headings in
HTML5 right for screen readers..."
http://www.netmagazine.com/tutorials/html5-ranked-headings-screen-readers

Administrator Guide to Accessibility
By Google.
"This guide provides information for technical administrators, CIOs,
compliance officers, and accessibility specialists for prospective and
current Google Apps for Business, Education, and Government customers.
Also, accessibility training personnel may find the User resources
sections useful in developing and delivering training to end users."
Note: this document is a PDF.
http://www.google.com/support/enterprise/static/gapps/docs/admin/en/gapps_accessibility/gapps_accessibility.pdf

Creating Accessible Microsoft Office 2010 Documents
By The Texas Governor's Committee on People with Disabilities.
"...Accessible documents are more portable and usable for everyone,
not just people with disabilities because accessible documents work
better across all web browsers, computer systems, and other devices.
Ensuring that your documents are made in an accessible manner provides
everyone with an equal opportunity to access information from your
agency, program or service. The Committee encourages widespread use of
these modules by public and private entities..."
http://governor.state.tx.us/disabilities/accessibledocs/

Document Accessibility Guide-Microsoft Word
By New Zealand Government.
"This guide is directed at people who use Microsoft Word. It provides
a list of best practice techniques designed to increase the
accessibility of Microsoft Word documents. Some of the accessibility
suggestions in this guide are also designed to assist with the
conversion of Word documents to PDF..."
http://webtoolkit.govt.nz/guides/content-and-design/document-accessibility-guide-microsoft-word/

Mobile Accessibility Tests
By Henny Swan.
"...I thought I'd put some tests together for mobile. This is intended
as a guide you can use in day-to-day testing - you should be able to
answer 'yes' to each question..."
http://www.iheni.com/mobile-accessibility-tests/

HTML Tables and WET Table Parser
By The Canadian Government.
http://wet-boew.github.com/wet-boew/demos/tableparser/index-eng.html

WCAG 2.0 is Now Also ISO/IEC 40500
By Judy Brewer and Shawn Henry.
"...for those who are already working with WCAG 2.0, you can now say
you're also working with an ISO standard, ISO/IEC 40500."
http://www.w3.org/QA/2012/10/wcag_20_is_now_also_isoiec_405.html

Southwest Conference on Disability
By Virginia DeBolt.
"Yesterday Emily Lewis and I gave a presentation on web accessibility
at the Southwest Conference on Accessibility in Albuquerque. We talked
about accessibility tests and what to do with the results of your
tests..."
http://www.webteacher.ws/2012/10/11/southwest-conference-on-disability/

Captioning of Internet Video Programming
By Federal Communications Commission.
"...The following deadlines apply to video programming that a
distributor shows for the first time on the Internet..."
http://www.fcc.gov/guides/captioning-internet-video-programming


+02: CASCADING STYLE SHEETS.

Removing White Space Around Text Fields
By Roger Johansson.
"Trying to be pixel perfect on the Web is like begging to be
frustrated. I try to not worry so much about a pixel here or there,
but sometimes you just have to get complete control to make things
look right..."
http://www.456bereastreet.com/archive/201210/removing_whitespace_around_text_fields/


+03: COLOR.

Easy Color Contrast Ratios
By Lea Verou.
"...I used to think that WCAG-mandated contrast ratios were too
restrictive and basically tried to force you to use black and white, a
sentiment shared by many designers I've spoken to. Surprisingly, in
practice, I found that in most cases they are very reasonable: When a
color combination doesn't pass WCAG, it usually *is* hard to read..."
http://lea.verou.me/2012/10/easy-color-contrast-ratios/

Map Accessibilty Survey for Colorblind People
By Daniel Fluck.
"Colored maps can be a major source of frustation for colorblind
people. While research has been done by cartographers, many maps still
disregard the special requirements for allowing a map to be read with
a reduced color space. Online maps are no exception even though
theoretically the dynamic nature of them could allow for options like
multiple color schemes or even selective highlighting of specific map
features..."
http://www.colblindor.com/2012/10/11/map-accessibilty-survey-for-colorblind-people/


+04: EVALUATION & TESTING.

Predicting Task Completion with the System Usability Scale
By Jeff Sauro.
"...So using survey data to gauge perceptions of usability outside a
usability test probably provides a reasonable measure of task
effectiveness at a high level.  Comparing these scores with those
taken within a usability test is for now risky. Compare surveys to
surveys and usability tests to usability tests."
http://www.measuringusability.com/blog/task-comp-sus.php


+05: EVENTS.

International Day of Persons with Disabilities
Online
December 3, 2012.
www.un.org/disabilities/default.asp?id=1597

WebAIM Training
January 29-30, 2013.
Logan, Utah, U.S.A.
http://webaim.org/training/

ATIA 2012 Orlando
January 30-February 2, 2013
Orlando, Florida, U.S.A.
http://www.atia.org/i4a/pages/index.cfm?pageid=4299

An Event Apart Atlanta
February 18-20, 2013.
Atlanta, Georgia, U.S.A.
http://www.aneventapart.com/2013/atlanta/

International Technology and Persons with Disabilities Conference
February 25-March 2, 2013.
San Diego, Califorina, U.S.A.
http://www.csun.edu/cod/conference/

South By Southwest Interactive
March 8-12, 2013.
Austin, Texas, U.S.A.
http://sxsw.com/interactive


+06: JAVASCRIPT.

ARIA Widgets and Focus/Forms Mode Support in JAWS and NVDA
By Jason Kiss.
"When using ARIA composite application widgets, e.g., combobox,
menubar, tree, authors are expected to implement appropriate keyboard
interaction and focus management. Where screen readers that use
virtual buffers are concerned, notably JAWS, NVDA, and Window-Eyes,
this means invoking their special passthrough mode referred to as
forms mode, focus mode, or sometimes application mode..."
http://www.accessibleculture.org/articles/2012/09/aria-widgets-and-focus-forms-mode-support/


+07: MISCELLANEOUS.

Lessons Learned From a Responsive Design
By Steven Bradley.
"One of the major goals of my recent redesign was to develop this site
responsively. I've talked quite a bit about responsive design the last
few months and don't want to rehash it all, but thought I would share
some of my thoughts and process along with some lessons I learned in
building this site..."
http://www.vanseodesign.com/web-design/responsive-design-lessons/

Viewport Meta Tag For Non-Responsive Design
By Nick La.
"I'm sure you all are using viewport meta tag for responsive design,
but did you know that the viewport tag can also be very useful for
non-responsive design? If you haven't got the time to convert your
design to responsive yet, you should read this article on how to use
viewport tag to improve the appearance of your design on mobile
devices..."
http://webdesignerwall.com/tutorials/viewport-meta-tag-for-non-responsive-design

Responsive Comping: Obtaining Signoff with Mockups
By Matt Griffin.
"If you're making websites, chances are you've given some thought to
what constitutes a responsive-friendly design process-and you've
probably found that adding a mockup for every breakpoint isn't a
sustainable approach. Designing in code sounds like the answer, but
you may be mystified at where to begin-or feel unmoored and
disoriented at the prospect of giving up the approach you've long
relied on. Enter responsive comping. This new, mockup-less web design
process makes it easy to get that Photoshop monkey off your back, and
have a fresh new beginning with your old friend the web browser."
http://www.alistapart.com/articles/responsive-comping-obtaining-signoff-with-mockups/

The Infinite Grid
By Chris Armstrong.
"Grid systems are a key component of graphic design, but they've
always been designed for canvases with fixed dimensions. Until now.
Today you're designing for a medium that has no fixed dimensions, a
medium that can and will shape-shift to better suit its environment-a
medium capable of displaying a single layout on a smartphone, a
billboard in Times Square, and everything in between. You're designing
for an infinite canvas-and for that, you need an infinite grid system.
Discover techniques and guidelines that can help bring structure to
your content whatever the screen size."
http://www.alistapart.com/articles/the-infinite-grid/


+08: NAVIGATION.

10 Tips How To Handle Responsive Navigation Menus Successfully
By Sabina Idler.
"Responsive web design is quite a new approach to handling your
website on different devices. While your content stays the same, the
layout changes according to the screen resolution. Responsive design
allows you to create a unique user experience on different platforms
and at the same time keep maintenance efforts at a minimum..."
http://blog.usabilla.com/10-tips-how-to-handle-responsive-navigation-menus-successfully/


+09: STANDARDS, GUIDELINES & PATTERNS.

Your HTML5 Questions 20
By Richard Clark.
"We're back again to answer some more of your questions. This time
we've included a bonus answer so you’ve got six to go at, rather than
the usual five..."
http://html5doctor.com/your-html5-questions-20/


+10: TOOLS.

Google Doc to Microsoft Office Bookmarklet
By North Carolina State University.
"Some assistive technology users are unable to use the Google Docs
user interface. Often times it is more convenient for them to download
the Google Doc into its corresponding Microsoft Office file format. It
is possible to do this from within a Google Doc by going to the
application's "File" menu and choosing "Download as". However, even
this task can be difficult for some assistive technology users because
of the lack of support for their assistive technology within Google
Docs. This tool provides a convenient way to download a Google Doc
into its corresponding Microsoft Office file format..."
http://accessibility.oit.ncsu.edu/tools/google/download-doc/

HTML Table Validator - Table Usability - Web Experience Toolkit (WET)
By The Canadian Government.
"This validator would help you find any relationship error defined in
your complex table. The validation process can be accomplished by
pasting your HTML table source code without the table element in the
text field below and clicking the button 'Analyse'..."
http://wet-boew.github.com/wet-boew/demos/tableparser/validator-htmltable.html

Accessibility Evaluation Toolbar For FireFox
By Jon Gunderson.
"Support web developers in testing web resources for accessibility features."
https://addons.mozilla.org/en-US/firefox/addon/accessibility-evaluation-toolb/


+11: USABILITY.

User Interface Design, Getting the Basics Right
By Anastasios Karafillis.
"...This article highlights a few, key principles of user interface
design, things all designers should bear in mind when designing a
graphical user interface..."
http://www.uxbooth.com/blog/user-interface-design-getting-the-basics-right/


[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

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 at d.umn.edu

[Issue ends.]

More information about the Webdev mailing list