Website Planning and Creation

In the last session we had discussed about mobile marketing. Basically we had discussed about mobile enabled
websites and mobile applications. We touched upon different advantages of mobile enabled websites and
mobile applications. We also discussed about what are the things that you need to keep in mind when you are
designing a mobile enabled website or a mobile application.

Now we'll get into the bigger and broader topic of website design and development. Now before I get into
specifics about website design and development, I would like to introduce this concept about user experience.
Now what is experience? Experience is basically all the cognitive and effective stimulate that a customer
receives from all different touch points across a brand interaction. So when you use a product, you experience a
product. When you use a website, you experience the website. When you interact with friends and get feedback
about a certain product or service, even there is an experience there.

So it is very important for us to understand how to create that unique experience and how to have websites that
provide better experiences to customers. So during the course of this session where we are discussing about web
design and development, we'll be touching upon how we can systematically design a better experience for
customers. We'll also think about what can be the different elements that make websites reliable. What are the
different things that make websites functional and convenient for customers to use while creating websites
which have greater or better user experience? We also have to understand that the website should be enjoyable
to use and it should be an experience worth sharing because only then will customers be willing to let other
customers know about such a website, share it on social media and create a lot of organic traffic to your
website.

So the user experience is all about what the user feels and how satisfied is the user from the usage of a certain
website. Now like we discussed in the case of mobile enabled websites in the previous session, there are
websites which are very convenient to use and there are other websites which are very cluttered and very
difficult to navigate through. A customer when he or she comes to a certain website is looking for certain
information, looking to gather as much as possible from that digital platform that is out there, and it is not
difficult to understand that the digital landscape is filled with millions and millions of websites which provide
information in varied ways to the customer. So customers prefer websites which are better to use, which are
convenient to use and which provide them with better experiences as compared to websites which are not so
good and not so satisfying to use.

Consider two examples. You have website A which is basically a very clean website which has a lot of
information provided in a well designed manner. It has a lot of free spaces. The fonts are used in an appropriate
size and in an appropriate manner. The graphics that are used are very appropriate. The navigation is easy on
the website, the website loads very fast, etc. And this website has been thought well and created in such a way
that it is easy for customers to use this website. Website B on the other hand is something that has a lot of
content. The parts don’t match each other, the sizes of the fonts don’t match one another, the colors are very
difficult and very contrasting to the customer to read through. It is very difficult for customers to navigate. The
customer doesn't have an idea what pages are provided in which part of the website. There is no site map for the
customer to understand the website better. And overall the graphics provided on website B is very confusing
and very heavy, which takes a lot of time to load.

Now between these two websites, it's highly probable that the customer would be going to website A much
more frequently as compared to website B. Now, even if you come to a search engine and search for a specific
key term and come to a website A, you might want to spend more time because it's easier for you to understand
this website while on the other hand website B is so difficult, so clumsy and so cluttered that the customer
might either close the tab, or close the window or go back to the search engine and try to look for another
alternative for the information that he or she is looking for.

So the user experience is the overall satisfaction the user gets from interacting from a product or a digital tool.
And it is an endeavor for all marketers to make sure that the user experience is central to when we are thinking
about creating websites. And that is where we bring in the concept of user experience design, which basically is
the process of applying proven principles, techniques and features to make the digital tool in such a way that it
optimizes the user experience and makes the user experience really great. So we'll discuss about all of these
different tools and techniques that are at our disposal. We will also discuss about a certain process by which we
can design a website and create a website that is the most appropriate. But the most important thing here, like
we discussed in the case of mobile enabled websites and mobile applications, is a user centered design.

The user centered design is basically a design philosophy that prioritizes the user's needs and wants about all the
other things that are important to the company or important to the marketer as such. So it is the understanding of
what the requirements of the user is, understanding of what devices the user is using, and then creating a
website which is the most or the best fit or the most optimized for the user's experience. And this is where we
also discuss about creating the entire website as well as creating the front engine or the user interface that the
user generally interacts with. So when you think about a website, you might see that the website has an
interface, which basically is the content that you see on your desktop or your mobile phone, etc.

