[webdev] Web Design Update: July 1, 2012

Laura Carlson lcarlson at d.umn.edu
Sun Jul 1 09:51:45 CDT 2012


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

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: EVENTS.
05: JAVASCRIPT.
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.

Four Keys to System-wide Web Accessibility
By Jon Whiting.
"The main focus of the GOALS project (a partner of WebAIM) is to help
institutions of higher education develop a system-wide approach to web
accessibility. At the beginning of the GOALS project, we analyzed
several exemplary post-secondary institutions to identify what sets
these institutions apart from schools that have been less successful
in implementing web accessibility. These findings helped form
Recommended Practice Indicators for Institutional Web Accessibility.
This document is targeted to higher education, but I think the four
principles at its foundation are universal. They are (in less academic
terms)..."
http://webaim.org/blog/four-keys-to-accessibility/

How do You Solve the Accessible Video and Audio Challenge?
By Glenda Sims.
"After a decade of working in the field of web accessibility, I still
hear people who think that creating accessibile multimedia for the web
is too expensive and too hard to do. I'll admit, I was initially
overwhelmed by the challenges. But today, I know that accessible
multimedia is doable and smart business. You just need to know how to
be super efficient with your resources and how to prioritize. And
while I know a lot about this topic, it is evolving and I can always
learn more from the accessibility tribe..."
http://www.glendathegood.com/blog/?p=718

Federal Judge Rules that ADA Covers Web-only Businesses
By Lainey Feingold.
"Those who believe that web content should be available to everyone
regardless of disability received welcomed news on Tuesday, June 19.
On that day, a federal district court judge in Massachusetts held that
the Americans with Disabilities Act (ADA) applies to web-only
businesses. The ruling came in a case brought by the National
Association of the Deaf (NAD) against Netflix for the streaming video
giant's failure to provide closed captioning on most of its 'Watch
Instantly' programming streamed on the Internet. Netflix had tried to
get the case thrown out of court, arguing that the ADA only applies to
physical places, and not to a web-only operation like Netflix'
streaming video service..."
http://lflegal.com/2012/06/netflix/

Ruling on Accessibility and the ADA
By Andrew Kirkpatrick.
"The United States District Court in Massachusetts ruled June 19 on a
motion to dismiss a suit brought against Netflix by the National
Association of the Deaf (NAD) and others. The suit is about Netflix
not providing enough captions for videos delivered via the 'Watch
Instantly' site, but the ruling addresses the applicability of the
Americans with Disabilities Act (ADA) for electronic accessibility in
general, not just limited to access issues for users who are deaf or
hard of hearing..."
http://blogs.adobe.com/accessibility/2012/06/ruling-on-accessibility-and-the-ada.html

Let's Put Down the Pitchforks and Get Some Perspective
By Karl Groves.
"...As a community, I think it is important that we remember to take
into consideration the way we deliver our message. The single best
trait that is universal among the people I've encountered in this
community is our shared passion for making things better for others
and it is the closest thing to true altruism I've ever experienced. We
must remember, however, that we're running a marathon and not a
sprint..."
http://www.karlgroves.com/2012/06/21/lets-put-down-the-pitchforks-and-get-some-perspective/


+02: CASCADING STYLE SHEETS.

Using Media Queries to Hide CSS3 from Older Browsers
By Roger Johansson.
"When working around bugs and different levels of support in various
browsers, a common approach is using conditional comments to target
certain versions of Internet Explorer. Come to think of it, it's
pretty rare to need to fix something for an older version of any other
browser. People who do not use IE tend to upgrade quicker and
CSS-related bugs in other browsers tend to be less severe than in IE,
especially compared to IE7 and older..."
http://www.456bereastreet.com/archive/201206/using_media_queries_to_hide_css3_from_older_browsers/

