The Basics Of Website Designing

In the age of the Internet, delivering a great customer experience online is of prime importance. Without a well-designed website, achieving a good customer experience is impossible.

If one perceives the online world as an unfamiliar department store, without a clear and concise map to guide one through the store, one would essentially be lost! Moreover, not finding what one needs fast enough can make a customer even leave the store without a purchase. 

A website works in a similar manner. A well-designed website enables a user to view or surf with ease, finding what the user needs, and perhaps if the website is interesting enough even browsing and exploring it further. A well-designed website is, in fact, a necessity for successful online sales. If a website is cluttered, poorly organized, or not user-friendly, losing a customer is as fast as a click of a button.

Don’t Make Me Think, Revisited (2014) by Steve Krug is a guide that explores user behaviour online, charts out basic principles of how a website can be well-designed to deliver a great experience, and also has a guide that shows how a website can be tested at each stage.

Default Internet Behaviour

Truthfully, a person who actually reads the user manual before using a gadget is a rare species! The majority simply open the packaging, starts figuring out the working of the gadget themselves, and go with what works best for them. The user manual is mostly, packed back in the box, or simply thrown away!

Similarly, the majority have no inkling of the mechanics of the Internet, yet, they have no problem navigating the online world. Most people search for a website URL directly, rather than use the browser’s URL bar. Such a strategy of common decision-making is called satisficing, a more typical approach, rather than rationally searching for information, identifying a solution, comparing and then choosing.

Don’t Make Me Think by Steve Krug - Book Summary & Review
Don’t Make Me Think by Steve Krug – Book Summary & Review

Furthermore, if a web surfer simply clicks the back button if they click on an incorrect link by mistake. It’s not only easier but also more fun, to figure out things independently.

These ‘default’ internet behaviours have trained users to look for the first, fastest and simplest solution that catches their attention. And when they succeed they feel confident, comfortable and smart.

Catching A User’s Attention

People surf websites with a mission in mind. They look for the things they need and want to get done with it as soon as possible. Almost everyone skips the promotional corporate jargon on websites. No one wants to waste time on long texts. While online, people scan rather than read.

Hence, the ability to catch the attention of the user if the primary focus of a website. The key elements of good website content are headlines, short paragraphs and highlighted keywords. Moreover, in order to enable users to decide which areas to focus on, these elements should be organised using a visual hierarchy. According to eye-tracking studies, people make quick decisions choosing where to look and ignoring irrelevant information such as advertising blocks.

The same principle is used by newspapers. Headlines, text and images are placed carefully to enable the reader to look first at what is most important. Websites too should make the important obvious so that users can immediately find and click on them.

Keeping in mind default internet behaviour where users don’t mind clicking as long as the process is mindless and gets them a clear result, websites should have pathways that are easy to navigate and understand. Most importantly, websites should avoid annoying practices like hiding important information behind multiple clicks – such as shipping costs.

Building a website isn’t like making a product brochure to attract an interested user, as believed. It is more like making a billboard to catch the attention of cars zooming past at 60 miles an hour!

Consistent, Clear And Simple Navigation

Easy navigation lies at the core of creating a successful website. Unlike unfamiliar stores, users cannot stroll down aisles in search of what they need. Online, if people don’t find what they want, leaving the website is just a click away.

Scaling a website is another challenge. A user cannot ascertain the number of pages a website has, and hence it is vital that a website design is easily navigable. Ideally, every page of a website should include a ‘sections’ bar that clearly indicates what the website contains. Additionally, to make it easier for a user to move around, every page should have at least 4 additional navigation items. These include – 

  • Search Bar – A search bar helps a user to quickly search the website for what they are looking for, without understanding its organization of it.
  • A ‘You are here’ Indicator – This small indicator, like the red dot in shopping malls helps a user understand how to navigate easily.
  • Link The Company Logo – Linking the company logo to the home page and making it available on each webpage enables users to ‘jump’ home faster.
  • Utilities – A utility section contains vital titbits that help one to easily use the website. This component includes a log-in space, a site map, an FAQ section, etc.

These navigational elements make it more comfortable to use the website effectively. A feeling of comfort, furthermore, builds trust.

Understanding Website Navigational Conventions

In addition to having easily accessible navigational components, these components should be self-evident. Thus to design a website that enables this, one should have an understanding of conventions.

While online, anything different from the usual, conventional style and design can be annoying. People have certain expectations when they visit a website. For instance, horizontally placed words along the top of a webpage commonly represent the main sections of the page.

It is often seen that web designers, in the pursuit of innovation, try to abandon conventions. They forget that conventions represent the best and most effective practices developed after years of fine-tuning. For example, internet users are familiar with the concept of tabs and immediately know how to use and navigate them. Hence, tab dividers are great navigational tools.

That said, innovation is important too, and creativity surely has its positives. Designers have to, however, simply keep in mind to make the innovation easily usable and prioritize user experience. In website designing, conventions, clarity, and consistency are best friends.

The First Impression – The Home Page