There might be a lot of other things that are working on the back end. Say for example, if you're thinking about
a website like YouTube, there is a lot of information, a lot of engines that are working, a lot of algorithms that
are working in the back end, thinking about what advertisements to show to you, thinking about what prior
browsing history do you have, thinking about which location you're searching from, thinking about what kind of
preferences do you have, thinking about what kind of demographics do you possess, thinking about what
devices you're using, etc. But none of this confusing information is provided to you. You basically get a very
simple and very seamless interface, which makes your life very easy. So the user interface is a user facing part
of the tool or platform, the part of the actual website that the user interacts with.

So good user experience is created and it provides for a much simpler user interface. Remember, we had
discussed about the two websites earlier, website A and website B. One important factor because of which our
customers find website A to be more satisfying and more appealing is that the user interface might be much
simpler for customers to use. And the second element here is usability, which means how friendly, efficient and
slick the digital platform is or the digital product is. So we'll discuss about all of these different elements but
before that it is important for us to understand that the user experience in itself is divided into two portions.
There is one element of user experience, which is the functional user experience and another element which is
basically the creative user experience. And a seamless integration of both makes the website user friendly and
more interesting or enjoyable for customers to use.

The functional user experience covers the elements of the user experience that relate to the actual usage of the
tool or actual usage of the website, such as the working technical elements, navigation search, different links
that are provided, etc. While the creative user experience generally includes the creative elements or the factors
of the website that create or provide a better visual or aesthetic appeal and create a wow factor for customers to
enjoy the website. Both of these have to come together. The website should be functional enough; the website
should also be appealing and also have different aesthetic elements which make it extremely enjoyable for
customers to use. So we'll discuss about all of these different elements and we'll see how both of them can be
synced together and how we can have a process that is put in place so that the user experience can actually be
planned for.

Now, the elements of a good user experience are: find-ability, which basically talks about whether the website
is easy to find, does it appear high on search results? And whether there are links provided on other popular
websites.

The second one is accessibility, which basically talks about whether you are able to use it when it is required.
Does it work on the mobile platforms? Is it dynamic enough for the customer to use it in different platforms?
Does it work on slow Internet connections? In some cases it might also be a requirement for the website to be
used by disabled people. Say for example, there are a lot of organizations which work for different causes.
Consider for example, an organization which is providing recreational activities for blind people. Now such a
website will have a large number of its customers who are blind and who are not able to read the font and read
the texts that you provide on the website. Now there are lot of softwares that are out there which help a lot of
people who are blind to use computers and to use mobile phones because they provide an option to read out the
text that the website provides. So in many cases if your website is catering to such people who might be
disabled or differently-abled, you might have to provide accessibility to such individuals as well.

The third element is desirability, so basically it talks about does the customer actually want to view the website?
Does the experience provided on the website is pleasant enough or is it really difficult to use the website.

The fourth element is usability, where we are talking about whether it is easy to use, whether the tools you
provided on the website are intuitive and easy to find. Many websites provide tools which the end user is not
really able to use or the end user is not aware about. Many websites use tools and use technology which
basically is very confusing for the customers that it caters to. Say for example, you are a website that is trying to
provide information to elderly people and you have a lot of rich graphics which basically is catering to new
technology which might be more appropriate for a younger age group. Now in this case, the target audience,
which is an elderly customer who comes to your website, might not be finding it easy to use the website. So
usability is again a factor of understanding the user experience. To make usability much more effective, you
have to remember that the website design has to be user centered or customer centered. You have to understand
the target group that you're trying to cater to, who's the audience that is coming to your website, and there by
design the kind of tools and the kind of content that you are providing.

