How does your design approach affect accessibility?
How does your design approach affect accessibility?
|
|
In an article entitled “Visual vs. Structural,” Tommy Olsson compares the two most typical - and often competing - web design approaches: visual design and structural design. The balanced and well-written article makes the point that while there are often no major differences in the code produced from one design approach or another, using a structural approach can result in more accessible sites.
While I hesitate to use such loaded words as “better,” I definitely agree that structural design can contribute to a product that is more scalable, easier to maintain, and more accessible. (I say this from the perspective of someone who has employed both approaches at one time or another.) And remember, “accessibility” doesn’t just mean “blind people.” As the web moves away from being confined to the desktop computer, accessibility is as much about accommodating mobile technologies as it is about making sure content is available to disabled users.
Read | Permalink | Email this | Linking Blogs | Comments
Similar Posts
- Where am I?
- Where can I go?
- Where have I been?
- Making a post about them every once in a while
- Having a top commenters widget
- Use gravitars
- Giving the top commenters a dofollow link
- Giving top commenters profile/link on the home page
- Giving top commenters a special design when they do comment, do occasional giveaways, etc…
- Use the dofollow plugin, so high quality commenters can get some SEO value from contributing.
- Fluid Layout Using A Grid
- Adaptive Content
- Images In A Fluid Layout
- jQuery Masonry
- Smart Columns with jQuery & CSS
- Text Zooming
Take Your CSS to the Desktop with Adobe AIR!
Here is an article that you may find useful.
Designers would find it surprising that to know that you can now take your HTML and CSS skills and use it to create desktop applications. This now very much possible for anyone who is willing to explore the power of Adobe AIR. Andrew Tetlaw has a nice little article over at SitePoint entitled Take Your CSS to the Desktop with Adobe AIR!. It provides a good, short introduction to Adobe AIR and how easy it is to use your web development skills to create rich cross-platform desktop applications.
For further reading, you may wish to check out Akash Mehta’s winning article, Walk on AIR: Create a To-do List in Five Minutes.
Facelift for sunhome.biz
WebdesignFromScratch.com recently gave sunhome.biz a slick re-design and they documented there thoughts and motivations so everyone can learn. The original design was drab with a large white space in the middle of the page. Also, the original design doesn’t consider the needs of its target audience, senior citizens. The new design is much easier to follow and more pleasing to the eye. Give the article a read to learn the specifics of what they changed and why they did what they did, which is the best way to learn good design.Read | Permalink | Email this | Linking Blogs | Comments
Three timeless navigation tips
It’s 2006, and we’re still talking about site navigation? Yes, we are; and apparently we need all the reminders we can get, since so few sites seem to get it right. (Including, I’m well aware, CSS Insider. Don’t hate; I didn’t design it.)In his new A List Apart article (“Where Am I?”), Derek Powazek slaps us upside the head, again, with the cardinal rules of web site navigation. From any page on a site, a user should be able to easily answer these three questions:
Derek provides visual examples of great site navigation. Put your site to the test! Do you know where you are, where you’ve been, and where you’re going?Read | Permalink | Email this | Linking Blogs | Comments
Engaging Readers, Design Your Way to More Blog Comments
You have probably read the studies that claim on average, 1% of online users actually contribute and create content on a given website. The rest are perfectly happy reading your posts, forming their own opinions, and moving on to the next blog with out ever actually leaving any sort of feedback. This makes sense of course, we don’t always have time to leave our thoughts on blogs, or many times it doesn’t even seem worth the effort. After all you have to formalize your thoughts, actually write them out, review, edit, post, and then monitor for responses.
It actually is a lot more involved than we probably realize.
It is also a lot more important to get this type of reader interaction than we probably realize. The amount of interaction generated through a blog is an easy indicator of it’s success. Not only for the blog owner, but also to other readers. Consider looking at two blogs with similar content, one with an average of 10 - 20 responses where the other only has 1 - 3.
I hate to say it, but most people would subscribe to the blog that is generating more interest and response, even if the content was of similar quality.
How Design Can Encourage More Blog Commenting
When people blog about “design” in regards to websites many times they are primarily referring to the asthetic quality of a site. While the aesthetic quality of a site can have a large impact on how many people put in the effort to comment on a blog, I want to approach the situation at a higher level.
Consider that the definition of design is “to assign in thought or intention; purpose.”
Design is not just making pretty visuals, but to craft your site with specific thought, intention and purpose. So the question then becomes, how can we build the site with the intention of encouraging users to leave comments.
Create an Incentive or Reward
The primary reason anyone is going to leave a comment on a blog is they believe that their will be some pay off that is worth their time to formulate their response, edit it, etc… In most cases it is because they have a feeling about the content to the point where they feel the need to get their thoughts off of their chest, or maybe the author is well known enough where the idea of talking with them would be the reward.
However not all blog posts will have content compelling enough, or an author well known enough to create the incentive and reward with those elements alone.
Highlight Your Commenters
Smart marketers have found that the higher that you can appeal on Maslow’s hierarchy of needs, the better success you will have reaching your audience. By highlighting those who really participate you are appealing to the need of “esteem.”
You could do this by:
Give Your Commenters a Bonus
I have seen great response to giving the top commenters some sort of bonus. Widgets that keep track of who has commented the most make this an easy endeavor to track and monitor.
Some of the more common methods could be:
Use Design and Visuals to Engage Users
While I have talked about “design” in terms of designing an experience or functionality, I haven’t addressed the actual visuals of a design and how it can improve the amount of user interaction.
If you pay enough attention to the design and visuals of your comments, you can catch the attention of users and encourage them to leave a comment.
Make Your Comment Area Eye Catching and Interesting
As a users gets closer to the bottom of an article or post, you can bet that they have either scrolled past or lost focus of most of the visual elements on the page. This presents an excellent opportunity to draw their eye to the comment area by just adding a little bit of flair, tension, or contrast to develop some visual interest.
Want to really get some attention? Consider using custom designed form fields (not too custom as to hinder user experience).
Be Suggestive
Suggest that a user leave a comment where ever you can! At the start of the comments create a link to add a comment. You could even go so far as adding a “reply” button/link at every comment in the list.
Additionally this will make it easy to comment, as users won’t have to hunt for the add comment link.
Highlight the Commenters
People leave comments because they want people to read their opinion (even if it is just the author). Make sure that the users name/link has enough visual emphasis. This will help establish that the commenter will get the recognition that they are seaking.
Again, use Gravitars. Users who have gone so far as creating a gravitar will appreciate being able to show their branding on another blog and are more likely to comment because of it.
Any Experiences or Tips?
These are some of the best methods I have come across, if you have any experiences, tips, or other ideas on how to encourage more users to participate through the design of your blog/website feel free to leave a comment with your thoughts.
Accessible CSS Forms: Using CSS to Create a Two-Column Layout - replace …
Websites have become less accessible and more complex over time according to recent studies. Learn how to buck the trend by creating fast, accessible CSS forms that …Interview with Håkon Wium Lie
Check out this Slashdot interview with Håkon Wium Lie, the originator of the CSS idea. (Can you believe it’s been over 10 years since CSS was proposed? Time flies when you’re coding with tables!) Lie currently serves as CTO of Opera Software.In the interview, Lie suggests that before releasing IE 7, Microsoft should ensure that the browser passes the Acid2 test and supports TrueType downloadable fonts. He also discusses XML, microformats, Ajax, and (of course) the future of CSS. Read the interview and watch him effortlessly knock down all suggestions that CSS is somehow lacking in capabilities.Read | Permalink | Email this | Linking Blogs | Comments
ClickTale: Watch what your visitors are doing
Analytic services provide valuable stats to web site owners and can be the only way of determining if a design is really working or not with real users. ClickTale hopes to up the ante by recording user actions so you can see every mouse movement, every click, and every scroll. Then the service lets you, the owner, see exactly what the user did. Perfect for testing usability. Currently ClickTale is a closed beta but you can sign up for updates by email. A web 2.0 site that is plum purple? I like it.Read | Permalink | Email this | Linking Blogs | CommentsTraveling back to 1996…
The Internet was a bland wasteland in 1996. Just take a look at some of the big corporations sites from 10 years ago. It may be downright painful, but it is a testament to see how far web design has come with the help of CSS. Check out Pepsi’s futuristic web-look. Ah, those were the days…Read | Permalink | Email this | Linking Blogs | CommentsIE 7 Beta 3 available
Internet Explorer 7 Beta 3 has been announced and is now available for download. Features include tabbed browsing, RSS integration, multiple search engines via the built-in search box, and more. Sure, these are all features that Firefox, Safari, etc. have had for a quite some time, but as the old saying goes, better late than pregnant. There are no new CSS features, however; Microsoft has stayed true to their promise that, for better or for worse, as of this March IE 7 was “layout complete.”Read | Permalink | Email this | Linking Blogs | Comments
Those familiar with fluid / elastic layouts know that they can be a little more challenging to implement compared to fixed-width layouts. With the advent of wide-screen monitors, one of the biggest advantages of fluid-width layouts is the ability to maximize available space.
It was only a year ago when 1024×768 was still the dominant screen size. However, as of January 2009, 57% of the population are on desktops higher than 1024×768. The number of users still on 1024×768 has declined sharply from 48% of the previous year to a mere 36%. On the other than, the users on widescreen desktop are rapidly growing, thanks in part to marketing by HDTV makers.
Kayla Knight has written a very good article on the topic of building good websites with fluid layout.
She comes up with 6 techniques to do this, which can be summed up as follows:
She also provides helpful examples and links to all the necessary tools needed to achieve the perfect fluid / elastic layout. With this, designers are armed and ready for the next evolution in layout design.