[webdev] Web Design Update: August 19, 2011
lcarlson at d.umn.edu
Fri Aug 19 06:58:07 CDT 2011
+++ WEB DESIGN UPDATE.
- Volume 10, Issue 08, August 19, 2011.
An email newsletter to distribute news and information about web
design and development.
++ISSUE 08 CONTENTS.
SECTION ONE: New references.
What's new at the Web Design Reference site?
New links in these categories:
02: CASCADING STYLE SHEETS.
04: EVALUATION & TESTING.
08: STANDARDS, GUIDELINES & PATTERNS.
10: What Can You Find at the Web Design Reference Site?
++ SECTION ONE: New references.
HTML5 Accessibility Chops - SVG Text Alternative Example
By Steve Faulkner.
"The W3C HTML5 specification contains an SVG (Scalable Vector
Graphics) based interactive Venn diagram. The diagram illustrates the
relationship between HTML content categories. Currently the content
and interactivity of the diagram is not accessible to some users. A
bug SVG content model VENN diagram needs to be made accessible was
filed. The HTML5 editors' response..."
Musings on Microsoft Office - Alt Text, Save as PDF, and More
By Terrill Thompson.
"Adding alternate text to images in electronic documents is simple. In
most authoring software you simply right click on an image, select an
option such as 'Format Picture' or something equally intuitive, and
locate a form field where you are prompted to enter alt text.
Unfortunately it's a bit more complicated than that in Microsoft
Testing for Accessibility
By Sara Ford.
"Sara Ford explains what accessibility means, and shows you how to
test your applications for accessibility. Topics covered include
keyboard accessibility, High Contrast, focus and selection, and
Assistive Technology Compatibility." This is a 2004 article that is
Inclusivity Requires A Paradigm Shift
By Neil Milliken.
"1 Billion plus people is not a niche market. According to the World
Health Organisation: One in seven of the world's population has some
kind of disability..."
+02: CASCADING STYLE SHEETS.
Do Not Use display:none to Visually Hide Content Intended for Screen Readers
By Roger Johansson.
"...When auditing websites for accessibility I occasionally find
elements that are incorrectly hidden with display:none. The most
common example is probably skip links intended to help keyboard and
screen reader users. The irony is that those well-intended skip links
are made useless by display:none..."
The Importance of 's' in CSS3 Transition Shorthand
By Greg Rewis.
"On a recent project, I spent the better part of an hour (okay, maybe
longer) fighting with what I would learn is an interesting anomaly in
the way that Firefox (4 and 5) deal with CSS3 shorthand transition
notation. What baffled me was the fact that the other players, Webkit
(Safari and Chrome) and Opera browsers, worked properly with the exact
same code. The premise was to have an area with a fixed height, set to
overflow: hidden, but then allow the site navigation to scroll
(transition) to the proper anchor, resizing the content box's height
to accommodate the contents while keeping the other contents
Transitions and Animations on CSS Generated Content
By Chris Coyier.
"Generated content means pseudo elements added to the page via the
::before and ::after. The support for applying transitions or
animations to these in the current browser landscape is not great. I
think this is a huge bummer, so I'm just making this blog post my
permanent home to track the progress on this..."
'Space' and 'Round' Values
By Chris Coyier.
"...If you've seen the code for CSS3 border images then you're
probably familiar with the space and round values for the
border-image-repeat property. Well, in the CSS3 spec, the well-known
background-repeat property now includes those two new values (in
addition to repeat, repeat-x, repeat-y, and no-repeat - all of which
most CSS developers will be thoroughly familiar with)..."
CSS3's 'space' and 'round' Values for background-repeat
By Louis Lazaris.
"...in the CSS3 spec, the well-known background-repeat property now
includes those two new values (in addition to repeat, repeat-x,
repeat-y, and no-repeat - all of which most CSS developers will be
thoroughly familiar with). To demonstrate what these new values do,
here are some screenshots and accompanying explanations..."
The Shapes of CSS
"All of the below use only a single HTML element. Any kind of CSS
goes, as long as it's supported in at least one browser..."
When Visitors Print - About That Print Stylesheet
By Tim Connell.
"Grab yourself a beverage, hit print and read about the simple things
that make a big difference when visitors print..."
CSS3 Properties, Values and Browser Support
By Estelle Weyl.
"Below is every most CSS3 Properties, all the possible values for that
property, and the support for each property value from grade-A
Understanding HTML5 Semantics - Part 2, Document Structure and Global
By Stephanie (Sullivan) Rewis.
"Understand the differences between the HTML4 and HTML5 document
structure, including the addition of new global attributes."
Understanding HTML5 Intelligent Forms - Part 1: New Input Elements
By David Powers.
"In this first part of a two-part tutorial, I'll describe the new
input elements and the <datalist> element, which allows you to suggest
options for a text input field. In Part 2 (coming soon), you'll learn
about the HTML5 form attributes...."
+04: EVALUATION & TESTING.
Try to Be a Test User Sometime
By Jakob Nielsen.
"In pilot studies, you can occasionally relax the need for real users
and let members of your own team serve as test participants. It's good
Do-It-Yourself Usability Testing - The Workshop
September 7, 2011 in Washington, DC, U.S.A.
September 27, 2011 in Seattle, Washingon, U.S.A.
October 5, 2011 in London, England, United Kingdom
September 22-23, 2011.
Prague, Czech Republic
Axure Basic Training Class
September 24, 2011.
Marina Del Rey, California, U.S.A.
Etre Get Together
October 3-5, 2011.
London, England, United Kingdom
Ethan Marcotte Interview - The Way of Responsive Web Design
By William Channer.
"Ethan Marcottee explains responsive web design. He also takes us
through his own process to building a responsive site which includes
applying media queries and designing for the mobile."
By Jeremy Keith.
"Right after I wrote about combining flexbox with responsive design-to
switch the display of content and navigation based on browser size-I
received an email from Raphaël Goetter. He pointed out a really
elegant solution to the same use-case that makes use of
+08: STANDARDS, GUIDELINES & PATTERNS.
Stephanie Sullivan Rewis and Greg Rewis - What Designers Need to Know
About HTML5 and CSS3 (Podcast)
By Sean Carmichael.
"The introduction of CSS3 and HTML5 brings with it a host of new
capabilities. With most modern browsers supporting CSS3 and HTML5,
implementing them into your designs is becoming easier. Understanding
what is now possible with these new standards can help you create
better designs more efficiently and effectively than ever before..."
HTML5 - Another Postcard from the Trenches
By John Foliot.
"...There is a lot of questions, confusion, and out-right
mis-information surrounding HTML5 today. Over the next 90 minutes I
hope to address these questions, and more..."
HTML5 And The Document Outlining Algorithm
By Derek Johnson.
"...The document outlining algorithm is a mechanism for producing
outline summaries of Web pages based on how they are marked up. Every
Web page has an outline, and checking it is easy using a really simple
free online tool, which we'll cover shortly..."
HTML5 Forms Input Types, Attributes and New Elements - Demos, Tips and Tricks
By Robert Nyman.
"...There are basically five areas of improvements when it comes to
form features in HTML5..."
W3C Works to Speed Web Standard Creation
By Stephen Shankland.
"The World Wide Web Consortium has begun its effort to speed its
processes for standardizing Web technology..."
6 Best Practices for Marking up Your HTML5
By Estelle Weyl.
"There are several coding rules required for XHTML that were optional
or even unsupported in HTML 4. While HTML5 supports both coding
formats, here are some non-required best practices.."
Use Words Your Readers Understand
By Rachel McAlpine.
"Use the vocabulary of your reader. That's a key factor in plain language..."
5 Principles of User-Centered Interface Design
By Adrian Jones.
"...I've outlined below 5 principles of user-centered interface
design, principles to help our websites and applications keep us on
[Section one ends.]
++ SECTION TWO:
+10: What Can You Find at the Web Design Reference Site?
Cascading Style Sheets Information.
Evaluation & Testing Information.
Information Architecture Information.
Miscellaneous Web Information.
Sites & Blogs Listing.
Standards, Guidelines & Pattern Information.
[Section two ends.]
+ SUBSCRIPTION INFO.
WEB DESIGN UPDATE is available by subscription. For information on how
to subscribe and unsubscribe please visit:
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:
+ 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
More information about the Webdev