Archive for the ‘Usability’ Category

HTML Mock-up guidelines from CMS Vendors?

Thursday, March 10th, 2011

With the develpment in CMS area, there is all the more push in the market for websites to move to a CMS system, large or small, to manage their content. As a result there are lots of new initiatives for grounds-up CMS implementation.

Usually, a CMS product starts with HTML a set of HTML mock-ups which defines how the site will look like along with specifying the static and dynamic regions on the page. By static, I mean area’s which are not editable by authors/editors and usually controlled by CSS. By Dynamic, I mean, authors/editors can go in CMS system and change content for these areas. Dynamic area could be anything, plan text, images, links etc.

The CMS developers take HTML mock-up as input, define content types based on defined dynamic area’s (and obvously functional specifications) and convert the HTML into CMS templates and content holes. The above approach sounds all straight forward but still there are soo many projects which fails/get delayed. And one of the reasons is HTML mock-ups.

Usually in an enterprise environment, multiple vendors are involved in building a website, from creative agencies, to implmentation partners to hosting partners. In most of the cases the creative agencies which develop HTML mock-ups who has no clue around how the HTML mock-up is going to be fitted in a WCM in terms of templates/ components/ elements etc. They try to make website flashy, attractive without really worrying around its maintenance. Some of the examples are:

  • Using images everywhere in the site goverened by CSS than HMTL
  • Same block of content using different HTML structure on different pages though the look and feel is the same
  • Hard coded height width dimensions for image tags
  • Too many variations in layout, which in reality could fit in just a few
  • etc.

Even if the HTML mock-up is developed to the best of practices, its usage varies with each CMS. An example, there is a style defined globally which is applicable to all the divs in centre portion of a page. Some CMS systems add their own divs when elements/components are dragged on the centre part. This leads to style issues for the centre portion and we spend lot of time negating those effects.

I think its time for CMS vendors to move forward and lay down best practices, guidelines that needs to be followed when developing HTML mock-up for their product. This could definitely makes easy for creative agencies and implementors to get it right the first time than really spending time on HTML structures just because the choosen CMS doesn’t like the way HTML mock-up is designed. It will really going to reduce overall project cost and project failures.

IE6 Countdown: Right time for Browser Standards

Sunday, March 6th, 2011

Its good to see world is ready to move on from Internet Explorer 6. Here is a snippet from IE6 count down site:

10 years ago a browser was born. Its name was Internet Explorer 6.
Now that we’re in 2011, in an era of modern web standards, it’s time to say goodbye.

This website is dedicated to watching Internet Explorer 6 usage drop to less than 1% worldwide, so more websites can choose to drop support for Internet Explorer 6, saving hours of work for web

Internet Explorer 6 usage around the world

Internet Explorer 6 usage around the world

As per my previous post Write Once, use everywhere? Content Vs Code, I think it’s perfect timing to get some standards defined around web browsers.

For corporates, its time to move on and this move is definitely going to give great boost on Intranet front, presenting more opportunities and opening new doors.

Write Once, use everywhere? Content Vs Code

Saturday, March 5th, 2011

One of the thumb rule for any CMS system is:

Have just one instance of the content and define templates/components/modules/elements to render it differently

So, Why the same rule doesn’t apply for code written to define styles, javascript functionality across browsers?

Let me take an example from one of my recent project: As per requirements, we need to support IE (6,7,8), Forefox (3.x), Safari (3.x), Opera (9.x). The HTML mock-ups are generated by one of the creative agency who are in the market for good number of years and know their stuff. SO, just analysing the HTML mock-up, total HTML/CSS/JS size is around 1.9 MB (exclding images). Out of which the CSS/JS specifically for handling cross borwser issues is 0.06 MB which roughly forms 3.5% of the total code set. And such
percentage of cross browser hacking code is present on most of the website.

Below are some of the issues from different perspectives:

Development Perspective

  • Analyse browsers which the site needs to support for previous web analytics or such tools
  • Define graphics which could work across browsers
  • Develop mock-ups with this extra code to hack site working across browsers
  • Testing effort across browsers. Most of the times the UAT error log will have such issues in good percentages
  • More development effort, hence more cost to the project


JAX India 2007: Day 1: Web2.0? But I am Barely keeping up with Web 1.0 Right Now !

Monday, May 28th, 2007

Its been an exciting day on the inaugural day of JAX India 2007. The day was
meant for workshops and I attended half a day workshop on
“Web 2.0? But I am Barely keeping up with Web 1.0 Right Now !”
by Craig R McClanahan. Here is extract from the session:

The session covered from history of web to what is Next Generation web (Web 2.0) and what we should do towards it. Here is extract from his presentation:


He started with his experience of Web way back when he started in 1975. From Lonely computers, which were self-absorbed applications to telephone lines (part lines to kids line) which lead to evolution of Internet and standards like HTTP and HTML.


This section of the presentation covered about how the current web applications are. Few main highlighting points are:

  • Increasing support for cross browsers
  • Key area of development happening around Mobile space
  • Server side capabilities are growing
  • Programming understanding in multi-threaded environment
  • Storage capacity is effectively free, CPU nearly so
  • Network infrastructure improving
  • Development technologies maturity at a much slower pace and challenges are in coming up with a framework like Struts and IDEs for JS-DHTML developments
  • More and more user personalization
  • Standardization at different scales and complexities


