[webdev] Web Design Update: March 7, 2013

Laura Carlson lcarlson at d.umn.edu
Thu Mar 7 06:03:51 CST 2013


+++ WEB DESIGN UPDATE.
- Volume 10, Issue 37, March 7, 2013.

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

++ISSUE 37 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: EVALUATION & TESTING.
04: EVENTS.
05: HTML5.
06: JAVASCRIPT.
07: MISCELLANEOUS.
08: STANDARDS, GUIDELINES & PATTERNS.
09: TOOLS.
10: USABILITY.
11: XML.

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

[Contents ends.]


++ SECTION ONE: New references.

+01: ACCESSIBILITY.

Inaccessible by Choice - PDF on MacOS
By Duff Johnson.
"An accessibility expert pointed out the other day that VoiceOver,
Apple's screen reader for MacOS, doesn't understand tagged PDF, and
therefore doesn't support accessibility in this extremely common
electronic document format. He's right. Since there aren't any screen
reader options for the Mac that understand PDF tags, it's fair to say
that AT users on a Mac don't have the same access to content as do
Windows users..."
http://duff-johnson.com/2013/03/01/inaccessible-by-choice-pdf-on-macos/

WebVTT and Captioning on the Web
By Silvia Pfeiffer.
"The HTML5 <video> and <track> elements have brought native captions
to the web. Interoperable captions between browsers are enabled
through the new file format WebVTT (Web Video Text Tracks)."
http://www.accessiq.org/news/features/2013/03/webvtt-and-captioning-on-the-web

Google Launches Sign Language Interpreter App For Hangouts, Adds
Accessibility Features To Gmail, Drive And Chrome
By Frederic Lardinois.
"At the CSUN International Technology and Persons with Disabilities
Conference this week, Google announced that it has added a number of
accessibility features to Chrome, Chrome OS, Gmail and Google Drive
that should make using Google suites of web apps a bit easier to use
for blind and low-vision users..."
http://techcrunch.com/2013/03/01/google-launches-sign-language-interpreter-app-for-hangouts-adds-accessibility-features-to-gmail-drive-and-chrome/

Making the Cloud more Accessible with Chrome and Android
By T.V. Raman.
"If you're a blind or low-vision user, you know that working in the
cloud poses unique challenges. Our accessibility team had an
opportunity to address some of those challenges at the 28th annual
CSUN International Technology and Persons with Disabilities Conference
this week. While there, we led a workshop on how we've been improving
the accessibility of Google technologies. For all those who weren't at
the conference, we want to share just a few of those improvements and
updates..."
http://googleblog.blogspot.com/2013/02/making-cloud-more-accessible-with.html

Accessibility for Google Apps
By Google.
A new site by Google.
http://support.google.com/a/bin/topic.py?hl=en&topic=2994293

Google Accessibility Update - CSUN 2013 Workshop
By Radek Pavlcek.
"On Tuesday I attended the whole day workshop, called Google
Accessibility Update, which was led by T. V. Raman..."
http://poslepu.blogspot.com/2013/02/google-accessibility-update-csun-2013.html

Forgotten of Web Accessibility: CSUN 2013 Talk
By Roger Hudson.
Roger's CSUN presentation slides.
http://usability.com.au/2013/03/forgotten-of-web-accessibility-csun2013-talk/


+02: CASCADING STYLE SHEETS.

Make Your Website Printable With CSS
By Adrian Roselli.
"Responsive design isn't just about screen size; it also means
adapting to different media - including print. Adrian Roselli shares
some techniques "
http://www.netmagazine.com/tutorials/make-your-website-printable-css

How to Shrinkwrap and Center Elements Horizontally
By Roger Johansson.
"When you use CSS to float an element that does not have an explicit
width, the element's width becomes its 'shrink-to-fit' width. This is
useful when you're floating elements that you don't know how wide they
need to be. A very common example is a navigation bar, where you often
want the width of the links to vary depending on how much text they
contain..."
http://www.456bereastreet.com/archive/201303/how_to_shrinkwrap_and_center_elements_horizontally/

3 Types of Breakpoints In Responsive Designs
By Steven Bradley.
"One of the more important questions you'll have to answer in a
responsive design is  where to set breakpoints..."
http://www.vanseodesign.com/web-design/3-breakpoint-types/

Building On The Measure - Logical Breakpoints For Your Responsive Design
By Vasilis van Gemert.
"There are several tactics for deciding where to put breakpoints in a
responsive design. There is the rusty idea that they should be based
on common screen sizes, but this doesn't scale well. There are no
'common' screen sizes. Another popular tactic is to create a
breakpoint wherever the layout breaks.
http://www.smashingmagazine.com/2013/03/01/logical-breakpoints-responsive-design/

How to Build a Better Button in CSS3
By Craig Buckler.
"Let's build a better button using CSS3 styles, animations and
transformations..."
http://www.sitepoint.com/build-a-better-button-in-css3/


+03: EVALUATION & TESTING.

Adapting your Usability Testing Practice for Mobile
By David Travis.
"There's no better way to get feedback on the usability of your mobile
app than by running a usability test. Although the process is the same
as when testing a desktop app, there are quite a few differences in
the details. Adjust your test to take account of these differences and
you'll be better placed to identify the real problems that real users
will have with your app when used in an authentic context. ..."
http://www.userfocus.co.uk/articles/testing-for-mobile.html


+04: EVENTS.

The Amaze Digital Accessibility Grant
Due date is 11:59 pm EST on May 1, 2013.
Apply Online
http://www.deque.com/amazegrant

Accessing Higher Ground
November 4-8, 2013.
Westminster, Colorado, U.S.A.
http://accessinghigherground.org/

