logo

Digital Marketing

Medium level

Unit 2: Website Development and Design

AIMS & OBJECTIVES

  1. 1)The aim of this presentation is to introduce learners to the concept of digital marketing techniques, related to web development​

    2)The objectives of this presentation is to familiarize learners with the core phases of website design and development 

LEARNING OUTCOMES

LOut1: Create basic structure of a website

LOut2: Analyze and plan content on a website

LOut3: Design a sitemap​.

LOut4: Use SEO strategy.

Lout5: Create domain name

KEYWORDS

  • Domain name
  • SEO
  • Research
  • Planning
  • Content
  • Navigation
  • UI
  • Wireframe
  • Usability

TABLE OF CONTENTS

Unit 2: Website Development and design

Introduction

Your website is your most important tool for creating a marketable web presence – it is the cornerstone of any web strategy. It is also your brand’s home on the web, the site that anyone can visit for up-to-date facts, information, offers, community and other features –the equivalent of an online business card. Your website is your online office, the hub of business activity.

User Experience

User experience (UX) is the experience related to physical, sensory, emotional and mental state of the person. The person has when interacting with a digital tool. Online UX can be divided into two broad categories:

  1. Functional UX. This covers the elements of the user experience that relate to actually using the tool, such as working technical elements, navigation, search and links.
  2. Creative UX. This is the bigger, harder to define impression created by the

tool. The so-called ‘wow’ factor that covers visual and creative elements.

There are six qualities that make up good UX:

  1. Findability. Can I find it easily? Does it appear high up in the search results?

How long does it take me to find something on the site? Does the three-click

rule work on this site?

  1. Accessibility. Can I use it when I need it? Does it work on my mobile phone, or

on a slow Internet connection? Can I use it as a disabled person?

  1. Desirability. Do I want to use it? Is it a pleasant experience, or do I dread

logging in?

  1. Usability. Is it easy to use? Are the tools I need intuitive and easy to find?
  2. Credibility. Do I trust it? Is this website legitimate?
  3. Usefulness. Does it add value to me? Will I get something out of the time I

spend interacting with it?

Development of a website

Υou should ensure that all website elements, such as menus, logos, colours and layout, are easy to find and kept consistent throughout the site. What you should not do:

  • Do not use entry pages (i.e. a page that site visitors encounter first before reaching the home page).
  • Flash is no longer a fit to design websites.
  • Don’t use blinking images, flashing lights, automatic sound, scrolling text and unusual fonts.

What you should do:

1.Reduce loading time: Try to keep content and actions on the same page

2.Give feedback: Communicate consistently. Ensure that you deliver the same message across all visitors.

3.Predict what your user wants: Include autocomplete or predictive text tools.

Development of a website: Steps

PHASE 1: Discovery and Planning

Planning a website starts with research of how your market works , your users, your competitors and your business. If you already have a website, you can use existing web analytics data to understand how well you are meeting your users’ needs.

Key questions you need to ask.

  • Business: What are your business aims? How should this digital strategy and material help you to achieve those objectives?
  • Users: Who are your users, how can you target them?

Before any web design process starts, the digital marketing and development team should  decide what browsers, operating system and devices will use.

In the context of the above, search engines like Google are committed to displaying the most relevant results to visitors for any given search query.  XML sitemaps make it easier  to read the content on your site and index the pages accordingly. Furthermore, this increases your chances of boosting the SEO ranking. Having in mind the above, you will create a sitemap, follow the below steps:

  1. Review the structure of your pages

The first thing you need to do is look at the existing content on your website and see if everything is structured.

 

  1. According to Search Engine Journal, you should aim to create a sitemap that has a depth, meaning it only takes three clicks to navigate to any page on your website.

  2. In the next level, you should proceed with the coding of URLs. The way to do this is by formatting each URL with XML tags. This job is mainly under the authority of a web developer. However, the person responsible for digital marketing should know the procedure. Then add the corresponding code for each URL.

    location, last changed, changed frequency, priority of page

  3. Use proper validation by find the human error in the sitemap. There are tools that will help validate your code to ensure the syntax is correct. One example is the XML Sitemap Tool. This tool will help you check if your xml sitemap is formatted correctly and optionally ping Google to inform them of your sitemap location.

4. Locate the root folder of your website and add the sitemap file to this folder. For instance we will use the Apple website

  1. Now that your sitemap has been formulated and added to your site files, you should submit them to search engines. In order to do this, you need to go through Google Search Console.

Here are some examples of how the code will be realized:

http://www.examplesite.com/page1

2019-1-10

weekly

2

PHASE 2: Domain name

Technically speaking, domain names are important. They are part of the URL of a website. A domain name has a form like this: www.mycompany.com . Domain names can carry the following information: subdomain.domain.tld/directory

  1. Domain – the registered domain name of the website
  2. Subdomain – a domain that is related to a larger domain
  3. TLD – the top level domain, on the top of the hierarchy of domain names directory – a folder to organise content. The TLD can offer indication of the country in which a domain is registered and can also give information about the nature of the domain.
  • com – the most common TLD
  • co.za, .co.uk, .com.au – these TLDs offer country information
  • .org – used by non-profit organisations
  • .gov – used by governments

