[webdev] Web Design Update: July 1, 2011

[Laura Carlson]

+++ WEB DESIGN UPDATE.
- Volume 10, Issue 01, July 1, 2011.

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

++ISSUE 01 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: MISCELLANEOUS.
07: NAVIGATION.
08: PHP.
09: STANDARDS, GUIDELINES & PATTERNS.
10: TOOLS.
11: USABILITY.

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

[Contents ends.]


++ SECTION ONE: New references.

+01: ACCESSIBILITY.

Images of Text - Accessibility for Web Writers, Part 7
By Dey Alexander.
"Avoid using images of text on the web because some people will find
them hard, if not impossible, to read. For instance, people with
reading problems such as dyslexia may struggle to read certain fonts,
line spacing or text alignment. If these are 'hard-coded' into an
image, they cannot reformat the text into a more readable style..."
http://www.4syllables.com.au/2011/06/accessibility-web-writers-part-7/

How to Start Adding Captions/Subtitles to Online Videos
By Bill Creswell.
"I was talking to someone today who wanted to start captioning their
videos. This seemed like a good use of a volunteer, so I gave them
some starting out info..."
http://billcreswell.wordpress.com/2011/06/28/how-to-start-adding-captionssubtitles-to-online-videos/

Waiting for Screen Readers to Learn the Semantics of HTML5
By Virginia DeBolt.
"There are new semantic elements in HTML5 with names like header,
article, and nav. But the screen readers haven't quite caught up with
the element names yet. The most recent test results I've seen on how
various browsers and screen readers handle the new HTML5 semantic
elements can be found at Accessible Culture..."
http://www.webteacher.ws/2011/06/27/waiting-for-screen-readers-to-learn-the-semantics-of-html5/

Evaluating Accessibility with ChromeVox
By University of Michigan.
"Google ChromeVox has a very low learning curve and is perhaps the
easiest screen reader for web production folks to use for
accessibility verification. ChromeVox is intended to be the nastive
screen reader for Chrome OS, but it has the worthwhile side benefit of
being available as an extension for the Chrome browser..."
http://www.umich.edu/webaccess/eval/chromevox.html

Assistive Technology Experiment - ZoomText
By Jon Whiting.
"...recently decided to spend some time becoming more familiar with a
few common assistive technologies, starting with the screen
magnification software ZoomText. I have shared a few of my experiences
with ZoomText below..."
http://webaim.org/blog/at-experiment-zoomtext/

Blind Students Sue Florida State University for Discrimination
By National Federation of the Blind.
"...The violations include requiring the students to use an
inaccessible Web-based application to complete homework assignments,
tests, and quizzes; requiring the use of clickers that cannot be used
by a blind person to respond to in-class questions and obtain bonus
credit; failing to provide Braille versions of the required textbooks
in violation of agreed-upon accommodation plans; and engaging in
retaliatory actions when the students complained of these
violations..."
http://www.nfb.org/NewsBot.asp?MODE=VIEW&ID=819

Blind Florida State U. Students Sue Over E-Learning Systems
By Jie Jenny Zou.
"Two blind students at Florida State University have sued the
institution and its Board of Trustees for discrimination, arguing that
a mathematics course at the university relied on e-learning systems
that were not accessible to the disabled..."
http://chronicle.com/blogs/wiredcampus/blind-florida-state-u-students-sue-over-e-learning-systems/

Federal Government Website Accessibility - Still a Long Way to Go
By Jonathan Lazar.
"Website accessibility is conceptually different from a lot of other
types of compliance for people with disabilities, even other
technology compliance. For example, if you design doorways or
bathrooms to be accessible for people with disabilities, once they are
designed, evaluated and meet the proper regulations, you rarely need
to re-check them for compliance. The doorframes don't change on a
monthly basis. Once accessible, they are accessible until they are
structurally altered (or regulations for accessibility are
changed)..."
http://blog.govdelivery.com/usodep/2011/06/federal-government-website-accessibility-still-a-long-way-to-go-.html