Craig stressed on using next generation web rather than Web 2.0 with emphasis on 4 key drivers:

Enhanced User Interfaces

The driving force is the limited usability of web applications compared to applications installed locally. Ajax and DHTML are the immediate solutions.

Lightweight Programming Models

  • Strong preference towards simplicity; less code = less initial work, less update work
  • Scripting languages again gaining popularity with many large application built with php, perl etc.
  • Loose coupling and layer based design
  • Increasing preference for quick, iterative approach (Agile model)
  • Programming models  
    • Ajax and DHTML (server side business logic)
    • Ajax and DHTML (client side business logic ) i.e. making web applications
      available offline 
    • Browser plugins (Flash/ Flex/ Java FX etc)

Web as a Platform

  • Web applications to become more of a service
  • Web platform providing Social network effect
  • Reducing “local islands” of important data
  • Users looking something bigger
    • Identity
    • Flexibility
    • Ubiquity 

The read/write web 

  • Web as a Bulletin Board


Craigs Top Ten Suggestion List

10 – Expose Data/Logic as services

9 – Incorporate External Content

8 – Seek QOS (Quality of Service) deals from Sources

7 – Give QOS Deals to users

6 – Adopt Agile Processes

5 – Test Driven Development

4 – Architect for Scalability

3 – Embrace Heterogeneity

2 – Reach out to Mobile Clients

1 – Enable User Provided Content

The session turned out to be good for users who do not have exposure to Web 2.0. The first 45 minutes where Craig covered History of web and existing applications was bit too extended and I was looking for more on Web 2.0. Let’s hope the other sessions lined up around Web 2.0 will be able to provide more insight.

Is Ajax making sites less reachable?

Thursday, May 17th, 2007

We have been talking about Ajax and Web 2.0 technologies for sometime now. At one end Ajax becoming an asset from usability point of view but on the other hand it is making sites less search engine friendly. Search engines for now are not intelligent enough to make a server side request and retrieve the information to index. So it boils down to Usability Vs Search-ability? Which one to achieve?

What is the best way to achieve a balance between the two – making my site usable as well as search-able.

Here is one of the possible approach:

Step 1: To design your site without any Ajax. Javascript
Step 2: Then modify your website to include small Ajax, Java scripts components making sure that the content that gets hidden is available else where in the site which does not deploy Ajax

Another Collaboration Feature: Google’s Gadget

Wednesday, May 2nd, 2007

Here is another Collaboration Feature from Google. Google has introduced a new Gadget maker product for iGoogle (new name for Google Personalized Homepage). The users without having any programming or web design experience can create Gadgets and share with community or other iGoogle user. The Gadgets are as simple as filling out the form in the predefined 7 templates:

• A Photo gadget which is designed to share a series of photos
GoogleGram gadget that display a new greeting message for every day of the week
Daily Me gadget which will show what you’re currently doing, as well as quotes, what’s on your mind etc.
Free Form gadget that as the name suggest will allow free flow of information, image text layout background colour
YouTube Channel gadget to share good videos on YouTube
• Personalized List Gadget to basically present your list of items. It could be list of your favorite songs, a list of items to buy today etc.
Personalized Countdown gadget is more like a reminder to any event, happening with a countdown

Apart from this, it provides option to update the Gadget and re-publish so that it gets updated at the other end.

Pretty neat way to bring people togather !!!! :)

But few things to watch out for:

• Updation at receiving end took a pretty long time to get refreshed with updated information
• No intimation whether the iGoogle user has added your Gadget or not
• If the Gadget creator deletes the Gadget, will it get deleted at the other end?
• A way to establish two way communication rather then just one way for now

Web Applications to be available offline

Friday, April 13th, 2007

Off late there has been lot of web sites that I came across which are trying to provide offline access for their Web applications. The basic idea is that the application can be worked with in a browser offline and automatically sync up whenever you get online.

Scrybe is one such online/offline calender and organizer service that provides offline web application service.

Catchup with Open Ajax Project

Thursday, March 22nd, 2007

Open Ajax Project or better known as Open Ajax Alliance has added many more members to their alliance. The biggest name to add to the list is Microsoft. This makes a total count of 73 members working towards Ajax Globalization.

Alliance has come up with the term called “OpenAjax Conformance” which defines a set of conformance requirements on Ajax technologies, products and applications to promote Ajax interoperability.
An Ajax library will be with Open Ajax Conformance only when:

1) Supports OpenAjax Hub Specifications (OpenSource project)
2) Javascript objects with OpenAjax Registry
3) Support best practices defined within Open Ajax Conformance

These developments clearly indicates where the http domain moving on. This is also one of the talking points with Web 2.0 :)

Ajax – Looking back at year’s old journey

Sunday, February 19th, 2006

Ajax has come a long way in a year’s time. Last year around this time, we first heard about it. Ajax had brought about the a big difference in web applications which largely changed usability arena. Web Applications started looking like rich desktop applications. Let’s look at its journey from rebirth.


Ajax Implementation – An Example

Thursday, January 19th, 2006

In my earlier post, “Are we ready to adopt Ajax to improve usability?“, I highlighted that best bet for the existing sites is to start small may be including an ajax based components or use ajax to validate form fields etc. Here is one of the example. (more…)