Why Image aspect ratios need to be defined at the information architecture level itself ?

Information architecture document specifies various sizes of images that need to be used in various pages. The dimensions are fixed to complement the look and feel of the site, based on the the importance of image in that page and on the relative importance of the article the image supports. However, In a standard, 3 level page structures with Home, Section and Article levels, progressively larger dimensions are used. Example, Thumbs are used in the home page, while slightly larger image size is used in the section level and the largest is used in the article level page.

Now when each section of the site addresses different target audience and their tastes and purposes of visit, it is very reasonable that the importance of image, in relation with the write up along with it, will vary. This is where the project team faces the greatest challenge. If the project team does not define the image sizes at the level of IA itself, they are heading for big trouble at the technical development stage. This is especially true when certain sections are cross promoted and showcased. But defining the size of the image is not enough.

Project team should try and keep an aspect ratio for the images. When i started off my career, it was difficult for me to understand the term aspect ratio and its relative importance. So i guess it would be great to refresh our understanding of the term again. Aspect ratio of an image is the ratio of the width of the image to its height, expressed as two numbers separated by a colon.

While fixing an aspect ratio, it should be ensured that images with smaller diamensions are displayed by trimming down the largest image along with the description or details used. If the largest image diamension is taken as the base size, there will be very little deformity to the image even if it is resized downwards.

Below are few reasons why aspect ratio is important at the early stages of planning a website:

Images can appear in multiple slots: In modern websites, an image can never be considered independently. It always has a relative existence. This is especially true when websites attempt cross selling. Example, Lets consider the website of a company concentrating on auspicious event management like wedding, funerals etc. Assume that there is a description of wedding service, it is natural that the marketing would want the floral arrangement services of the same company cross promoted in the same page. The company may also decide to cross sell all the relevant services in the same page. So the image that appears as part of the description will have to fit into a smaller showcase allotted for related services. If an aspect ratio is kept, the images will appear perfectly in any small slots.

Device usability: When the same content is delivered through different devices like PCs, laptops, mobile phones, TVs, e-readers, other handheld devices, and even on billboards, it is always safe to maintain an aspect ratio. Human interaction with these different devices are so different that it is always necessary to keep an aspect ratio where largest possible image can be downsized real time using a small program or script once the device is identified when the content rendering happens so that a user will not have go in search of the navigational links when the user reaches at the bottom of any article.

Bandwidth: When the bandwidth is low, it is always better to serve images with smaller size and dimension. This would give optimum user experience. Have you ever tried to access a mobile unoptimised website on your handheld device with a creeping GPRS connection? If you are in India, you may have faced the issue many times. The site will load partly and the user waits for ages to see even the header, let alone the body of the site.

Screen size: With different devices and platforms delivering content over different screen resolutions, keeping an aspect ratio allows users to access easily the content of their choice. Content that is rendered properly on a computer may not appear as decent on a mobile handset browser because of the smaller screen size.

Difference in the monitor resolutions: Even the difference in monitor resolution has significance. Other day i was trying to point out to one of websites readers the link to subscribe our print magazine. The link to subscription site is available on the right panel of the site. But the customer is unable to spot it. After verifying multiple possibilities with the customer, i realized that his monitor resolution was 800 x 600 and the banner appears only if the monitor resolution is 1024 x 768

If the aspect ratio is not insisted from the beginning, it is likely that some images may appear deformed due to shrinking or breaking while same image would appear perfect else where on the same site.

How to make users more active on website ?

How to create website features for a specific target audience ? Part - 3

In this last part lets discuss the features that emerge from the interaction of the user with the possible activities on the website. Consider, the situation where a pensioner is paying online. What would he consider when he finds an option to pay online ? What might go through his mind ? What features would actually turn him away from paying online ? What would actually induce him to pay online ? All these questions should pop up inside our head when we consider a feature that allows pensioners to pay online.

Again a little bit of the unique nature of the user comes up. As far as i could gather, there are not many seniors who are web and computer friendly. They are not familiar and hence very reluctant to trust the new age payment mechanisms. I have seen many senior persons asking a relevant yet rather strange question - Who are we paying online in an E-Com site ? There is no one to receive the money and there is not even physical currency involved. Simply put, our older generation just don't believe in online payments. So going back to the questions that i have listed in previous paragraph, lets reconsider one specific question - what will actually make a senior citizen pay online. If the answer to this question can be executed flawlessly, that site would see a lot of traffic from the TA and online payment by senior citizens is bound increase. Lets consider a few features based on this single question alone:

• Descriptive helps for all the steps and processes to complete the payments.
• A customer support person who is reachable 24 x 7 over the phone to help. Messages like this would help increase the safety feeling a lot - "Are you finding it difficult to pay online, Call Ms. Mandira Bedi, Customer support executive. Toll free number : 1800 180 1407
• Give telephone number clearly visible in the payment page.
• Use trusted online payment systems like icici payment gateways
• Testimonials of individuals who have payed online before through the site would increase the credibility tremendously.
• A system that ensures that when someone pays online or could not pay online completely, the person gets a follow up call from a customer care executive to help.
• A contact address upfront with images of head office of the company to give a personal feeling to the whole business.

So far we considered only one proposed requirement in the scope document that is to allow senior citizens to pay online. In similar fashion, each requirements in the scope document should be considered as deep and elaborate as possible to come up with all the user specific and activity specific features related to it. Hope i made some sense to you. It would be great to know your opinions and thoughts. I would love to hear from you so that i can get to know the areas where my readers would actually like to read about. Drop me comment below or click here to know my credentials. Thank you.

How to create activity specific website features ?

How to create website features for a specific target audience ? Part - 2


In part 1, we talked about how to woo the target audience with user specific features. In this part, lets discuss how features, related to activities in the site, can be used attract the target audience to the website. Lets go back to our example of our beloved pensioner again. Here the activity that our pensioner is expected do on the site is to pay online. So based on this one aspect alone i would include in the site, the following features:

           

·                    Both card and direct online bank payments

·                    Develop a mix of online and offline payment. Pay using conventional demand draft or wire transfer and keep an e wallet.  Use the e wallet to pay online. This would help the user to avoid using cards online.

·                    A contextual help menu that explains the user the significance of each process in the online payment.

·                    A help section with all the possible questions answered related to the use of the website and payment online.

·                    Reply messages before and after payments with a unique number to identify the payment.

In the part 1 and 2, we considered both the user specific as well as the activity specific features that may be included in the site to attract the TA. In the 3 rd and the last part of the article, we shall address the most relevant features that emerge from the interaction of user with the activities in the site. In situations like online payment, these features are so important that they can significantly increase the taking place of the activity. By including these features I shall explain in the 3 rd part of this article, the web site will be able to increase the number of online payments done through the site by pensioners by giving them optimum user experience. So keep glued to identical self.

How to create user specific website features ?

How to create website features for a specific target audience? Part - 1


If you have read my September 3 rd posting "How to define the target audience of your website?", you can very well read on. If not I would strongly recommend you to please go and read the same before you read any further down this article. As my mother would always say, you got to sit down and then stretch your legs if not, almost always, you would fall.

Talking about my mother, she might be making snacks for evening tea now. Its 2 40 PM IST on Sunday here. But i am not with her so i miss the spicy Vada that she makes so well. Ok, lets leave vada for the time and talk about website features.

Once you outlined and made a fairly good idea about the characteristics of your audience, it is time for you to crystallize the insights into website features. Almost always, the scope document would only say that the audience likes to read and interact based on a subject or do certain things. It is upto the project team to understand the requirement and translate the same into web features or activities. Now, lets consider the user specific features which are ignored on most of the occasions as unimportant. Adding the user specific features would really improve the user experience. I can personally assure you that.

User specific features:

Lets take an example here. If the scope document says, the site should allow pensioners to pay online, what would be the implications? If we consider only the user here ie. the Pensioner, we can list out the following features for the site:

Who is a pensioner? It is obvious that we are dealing with Senior citizens around the age of 60 or even more. First lets consider their physical conditions. They are seniors, they may have fading eyesight, fading health and very little attention span. Based on these physical conditions the web site should use:

1. Bigger fonts so that links and descriptions are clearly visible and understandable
2. Uncluttered design to ensure that no other major distractions are present in the page that would take them to other services of the website. E.g., online payment pages should have only the links that is related to making payments and global navigation links to guide the user back to where he or she came from.
3. Option to add any page to favorites. There should also be clearly explanations that will help the user to understand that by adding the page to favorites they can come straight to the payment page.
4. Alias urls that may be easily remembered by anyone like nyt.com for newyorktimes.com

Just by considering the "Who" part of the target audience itself we can list out features that will make a lot of improvements in the user experience. Features suggested above are generic as far senior citizens are concerned. When we consider senior citizens along with their social and academic background, we may have to uncheck a few features and include a few others. The point here is to have a deep understanding of the target audience (TA). The clearer the picture of the website's TA, the easier it is for the website to engage with the users.

I shall be writing about including different activities in the website that would appeal to the TA in my next posting. So stay glued for Part 2.

How to define the target audience on web ?

