Stepping into Usable Web

Stepping into usable web – the slider was presented at Experience Sharing event in January 2012. It was a small event with some smart IT professionals from Bangladesh. The event was fun and memorable. I took the chance of explaining what I feel about Usable Web, What a website should have? What steps we can follow to ensure usability and give rich experiences to the users?

I believe -

Website is not only a frame of images, links or texts anymore! A website should so usable not only for it’s visitors but also for machines too!

Elements of a Usable Web

The slider was divided into six main sections.

  1. Concentrate on User Goal
  2. Develop Information Architecture
  3. Make an Effective, Readable UI and accessible UI
  4. Semantic Markups
  5. Need for Speed (The Book)
  6. Make it social make it SE friendly

User First! Concentrate on User Goal

  • Who will be visiting your website?
  • What do you want them to do?
  • What they will get from your website?

Become and Architect! Work on Information Architecture

  • Content (List of all possible contents)
  • Site Map Diagram (Page structure)
  • Wireframes
  • Prototypes (Screen Design

Reference: Usability First

Make Usable UI! Work on User Interface

  • Converting wireframe and prototypes into final design format
  • Design for devices
  • Design for accessibility
  • Design for usability
  • Design for Rich Experience

Semantics! Meaningful Markups

  • Your markup should not be alien codes
  • Readable for devices
  • Meaningful
  • Understandable
  • Device and SE robot friendly

Reference: Dive Into HTML5 (http://diveintohtml5.info/semantics.html)

Speed it UP! Ensure Web Performance

  • A single second delay can loose you thousand of $$$$
  • Don’t overload your website
  • Use less HTTP calls
  • Use modern techniques
  • Load progressively

Reference: Book of Speed (http://www.bookofspeed.com/),  Learning CSS3: Useful References (http://www.smashingmagazine.com/learning-css3-useful-reference-guide/)

User Rich Tags! Make it Social Media and Search Engine Freidnly

  • Emphasise on Rich Contents
  • Use Microdata
  • Schema

References: Google Rich Snippets

It was a very interactive presentation. Each points were elaborated on that event. Let me know if you need detailed explanation on any particular segment. Asj them in the comments section.

Would You like to get into a User Experience and User Interface related group? I am trying to form a group called UXCon in Facebook. Get in and ask others to join the group.

No related posts.