+++ WEB DESIGN UPDATE.
- Volume 10, Issue 24, December 9, 2011.

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

++ISSUE 24 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: EVENTS.
04: FLASH.
05: JAVASCRIPT.
06: MISCELLANEOUS.
07: NAVIGATION.
08: PHP.
09: STANDARDS, GUIDELINES & PATTERNS.
10: TYPOGRAPHY.
11: USABILITY.
12: XML.

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

[Contents ends.]


++ SECTION ONE: New references.

+01: ACCESSIBILITY.

The Hidden Nuggets of WCAG2: When Not to Use ALT Attributes
By Gian Wild.
"So, just when should you not use an ALT attribute? Short answer: never. You must always have an ALT attribute if you have an IMG element. Always. No ifs, no buts, no maybes..."
http://www.sitepoint.com/the-hidden-nuggets-of-wcag2-when-not-to-use-alt-attributes/

What is Web Accessibility?
By Nick Pettit.
"Web accessibility can sometimes be a controversial topic, but a fiery dialogue is a healthy sign of just how much people really care. While opinions may vary on specific issues, one thing is clear: Equal access to information is paramount in the digital age..."
http://thinkvitamin.com/user-science/accessibility/what-is-web-accessibility/

How to Make the Web More Accessible?
By Vlad Alexander.
"We have the know-how to make the web more accessible; what we're lacking is the will to act on it. The a11y bugs project is a new grass roots effort that aims to spur the stakeholders in web technology into action, to make the web more usable for everyone..."
http://a11ybugs.org/article.php?id=2

Board Releases New Draft of ICT Rule for Public Comment
By The Access Board. 
"The U.S. Access Board has released for public comment a second Advance Notice of Proposed Rulemaking (ANPRM) that includes a revised draft of updated accessibility requirements for information and communication technology (ICT) covered by Section 508 of the Rehabilitation Act and Section 255 of the Telecommunications Act of 1996. This latest version includes changes made in response to public feedback received on an earlier draft issued last year..."
http://www.access-board.gov/news/ict-draft-rule.htm

Talk is Cheap - Screen Reader Testing on Mobile
By Henny Swan.
"Testing your content on mobile need not be as painful as you think. If you have an Android and iOS device then you already either have a free mobile screen reader in your pocket or it's a short download away. This is a quick guide to get you set up..."
http://www.iheni.com/talk-is-cheap-screen-reader-testing-on-mobile/

Web Accessibility Metrics - 'What Are They For Then?'
By Martyn Cooper.
"Yesterday I participated in the W3C's, Web Accessibility Initiative's (WAI) Website Accessibility Metrics Online Symposium.  Details and access to the papers and presentations of the symposium is available at: http://www.w3.org/WAI/RD/2011/metrics/. This blog post is not an attempt to give a comprehensive report of the symposium but to air some of my thinking about it and how it relates to ongoing work I am involved in at the Open University where I am employed as a Senior Research Fellow with an internal consultancy role on accessibility..."
http://martyncooper.wordpress.com/2011/12/06/web-accessibility-metrics/

Alexa 100 Accessibility Errors
By Jared Smith.
"...The table below outlines errors for the home pages of the Alexa Top 100 US sites .."
http://webaim.org/blog/alexa-100-accessibility-errors/


+02: CASCADING STYLE SHEETS.

CSS Selectors 101
By Virginia DeBolt.
"I'm preparing some handouts for an 8 hour continuing ed class in Cascading Style Sheets I'll be teaching at UNM. The class doesn't get a book so I have to write everything up myself. I thought I'd share some of the handouts here. The first installment: CSS Selectors..."
http://www.webteacher.ws/2011/12/07/css-selectors-101/

Numbering In Style
By Chris Coyier.
"...applying numbered counters is not limited to ordered lists. For instance, let's say you wanted to number the question and answer pairs of a FAQ list..."
http://css-tricks.com/15358-numbering-in-style/

Understanding CSS's vertical-align Property
By Louis Lazaris.
'...The vertical-align property is one of those features of CSS that sounds pretty self-explanatory, but can cause problems for CSS beginners. I think even many CSS veterans have had problems figuring this one out at times. In this post, I'll try to cover it in an understandable manner..."
http://www.impressivewebs.com/css-vertical-align/

The Difference Between Width:auto and Width:100%
By Roger Johansson.
"When adapting a layout for different viewport widths (a.k.a. responsive design) or media (like print), it's common to reset any float and width values on major layout blocks to linearise their display..."
http://www.456bereastreet.com/archive/201112/the_difference_between_widthauto_and_width100/

Responsive Web Design in Three Steps
By Nick La.
"Step 1. Meta Tag...Step 2. HTML Structure...Step 3. Media Queries..." 
http://webdesignerwall.com/tutorials/responsive-design-in-3-steps

3 Things You Never Thought to Do With Media Queries
By Joshua Johnson.
"...The purpose of this article is more exploratory than educational. The intention is to start a discussion about whether or not media queries hold potential for purposes other than responsive design...."
http://designshack.net/articles/css/3-things-you-never-thought-to-do-with-media-queries/