.ac – used by academic institutions

In the next level, having a domain name, needs a website hosting (web hosting). Web hosting is a service that hosts and stores your website files (content) on a secure server.  Whichever web hosting company you sign up with, make sure it has the following features:

-FREE domain name with SSL (for security)

-One-click-install for WordPress (free)

-Custom email accounts

-Unlimited bandwidth (no traffic limitations)

-Customer support, preferably 24/7 live chat

 

 

A good recommendation is Bluehost.com for web hosting and domains. They offer free domain registration for the first year. In order to registrate to this platform you should follow the below steps:

1)To get a web hosting account, simply use Bluehost and click on “Get Started Now”.

2) Next, you should choose your web hosting plan

3)In this step, you should choose and register the domain name 

4) Once you’ve completed your registration process, it will take a few minutes to get instant access. You should wait…

 

 

PHASE 3: Design phase

1) Wireframes are a great way to map out the structure of the website and to use it as an “prediction tool” for how a visitor will interact with it. By having wireframes we are able to quickly prototype our ideas and processes, as well as gather feedback.

2) You should consider the following keypoints:

  • Your design should not only help the business deliver its message or products to customers but it should be the tool for navigation in an easy way. Having this in mind, you should conduct proper research (check Unit 1).
  • Make sure to store and organize all your research information in a way that you don’t waste too much time and effort. You can do this by arranging the research based on macro and micro categories, using folders and subfolders and formulating cheat sheets to capture key concepts such as buying behaviors
  • You should use “User flow” tactic as the path or journey of a user during a website or app session. This process includes the point where they entered your website/app, all the points where they interacted with the website/app (like the pages they visited and the buttons they clicked on till their final transaction). For instance, a user enters your eCommerce website after clicking on an ad about, say, grey derby shoes. After launching it, the person may want to filter the shoes by price, size, brand, etc; he/she may want to zoom in on one or more of the shoes, check their specifications, and add more filters.

PHASE 4: Content and copywrite

1) Content is how Google and other search engines “assess” your website, your web ranking and therefore your perceived expertise. A website that is Search Engine Optimized (SEO) will use good content that is semantically marked up using a recognized microschema. A microschema refers to a way to tell search engines what sort of information you have, and how it relates to you or your business. With a microschema, a search engine doesn’t need to be a “predictor” of what what information is relevant, and what isn’t. There are two primary microschemas:

-Schema, which is sponsored by Google, Yahoo, & Yandex.

-RDFa, by W3C, the group that maintains HTML & CSS.

Use SEO strategy by applying the following:

  1. Everything in search engine optimization revolves around keywords and that is why you should search them through Google search. Longer keywords, tend to be less competitive, so your digital marketing strategy should take it into consideration 
  2. Analysis of Google’s first page by typing one of the keywords that you have found in Google search
  3. Analysis of Google’s first page by typing one of the keywords that you have found in Google search
  4. Optimize Your Site for Google RankBrain since Google RankBrain is Google’s first machine learning algorithm. It measures how you interact with the results on the first page

Improve your organic click-through-rate (CTR) by adding numbers or hashtags

Improve your bounce rate by helping your rankings a lot to incorporate compelling introductions that encourage people to take action. Avoid the following:

SYNOPSIS

This presentation was about UX touches on so many aspects of digital marketing that it’s hard to list them all. However, this lesson helps readers with an intermediate level of ICT skills to create a website, by using the aforementioned core tools.

In this context, the presentation focuses on the importance of :

1.Using SEO

2.Creating a sitemap

3.Design a wireframe

Users come first when creating any web-based marketing channels. Core UX principles, such as

user-centric design, web conventions, and simplicity are essential tools for creating websites and develop digital marketing strategies.

List of References

  • Charlton, G. 2014. 21 First class examples of effective web form design econsultancy.com/blog/64669-21-first-class-examples-of-effective-web-form-design
  • Hinderer, D. and Nielsen, J. 2003. 234 tips and tricks for recruiting users as participants in usability
  • studies. Available at: media.nngroup.com/media/reports/free/How_To_Recruit_Participants_for_Usability_Studies.pdf
  • Idler, S. 2013. The effect of the human face in web design. Available at: blog.usabilla.com/effect-human-faces-web-design
  • WebsiteSetup. “How to create a website”. Available at: https://websitesetup.org/
  • BRM. “7 stages of good web design”. Available at: https://www.brmwebdev.com/web-design/development
  • Capterra. “How to Create Wireframes in 6 Easy Steps”. Available at: https://blog.capterra.com/how-to-create-wireframes/
  • Quicksprout. (2019). “5 Easy Steps to Creating a Sitemap For a Website”. Available at: https://www.quicksprout.com/creating-website-sitemap/
  • Backlinko. (2020). “How to Create an Effective SEO Strategy In 2020”. Available at: https://backlinko.com/seo-strategy