+++ WEB DESIGN UPDATE.
- Volume 10, Issue 05, July 29, 2011.

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

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

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

[Contents ends.]


++ SECTION ONE: New references.

+01: ACCESSIBILITY.

A Simple Introduction to Web Accessibility
By Ian Hamilton.
"Accessibility can often seem daunting and complex but in fact there are only four types of disability you need to be aware of. Through groupings, simulations and quick fixes, UX and accessibility consultant Ian Hamilton shows that the basics are actually surprisingly simple..."
http://www.netmagazine.com/features/simple-introduction-web-accessibility

Lack of Interoperability 'Is Biggest Accessibility Barrier'
By Dan Jellinek.
"The biggest barrier to making make the web more accessible to disabled people is interoperability, Sandi Wassmer, member of the UK government's e-Accessibility Forum, told delegates at e-Access '11 conference in London last month..."
http://www.headstar.com/eablive/?p=609

Open University Media Player Passes Accessibility Test
By Dan Jellinek.
"An online video and audio player being developed by the Open University (OU) for its students and the wider learning community has successfully passed through a round of accessibility testing including testing with deaf and dyslexic users, E-Access Bulletin has learned..."
http://www.headstar.com/eablive/?p=611


+02: CASCADING STYLE SHEETS.

CSS3 Bling in the Real World
By Chris Mills.
"...I will get down to business and look at some of the basic CSS3 yumminess we all know and love, and how to make it as cross-browser as possible: Linear gradients, Drop shadows, Opacity, Rounded corners, Web fonts..."
http://www.alistapart.com/articles/css3-bling-in-the-real-world/

Create an Adaptable Website Layout with CSS3 Media Queries
By Jean-Baptiste Jung.
"With the rise of both very large screens and mobile devices, web developers have to be able to create websites that display correctly and look good whatever the device is. Sure, you can use good old techniques like fluid layouts, but I've got something better to show you today. This tutorial will teach you how you can create an adaptable website layout using CSS3..."
http://www.catswhocode.com/blog/create-an-adaptable-website-layout-with-css3-media-queries

320 and Up
By Andy Clarke.
"'320 and Up' prevents mobile devices from downloading desktop assets by using a tiny screen's stylesheet as its starting point. Try this page at different window sizes and on different devices to see it in action."
http://stuffandnonsense.co.uk/projects/320andup/

Seamless Responsive Photo Grid
By Chris Coyier.
"Let's say you have a bunch of images you want to display, and the goal is to get them edge-to-edge on the browser window with no gaps. Just because you think that would be cool. They are of all different sizes. You don't care if they are resized, but they should maintain their aspect ratio..."
http://css-tricks.com/13372-seamless-responsive-photo-grid/


+03: EVALUATION & TESTING.

A Few Notes from Usability Testing - Video Tutorials Get Watched, Text Gets Skipped
By Tom Johnson.
"This week was the first time I've actually seen our usability labs used. We have a new usability research group led by someone with years of experience doing usability engineering for Microsoft. I watched in our observation room as he led a handful of users through 60-90 minute usability tests for an application I documented..."
http://idratherbewriting.com/2011/07/22/a-few-notes-from-usability-testing-video-tutorials-get-watched-text-gets-skipped/

Requirements-Driven Software Development Must Die
By Fred Beecher.
"...For all our mental and linguistic prowess, we human beings are remarkably bad at communicating our needs, understanding what other human beings are trying to say, and visualizing complex systems in our heads. All three of these factors combine to make the typical requirements review meeting a futile exercise..."
http://userexperience.evantageconsulting.com/2011/07/requirements-driven-software-development-must-die/


+04: EVENTS.

UX Masterclass Chicago
September 15-16 2011.
Chicago, Illinois, U.S.A.
http://events.boxesandarrows.com/events/1567

Accessibility Camp Toronto
September 24, 2011.
Toronto, Canada
http://lanyrd.com/2011/a11ycampto/

Information Architecture Summit
September 23-24, 2011.
Prague, Czech Republic
http://www.euroia.org/

edUi 2011
October 13-14 2011.
Richmond, Virginia, U.S.A.
http://eduiconf.org 

Design by Fire 2011
October 13-14 2011.
Utrecht, Netherlands
http://designbyfire.nl/2011 

Web 2.0 Summit
October 17-19, 2011.
San Francisco, California, U.S.A.
http://www.web2summit.com/web2011


