[webdev] Web Design Update: February 21, 2013

Thu Feb 21 06:10:14 CST 2013

+++ WEB DESIGN UPDATE.
- Volume 10, Issue 35, February 21, 2013.

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

++ISSUE 35 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: EVALUATION & TESTING.
05: EVENTS.
06: HTML5.
07: INFORMATION ARCHITECTURE.
08: MISCELLANEOUS.
09: NAVIGATION.
10: STANDARDS, GUIDELINES & PATTERNS.
11: USABILITY.

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

[Contents ends.]

++ SECTION ONE: New references.

+01: ACCESSIBILITY.

Text Alternatives for Images with Captions
By Dey Alexander.
"Web writers must provide a text alternative for informative or
functional images they use in their content. But what should you do
when the image also needs a caption? Three methods are commonly used,
but none are ideal. In this article I'll explain why and suggest an
alternative."
http://www.4syllables.com.au/2013/02/text-alternatives-images-captions/

How Should You Markup the First Instance of an Acronym in Body Copy?
By Derek Featherstone.
"This week's Ask the Sherpas question comes from reader Trevor
Brennan: How should someone markup the first instance of an acronym
(within body copy) where its acronym directly proceeds its definition:
eg. 'Web Content Accessibility Guidelines (WCAG)'..."
http://www.facebook.com/notes/web-standards-sherpa/how-should-you-markup-the-first-instance-of-an-acronym-in-body-copy/477296439004474

How Does Accessible Web Design Benefit All Web Users?
By AccessibleTech.
"There are many examples in society of innovations that were
originally intended for people with disabilities but that have
provided access benefits to all people (curb cuts and automatic door
openers are two of the most common). Accessible web content is a
similar innovation. Web content designed in a way that is accessible
to people with disabilities additionally benefits many non disabled
users and often benefits all users.Following are specific examples..."
http://www.accessibletech.org/access_articles/webinfo/accessibleWebBenefit.php

How to Future Proof Your Accessibility Efforts
By A11Y Project.
"Future proofing your accessibility work will help lower your
development costs as well as support current and future user agents,
such as assistive technologies (AT). WCAG has 2 guidelines, Parsing
and Name, role, value, for futureproofing your website..."
http://a11yproject.com/posts/future-proof-your-accessibility/

Web Accessibility Checklist
By A11Y Project.
"A handy HTML accessibility checklist..."
http://a11yproject.com/checklist.html

+02: CASCADING STYLE SHEETS.

Using Flexbox - Mixing Old and New for the Best Browser Support
By Chris Coyier.
"Flexbox is pretty awesome and is certainly part of the future of
layout. The syntax has changed quite a bit over the past few years,
hence the 'Old' and 'New' syntax. But if we weave together the old,
new, and in-between syntaxes, we can get decent browser support.
Especially for a simple and probably the most common use case:
order-controlled grids..."
http://css-tricks.com/using-flexbox/

Flexbox Syntax for IE 10
By Zoe Mickley Gillenwater.
"Yesterday in my presentation on CSS3 Layout I talked about the
different syntaxes that the Flexible Box Layout module (Flexbox) has
gone through on its journey to candidate recommendation. As I said in
my talk, IE 10 didn't have time to update to the new syntax before it
came out last fall, so it uses the syntax that first came out in 2011,
with the -ms- prefix tacked on..."
http://zomigi.com/blog/flexbox-syntax-for-ie-10/

New CSS Tests - Selectors and Columns
By Peter-Paul Koch.
"Over the weekend I finished the first two CSS compatibility tables
new style: selectors and columns. These tests are almost complete (a
few selectors are missing), and have been executed in 40 or so
browsers, desktop and mobile."
http://www.quirksmode.org/blog/archives/2013/02/new_css_tests_s.html

Point Break
By Ian Devlin.
"If you've been working with responsive web design then you will be
familiar with the term 'breakpoint' being used to define a media query
with a browser width (usually although height can be used too) at
which something in the website's layout or look should be changed. The
name itself though has a negative connotation..."
http://www.iandevlin.com/blog/2013/02/opinion/point-break

+03: COLOR.

Color, Contrast and 1194.21
By Michael Adams.
"I was recently asked about a software issue involving problems with color..."
http://theaccesspond.com/2013/02/14/color-contrast-and-1194-21/

+04: EVALUATION & TESTING.

Overcoming Participants' Test Mentality - Qualitative Research
Approaches for Web Sites
By Steve Mellor.
"User experience..., perhaps more than any other area of qualitative
research, really requires some thought about the best approach for
each brief. … Because doing face-to-face UX research has some
disadvantages that can really impact the reliability of the research
findings."
http://www.uxmatters.com/mt/archives/2013/02/overcoming-participants-test-mentality-qualitative-research-approaches-for-web-sites.php