+03: EVENTS.

9th International Cross-Disciplinary Conference on Web Accessibility
April 16-17, 2012.
Lyon, France
http://www.w4a.info/2012/


+04: FLASH.

Flash is Dead! Long Live Flash!
By Adrian Roselli.
"A lot of news has been made of Adobe's recent move to end development of the Flash player for mobile devices (such as your smartphone or tablet). Even people outside of the tech community have heard about it and are trying to understand what it really means. I wrote up the details last month (Flash Isn't Going Away, Except from Your Mobile) and tried to remind everyone that Adobe isn't giving up on Flash, it's just changing its direction on its mobile player based on industry trends..."
http://blog.algonquinstudios.com/author/aroselli/


+05: JAVASCRIPT.

Conditional Loading for Responsive Designs
By Jeremy Keith.
"...what happens when you apply your media queries for larger viewports and you do have sidebars and multiple columns? Well, you can load in that nice-to-have content using the same kind of Ajax functionality that Paul described in his article last year. The difference is that you first run a quick test to see if the viewport is wide enough to accommodate the subsidiary content. This is conditional delayed loading...This was just a simple example but I hope it illustrates that conditional loading could become an important part of the content-first responsive design approach."
http://24ways.org/2011/conditional-loading-for-responsive-designs

Clean Conditional Loading 
By Jeremy Keith.
"...But Éit doesn't feel very DRY to have that 640 pixel breakpoint repeated in two places: once in the CSS and once in the JavaScript. It feels even ickier if I'm using ems for my media query breakpoints (as I often do) while using pixels in JavaScript..."
http://adactio.com/journal/5042/

From WAI-ARIA to HTML5 and backÉor maybe not?
By Marco Zehe.
"The new version of our form is much improved over the version we had originally. It still contains some WAI-ARIA where it makes sense, since there is no native HTML5 alert box yet. But the rest is HTML5. The JavaScript code is a bit less bloated since we don't have to do our own validation any more, and we benefit from all the builtin constraint validation mechanisms..."
http://www.marcozehe.de/2011/12/05/from-wai-aria-to-html5-and-back-or-maybe-not/

That 'JavaScript Not Available' Case
By Christian Heilmann.
"...All in all, the question of JavaScript dependence reaches much further than just the technical issues. It questions old best practices and has quite an impact on maintainability..."
http://christianheilmann.com/2011/12/06/that-javascript-not-available-case/


+06: MISCELLANEOUS.

There Is No Mobile Web - Conference Presentation (Video)
By Jeremy Keith.
"The video of the opening keynote I delivered at the Breaking Development conference in Nashville earlier this year. It expands on the One Web presentation I gave at DIBI, focusing on the language we use to talk about our approaches to web development."
http://vimeo.com/32143919

Responsive Design is Irresponsible 
By Kevinjohn Gallagher.
"I've been thinking of how to write this for little while, knowing that should anyone read it, I'll be condemned as a heretic and outcast from the web community (and lets be honest, I'm already living on the edge)..."
http://kevinjohngallagher.com/2010/06/responsive-design-is-irresponsible/

Detect And Redirect Users For Mobile Development
By Karl Dubost.
"I have read today this long list of tips for Mobile Development. The tip about Detect and Redirect Users is not given with enough care outlining the issues related to user agent sniffing. So I left a comment. And I thought it might be useful for more people and I need to keep some of the points I made in there for memories..."
http://my.opera.com/karlcow/blog/2011/12/06/detect-and-redirect-users-for-mobile-development

Notes on Adaptive Images (yet again!)
By Bruce Lawson.
"All the cool kids are doing responsive design, it seems. This means fluid designs, having some hot media query action to reformat your layout depending on screen size, and ensuring your images are flexible so they don't break out of container, generally by setting them to {max-width:100%;}..."
http://www.brucelawson.co.uk/2011/notes-on-adaptive-images-yet-again/

Responsive Images and Transparent Content Negotiation in HTTP
By Karl Dubost.
"...This issue has been solved a long time agoÉ It is called content-negociation. The ability to serve different representations depending on the headers sent by the client..."
http://my.opera.com/karlcow/blog/2011/12/08/responsive-images-and-transparent-content-negotiation-in-http

Podcast 93: Teaching Mistakes
By Dennis E. Lembree.
"Dennis talks briefly about a couple of his recent presentations, a few other presentations and articles, and has a great conversation with Katherine Lynch..."
http://webaxe.blogspot.com/2011/12/podcast-93-teaching-mistakes.html


+07: NAVIGATION.

Visited Links Can Only be Differentiated by Colour
By Roger Johansson.
"Showing whether a link on a web page has been visited or not can be very useful. One example that many will be familiar with is how it helps you know which links you have already followed from a Google search results page - links to pages you have already visited are a different colour than the other links..."
http://www.456bereastreet.com/archive/201112/visited_links_can_only_be_differentiated_by_colour/


+08: PHP.