+05: INFORMATION ARCHITECTURE.

The UX of Learning
by Tyler Tate.
"Think of the last time you ordered a book, booked a flight, or bought a car. How did you choose which book to read, where to go for vacation, or which car was best for you? You may have searched online, read reviews, or asked others for advice to help you make an informed decision. In a word, you learned. Learning is a complex process with distinct stages, each with corresponding tasks and emotions. Understanding how users learn can help us design experiences that support the user throughout the entire process. To design better learning experiences online, start by learning a thing or two about learning itself."
http://www.alistapart.com/articles/the-ux-of-learning/


+06: MISCELLANEOUS.

Catherine Roy WordCamp 2011 Interview (mp3)
By Moz Taylor.
"...first up, Moz interviews Catherine Roy, Director of CREin, about Web accessibility standards."
http://thedigitallifeshow.com/july-23-matt-mullenweg-and-catherine-roy-from-wordcamp-2011/

HTML5 - Insights and Benefits with Chris Heilmann
By Bill Cullifer.
"...For today's podcast, I sat down with Chris Heilmann, Mozilla Evangelist, author and speaker. Chris provides a terrific overview of the benefits of HTML5 and what Web professionals and those that teach need to consider when developing with this emerging technology standard..."
http://webprofessionals.org/html5-insights-and-benefits-with-chris-heilmann-mozilla/


+07: NAVIGATION.

Link Purpose - Accessibility for Web Writers, Part 9
By Dey Alexander.
"Write links that clearly describe their purpose or content. Meaningful links make content more usable. They usually stand out on a web page (as they're a different colour and underlined), so anyone who can see the page can scan it and identify the linked content. Search engine optimisation experts tell us that meaningful links can improve search ranking, making content easier for users to find."
http://www.4syllables.com.au/2011/07/accessibility-web-writers-part-9/

Responsive Navigation Menus: Convert a Menu to a Dropdown for Small Screens
By Chris Coyier.
"The Five Simple Steps website has a responsive design with a neat feature. When the browser window is narrow, the menu in the upper right converts from a regular row of links into a dropdown menu..."
http://css-tricks.com/13303-convert-menu-to-dropdown/


+11: STANDARDS, GUIDELINES & PATTERNS.

Avoiding Common HTML5 Mistakes
By Richard Clark.
"Between curating sites for the HTML5 gallery and answering readers' questions here at HTML5 Doctor, I see a host of HTML5 sites and their underlying markup. In this post, I'll show you some of the mistakes and poor markup practices I often see and explain how to avoid them..."
http://html5doctor.com/avoiding-common-html5-mistakes/

Getting Sourcey - Native HTML5 Audio and Video
By John Allsopp.
"...While HTML5 for the first time specifies a way of incorporating audio and video content via the mundanely named audio and video elements, the revolution in web content these bring is that browsers now no longer require plugins to play the content, rather they do so 'natively'. Which has the advantage that users don't need to download and install plugins, or keep them up to date. But there's more to it than that. With plugin content, browsers effectively hand over a part of the browser window and say to the plugin - 'ok, this is all yours, do your worst'. Which makes applying style to a video player (rounded corners, or adding a drop shadow, for instance) challenging, and effects like layering HTML based content over the top of plugin content a bit of a lottery...."
http://www.webdirections.org/blog/getting-sourcey-native-html5-audio-and-video/

Don't Let HTML5 Become the New DHTML
By Adrian Roselli.
"...Allowing HTML5 to mean CSS3, geolocation, H.264, or any other technology just makes it harder on us who work in this space. A technology for a project should be chosen based on the goals at hand, not because a client insists on it because of a misunderstanding of a brand or because the press release will sound great when citing how cutting edge everyone is. Most importantly, a technology should not be chosen because of confusion over terminology Ñ least of all when that term actually refers to one particular specification..."
http://blog.adrianroselli.com/2011/07/dont-let-html5-become-new-dhtml.html

HTML5 - Notes for Analysts and Journalists
By Bruce Lawson.
"There have been a few stories lately for investors rather than techies that have a few inaccuracies, probably because they're written by finance/ business journalists rather than tech journalists. (Nothing wrong in that; I know my HTML5 from my CSS but couldn't tell a gilt-edged bond from a derivative.) Here a few notes for analysts and journalists that might chance upon this blog..."
http://www.brucelawson.co.uk/2011/html5-notes-for-analysts-and-journalists/