Getting to Grips with a Mobile Accessibility Strategy
By Henny Swan. (Misattributed last week. Apologies to Henny.)
"Establishing a mobile accessibility strategy can be a bit daunting.
It's tough to know where to start and even tougher to know where to
stop: what devices should be supported, browsers, apps, access
technology, who is it for and how teams can incorporate best practices
into their working practices?..."
http://www.iheni.com/getting-to-grips-with-a-mobile-accessibility-strategy/


+02: CASCADING STYLE SHEETS.

CSS3 Course (videos)
By Nick Pettit.
This CSS course has sections on borders, gradients, animation,
typography, media queries, selectors, backgrounds at no charge.
http://membership.thinkvitamin.com/library/css3

CSS3 Linear Gradients
By John Allsopp.
"We’re starting with linear gradients. We’ll take a look at where they
come from, how to use them, and the current level of browser support.
Ironically although webkit introduced gradients, until version 5.1,
Safari has supported a different syntax from that described here — so,
if you are using a version of Safari other than 5.1 (currently in
beta) you won’t be able to see the examples..."
http://www.webdirections.org/blog/css3-linear-gradients/

CSS3 Border-Image
By Estelle Weyl.
"A feature that is new in CSS3, but not so new to browsers, is the
border-image property. Border-image provides a method to add
decorative borders to any element. With the border-image properties
you can create decorative borders for elements, beyond simple rounded
corners, with images of very small file size or even with gradients."
http://www.sitepoint.com/css3-border-image/

Techniques for Context Specific Images
By Chris Coyier.
"One of the shortfalls of using CSS media queries as the only
ingredient of a mobile solution is that the same content gets served
to both desktop browsers and mobile devices (which theoretically are
slower and have less network speed). Serving the same HTML to both...
not as big of a deal. Serving up images that are many times bigger
than they need to be on mobile, that's more of a problem. A number of
smart people have tried to solve this problem, so I just wanted to
highlight their work here..."
http://css-tricks.com/9838-techniques-for-context-specific-images/

Farewell Floats - The Future of CSS Layout
By Joshua Johnson.
"Floats are one of the most basic tools for structuring a web page
using CSS. They're both one of the very first things that we learn
about and one of the last things that we truly master. Today's article
looks at some of the reasons that floats are pretty lame and takes a
look at a number of alternative layout systems, some of which are
still under development but may one day represent the standard for
CSS-based layout..."
http://designshack.co.uk/articles/css/farewell-floats-the-future-of-css-layout/

Fighting the TR - CSS Styling Restrictions
By Niels Matthijs.
"How can it be that with several years of intense front-end
experience, you can still get stuck implementing the most trivial of
things from time to time. Not too long ago I okayed a design that
seemed simple enough, but once I sat down to implement it (keeping in
mind IE6/IE7 support) I hit a wall pretty quick. I've questioned the
usefulness of html restrictions before (html headings and the footer
attribute), the same argument can be made for restrictions on css
properties..."
http://www.onderhond.com/blog/work/styling-tr-issues-cross-browser

CSS 2.1 Complete: Unblocking Faster Web Standards Progress
By Adrian Bateman.
"...Finishing CSS 2.1 is a turning point for the Web..."
http://blogs.msdn.com/b/ie/archive/2011/06/28/css-2-1-complete-unblocking-faster-web-standards-progress.aspx


+03: COLOR.

Color Blind Essentials
By Daniel Fluck.
"Many people are looking for the basics about color blindness. So I
wrote the following series on Color Blind Essentials which should give
you a good overview over the most central topics..."
http://www.colblindor.com/2010/02/23/color-blind-essentials/


+04: EVALUATION & TESTING.