Dates and Times
By Evert Pot.
"...The truth is dates and times are hard..."
http://phpadvent.org/2011/dates-and-times-by-evert-pot

If Else and Switch Case
By PHP Know How.
"If Else and Switch Case are control structures that let you execute code segments based on given conditions. These build up the dynamic behavior of PHP..."
http://www.phpknowhow.com/basics/if-else-and-switch-case/

Loops
By PHP Know How.
"Loops let you execute a block of code number of times. Loops often come into play when you work with arrays. Rather than writing same piece of code for each array element, it's preferred to use a loop where the particular code block is written only once..."
http://www.phpknowhow.com/basics/loops/

Basic Debugging
By PHP Know How.
"Debugging means tracing down errors in your programs and correcting them. PHP doesn't come with a built-in debugger. So, PHP recommends some third party tools for debugging. However for basic debugging, we can use few functions available in PHP. These would be sufficient to troubleshoot most of the errors that can occur in your PHP programs..."
http://www.phpknowhow.com/basics/basic-debugging/

Break Statement
By PHP Know How.
"Break statement is used to get out of running loops. It's also used in Switch Case control structures to stop execution of next case statements..."
http://www.phpknowhow.com/basics/break-statement/


+09: STANDARDS, GUIDELINES & PATTERNS.

HTML5 Canvas Accessibility Discussions 2009-2011
By Steve Faulkner.
"Charles Pritchard has taken the time to provide an email overview of Canvas accessibility discussions which have taken place on the public-canvas-api over the past 3 years. I have reformatted it here and added some headings, as it is an excellent resource for understanding where we have been and where we are with HTML5 canvas accessibility..."
http://www.paciellogroup.com/blog/2011/12/html5-canvas-accessibility-discussions-2009-2011/

Reverse Ordered Lists in HTML5
By Louis Lazaris.
"With all the hype surrounding the new APIs and the fancy parts of CSS3, I had almost forgotten about the new reversed attribute that allows you to write a descending list of numbered items, as opposed to the default ascending list of numbered items..."
http://www.impressivewebs.com/reverse-ordered-lists-html5/


+10: TYPOGRAPHY.

Styling Text 101
By Virginia DeBolt.
"Here's another of the handouts I prepared for a Continuing Ed class in CSS at UNM..."
http://www.webteacher.ws/2011/12/08/styling-text-101/

Creating Custom Font Stacks with Unicode-Range
By Drew McLellan.
"Any web designer or front-end developer worth their salt will be familiar with the CSS @font-face rule used for embedding fonts in a web page. We've all used it - either directly in our code ourselves, or via one of the web font services like Fontdeck, Typekit or Google Fonts..."
http://24ways.org/2011/unicode-range


+11: USABILITY.

Love Your Devices: Adaptive Web Design with Media Queries, Viewport and More
By Chris Mills.
"It's time again to reflect on happiness and well being: that of yourselves and the members of the public who consume the web content and services you create. Today we are going to talk about getting more satisfaction from battery-powered devices..."
http://dev.opera.com/articles/view/love-your-devices-adaptive-web-design-with-media-queries-viewport-and-more/

Collaborative Development for a Responsively Designed Web
By Paul Robert Lloyd.
"In responsive web design we've found a technique that allows us to design for the web as a medium in its own right: one that presents a fluid, adaptable and ever changing canvas..."
http://24ways.org/2011/collaborative-development-for-a-responsively-designed-web

How To Achieve Simplicity In Design
By Steven Bradley.
"In his now classic book Art and Visual Perception, Rudolph Arnheim noted that people will perceive and interpret ambiguous or complex shapes as the simplest form possible. There's something inherent in us that prefers the simple to the complex..."
http://www.vanseodesign.com/web-design/simplicity/

Subliminal User Experience
By Chris Sealey.
"...The purpose of this article is not to provide technical how-tos, as the functionality is, in most cases, quite simple and could be implemented in a myriad of ways. Rather, it will present a handful of ideas for enhancing the experience of an interface at a deeper level of design without relying on the container..."
http://24ways.org/2011/subliminal-user-experience

Another Case for Using Top Aligned Form Labels
By UX Movement.
"By now, most designers should know that top aligned labels allow users to fill out forms faster than left aligned labels. This makes sense when you read and understand why and the research that verifies this fact. If that reason alone isn't enough to convince you to use top aligned labels, here are a couple more reasons why they work best for most users..."
http://uxmovement.com/forms/another-case-for-using-top-aligned-form-labels/

Better Usability Through Consistent Design
By Web Page Mistakes.
"Using a consistent design throughout your website or blog adds to the usability of the site. It also adds accessibility and search engine optimization features. A site designed with the user in mind improves the overall experience when visiting the site which in turn results in..."
http://www.webpagemistakes.ca/usability-consistent-design/


+12: XML.

What is XHTML5?
By Richard Ishida.
"There appears to be some confusion about XHTML1.0 vs XHTML5. Here is my best shot at an explanation of what XHTML5 is..."
http://rishida.net/blog/?p=747


[Section one ends.]


++ SECTION TWO:

+13: 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.]