Powerful New CSS- and JavaScript Techniques
By Smashing.
"Since the release of the previous post, we've been collecting,
sorting, filtering and preparing a compact overview of powerful new
CSS techniques. Today we finally present some of these techniques. Use
them right away or save them for future reference..."
http://coding.smashingmagazine.com/2012/06/21/powerful-new-cssjavascript-techniques/

Using Min/Max Width and Height in CSS
By Louis Lazaris.
"Even if you're just getting started with CSS, you've likely used the
height and width properties quite a bit already. But you've probably
noticed that those properties can put unnecessary constraints on your
page elements. So you might benefit from knowing and using related
properties that use the 'min' and 'max' prefixes..."
http://www.impressivewebs.com/min-max-width-height-css/

Working with CSS Regions and Shadow DOM
By Razvan Caliman.	
"When we set out to develop CSS Regions we knew that most innovative
applications of the technology would come from creative integrations
with other web standards. Shadow DOM is one such example of a web
standard just itching to be experimented with..."
http://blogs.adobe.com/webplatform/2012/06/25/working-with-css-regions-and-shadow-dom/


+03: COLOR.

F-M 100 Hue Test - Compare Your Result with Others
By Daniel Fluck.
"A few days ago I released the F-M 100 Hue Color Vision Deficiency
Test on Colblindor. Since then many people have taken the test which
makes it possible to give you some added value on the test. From today
on you can also compare your result with 'the rest of the world'..."
http://www.colblindor.com/2012/06/25/f-m-100-hue-test-compare-your-result-with-others/


+04: EVENTS.

The Future Of Web Design
October 22-24, 2012.
New York, New York, U.S.A.
http://futureofwebdesign.com/new-york-2012/

User Interface 17 Conference
November 5-7, 2012.
Boston, Massachusetts, U.S.A.
http://www.uie.com/events/uiconf/2012/

Full Frontal 2012
November 9, 2012.
Brighton, England, United Kingdom
http://2012.full-frontal.org/


+05: JAVASCRIPT.

JavaScript Closures Demystified
By Colin Ihrig.
"Closures are a somewhat advanced, and often misunderstood feature of
the JavaScript language. Simply put, closures are objects that contain
a function and a reference to the environment in which the function
was created. However, in order to fully understand closures, there are
two other features of the JavaScript language that must first be
understood―first-class functions and inner functions..."
http://www.sitepoint.com/javascript-closures-demystified/

ARIA role=alert Browser Support
By Steve Faulkner.
"ARIA role=alert is supported across modern browsers and assistive
technology, but implementation in browsers differ, which can lead to
role=alert appearing to be unsupported..."
http://www.paciellogroup.com/blog/2012/06/html5-accessibility-chops-aria-rolealert-browser-support/

Notes on Using ARIA
By Steve Faulkner.	
"I have jotted down some notes on ARIA concepts and usage that may be
useful for developers. The first rule of ARIA use: If you can use a
native HTML element or attribute instead of an ARIA role, state or
property, then do so..."
http://www.paciellogroup.com/blog/2012/06/html5-accessibility-chops-using-aria-notes/


+06: MISCELLANEOUS.

Why HTML5 Urgently Needs an HTML Adaptive Images Mechanism
By Bruce Lawson.
"...Webkit has implemented a new non-standard CSS function called
-webkit-image-set...I bet it's 0.03 nanoseconds before developers
convert <img src="foo.blah" alt="useful alternate text"> into an empty
<div>s with adaptive background images using -webkit-image-set and
(please!) a fallback background images for non-webkit browsers. Why
wouldn't they? Retina screens will download massive but beautiful
images, while users of lower-res phones save bandwidth by downloading
smaller images instead of huge images and then reducing them down.
Problem solved. And, unfortunately, people who don't download images,
or can't perceive images won't get any alternate text, as there is no
content <img> element any more. Those guys have always been last in
the pecking order and there's no reason to assume they'll get a better
deal this time."
http://www.brucelawson.co.uk/2012/html5-urgently-needs-adaptive-images-mechanism/