Most often, a link from Facebook or Twitter leads a user right in the middle of a website. It is commonly observed that users next click on the homepage button to ascertain where they have landed, or whether the content on the website is trustworthy or not. The home page is the first impression of a company, and hence a crucial component.  

Since it is known that items linked from the home page of a website get more clicks, every stakeholder will have an opinion and an idea as to what should be included in it. Nodding to every opinion could lead to a cluttered home page.

The first priority of a home page is to create an accurate first impression. According to a web design study, the first impression of a website sticks with a user even after the user has navigated through other pages of the website.

This happens because when one encounters something new, one’s imagination goes into overdrive, creating a picture in the user’s mind about how this new thing works and trying to fit the new information into one’s preconceived notions. Hence if a home page is confusing, a user could misinterpret information, leading to more confusion and thus, disinterest.

In order to avoid confusion, a tagline or a short sentence that clearly communicates the goal of the website, placed near the logo is effective. This tagline should be personable and lively and convey the value of the site. For example, the news site The Daily Beast uses the tagline “Read this, skip that”.

Test, Test, Test Again

How does one test if a website fulfils the goals of easy comprehension and navigation?

Commonly, people turn to relatives and friends, or their own judgement to assess the objectives. However, while objectivity will be impossible with one’s own judgements as the features and usability will be obvious, friends and relatives tend to have wildly subjective opinions. Developers tend to prefer innovative features and designers like websites that offer a pleasant visual experience with subtle touches and lots of white space. And both assume that the world shares their views.

The truth is that almost everyone is like that. Most think that their opinions are correct, and there are very few people who view things from others’ points of view! Unfortunately, there are no ‘wrongs’ or ‘rights’ in website designing, and getting the opinions of a select few never helps.

The only thing that does work is testing – again and again. The best way to understand if a website is working as intended is to watch people use it and try to navigate it. With testing, the connotations of ‘right’ or ‘wrong’ are taken away and the focus moves to what works and what doesn’t. it additionally, shows and proves that every web user is different.

Getting Testers

Testing websites, however necessary, isn’t an exciting task for most people or developers – unless they are going to get paid for their time. Moreover, one needn’t be too restrictive in terms of the background of testers, as a website should be easily understandable and navigable for everyone.

Once a group of testers is selected, the facilitator should observe the group while they use the website and take notes. A facilitator’s goal is to keep the user group comfortable and focused.

Starting with the home page, a facilitator should get the testers to talk about what is visible by asking questions such as, ‘What are looking at?’ and ‘What do you think?’ These questions help to understand whether the tester is getting the main idea of the website or not. However, a facilitator should avoid influencing testers. If any tester asks for help, the facilitator can ask, ‘What would you do if you were alone?’

Facilitators have to get the test subjects to try every feature of the website – right from creating an account to logging in or buying or returning an item. If a test subject fails at any given task, the facilitator should observe the subject trying to resolve the issue, and let the subject keep clicking around till the subject either gets frustrated and gives up, or the facilitator cannot learn anything more.

Getting team members, managers, or even other stakeholders to observe the testing study is important, as they too will be able to understand the point of testing. Often when executives watch a tester fail, they understand the importance of usability.

The Pros Of Testing

Many believe that testing websites is time-consuming, expensive and requires expertise.  However, testing simply enables one to understand whether a website works or not, is easily navigable or not and informs one’s decision-making.

Keeping that in mind, one needs to only test up to 3 regular web users, and have team members observe, and take notes on what problems the users face. According to the author, testing generally brings up more problems than what can be reasonably resolved, and hence, prioritizing between issues is important. Issues that a tester can quickly fix are not a priority.

Starting the testing process earlier in the web designing process is more effective, as the earlier problems are identified, the easier they are to change and implement. A beta site is far more easily adjustable than a live one.

Furthermore, one can even begin testing before a website is developed – by watching a testing group navigate a competitor’s site. The insights from competitor testing help while developing one’s own website, help with decision-making and save time and resources too.

Developing For The Smartphone

Apple revolutionized mobile web browsing. With practically everyone accessing websites on the smartphone platform, the downloadability of a website on the platform is important.

Today, users on smartphones read less and move faster. They are more likely to give up and exit a website if they encounter a hiccup. Hence a website has to load faster on a smartphone and be adjusted to be readable on smaller screens. Smaller screens translate to lesser space, which translates to more compromises. Hence a website should ensure that in-demand spaces are easily found. While information can require more taps, navigating to get to it should be easy. 

Furthermore, users on smartphones should be able to access a website’s full menu of features. There’s no telling whether the user is surfing on the go, or is on the couch looking for information! This indicates that websites should have zoomability features, as well as a link to access the complete website.

Considering mobile computing is touted as the future, creating an amazing user experience is of the essence and is key!

Conclusion

The usability of a website is its most important feature. It puts a user front and centre, making it easy for users to find the information they are looking for. Navigability and simplicity are vital, whether the platform used is a smartphone or a laptop.

Most importantly, in order to ensure that a website is delivering a great user experience, testing it at every step is most important!