Usability Testing is HOT
By Dana Chisnell.
"...People who find usability testing hot say it's about data that can
end the opinion wars, revelations and surprises, and getting
perspective about real use, motivations, and context of use..."
http://usabilitytestinghowto.blogspot.com/2011/06/usability-testing-is-hot.html

Usability Testing - What to Test
By Jacob Creech.
"When you have decided that you want to usability test, one of the
first things you have to consider is what you are going to usability
test..."
http://www.intuitionhq.com/blog/2011/05/website-usability-testing-what-to-test/

Website Usability Test - TED.com
By Jacob Creech.
"Among the more frequent questions that people ask, or more properly,
that people would like to see, is a complete website usability test
from start to finish. That means from your first look at a website,
deciding what questions to write, sharing a test with your testers,
and interpreting the results. This sounds to me like a grand idea;
there is nothing like having a complete walkthrough to help you from
start to finish, and it's a good exercise to go through for us as
well, and so we'd like to introduce the first in our series of Website
Usability Tests - TED.com."
http://www.intuitionhq.com/blog/2011/06/website-usability-test-ted-com/

Website Usability Test - Gizmodo.com
By Jacob Creech.
"This time around we are looking at Gizmodo and seeing how the design
and usability of the site stack up..."
http://www.intuitionhq.com/blog/2011/06/website-usability-testing-gizmodo/


+05: EVENTS.

ARIA and jQuery UI Accessibility Hackathon
July 11-12, 2011.
Toronto, Canada
http://wiki.jqueryui.com/w/page/38817541/ARIA-Hackathon

Human-Computer Interaction
July 12-14, 2011.
Orlando, Florida, U.S.A.
http://www.hcii2011.org/

Usability Week 2011 San Francisco
September 25-30, 2011.
San Francisco, California, U.S.A.
http://www.nngroup.com/events/san_francisco/agenda.html

The Future of Web Apps London
October 3-5, 2011.
London, United Kingdom
http://futureofwebapps.com/london-2011/

Usability Week 2011 Austin
October 3-7, 2011.
Austin, Texas, U.S.A.
http://www.nngroup.com/events/austin/agenda.html

Web 2.0 Expo
October 10-13, 2011.
New York, New York, U.S.A.
http://www.web2expo.com/webexny2011/

Usability Week 2011 London
November 13-18, 2011.
London, United Kingdom.
http://www.nngroup.com/events/london/agenda.html


+06: MISCELLANEOUS.

Web Designers Roadmap for 2011
By Stefan Mischook.
"What to learn (as of 2011-2012) - in order of priority: 1. HTML, 2.
CSS, 3. PHP basics, 4. Javascript, 5. JQuery, 6. Wordpress, 7. OOP PHP
(for programmers only), 8. HTML 5 and CSS 3, 9. iPad / iPhone (choice
of either: Objective C or HTML 5 + CSS 3)..."
http://www.killersites.com/blog/2011/web-designers-roadmap-for-2011/

Findings From the Web Design Survey, 2010
by ALA Staff.
"It was just five years ago that this magazine and its design
conference offshoot sought, with your help, to begin determining the
precise professional dimensions of our shared craft..."
http://www.alistapart.com/articles/findings-from-the-web-design-survey-2010/


+07: NAVIGATION.

How ARIA Landmark Roles Help Screen Reader Users
By Leonie Watson.
"This video from Nomensa demonstrates how ARIA landmark roles help
screen reader users understand the purpose of different areas of a web
page, such as search, navigation or main content."
http://www.youtube.com/watch?v=IhWMou12_Vk

Three Easy Metrics for Improving Website Navigation
By Jeff Sauro.
"Here are three simple metrics which can be collected as part of tests
using card-sorting or tree-testing in any stage of design..."
http://www.measuringusability.com/blog/navigation-metrics.php