+12: TOOLS.

Respond.js
By Scott Jehl.
"Fast CSS3 Media Queries for Internet Explorer 6-8 and more..."
http://filamentgroup.com/lab/respondjs_fast_css3_media_queries_for_internet_explorer_6_8_and_more/

Test iPhone Simulator
This is a web browser based simulator for quickly testing your iPhone web applications. This tool has been so far tested and working using Internet Explorer 7, FireFox 2 and Safari 3.
http://www.testiphone.com/

dot Mobi Emulator
Allows you to see your page as it would look on either a Sony K750 or a Nokia N70.
http://mtld.mobi/emulator.php

Mobile Emulators and Simulators: The Ultimate Guide
By Maximiliano Firtman.
"I've mixed all this information to create this ultimate guide to 37 download resources for hundreds of emulators and simulators."
http://www.mobilexweb.com/emulators

Color Oracle
By Bernhard Jenny.
"Color Oracle is a colorblindness simulator for Window, Mac and Linux. It takes the guesswork out of designing for color blindness by showing you in real time what people with common color vision impairments will see..."
http://colororacle.cartography.ch/


+13: TYPOGRAPHY.

Contrast Rebellion
By Zoltan Gocza and Richard Gazdik.
"...Let's put an end to this low-contrast, light gray nonsense and use typography for its purpose: making text readable."
http://contrastrebellion.com/

Interesting Cause - http://contrastrebellion.com
WebAIM Thread.
http://webaim.org/discussion/mail_thread?thread=4809

@font-face Solutions & Suggestions
By Nick La.
In the last post I talked about the design aspect of using CSS3 @font-face, today I would like to extend this topic to the technical side on implementing custom web fonts. So what are the options for implementing web fonts? I'm going to review the three main methods of incorporating @font-face and explain the pros and cons of each method.
http://webdesignerwall.com/general/font-face-solutions-suggestions


+14: USABILITY.

Why Mobile UX Is More Than Users On-The-Go
By Laura Hampton.
"...The mobile user is no longer limited, and mobile experiences are just as key as the desktop counterparts. Understanding how our users behave and how we might engage them is therefore imperative..."
http://uxmag.com/design/why-mobile-ux-is-more-than-users-on-the-go

Responsive Web Design Techniques, Tools and Design Strategies
By Smashing Staff.
"We've compiled this round-up of resources for creating responsive website designs. Included are tutorials, techniques, articles, tools and more, all geared toward giving you the specific knowledge you need to create your own responsive designs."
http://www.smashingmagazine.com/2011/07/22/responsive-web-design-techniques-tools-and-design-strategies/

The Goldilocks Approach to Responsive Design
By Chris Armstrong.
"With over 4 billion mobile devices in use around the world, mobile browsing is rising fast. We can no longer assume that our sites will be viewed on a desktop monitor with an average resolution. Perhaps we never could..."
http://www.designbyfront.com/workinprogress/article/the-goldilocks-approach-to-responsive-design

A Wider Context
By Stephanie Reiger.
"...Maybe mobile context isn't the problem. Maybe the real challenge (some may say, the real opportunity) lies in finding ways to ensure 'the next web' brings as many opportunities to coming generations as it has to us so far..."
http://yiibu.com/articles/wider-context/

Who Says Accessible Web Design is Boring? Announcing New Windows with Trendy Style
By Glenda Watson.
"Recently I explained why opening links in new windows is an accessibility issue and I offered one technique that announced in the link text that a new window opens as in this example..."
http://blogaccessibility.com/who-says-accessible-web-design-is-boring-announcing-new-windows-with-trendy-style/

7 Uability Principles That Make Your Website More Engaging (Video)
By Susan Weinschenk.
"Dr. Susan Weinschenk shares seven usability principles to make your website more engaging."
http://www.youtube.com/watch?v=3J85SUZFXNM

Is That a Usability Problem or a Feature?
By Jeff Sauro.
"...There has to be a balance between usability, business and security.  Even the most intransigent usability wonk would agree to that. But when there's too little usability and too much business someone has to sound the alarm. And while security is essential, it shouldn't discourage usage..."
http://www.measuringusability.com/blog/problem-feature.php



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


[Issue ends.]