Hypothesis Testing in the User Experience
By Jeff Sauro.
"...While the process of subjecting data to statistical analysis
intimidates many designers and researchers (recalling those school
memories again), remember that the hardest and most important part is
working with a good testable hypothesis. It takes practice to convert
fuzzy business questions into testable hypotheses. Once you've got
that down, the rest is mechanics..."
http://www.measuringusability.com/blog/hypothesis-ux.php

+05: EVENTS.

Breaking Development
October 21-23, 2013.
Nashville, Tennessee, U.S.A.
http://bdconf.com/2013/nashville

edUi
November 4-6, 2013.
Richmond, Virginia, U.S.A.
http://eduiconf.org/

Confab Higher Ed
November 11-12, 2013.
Atlanta, Georgia, U.S.A.
http://confabevents.com/events/higher-ed-2013

+06: HTML5.

Screen Reader Support for HTML5 Sections
By Leonie Watson.
"HTML5 includes a handful of section elements that give documents a
robust semantic structure. The header, footer, nav, article, section
and aside elements give different regions of a document meaning.
Amongst other things, that meaning can be understood by screen
readers, and the information used to help blind and partially sighted
people orient themselves and navigate around the page..."
http://tink.co.uk/2013/02/screen-reader-support-for-html5-sections/

+07: INFORMATION ARCHITECTURE.

Web Accessibility for Information Architects - Part I
By Glenda Sims.
"This post is the first in a two-part series about Accessibility and
Information Architecture by Deque Director of Consulting Methodology &
Quality, Glenda Sims..."
http://www.deque.com/web-accessibility-information-architects-part-one

Web Prototyping for Touch Gestures
By Sanjay Raval.
"In this article, you'll learn how to create a web prototype with
touch gestures using simple and easy HTML, CSS and jQuery..."
http://www.sitepoint.com/web-prototyping-for-touch-gestures/

+08: MISCELLANEOUS.

Interview - Lea Verou on Why Web Standards Matter and How You Can Help
By Webmonkey.
"This is the first in a coming series of interviews with web
developers. We're excited to start with Lea Verou, a front-end web
developer from Greece who has not only made lots of cool stuff we've
linked to, but also recently joined the W3C to help work on web
standards."
http://www.webmonkey.com/2013/02/developer-lea-verou-on-why-web-standards-matter/

Responsive Web Design - Planning For The Future
By Drew Thomas.
"When considering a mobile Web strategy and weighing responsive Web
design against a separate mobile website, the most important metric is
how functional the website is for the user. This goes beyond better
content organization for smaller screens. Mobile (and desktop)
websites should be easily found, easily shared, fast loading, easy to
maintain and easy to build on..."
http://mobile.smashingmagazine.com/2013/02/14/responsive-web-design-planning-future/

+09: NAVIGATION.

Video - How ARIA's Landmark Roles Work
By Scott Gilbertson.
"We've written a lot about how you can make your website more
accessible with WAI ARIA roles, particularly ARIA's Landmark roles. As
a bonus you can also use the roles to style elements..."
http://www.webmonkey.com/2013/02/video-how-arias-landmark-roles-work/

+10: STANDARDS, GUIDELINES & PATTERNS.

These Apples Don't Taste Like Oranges - Let's Burn Down the Orchard
By Christian Heilmann.
"When I see comparisons of HTML5 to native apps I get the feeling that
the way we measure failure and success could give statisticians a
heart attack..."
http://christianheilmann.com/2013/02/19/these-apples-dont-taste-like-oranges-lets-burn-down-the-orchard/

+11: USABILITY.

10 Web Usability Tips
By Alex Caldwell.
"Usability is the most important function of every website. It doesn't
matter how attractive your site is. If it isn't easy to use, it won't
engage your audience. While the following tips are the best practices
that I've developed over several years, they're open to interpretation
and are simply what I believe is generally important. As technology
continues to evolve, these tips will evolve as well, but the main
concepts and principles will stay the same."
http://brolik.com/blog/10-web-usability-tips/

How Do Users Really Hold Mobile Devices?
By Steven Hoober.
"Everything changes with touchscreens. On today's smartphones, almost
the entire front surface is a screen. Users need to be able to see the
whole screen, and may also need to touch any part of it to provide
input. Since my old data was mostly from observations of users in the
lab-using keyboard-centric devices in too many cases - I needed to do
some new research on current devices. My data needed to be more
unimpeachable, both in terms of its scale and the testing environment
of my research."
http://www.uxmatters.com/mt/archives/2013/02/how-do-users-really-hold-mobile-devices.php

QA and UX
By Jakob Nielsen.
"Quality assurance impacts the user experience: when things don't
work, users question their understanding and develop superstitions and
inefficient workarounds."
http://www.nngroup.com/articles/quality-assurance-ux/

[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

Dreamweaver Information.
http://www.d.umn.edu/itss/training/online/webdesign/dreamweaver.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

Flash Information.
http://www.d.umn.edu/itss/training/online/webdesign/flash.html

HTML5 Information.
http://www.d.umn.edu/itss/training/online/webdesign/html5.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.]