[webdev] Web Design Update: May 13, 2011
Laura Carlson
lcarlson at d.umn.edu
Fri May 13 06:40:05 CDT 2011
+++ WEB DESIGN UPDATE.
- Volume 9, Issue 46, May 13, 2011.
An email newsletter to distribute news and information about web
design and development.
++ISSUE 46 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: MISCELLANEOUS.
04: NAVIGATION.
05: STANDARDS, GUIDELINES & PATTERNS.
06: TOOLS.
07: TYPOGRAPHY.
08: USABILITY.
SECTION TWO:
09: What Can You Find at the Web Design Reference Site?
[Contents ends.]
++ SECTION ONE: New references.
+01: ACCESSIBILITY.
Longdesc and Other Long Image Description Solutions, Part 2 of 2
By Dennis Lembree.
"...The longdesc image attribute is easy to implement but is not
supported well. Other methods such as text links and ARIA can be used
to achieve a similar result but may not be fully supported either or
may not be aesthetically pleasing. Today, the best way to implement a
long description for an image, when needed, is to use a hybrid
technique with text link, longdesc, and ARIA. Other techniques have
surfaced (especially for charts), but until the W3C, browser vendors,
and web authors play nice together, there will continue to be
fragmented and partially supported solutions which is a loss for
everyone."
http://designfestival.com/longdesc2/
WYSIWYG Support for @longdesc Today
By John Foliot.
"...I thought I would investigate Tantek's assertion with regard to
WYSIWYG editing tools, complete with screen captures. While this is by
no means a complete list, it does cover environments and situations
that I personally encounter almost daily, and is, if nothing else, a
good representative sampling..."
http://john.foliot.ca/wysiwyg_longdesc/
+02: CASCADING STYLE SHEETS.
Clipping Text With CSS3 text-overflow
By Roger Johansson.
"When you need to display an unknown amount of text in a constrained
space you may need to somehow hide text that doesn't fit. One way is
to use overflow:hidden to quite brutally hide it. Doing this works,
and it works cross-browser, but it can be difficult for the user to
realise that text has been hidden since there is no visual indication
of it. A property from the editor's draft of the CSS Basic User
Interface Module Level 3 that can help improve the situation is
text-overflow..."
http://www.456bereastreet.com/archive/201105/clipping_text_with_css3_text-overflow/
The Ever-Increasing Uses of a Zoom Layout (Part 1)
By James Edwards.
"If I were to point at a page and describe it as a zoom layout - would
you know what I was talking about? The term was popularized by Joe
Clark, one the foremost advocates of accessible web development, to
describe a page that's been formatted (or re-formatted) to make it
easier for low-vision users - people who navigate with extremely large
text, or using magnifying software..."
http://blogs.sitepoint.com/the-ever-increasing-uses-of-a-zoom-layout-part-1/
The Ever-Increasing Uses of a Zoom Layout (Part 2)
By James Edwards.
"...So what do we need to do to make this happen? It all comes down to
two simple things..."
http://blogs.sitepoint.com/the-ever-increasing-uses-of-a-zoom-layout-part-2/
Outer Border Radius Tabs
By Chris Coyier.
"Imagine a real-life tabbed folder. The tabs on those aren't only
rounded at the top of the tab, but they also connected to the folder
with a rounded edge. Top corners, easy, just border-radius. Bottom
corners, not so easy. Steve Smith has a published a neat technique
utilizing pseudo elements to do it."
http://orderedlist.com/blog/articles/flared-borders-with-css/
+03: MISCELLANEOUS.
How To Get Sign-Off For Your Designs
By Paul Boag.
"'How did you do that?' My colleague Leigh sounded impressed. He had
been working with a problem client for weeks trying to get design
approval. Then I came along and was able to get signed-off in a single
conference call. 'Can you teach me how you did that?' he asked. I
mumbled something about years of experience, but the truth was I
didn't have a clue. It just seems I can find design approval easier
than most."
http://www.smashingmagazine.com/2011/05/06/how-to-get-sign-off-for-your-designs/
+04: NAVIGATION.
Opening Links in New Windows
By Glenda Watson Hyatt.
"You know the sites: the kind where clicking on a link opens a new
window (or a tab, depending upon your browser). The back button
doesn't take you back to the previous page because a new window opened
instead. By the time you are finished with the site, you have several
windows open that you must now close before carrying on with whatever
you were doing. How annoying..."
http://blogaccessibility.com/sin-6-opening-links-in-new-windows/
Mooer's Law and Findability
By Tom Johnson.
"I was recently reading about Mooer's law in Peter Morville's Ambient
Findability. Morville contrasts Moore's law with Mooer's law. Moore's
law (much more familiar) asserts that the number of computer
transistors that you can fit on an integrated circuit doubles every
two years. We're all familiar with the ever-increasing amount of
storage space, processing power, memory, and other rapid advance with
technology. But Mooer's law is perhaps both more interesting and
relevant to technical writers and findability. In 1959, Calvin Mooer,
a computer scientist, observed the following..."
http://idratherbewriting.com/2011/05/09/mooers-law-and-implications-for-findability/
+05: STANDARDS, GUIDELINES & PATTERNS.
This Could be Big - Decentralized Web Standard Under Development by W3C
By Marshall Kirkpatrick.
"Imagine a web where our browsers connected directly to each other to
do voice, video, media sharing and run applications, using P2P and
real-time APIs, rather than going through centralized servers that
controlled traffic and permissions. That's a potent idea and if
implemented properly could future-proof a part of the web from
authoritarian crack-downs, disruptions by disasters and more. It could
also establish a permanent lawless zone of connected devices with no
central place to stop anyone from doing anything in particular..."
http://www.readwriteweb.com/archives/his_could_be_big_decentralized_web_standard_under.php
The hgroup Hokey Cokey
By Jack Osborne.
"As you may well have heard this week, hgroup has been in, out and in
the spec again, while members of the W3C and others have truly been
shaking it all about. If you've missed this latest merry dance then
please head on over to the W3 bug report page to help get a clearer
indication.
http://html5doctor.com/the-hgroup-hokey-cokey/
+05: TOOLS.
KeyTitle extension
By Charles McCathieNevile.
"It's an (Opera) extension so you can navigate a page by keyboard, and
have the title tooltips shown just as they would if you mouseover
something with a tooltip. This is another step to bing keyboard use to
match what happens when people are working with a mouse, and vice
versa..."
http://my.opera.com/chaals/blog/keytitle-extension
+07: TYPOGRAPHY.
Typographically Correct Punctuation on Web Sites
By Stephen Morley.
"While many web designers settle for the simplified punctuation of the
ASCII character set, using typographically correct punctuation shows
the professionalism and attention to detail of the designer and the
web site owner. This page explains the differences between
superficially similar punctuation marks and lists the character entity
references used to represent them..."
http://code.stephenmorley.org/html-and-css/typographically-correct-punctuation/
+08: USABILITY.
The Goodall Technology Reading Ease Index - How Complex is Your Marketing Copy?
By Danny Goodall.
"...as part of the REPAMATron project which looks to automatically
create competitive marketing intelligence studies by inferring the
marketing strategy behind a vendor's marketing copy, I've decided to
try to rate the ease with which technology marketing copy can be
read..."
http://www.lustratusrepama.com/2011/the-goodall-technology-reading-ease-index-how-complex-is-your-marketing-copy/
Utilize Available Screen Space
By Jakob Nielsen.
Websites and mobile apps both frequently cram options into too-small
parts of the screen, making items harder to understand."
http://www.useit.com/alertbox/screen-space-use.html
Bad Interfaces - Getting Dates Wrong
By Gary Barber.
"When you use an interface it's the little things that help make it
either a pain or just outstanding..."
http://manwithnoblog.com/2011/05/09/bad-interfaces-getting-dates-wrong/
Heretical Idea - Stop Redesigning
By Gary Barber.
"...Something to consider using transforming design, instead of the
usually slash and burn redesign."
http://manwithnoblog.com/2011/05/12/heretical-idea-stop-redesigning/
[Section one ends.]
++ SECTION TWO:
+09: 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