Many a times credibility is a big factor when it comes to user experience and when it comes to whether or not
people actually use the website. Now, how is that you will trust a website? Because there are a lot of websites
out there which are not worthy of being visited, which basically are considered by people to be not credible.
There are a lot of websites which might have a lot of malware, a lot of codes which might actually do harm to
your privacy, to your security and provide risk to you in the digital space. So how is it that the website provides
credibility to its customers? When I say credibility I mean it could be with respect to the content that is provided
on the website, it could be with respect to the looks of the website, the kind of “About Us” information that is
provided. There could be a lot of testimonials provided on the website to make it more credible. If you're an
organization you might want to provide your logo consistently across different pages that are available on the
website, a lot of associations, a lot of partnerships that you can have, can be portrayed. A lot of third party links
can be provided to make sure that credibility is created. Contact information can be very clearly and very
seamlessly provided so that people in case they have this doubt that whether or not this website is credible
enough or not, they can actually find out more about this by contacting the organization, contacting the brand in
itself.
And the final element is usefulness. Does it add value to the customer? This is similar to the user centered
design that we spoke about. Simplicity is something that is very important when it comes to websites. Websites
should have a lot of free space which helps people to navigate through it very easily. It should not be cluttered
in such a way that the customer finds it very confusing because at the end of the day, every customer that you
find is a human being and we have very limited cognitive ability. Think about the case where if you have been
given a very detailed book to gather very brief information that you're looking for, it might be a very daunting
task for you to go through the entire book and find out a small set of information that you're looking for. But
think about the case where you have given information in a format that is very easy to read, which is very
convenient to you. You can navigate through the entire content and find what you want without spending too
much of your thinking or too much of your cognitive powers. It becomes much easier for you to do that. And
that makes it that much more useful for customers.

Think about the case where if you want to put everything out there, it becomes a very daunting task and it
becomes very difficult for customers to browse through the entire website. So keep the options in a manner that
the customers are able to go through without having to spend too much time. This again is part of creating the
hierarchy of the website. So again, we'll come to all of these things in the next part. Try to use plain language,
try to use the conventions of website design because many times you would have seen that most websites will
have a set of similar patterns.

You would see that the navigation bars are similar. In most websites you would see that content is provided in
different parts of the website. You would see that the font size used, the kind of headings that are used, the kind
of photos that are used, and the kind of information that is provided in the footer is similar across different
websites. These are because there are certain conventions that most of the websites use. This again is very
interesting because many a times the customers keep using different websites, they also learn from using these
different websites. Say for example, if you have a habit of going through websites which have a certain
convention, which have a certain pattern, which have a certain format, then coming to a website which has a
completely different format might be difficult for you to understand because you are seeing something that is
new, something that is strange and something that is not necessarily easily understandable for you.

So by following conventions, by following things that are simple for customers, you also increase the usefulness
of the website, thereby making the user experience that much better. At the end of the day, what we are trying to
do is to make the user experience better by providing a website which is able to satisfy the requirements of the
customer, may it be shopping on the website, may it be finding information, may it be providing a certain
feedback about the product, may it be finding more information about the product, may it be comparing
different options that are provided by the company or it could be a social networking platform. The customer
spends time and effort to come to a website and use a website because the customer is looking for certain value
and the easier you are able to provide this value to the customer, the customer will find the website that much
more interesting, enjoyable, useful and at the end of the day that much more satisfying. And that is what we are
trying to create by doing all of these different things.

So now we are going to discuss the steps in creating a website. Now there are different things that you have to
keep in mind and consider one after the other while you are creating your website and when you are trying to
make the user experience that much better. All of it starts from doing a fair bit of research. Now research
basically is something that might sound like very academic but we have to understand that many times
marketers have a habit of thinking that they know what the customer actually wants or what the customer
actually is looking for, which might not be the case. There are a lot of examples of how brands and companies
have failed because they didn't understand what the customer was looking for.

There is this very interesting concept about marketing Myopia, which is basically the short sightedness about
only immediate things and about things that the brand of the company thinks that they are doing without really
understanding what the customer wants or what the customer's requirements are or what the basic offerings that
the customer is looking for, etc. So in a similar manner, even when you're creating digital assets, it's important
for you to do a fair bit of research and to understand what is the kind of needs and what is the kind of value that
customers are looking for. Now many a times you have to first of all, start by asking this question.

Remember, in one of the early classes we had discussed about segmentation, targeting and positioning. So
segmentation was dividing the entire market into smaller groups so that you can address them better. Targeting
was to identify which of these groups should you address and positioning was how you want to create an image
of yourself in the customer's mind. So your research for your user experience design or the website designs
should start from understanding which is the target group that you're trying to cater. And only once you
understand what your target audience is, will you be able to understand a lot of different things that are
important in creating that website. Say for example, if your target group is young college going students, then
you have to next ask the question, what kind of devices the students use in order to reach the internet and in
order to browse through the internet. If your target group is an elderly group, then you have to ask the question,
what kind of devices do they use? In the first case when you're thinking about young college going students,
these might be people who are using more of mobile devices than devices like a desktop.