World Usability Day
November 14, 2013.
Everywhere
http://www.worldusabilityday.org/

Accessibility Everywhere: Groundwork, Infrastructure, Standards
(AEGIS) International Conference
November 28-30, 2013.
Brussels, Belgium
http://www.epr.eu/aegis/

International Day of People with Disability
December 3, 2013.
Online
http://www.idpwd.com.au/


+05: HTML5.

HTML5 Forms Input Types
By Richard Clark.
"In the first article in this series we looked at the history of HTML5
forms and many of the new attributes available to us. In this second
and final part of the series, we'll look at the new input types
available in HTML5. As we'll see, these new features will go a long
way toward making your life easier while delivering a delightful user
experience. The best thing about all this? You can start using them
now..."
http://html5doctor.com/html5-forms-input-types/

6 Nifty, Time-Saving HTML Attributes
By Charles Manfre.
"There are dozens upon dozens of HTML attributes. Some are well-known
and widely used, such as style and href, while others are more
obscure..."
http://www.sitepoint.com/6-nifty-time-saving-html-attributes/

HTML's New Template Tag
By Eric Bidelman.
"This article discusses APIs that are not yet fully standardized and
still in flux. Be cautious when using experimental APIs in your own
projects."
http://www.html5rocks.com/en/tutorials/webcomponents/template/


+06: JAVASCRIPT.

Modern Web Accessibility with JavaScript and WAI-ARIA
By Paul J. Adam.
Paul's CSUN presentation slides.
http://pauljadam.com/moderna11y/

Accessibility of HTML5 and Rich Internet Applications - CSUN 2013
Workshop Material
By Hans Hillen and Steve Faulkner.
Hans and Steve's CSUN presentation slides.
http://www.paciellogroup.com/training/CSUN2013/

A Plain English Guide to JavaScript Prototypes
By Sebastian Porto.
"When I first started learning about JavaScript object model my
reaction was of horror and disbelief. I was totally puzzled by its
prototype nature as it was my first encounter with a prototype based
language. I didn't help that JavaScript has a unique take on
prototypes as it adds the concept of function constructors. I bet that
many of you have had similar experience."
http://sporto.github.com/blog/2013/02/22/a-plain-english-guide-to-javascript-prototypes/

Douglas Crockford on 'Syntaxation'
Douglas Crockford's talk at the mloc.js Conference in Budapest. The
talk' topic is syntax: what it's for, what it can cost and what
language designers should be aware of.
http://www.ustream.tv/recorded/29297101

The Beginner's Guide to JavaScript Date and Time
By Rakhitha Nimesh.
"Date and time values are used for many important functions such as
searching, validation, and report generation. There is no standard
format for dates in web applications, as people in different time
zones and countries prefer different formats. Therefore, adapting to
any kind of date format can be a challenge as a front end developer.
Today, we are going to see how to effectively use date and time
functions in JavaScript..."
http://www.sitepoint.com/beginners-guide-to-javascript-date-and-time/


+07: MISCELLANEOUS.

CSUN 2013 Videos
By Web Able TV.
Presentations and interviews from the 28th Annual International
Technology and Persons with Disabilities Conference.
http://www.webable.tv/FeaturedContent/WebAbleTVUpcomingandRecentWebcast/CSUN2013.aspx


+08: STANDARDS, GUIDELINES & PATTERNS.

Our Work Here is Done
By Aaron Gustafson, Bruce Lawson, and Steph Troeth.
"When The Web Standards Project (WaSP) formed in 1998, the web was the
battleground in an ever-escalating war between two browser
makers-Netscape and Microsoft-who were each taking turns 'advancing'
HTML to the point of collapse. You see, in an effort to one-up each
other, the two browsers introduced new elements and new ways of
manipulating web documents; this escalated to the point where their
respective 4.0 versions were largely incompatible..."
http://www.webstandards.org/2013/03/01/our-work-here-is-done/

Jeffrey Zeldman on the Dream of a Standards-Based Web
By Jeffrey Zeldman.
"The father of web standards fondly remembers The Web Standards
Project and how it revolutionised the industry."
http://www.netmagazine.com/opinions/jeffrey-zeldman-dream-standards-based-web

The The Stinger
By Eric A. Meyer.
"(In television, the 'stinger' is the clip that plays during or just
after the closing credits of a show.) On Friday, the Web Standards
Project announced its own dissolution.  I felt a lot of things upon
reading the announcement, once I got over my initial surprise:
nostalgia, wistfulness, closure.  And over it all, a deep sense of
respect for the Project as a whole, from its inception to its peak to
its final act..."
http://meyerweb.com/eric/thoughts/2013/03/04/the-stinger/


+09: TOOLS.

NoCoffee Vision Simulator (Chrome extension)
By Aaron Leventhal.
"NoCoffee can be helpful for understanding the problems faced by
people with slight to extreme vision problems"
https://chrome.google.com/webstore/detail/nocoffee/jjeeggmbnhckmgdhmgdckeigabjfbddl
NoCoffee Vision Simulator (Article)
http://accessgarage.wordpress.com/2013/02/09/458/

Accessibility Statement Generator
By Nomensa.
http://www.accessibilitystatementgenerator.com/


+10: USABILITY.

The Complexity of Simplicity
By Jay Selway.
"Here are ten principles that I've found helpful when trying to ensure
something stays simple."
http://uxmag.com/articles/the-complexity-of-simplicity


+11: XML.

Using SVG
By Chris Coyier.
"SVG is an image format for vector graphics. It literally means
Scalable Vector Graphics. Basically, what you work with in Adobe
Illustrator. You can use SVG on the web pretty easily, but there is
plenty you should know..."
http://css-tricks.com/using-svg/


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


More information about the Webdev mailing list