One of the most important concern of any online initiative is how to engage the target audience. Any thought in this direction should begin with identifying and defining the target audience who are likely to be interested in the initiative and would inturn would do any business. Ask yourself these simple questions and the answers for which  would define your target audience.

Most important of these question is who would do business with you ? Try to figure out who would be interested in your products or services that you offer. Be as detailed as possible and categorise the target audience into several groups with similar charecteristics eg., beauty conscious yong women

Once you linked the nature of your products and services with the potential buyers, try to find answer to the next pertinent question - what are the charecteristics of this target audience. Try to categorise the target group interms of their age, social status, gender and your broad idea about the interests of each target group. Lets say if the product is related to personal care targetted towards young men and women, never present the information in way a pharmaceutical company would present the same information. Figure out what would appeal to the young. This should reflect not only in the presentation of information but also in the design of the site.

Now you have the target audience categorised into several groups and charecteristics of each group. These charecteristics should be translated into online functionalities. This can range from categorisation of products and services to chaing the look and feel of the site according to the group that would frequently visit the site.

Once these online functionalities are ready, it is time to figure out how these functionalities and features should be presented on the website. Logically, what would appeal most in the target audience should be highlighted most in the page. Each functionality should be treated as elements with progressively lesser importance. If there is a product or service that is unique or that needs to be given priority because of any business interest, that also should be addressed with importance while placing different elements on the web page.

There are several techniques that would prove very useful in defining target audience. Sampling of the potential customers is an important tool. Interviewing potential customers is another very useful technique. Card sorting is another technique that can be effectively used to find out what needs to be placed as most important and less important on a web page. Valuable insights will also be available if the traffic data of competitor sites can be analysed, but this is highly unlikely. Once the site went live and traffic began to trickle into the site, then also web analytics can prove very useful. Google analytics is an efficient web analytics service which can be used by the web administrator free of cost.

So it is neither the beuty nor the technology that will generate business for an online initiative. The more we know about our potential customers, the better our chances of tuning our products and services according to their requirements and hence doing  larger volume of business.

I would like to hear from you what you think about the ideas expressed here. Please feel free to drop me a scrap or email with your comments, concerns and questions and i would be more than happy to share my suggestions which you might find useful.

regards,

Shivaprasad

Make information retrieval easy

We work with 1000 GBs of data and virtually thousands of files on a daily basis. You get a call, and suddenly one of your bosses is asking for a proposal that you prepared in 2008. Gosh...that would be the response that most of us would let out. Microsoft has given us a good search tool. But that proves useless, as you have no clue what to search for. You consider the year, even the text within the file...then you search for the open window next to you..to sneak out. But i can assure you that this will not happen, if you had taken that little pain of arranging the files in your own computer.

Keep an Index:
First try to keep a clean index of your files. Index need not be a notepad which you keep on the desk top as an icon. It may be even a folder structure.

Follow naming conventions:
Try to give files proper names. Do not under any circumstances give numbers. It will be very difficult even for a computer to search them out. I have even seen people pressing any combination of random keys and give names. I have seen my friends giving names of local kerala foods to jpg prototypes. Next time when you download a file from the net or visit an HTML page on any website, see if these files carry any of those stupid and irrelavent names in live. If possible follow a naming convention that even specifies the purpose or situation where this file or matter will be used.

Learn to cat and subcat.
Organise your files inside different folders. Organise these files under categories and subcategories. See a simple folder structure as below for all the files:

today, this_week, other_weeks_ of_ the_ month, last_months, 2009

today will keep all files that you are working on that day

this_week folder will keep all the files that you have worked on till yesterday

Other_weeks_ of_ the_ month folder will keep all the files that you have worked and completed in past weeks of the ongoing month. Sometimes you may have to keep this folder empty if you are in the first week of a month.

last_months folder is where you need to keep all your files that you have worked on till last month

last year or 2009: This folder needs to carry the number of the last year. As you go on working on a computer for a number of years. The folders assigned to years will increase.

Now what you need to do is to keep on changing the files between these folders. When you name the files try to name the files in line with its use. eg., manual_version1_blackpearl. Here i assume that blackpearl is a software name. There are many other ways to organise files. But this would be a nice beginning.

How to do it:

First you need to closely examine the situations of information or file retrievals. Ask yourself the following:

Do i search for files in relation with an year or month?

Do i search for a file in relation with its purpose ?

Do i search for a file with relation to the creator of the file?

You may come up with similar questions and try to create a knowledge structure based on that.

No matter where we work and how much intelligence and wit we use in our jobs, there are areas where we generally ignore to use our common sense. If we take that little pain of organising our own file structure, not only our productivity would improve, but it would help us to get that important information or file in a flash. If time is money, by organising yourself, you indeed can make a lot of it.