When you're thinking about an elderly group, these might be people who are using more desktops than mobile
devices. When you are thinking about young college going students, they might be having a constraint about the
amount of data that they can spend because they might not be always able to afford a lot of data. While when
you're thinking about an elderly group, you might not have a constraint of how much data they are able to use.
When you're thinking about a group of people who basically have certain requirements you might want to create
website that caters to those specific requirements itself. So a fair bit of research is required.

Now research can be done in different ways. You can reach out to a set of these customers to try to understand
what kind of requirements they have, in case you are starting off afresh and creating a website for the first time.
In case you already have a website and you're thinking about creating a better user experience, then you can get
feedback about your existing website and ask people about how this website could be improved.

Competition can be a good source of information. You can look into the kind of websites and kind of user
experience provided by the competition. Because many a times, remember we had discussed how customers try
to create an image of you with the competition. So there are different things that the customer feels that should
be similar to what the competitor provides. So if the competition is providing certain user experience and you
should not be far off from a similar user experience. You should be able to provide websites which have similar
functionalities, which are similar in creatives, which are able to provide the customer with the same kind of
value that your competitors are providing. Otherwise your customers are going to differentiate yourself or
differentiate your competitor as somebody who is able to provide a better user experience than you.

So you could ask the customers, you could look for what competitors are offering on the internet and learn from
a lot of these things. There are a lot of industry experts who are able to provide information on what kind of
breakthrough technologies are being provided and how these technologies can be put to use in mobile websites
and on digital websites that you might be able to provide. So you can reach out to such people who are domain
experts, who are experts in the matter of web designing, web development and user experience creation so that
they can provide to you the right set of technologies and tools that can be used in order to provide greater value
to the customer.

In many cases, this helps you to create a website that is more satisfying than the websites that are provided by
the competition, thereby creating an edge over the competition. Once you have done all the research, you
basically will get an understanding as to what kind of target group you're trying to cater to, what kind of
platforms are you trying to address, what kind of devices are these customers using, etc. Once all of this is done,
you have to basically define a basic structure of the website. Now, websites could have a horizontal or a vertical
structure. Many times you would have seen that websites have content that is listed in a vertical manner wherein
you will find that the entire content is in one column going from top to down. In many other cases, you would
find that websites don't have a lot of things that you have to scroll through, but they have a horizontal structure.

Now this is something that is designed according to the kind of devices that customers are using and the kind of
devices that your target group is generally more likely to use. Like we discussed in the previous session, you
have to target to address the most frequently used devices. So depending on the most frequently used devices,
you might want to define a structure that is either horizontal or vertical in nature.

The third is where you think about creating the content plan. Now there are different elements that are important
when you're thinking about creating the content plan. The content of course is the kind of text or multimedia
content that is put into the website. But not all content is equal. There is some content that should be prioritized
over other contents. So hence for the content plan, you might have to create a hierarchy, a structure, and identify
content that is most relevant as opposed to content that is not so relevant.

So one good thing or one easy way of doing it is to understand what are the different buckets that you need to
have. Say for example, in general, if you look into a company's website or a brand's website, you might see that
there is one column or one tab that says “About us”, which basically is all information about the organization.
Then you would have something that talks about the products and services that the company offers. Then you
would have something that talks about the customer testimonials and user case studies of the company and what
they have done in the past. Then you would have something that talks about awards. Then if it's a company that
wants to talk about things that they are doing in public, there might be a column that talks about the news and
events that the company participates in. And finally you might find that there is a “Contact us” or a form or
some kind of information where the customer or the user of the website can reach out to this company.

All of these are different buckets that the company has identified. So in the home page you will have content
which basically is a generic overview or a generic introduction of what the company is or what the organization
is or what your brand is. So this is where you might want to talk about what kinds of things you're doing, this is
where you will give a basic overview of what your core philosophy is, etc. Then you have identified that there
are these four or five different sections which basically are defining the core structure of the website, so “About
Us” or “Company Information” is one part of this structure.

