+++ WEB DESIGN UPDATE. - Volume 10, Issue 01, July 1, 2011. An email newsletter to distribute news and information about web design and development. ++ISSUE 01 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: COLOR. 04: EVALUATION & TESTING. 05: EVENTS. 06: MISCELLANEOUS. 07: NAVIGATION. 08: PHP. 09: STANDARDS, GUIDELINES & PATTERNS. 10: TOOLS. 11: USABILITY. SECTION TWO: 12: What Can You Find at the Web Design Reference Site? [Contents ends.] ++ SECTION ONE: New references. +01: ACCESSIBILITY. Images of Text - Accessibility for Web Writers, Part 7 By Dey Alexander. "Avoid using images of text on the web because some people will find them hard, if not impossible, to read. For instance, people with reading problems such as dyslexia may struggle to read certain fonts, line spacing or text alignment. If these are 'hard-coded' into an image, they cannot reformat the text into a more readable style..." http://www.4syllables.com.au/2011/06/accessibility-web-writers-part-7/ How to Start Adding Captions/Subtitles to Online Videos By Bill Creswell. "I was talking to someone today who wanted to start captioning their videos. This seemed like a good use of a volunteer, so I gave them some starting out info..." http://billcreswell.wordpress.com/2011/06/28/how-to-start-adding-captionssubtitles-to-online-videos/ Waiting for Screen Readers to Learn the Semantics of HTML5 By Virginia DeBolt. "There are new semantic elements in HTML5 with names like header, article, and nav. But the screen readers haven't quite caught up with the element names yet. The most recent test results I've seen on how various browsers and screen readers handle the new HTML5 semantic elements can be found at Accessible Culture..." http://www.webteacher.ws/2011/06/27/waiting-for-screen-readers-to-learn-the-semantics-of-html5/ Evaluating Accessibility with ChromeVox By University of Michigan. "Google ChromeVox has a very low learning curve and is perhaps the easiest screen reader for web production folks to use for accessibility verification. ChromeVox is intended to be the nastive screen reader for Chrome OS, but it has the worthwhile side benefit of being available as an extension for the Chrome browser..." http://www.umich.edu/webaccess/eval/chromevox.html Assistive Technology Experiment - ZoomText By Jon Whiting. "...recently decided to spend some time becoming more familiar with a few common assistive technologies, starting with the screen magnification software ZoomText. I have shared a few of my experiences with ZoomText below..." http://webaim.org/blog/at-experiment-zoomtext/ Blind Students Sue Florida State University for Discrimination By National Federation of the Blind. "...The violations include requiring the students to use an inaccessible Web-based application to complete homework assignments, tests, and quizzes; requiring the use of clickers that cannot be used by a blind person to respond to in-class questions and obtain bonus credit; failing to provide Braille versions of the required textbooks in violation of agreed-upon accommodation plans; and engaging in retaliatory actions when the students complained of these violations..." http://www.nfb.org/NewsBot.asp?MODE=VIEW&ID=819 Blind Florida State U. Students Sue Over E-Learning Systems By Jie Jenny Zou. "Two blind students at Florida State University have sued the institution and its Board of Trustees for discrimination, arguing that a mathematics course at the university relied on e-learning systems that were not accessible to the disabled..." http://chronicle.com/blogs/wiredcampus/blind-florida-state-u-students-sue-over-e-learning-systems/ Federal Government Website Accessibility - Still a Long Way to Go By Jonathan Lazar. "Website accessibility is conceptually different from a lot of other types of compliance for people with disabilities, even other technology compliance. For example, if you design doorways or bathrooms to be accessible for people with disabilities, once they are designed, evaluated and meet the proper regulations, you rarely need to re-check them for compliance. The doorframes don't change on a monthly basis. Once accessible, they are accessible until they are structurally altered (or regulations for accessibility are changed)..." http://blog.govdelivery.com/usodep/2011/06/federal-government-website-accessibility-still-a-long-way-to-go-.html Getting to Grips with a Mobile Accessibility Strategy By Henny Swan. (Misattributed last week. Apologies to Henny.) "Establishing a mobile accessibility strategy can be a bit daunting. It's tough to know where to start and even tougher to know where to stop: what devices should be supported, browsers, apps, access technology, who is it for and how teams can incorporate best practices into their working practices?..." http://www.iheni.com/getting-to-grips-with-a-mobile-accessibility-strategy/ +02: CASCADING STYLE SHEETS. CSS3 Course (videos) By Nick Pettit. This CSS course has sections on borders, gradients, animation, typography, media queries, selectors, backgrounds at no charge. http://membership.thinkvitamin.com/library/css3 CSS3 Linear Gradients By John Allsopp. "WeĠre starting with linear gradients. We'll take a look at where they come from, how to use them, and the current level of browser support. Ironically although webkit introduced gradients, until version 5.1, Safari has supported a different syntax from that described here Ñ so, if you are using a version of Safari other than 5.1 (currently in beta) you won't be able to see the examples..." http://www.webdirections.org/blog/css3-linear-gradients/ CSS3 Border-Image By Estelle Weyl. "A feature that is new in CSS3, but not so new to browsers, is the border-image property. Border-image provides a method to add decorative borders to any element. With the border-image properties you can create decorative borders for elements, beyond simple rounded corners, with images of very small file size or even with gradients." http://www.sitepoint.com/css3-border-image/ Techniques for Context Specific Images By Chris Coyier. "One of the shortfalls of using CSS media queries as the only ingredient of a mobile solution is that the same content gets served to both desktop browsers and mobile devices (which theoretically are slower and have less network speed). Serving the same HTML to both... not as big of a deal. Serving up images that are many times bigger than they need to be on mobile, that's more of a problem. A number of smart people have tried to solve this problem, so I just wanted to highlight their work here..." http://css-tricks.com/9838-techniques-for-context-specific-images/ Farewell Floats - The Future of CSS Layout By Joshua Johnson. "Floats are one of the most basic tools for structuring a web page using CSS. They're both one of the very first things that we learn about and one of the last things that we truly master. Today's article looks at some of the reasons that floats are pretty lame and takes a look at a number of alternative layout systems, some of which are still under development but may one day represent the standard for CSS-based layout..." http://designshack.co.uk/articles/css/farewell-floats-the-future-of-css-layout/ Fighting the TR - CSS Styling Restrictions By Niels Matthijs. "How can it be that with several years of intense front-end experience, you can still get stuck implementing the most trivial of things from time to time. Not too long ago I okayed a design that seemed simple enough, but once I sat down to implement it (keeping in mind IE6/IE7 support) I hit a wall pretty quick. I've questioned the usefulness of html restrictions before (html headings and the footer attribute), the same argument can be made for restrictions on css properties..." http://www.onderhond.com/blog/work/styling-tr-issues-cross-browser CSS 2.1 Complete: Unblocking Faster Web Standards Progress By Adrian Bateman. "...Finishing CSS 2.1 is a turning point for the Web..." http://blogs.msdn.com/b/ie/archive/2011/06/28/css-2-1-complete-unblocking-faster-web-standards-progress.aspx +03: COLOR. Color Blind Essentials By Daniel Fluck. "Many people are looking for the basics about color blindness. So I wrote the following series on Color Blind Essentials which should give you a good overview over the most central topics..." http://www.colblindor.com/2010/02/23/color-blind-essentials/ +04: EVALUATION & TESTING. Usability Testing is HOT By Dana Chisnell. "...People who find usability testing hot say it's about data that can end the opinion wars, revelations and surprises, and getting perspective about real use, motivations, and context of use..." http://usabilitytestinghowto.blogspot.com/2011/06/usability-testing-is-hot.html Usability Testing - What to Test By Jacob Creech. "When you have decided that you want to usability test, one of the first things you have to consider is what you are going to usability test..." http://www.intuitionhq.com/blog/2011/05/website-usability-testing-what-to-test/ Website Usability Test - TED.com By Jacob Creech. "Among the more frequent questions that people ask, or more properly, that people would like to see, is a complete website usability test from start to finish. That means from your first look at a website, deciding what questions to write, sharing a test with your testers, and interpreting the results. This sounds to me like a grand idea; there is nothing like having a complete walkthrough to help you from start to finish, and it's a good exercise to go through for us as well, and so we'd like to introduce the first in our series of Website Usability Tests - TED.com." http://www.intuitionhq.com/blog/2011/06/website-usability-test-ted-com/ Website Usability Test - Gizmodo.com By Jacob Creech. "This time around we are looking at Gizmodo and seeing how the design and usability of the site stack up..." http://www.intuitionhq.com/blog/2011/06/website-usability-testing-gizmodo/ +05: EVENTS. ARIA and jQuery UI Accessibility Hackathon July 11-12, 2011. Toronto, Canada http://wiki.jqueryui.com/w/page/38817541/ARIA-Hackathon Human-Computer Interaction July 12-14, 2011. Orlando, Florida, U.S.A. http://www.hcii2011.org/ Usability Week 2011 San Francisco September 25-30, 2011. San Francisco, California, U.S.A. http://www.nngroup.com/events/san_francisco/agenda.html The Future of Web Apps London October 3-5, 2011. London, United Kingdom http://futureofwebapps.com/london-2011/ Usability Week 2011 Austin October 3-7, 2011. Austin, Texas, U.S.A. http://www.nngroup.com/events/austin/agenda.html Web 2.0 Expo October 10-13, 2011. New York, New York, U.S.A. http://www.web2expo.com/webexny2011/ Usability Week 2011 London November 13-18, 2011. London, United Kingdom. http://www.nngroup.com/events/london/agenda.html +06: MISCELLANEOUS. Web Designers Roadmap for 2011 By Stefan Mischook. "What to learn (as of 2011-2012) - in order of priority: 1. HTML, 2. CSS, 3. PHP basics, 4. Javascript, 5. JQuery, 6. Wordpress, 7. OOP PHP (for programmers only), 8. HTML 5 and CSS 3, 9. iPad / iPhone (choice of either: Objective C or HTML 5 + CSS 3)..." http://www.killersites.com/blog/2011/web-designers-roadmap-for-2011/ Findings From the Web Design Survey, 2010 by ALA Staff. "It was just five years ago that this magazine and its design conference offshoot sought, with your help, to begin determining the precise professional dimensions of our shared craft..." http://www.alistapart.com/articles/findings-from-the-web-design-survey-2010/ +07: NAVIGATION. How ARIA Landmark Roles Help Screen Reader Users By Leonie Watson. "This video from Nomensa demonstrates how ARIA landmark roles help screen reader users understand the purpose of different areas of a web page, such as search, navigation or main content." http://www.youtube.com/watch?v=IhWMou12_Vk Three Easy Metrics for Improving Website Navigation By Jeff Sauro. "Here are three simple metrics which can be collected as part of tests using card-sorting or tree-testing in any stage of design..." http://www.measuringusability.com/blog/navigation-metrics.php Creating Meaningful Site Search by Challenging Assumptions By Emily Smith. "The role of search in your site can be a hot topic. Sometimes there is pressure to make it a giant bandage to cover poor navigational structure, and other times it's included just because 'every site needs search.' Let's look at three pervasive myths about search and two questions that will help us create a strategy unique to every site..." http://designfestival.com/creatin-meaningful-site-search-by-challenging-assumptions +08: PHP. PHP Documentation Update By Hypertext Preprocessor. "PHP has several new documentation features that the community should be aware of..." http://www.php.net/index.php#id2011-06-25-1 +09: STANDARDS, GUIDELINES & PATTERNS. Irreconcilable Differences By Larry Masinter. "The ongoing battle for future control over HTML is dominated not only by the usual forces ('whose technology wins?') but also some very polarized views of what standards are, what they should be, how standards should work and so forth. The debate over these prinicples has really slowed down the development of web standards..." http://masinter.blogspot.com/2011/06/irreconcilable-differences.html Why HTML5 Elements INS and DEL Suck By Daniel Glazman. "I have said it multiple times here, in W3C mailing-lists or in public between 1998 and now but apparently it must be said again and again: the current HTML5 Last Call Working Draft - that does not reach at all the quality of other LCWD in the W3C and did not meet the basic requirements for a LCWD in the W3C Process - still has not worked on that erratum. So let me repeat it : html5 ins and del elements suck and should be dropped in favor of a better solution..." http://www.glazman.org/weblog/dotclear/index.php?post/2011/06/25/Why-html5-elements-INS-and-DEL-suck Knowing When to Break the Rules By Derek Featherstone. "If breaking a rule like validation by adding ARIA means that your interface becomes more accessible then do it." http://simplyaccessible.com/article/break-the-rules/ HTML5 Elements: An Irresponsible Choice...Right Now By Trevor Davis. "Ok, before we get too far into this, I want to say this: I fully support web standards and progressive enhancement..." http://www.viget.com/inspire/html5-elements-irresponsible-choice-right-now/ Quoting and Citing with
, , , and the cite attribute By Oli Studholme. "Given HTML's roots in the academic world, it should be no surprise that quoting is well-accommodated in the elements
and , with their optional cite attribute. In addition, there's the element, which over the last nine years went from 'semantic orphan element made good' to one of the more contentious elements in HTML5. Let's power up the endoscope and examine the scarring, starting with
...." http://html5doctor.com/blockquote-q-cite/ Retain Accessibility Immediately By Douglas Schepers. "There has been a heated argument recently on the W3C Canvas API mailing list between accessibility advocates and browser vendors over a pretty tricky topic: should the Canvas API have graphical 'objects' to make it more accessible, or should authors use SVG for that?..." http://schepers.cc/retain-a11y-immediately +10: TOOLS. aViewer Beta - Updated By Steve Faulkner. "...Here at TPG we have been working on a new tool to inspect elements on a web page and be able to view the HTML code, ARIA attributes (if any) and the information being conveyed by the browser to accessibility APIs, all in one neatish interface. We have given it the catchy moniker 'AViewer' and a beta version is available for download...Runs on Windows only." http://www.paciellogroup.com/blog/2011/06/aviewer-beta-updated/ CSS3, Please! The Cross-Browser CSS3 Rule Generator By Paul Irish and Jonathan Neal. "You can edit the underlined values in this css file, but don't worry about making sure the corresponding values match, that's all done automagically for you. Whenever you want, you can copy the whole or part of this page and paste it into your own stylesheet." http://css3please.com/ +11: USABILITY. What is Usability? By Jacob Creech. "...Today I'd like to talk about what usability is, and why it's so important..." http://www.intuitionhq.com/blog/2011/05/what-is-usability/ [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@d.umn.edu [Issue ends.]