Optimizing vs. Adapting for Devices
By Luke Wroblewski.
"In multi-device adaptation vs. optimization I highlighted a common
distinction between responsive Web design and server-side solutions
for adjusting Web sites to different devices. Later I read two
articles that did a good job of illustrating this distinction..."
http://www.lukew.com/ff/entry.asp?1572

Are Tablets Mobile Devices?
By Luke Wroblewski.
"Many organizations include tablets in their overall definition of
'mobile"' computing. But when you look at where and when tablets are
being used today, they're much more "mobile in the home" than
mobile..."
http://www.lukew.com/ff/entry.asp?1571

Survey - Tablet Owners Prefer Browsers to Native Apps
By John Paul Titlow.
"...Among tablet owners, at least, reading on the mobile Web is
preferable to using native apps, according to a recent survey from the
Online Publishers Association. Forty-one percent of tablet-bound
readers prefer reading on the Web, compared to the 30% who would
rather launch a standalone app from a specific publisher."
http://www.readwriteweb.com/archives/survey-tablet-owners-prefer-browsers-to-native-apps.php


+07: NAVIGATION.

Enhancing ARIA Landmarks with Aria-Labelledby
By Leonie Watson.
"ARIA landmark roles provide a useful way for screen reader users to
navigate through web pages, and to understand the purpose of different
sections of content on the page. With just a little bit more ARIA you
can make landmarks even more helpful to blind and partially sighted
people..."
http://tink.co.uk/2012/06/enhancing-aria-landmarks-with-aria-labelledby/

Expandable Mobile Search Form
By Nick La.
I'm going to share a CSS tutorial on how to make an expandable search
form that is suitable for mobile and responsive designs. This trick
uses native CSS properties - no Javascript or extra markups required.
It is a simple and effective way to design a compact search form.
http://webdesignerwall.com/tutorials/expandable-mobile-search-form


+08: STANDARDS, GUIDELINES & PATTERNS.

HTML5 Multimedia: Using Video with Canvas
By Ian Devlin.
"In addition to native multimedia, one of the most talked about
capabilities that HTML5 brings to the web table is the ability to draw
and manipulate graphics using JavaScript via the new canvas element.
The element defines an area on a web page that you can draw on using a
JavaScript API. Ian Devlin shows you how to use it..."
http://www.peachpit.com/articles/article.aspx?p=1760497&WT


+09: TYPOGRAPHY.


How To Maintain Readable Type In Responsive Design
By Steven Bradley.
"Setting type involves choices that create proportional relationships
in your text. Done well and your text will be both easy and desirable
to read. As responsive layouts adapt to varying screen widths, one of
these choices (line-length) changes. To maintain the same proportional
relationships other aspects of the type need to adjust..."
http://www.vanseodesign.com/web-design/responsive-typography/


+10: USABILITY.

7 Cs of Uuality Web Content.
By Dey Alexander.
"If you want to write better content for your website, intranet or
blog, aim for these 7 qualities. They're based on the classic '7 Cs of
communication', reworked for communicating online..."
http://www.4syllables.com.au/2012/06/7-cs-web-content/

Is There a Real Issue?
By Russ Weakley.
"The Australian Museum web team recently discussed some potential
tweaks to the What's on page. During the discussion, the web manager,
Lynda Kelly, asked the key question - 'Is there a real problem
here'..."
http://www.maxdesign.com.au/2012/06/21/is-there-a-real-problem/

Getting Agreement for Your Homepage
By Paul Boag.
"Social media, search engines and deep linking have all reduced the
importance of your homepage. However, that doesn't stop everybody from
wanting their content on it..."
http://boagworld.com/business-strategy/getting-agreement-for-your-homepage/

Balancing Simplicity and Complexity
By Gerry McGovern.
"Do people want a simple life? Or do they want the complex life made simple?..."
http://www.gerrymcgovern.com/nt/2012/nt-2012-06-25-Complexity-simplicity.htm


[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