Creating Meaningful Site Search by Challenging Assumptions
By Emily Smith.
"The role of search in your site can be a hot topic. Sometimes there
is pressure to make it a giant bandage to cover poor navigational
structure, and other times it's included just because 'every site
needs search.' Let's look at three pervasive myths about search and
two questions that will help us create a strategy unique to every
site..."
http://designfestival.com/creatin-meaningful-site-search-by-challenging-assumptions


+08: PHP.

PHP Documentation Update
By Hypertext Preprocessor.
"PHP has several new documentation features that the community should
be aware of..."
http://www.php.net/index.php#id2011-06-25-1


+09: STANDARDS, GUIDELINES & PATTERNS.

Irreconcilable Differences
By Larry Masinter.
"The ongoing battle for future control over HTML is dominated not only
by the usual forces ('whose technology wins?') but also some very
polarized views of what standards are, what they should be, how
standards should work and so forth. The debate over these prinicples
has really slowed down the development of web standards..."
http://masinter.blogspot.com/2011/06/irreconcilable-differences.html

Why HTML5 Elements INS and DEL Suck
By Daniel Glazman.
"I have said it multiple times here, in W3C mailing-lists or in public
between 1998 and now but apparently it must be said again and again:
the current HTML5 Last Call Working Draft - that does not reach at all
the quality of other LCWD in the W3C and did not meet the basic
requirements for a LCWD in the W3C Process - still has not worked on
that erratum. So let me repeat it : html5 ins and del elements suck
and should be dropped in favor of a better solution..."
http://www.glazman.org/weblog/dotclear/index.php?post/2011/06/25/Why-html5-elements-INS-and-DEL-suck

Knowing When to Break the Rules
By Derek Featherstone.
"If breaking a rule like validation by adding ARIA means that your
interface becomes more accessible then do it."
http://simplyaccessible.com/article/break-the-rules/

HTML5 Elements: An Irresponsible Choice...Right Now
By Trevor Davis.
"Ok, before we get too far into this, I want to say this: I fully
support web standards and progressive enhancement..."
http://www.viget.com/inspire/html5-elements-irresponsible-choice-right-now/

Quoting and Citing with <blockquote>, <q>, <cite>, and the cite attribute
By Oli Studholme.
"Given HTML's roots in the academic world, it should be no surprise
that quoting is well-accommodated in the elements <blockquote> and
<q>, with their optional cite attribute. In addition, there's the
<cite> element, which over the last nine years went from 'semantic
orphan element made good' to one of the more contentious elements in
HTML5. Let's power up the endoscope and examine the scarring, starting
with <blockquote>...."
http://html5doctor.com/blockquote-q-cite/

Retain Accessibility Immediately
By Douglas Schepers.
"There has been a heated argument recently on the W3C Canvas API
mailing list between accessibility advocates and browser vendors over
a pretty tricky topic: should the Canvas API have graphical 'objects'
to make it more accessible, or should authors use SVG for that?..."
http://schepers.cc/retain-a11y-immediately


+10: TOOLS.

aViewer Beta - Updated
By Steve Faulkner.
"...Here at TPG we have been working on a new tool to inspect elements
on a web page and be able to view the HTML code, ARIA attributes (if
any) and the information being conveyed by the browser to
accessibility APIs, all in one neatish interface. We have given it the
catchy moniker 'AViewer' and a beta version is available for
download...Runs on Windows only."
http://www.paciellogroup.com/blog/2011/06/aviewer-beta-updated/

CSS3, Please! The Cross-Browser CSS3 Rule Generator
By Paul Irish and Jonathan Neal.
"You can edit the underlined values in this css file, but don't worry
about making sure the corresponding values match, that's all done
automagically for you. Whenever you want, you can copy the whole or
part of this page and paste it into your own stylesheet."
http://css3please.com/


+11: USABILITY.

What is Usability?
By Jacob Creech.
"...Today I'd like to talk about what usability is, and why it's so
important..."
http://www.intuitionhq.com/blog/2011/05/what-is-usability/


[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

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.]