Then you have the products and services that the company offers, which becomes a second bucket. You have
the news and events that the company has participated to be the third structure or the third bucket. Then you
have the contact information or information to reach out to the company as the fourth bucket. So, all of this is
identified. Then inside each of these buckets you might want to create a hierarchy because the customer might
want to read a little bit about the history of the company before knowing more about the biography of the
company. So that is why if you go to the “Contents” or the “About us” tab in most of the websites, you'll find
that it talks about the history of the company, then it talks about the people who matter in the company, then it
talks about the basic profile of each of these people.
Similarly, if you are talking about a software company for example which might be working in different
domains. The company might have capabilities of creating airbag systems for the automobiles. It might also
have some capabilities in creating a software that runs the robotics in a manufacturing plant. It might also have
capabilities to create the software that goes inside your television, etc. So this is a software company that has
capabilities across three different domains or maybe more of these domains. Now if you're going to list down all
of these things in a manner which is very confusing to customers or confusing to readers, it might not do its
purpose. So hence it is important for you to now club them into different groups.

One good way of doing this would be to put all of this into industry-wise groups. So you might have products
and services as the core bucket that we are talking about here. And within that you might have products and
services in the automotive domain, products and services in the industrial automation domain, products and
services in the consumer electronics domain, etc, wherein a customer or an audience of the website when he's
interested in automotive related services can click on the products and services link and go directly to the
automotive division or the automotive products and services and can find out about airbags, about infotainment,
about antilock braking systems and all different software offerings that you have. For somebody who's not
interested in automotive, for somebody who might be interested in consumer electronics, can directly go into
consumer electronics and see what kind of offerings do you have for televisions, for washing machines, for
mobile phones, etc.

So thereby creating a structure and creating a hierarchy makes your content much more planned and it makes a
user experience that much easier so that the customer can easily navigate through the entire thing and find what
is most important. And when you are creating the content plan, also understand that relevancy is something that
should be given priority. Content that is most relevant should be given a significant presence in the hierarchy
rather than content that is less relevant, so that the customer will always find content which is relevant rather
than going through a lot of content, which basically is noise, content which is confusing the customer and
making the customer want to switch back to another website or competitor’s website, etc. So hence structure,
hierarchy and relevance are elements of the content plan that also are things that you have to plan while you
create your website.

So this is where you have identified who is your target customer, you have identified which devices are you
catering to, you have created a structure of the website (horizontal or vertical), you have identified what content
has to be put through into the website, you have identified what kind of structure should the content have
(basically the different buckets) and you've identified a hierarchy. Basically in each of these buckets you have
identified what content should be put in first and how each of these contents and how the navigation should
happen etc. Relevance also has been thought about.
Now, once all of these things have been thought about, you might want to create the site map. Remember when
we discussed the word search engine optimization, we discussed about the importance of having a site map. It
basically helps the search engines to identify what pages are connected and what pages are available on your
website. It also helps a lot of users navigate easily through different parts of your websites. So site map is
something that you have to create and also pay a little bit of attention on navigation.

Remember when we discussed how navigation was important. Breadcrumbs navigation basically helps people
to identify where they are on each website. It also helps the search engine to identify what kind of website you
have, what kind of pages are linked to each other and thereby provide you better optimized results, etc.

Now once all of this is done, you might also want to think about what kind of layout you should have, because
you have different elements or different parts of the entire website which are at your disposal when you're
designing the website. You have the header wherein you can provide the company information, logo
information, navigation can be provided. You have footer where you can provide the site map link, you can
provide the “Contact us” link. You can provide a lot of auxiliary information about things which are not very
relevant to the customer. You have a central content which basically is where most of the rich content is
provided and you will have left and right side bars, which basically in many cases might have information
which help the navigation of customer. Say for example, if you're talking about your expertise in creating
mobile phones, then you will give links to different mobile phone models that you have in the right sidebar so
that the customer who is reading through your expertise in creating mobile phones can click on the different
mobile phones that are out there and identify what kind of offerings you have in the market.

In the previous case where we discussed about the software company, if industrial automation is the page where
the customer is, then the customer reading through industrial automation can have case studies provided in the
right sidebar where the customer can easily click on these case studies and have more information. So similarly,
the left and right side bars can be used. But you have to remember that many a times when you start using all of
these areas in the website, it becomes very cluttered. So you have to pay close attention to the user experience
and the entire layout should not be in such a way that it becomes very cluttered and very difficult for customers
to navigate through the entire thing.

Many times you want customers not just to come to your website but also to perform certain actions. Say for
example, if you're a company that is an e-commerce player, you have provided information about a lot of
products out there, but you also want customers to buy products from you. So once you have provided
information about a certain product, you want to give the customer an option to buy the product right now or to
add the product to the cart. In cases where you are a company, which basically is catering to a service offering,
say for example, if you are a photographer and if your website is out there where you're talking about all the
different abilities you have in covering wedding events, in covering other events, in doing photo shoots, etc.
You also want to provide the customer with an opportunity to directly get in touch with you and not just read all
the information and not just look at all the content and then move out. So in many cases “call to action” buttons
are provided. Say for example, in an ecommerce platform you'll find that there is a “buy now” or there is a “add
to cart” button that is provided because when you click the “buy now” button, the customer is taken to a
payment gateway and immediately the payment is done and the conversion happens. When you put an “add to
cart” button, it is put into a shopping cart, which later can be purchased by the customer.

If you are a photographer, you might have a button to call immediately where in the customer can reach out to
you and immediately have a conversation with you. In many cases, companies also use forms. Remember when
we discussed about e-commerce campaigns, we discussed about how the entire database can be generated. So
many a times you would have seen that there are subscription forms. Many a times when you have to download
something from the website, you will have a small form provided where the customer is asked for the first
name, last name and email address etc. When you have a complaint or when you have a query, there are forms
that are provided. So even in your website, think and ask yourself whether or not there is a requirement for such
a form, whether or not form should be provided or whether or not the customers’ call to action button should be
provided.

In case you're providing forms, make sure that all data collected from them is used in the manner that you admit
to be using. So in case you're using the data collected from web forms for email campaigns, make sure that you
ask the customer's consent for using all of this. There might be a lot of search options because again, as simple
as you make your website still the website can be too confusing for customers because of the amount of content
that is provided. So hence you have to provide an option to search the website and provide content that is easy
for the customer to search through. All of these are mostly elements that talk about the functional elements.

Now there are also visual preferences or page-setting elements that are important in web design and design of
user experience; the color, the image, the kind of multimedia that is provided on the website. Many a times what
companies do is that they have a certain brand philosophy. Say for example, if you're a brand, you have a brand
logo that basically depicts a certain color. You would want to have a website that is some way related to the
kind of a color theme that you choose centrally across all marketing collateral that you use. All the brochures
that you use, all the holdings that you use, all the brand logo, coloring, all the marketing communication that
you do across channels should have a similar theme. So, even your website should carry the similar theme. And
this is something that you have to very carefully identify depending on the kind of brand that you want to
portray.
Say for example, if you are somebody who wants to be a very exciting, a very entertaining and a very young
brand, then you might want to choose bright colors. But if you are somebody who is mellower, softer and more
interested in catering to people who don't believe in a lot of adventurous things, you want to choose a color
preference that is much mellower, something that is much lighter, something that is plain etc. So all of these
visual preferences also have to be thought about; everything that we discussed in one of the previous sessions
about search engine optimization. It is not part of the user interface that the customer sees, but it is something
that is important for you to understand so that your website is organically rated high on the search engine.

So again, everything about identifying the right set of keywords, doing a lot of keyword research, understanding
the kind of keyword density on your website, understanding the kind of forward links and backward links that
you have with other popular websites, thinking about the entire site map, thinking about the entire structure of
the website, making sure that all the different elements of your html tags and how headings are provided or how
content is provided. Everything in a way that it is easy for search engines to now understand what your website
is talking about, how relevant the website is for the customer search query and whether or not the website
should be ranked higher in the search engine result page. So, all of these things, although not part of the user
experience per se, have to be thought about while you create the entire website.

And many times there is no one way of identifying that this website works best. So hence you have to identify a
set of principles. You have to implement these things. You have to test these things. You have to keep
reinventing yourself. You have to keep updating this website so that you keep yourself extremely relevant. So,
all of these different elements that I had discussed and everything that has been listed down here are different
things that you have to keep in mind when you're creating user experience. And later on, we will see a small
demo of how all of these things can be put together in a small CMS platform, in a small video clip that you will
see towards the end of the session.