Basic Things You Need To Know for a Successful Website Design

By 19/01/2020website design
website design

A website is a necessity for any business in today’s digital world. Whether you have a small business or a large company, having a website can make a big difference regarding how the organisation reaches out to other companies and customers. By having a website, you can apply many different marketing strategies to spur the growth of your business. This diversity is because a website provides arguably one of the best platforms to advertise your business.

Through a website, customers learn about the business’s mission and vision as well as the services or products that it provides. It is critical for increasing sales and growing your business. Your business’s website can also help attract investors and other stakeholders, such as prospective employees and suppliers.

Your company’s website is also at the centre of the organisation’s online presence since through the website, since you can link the website to your advertising activities on social networking sites, pay-per-click advertising platforms, and forums. Therefore, if your business does not have a website, there are high chances that you are losing many opportunities.

Having a good website starts with website design. This article discusses the basic things that you should know about effective website design. The document is structured as follows. It begins by providing the meaning of website design and examining the importance of this process. Next is an analysis of the critical elements of website design, the conventional methods for designing websites, the best practices of website design, and the latest web design trends in 2020.

The article also compares website design and website development and discusses whether you should hire someone to design a website for you or do the design work by yourself. Along the same line, the average cost of hiring website designers in Hong Kong is also available. You will also learn about the factors that influence website designers’ cost. If you are thinking about designing your website, the article also provides some of the platforms that you can use. You will also get information about companies that offer web design services in Hong Kong and other website design resources.

What Is Website Design?

Website design or web design is the process of conceptualising, planning, and creating websites. The process involves many different aspects, which include coming up with a page layout, producing the content to be displayed on the webpage, and designing different kinds of graphics used on the webpage. Therefore, a web designer works on the layout, appearance, and, in some instances, the content of a website.

Importance of Website Design

When someone hears about a given company or business, the first thing they are likely to do is to check the company’s website. A business’s website is a reflection of what the company is. The site projects the corporate image of the organisation just as the business’s image gets depicted through other forms of advertising and the business’s activities. Therefore, a website can make or break a company, depending on how the website looks. A well designed, informative and easy-to-use website will attract more customers while a poorly designed site will not bring more customers.

As explained below, website design can help boost a company’s first impression from the perspective of the target audience. It can influence a company’s SEO strategy, it can help build trust from customers and other partners, and it can also help develop a business’s brand consistency.

First Impressions Count

When you come across a website for the first time, you are likely to get the same experience you have when you meet a real person for the first time. Individuals make spontaneous judgements, and it takes less than 10 minutes for someone to create an opinion about you. Similarly, it will take very little time for someone to decide whether to continue viewing the content of a website.

Any website should, therefore, get designed in such a way that it enhances people’s perceptions about your business’s brand when they arrive. It should persuade visitors to stay, which increases the likelihood of convincing them to become your loyal customers.

It Can Make or Break Your SEO Strategy

Any business that wants to have a successful online presence must have a great website design. However, if a website does not have a high search ranking, very few people will ever see it. In other words, website design can make or break your SEO strategy. Your website must be search engine friendly to have a good SEO ranking.

To achieve a high SE ranking, you should consider strategies such as making your site navigation search engine friendly, placing scripts outside of the HTML file, ensuring that URLs are search-friendly, and following W3C standards.

It Can Build Trust

Trust is a crucial issue in business, especially when you are interacting with audiences online. Given that your business’s website conveys an image of the company, you have to use the site to build trust with your customers and other partners.

Some of the things that you can do to make your website build trust include making it HTTPS secure, adding testimonials and reviews, linking the website to your social media platforms like Twitter and Facebook. You can also gain confidence by providing business contact information and ensuring that the site has a clean and modern appearance.

Brand Consistency

Brand consistency refers to the regular use of brand-related messages connected to a brand’s identity, the brand’s values, and the organisation strategy over a given period. Consistency implies that an organisation consistently delivers core messages, visual branding, and other brand aspects, which can strengthen the organisation’s brand recognition.

A well -designed website will deliver the aspects mentioned above, thus helping solidify your business’ brand identity and brand recognition. In turn, you are likely to get more customers through your website.

Vital  Elements of Website Design

A typical website has several key features, including overall design and visual appearance, colour scheme, navigation, mobile-friendliness, consistency, and page speed. These features, how they should be designed as well as what you should avoid, are listed in the table below.

Element Description/importance Dos Don’ts
Aesthetics Web design aesthetics refers to the attractiveness of a website. Studies have established that creating good aesthetics in services or products results in better user experience and product/service usability. ●        Make the content and graphic simple, clear, distinct and visible

●        Use images and pictures to emphasise your messages.

●        Use typography (different types of fonts) wisely. For example, sans serif fonts like Verdana and Arial tend to be easier to read online compared to serif fonts like Times New Roman and Courier.


●        Don’t make users think, wait or read to get the message that you are trying to convey. Ensure that the content does not require a lot of thought or reading.

●        Don’t use large files since such files take too long to load.

●        Don’t forget about the web site’s capacity to be accessed on mobile devices.

Colours Choosing the right colour scheme for your website can help in branding your business and influencing your visitors’ psychology. ●        Use colours that help advance your brand’s image.

●        Use white space.

●        Use colour to highlight the most important aspects of your website.


●        Don’t use just use any colour simply because it is your favourite.

●        Don’t let the colours you use hinder the readability of the website’s content.

●        Don’t use too many colours on your website.


Typography Website typography refers to the use of different types of fonts on a website. ●        Show some form of typographic hierarchy by using different font sizes, colour, weight, and contrast.

●        Include white text in your text to enhance the text’s readability.

●        Select appropriate fonts for your body text. As noted above, sans serif fonts are easier to read in comparison to serif fonts.

●        Don’t use fonts that are difficult to read.

●        Don’t make the text too small.

●        Don’t use too many different types of fonts on a single web page.

Images As people say, a picture is worth a thousand words. Web professionals know the importance of including images in the design and content of a website. It is because visual appeal is paramount. However, it is not true that any kind of pictures will do wonders.


●        Use images to illustrate concepts and guide users.

●        Include photos of real people.

●        Use images to demonstrate the obvious.


●        Don’t use too many images on one web page.

●        Don’t use images that are too large because they will slow down the website.

●        Don’t use generic images of individuals.

User Experience (UX) UX refers to the interaction that a user has with a service or product. As regards websites, the UX in web design considers every aspect of the site that shapes the website experience and ease of use of the website. ●        Provide similar UX notwithstanding the device used to access the website.

●        Ensure that all buttons and links function appropriately.

●        Ensure that users control their browsing experience.


●        Don’t let the website’s design hinder the readability of pages.

●      Don’t hinder a visitor’s ability to scan the screen.


●        Don’t let visitors wait too long for the website’s content to load.


Navigation A website’s navigation refers to a website’s feature that enables users to move from one web page to another.



●        Make navigation across different pages simple.

●        Use a canonical structure (e.g. use of titles or keywords for blogs).

●        Prioritize each menu.



●        Don’t use cumbersome menus.

●        Don’t use too many S.E.O. Keywords in the website’s navigation.

●        Don’t change the navigation on each page.

Mobile-Friendliness Designing your website to be mobile-friendly makes it possible for the website’s pages to function effectively on all mobile devices. ●        Ensure that the pages load quickly on all devices.

●        Use large fonts.

●        Take user experience on each device into consideration.




●        Don’t use tiny links.

●        Don’t clutter the website design.

●        Don’t adopt a given design just because it is fashionable.




Website design consistency involves ensuring that elements repeated in the site’s pages remain uniform.



●        Ensure that users have similar experience across all devices.

●        Keep the website’s interface consistent.

●        Make navigations simple, clear and consistent.


●        Don’t use busy backgrounds.

●         Don’t use too many colours for different pages.

●        Don’t allow too many pop-ups on pages.


Page Speed


Page speed determines how fast a website’s pages load when a user clicks on a link. ●        Use light images.

●        Use simple navigation.

●        Conduct a speed test.


●        Don’t use weighty images.

●        Don’t use bold fonts.

●        Use less text and fewer images to make the pages lighter.

Conventional Methods for Designing a Website

It is essential to know how to design a website or at least understand how sites get designed. When it comes to creating websites that function well on both desktop computers and mobile devices, the most common methods that are useful include responsive and adaptive design. The two procedures are listed below.

Responsive Design

Response design is a type of website design that makes use of a single layout for a webpage and responsively adjusts the web layout to fit the screen of the user, whether it is a laptop, a desktop, a mobile phone or a tablet. As the name suggests, responsive website design will respond to any change in the width of the browser by adjusting the position of the website’s elements so that they can fit in the available space. It is because of this that a webpage that has a responsive design will change automatically to fit the screen where it is displayed.

Thus, with a responsive site, you only require one page, and everything will seamlessly respond and change according to the user’s browser or device. For example, people who are using a desktop to access your website will be able to see the desktop view while those with mobile devices will see it in mobile.

Adaptive Design

The adaptive website design creates different fixed structures that adapt to particular screen sizes. That is to say that with adaptive web design, you will have several versions of a webpage to fit different devices as opposed to one static page that appears the same on all devices.

Best Practices of Website Design

Whether you are involving a web design company or working on your own to design a website, you should be familiar with the right practices for website design. The suitable approaches website design includes providing an accurate description of the details of the site, maintaining a consistent branding, grouping similar content together, having simple navigation, and having a responsive design. Details about each of the practices mentioned above are listed below.

Describe, Describe, Describe

A precise and descriptive title on your web pages helps both search engines and people to find what the web page contains. The use of tiles to describe what a website entails makes the website’s content more visible to users. Additionally, having accurate and descriptive titles makes it possible for viewers to visit one page over others in a list of results obtained by a search engine. Therefore, describing everything that your website entails is essential because it makes your pages more visible to audiences and search engines.

Maintain a Consistent Branding

Your business’s brand is a unique story that creates a connection between people and the services or products that you offer. It is crucial for the website that you create for your business to match this story to make the company more engaging and genuine. And that is where brand consistency comes in.

Everything about the website from the content to the colours and layout of the pages should represent your brand. The website should continually deliver core messages and use visual branding and other related aspects that all reinforce your business’s brand awareness and brand recognition.

Group Similar Content Together

The Gestalt principle states that things that are alike tend to have a closer relationship than things that are not similar. That is, elements that share visual characteristics like size, shape, texture, colour, orientation or value will get acknowledged as belonging together.

A good website needs to adhere to the Gestalt principle of similarity by having the various elements of the site, such as text and graphics arranged according to how they are related to other components within the pages. It will make the website more presentable and appealing.

Simple Navigation

Website navigation tools make it possible for visitors to experience the various aspects of the website. A website navigation system is comparable to a road map that enables the visitors to a web page to explore and discern different components and information that the website contains. To make the user’s experience enjoyable, you should ensure that the navigation should be simple.

Simple website navigation includes things such as being descriptive, avoiding format-based navigation and drop-down menus, limiting the number of menu items, and making it easy to navigate the website on mobile devices.

Responsive Design

As explained above, a responsive design makes it possible for the website to respond and adjust itself to suit users’ behaviour environment based on factors such as the screen size and the device or platform in use.

Given that there are many types of devices that people can use to access the Internet, your website needs to have a responsive design. This way, many people will be able to access the site regardless of the device that they are using.

Latest Web Design Trends 2020

Web design trends are continually shifting. Based on the current trends, the year 2020 is undoubtedly associated with unlimited technical possibilities as designers try new ideas, revitalise previous designs, and regularly endeavour to implement new methods of web design. That said, some widely known web design styles will not go away soon, such as colour flat illustrations and minimalism.

But if you are looking for new trends, then features such as 3D graphic look, voice-capable interfaces, and focus on motion come to mind. Details about these trends and factors that you should consider before implementing any of them are listed below.

3D Graphic Look

The use of 3D features in websites started in 2011 when WebGL got launched. WebGL is a JavaScript application programming interface (API) used to render 3D graphics within compatible browsers without using plugins. In 2020, the 3D graphic look is likely to be implemented in websites on a larger scale. Some of the popular 3D designs include flashy or epic designs and others that are subdued or subtle.

Before using 3D graphics on your website, you should note that 3D images provide a better level of control compared to the conventional 2D models. You can use 3D images if you are interested in placing the images at any position of your web pages and getting the perfect look from these images. 3D graphics are also appropriate if you would like to show off your work on mobile devices.

Voice Capable Interfaces

Voice capable interfaces allow users to interact with a website through speech or voice commands. Examples of Voice Capable Interfaces include Google Assistant, Guru and Alexa. You can use the voice feature on your site if you are interested in making users access your website in a hands-free and eyes-free way.

Focus on Motion

Motion is an impact aspect of websites in 2020. It gets incorporated into websites using isometric graphical designs that entail fully animated and highly engaging visual displays. You can use motion aspects in your website if you are interested in content and presentations that move and play with the audience.

Website Design vs Website Development

Website design and website development are terms that are nowadays commonly interchanged due to the perceived similarities between what the two concepts mean. However, website design and website development are two profoundly different aspects of the process of building websites, and which require different skills.

At the basic level, website design refers to both the usability and aesthetic aspects of a website. Website designers use web design programmes like Adobe Photoshop to make a website’s layout and other visual features. That is to say that web designers craft the optical outline of a website. The web structure that web designers create can get referred to as a flat canvas that does not function on its own, creating a roadmap for web developers.

Web developers, on the other hand, take web design and go ahead to make an operational website from the model. Web developers use tools such as HTML, JavaScript, PHP and others to convert web designs to functional websites. In other words, web developers use the design prototype of a website to create a fully functional website.

One question that continually comes to mind is when to use website design or website development. This question can be answered by merely looking at what web designers and web developers do. If you would like to create a website layout and decide the visual aspects to use, you should go for a web design company. On the other hand, you should choose website development services if you need help with making your web layout fully functional and determining whether the functionalities that you desire are possible.

Website Design: Hiring vs Doing It Myself

If you are planning to create a new website or update an existing one, one question you are likely to ask yourself is whether to do the work on your own or hire an expert.  Unlike the situation in the past when it was imperative to hire a professional to help you with creating a website, nowadays you can create your site even with basic knowledge thanks to the availability of tools such as online website builders.

You may be confident to build a website by yourself or still choose to use the services of a professional. The choice that you make should depend on several factors, including the purpose of the website, your level of expertise, and your budget.

Purpose of Your Website

The use of your website has a significant bearing on the features that the site should have, and the level of skill required to build the website.

You may need a brochure website, which is the most straightforward form of a website to showcase what your business does. Such a website simply gives a company a web presence and provides information such as your vision and mission, pricing, the products offered, and contact information. Designing a simple website requires a relatively low level of skill, meaning that you can give it a try even if you are not a pro.

On the other hand, you may require an e-commerce website that showcases products and makes it possible for customers to create and cancel orders, edit transactions, and make payments. Such a website is a bit more complicated. Sites that combine e-commerce functionalities and other application functions are far more complicated and will need to be created by a professional.

Your Level of Expertise

If you are a web designer or web developer who can create a functional website from scratch, then you can always build the site that you want. In contrast, if you do not know how to design a website, you should consider hiring a professional.

As noted above, you can still make your website even if you are not a skilled programmer. There are online website builders and other platforms such as WordPress that you can use to create a website by yourself.

Your Budget

A website’s cost can range from between US$50 and US$5000 depending on whether you build the site by yourself or hire a web design company. An e-commerce website will cost even more because of its complex nature. Your budget should guide you on whether to build your website or hire a professional, especially for a site like an e-commerce platform.

Average Costs of Website Designers in Hong Kong

The cost of web design services in Hong Kong varies depending on the type of website that you would like to build. On average, it will cost you between $12,000 and $150,000 to design a website. This amount will cater for the cost of developing the site and launching it. The cost of routine maintenance ranges between $35 and $5000 a month, which approximately range between $400 and $60,000 a year.

Based on a 2018 report by Hellotoby, a Hong Kong-based freelancer website that collects data on contracts between service providers and their clients, the average costs of designing different types of websites (informational/small business; corporate website; e-commerce website) in Hong Kong are on the table below.

Type of website Minimum cost Maximum cost
Informational/small business HK$5,000 HK$30,000
Corporate HK$70,000 HK$150,000
E-commerce HK$100,000 HK$300,000


Further, data from WebFX, an organisation that provides digital marketing services, shows the costs of designing different types of websites as tabulated below.

Type of website Minimum cost Maximum cost
Small business $1,000 $10,000
Medium-sized business $10,000 $50,000
Enterprise-level company $50,000 $100,000

Influencing Factors of Website Designers’ Cost

The cost of hiring a website designer varies based on factors such as the magnitude of the project, the experience of the designer, how technical the task is, and how creative the designer needs to be.

The Magnitude of the Project

The cost of developing a website will vary depending on the size of the project. The project can be a simple layout website, a small business website, a medium business website, or a big company website. The sizes of these websites vary due to factors such as the number of pages required and additional features such as e-commerce interactivity features. The larger the project, the more it is likely to cost.

The Experience of the Designer

The experience required to design a website also varies with the size of the project. Simple websites require people with fundamental skills, while intricate sites like e-commerce websites require skilled and experienced web designers and developers.

How Technical the Task Is

The technicality of a task depends on the purpose of the website. The more technical the web design work is, the costlier the project will be.

How Creative the Designer Needs to Be

The level of creativity involved in website design also varies. You may require a simple website with 2D images and text or a more sophisticated model that includes 3D photos, voice-capable interfaces, and motion effects. The more features you want, the more creative the web designer should be – and this will influence the web designer’s cost.

Platforms You Can Consider to Design Your Website

If you choose to design your website, there are several online platforms that you can use. Five of the platforms are listed next.


Squarespace enables users to design fully featured personal and business websites. The key features of Squarespace, which are also the platform’s USPs, include multiple templates, ability to customise, and other quality features. Users have free trials and service charges that start from $12.00 for personal websites and $40 for e-commerce websites.

The pros and cons of Squarespace are listed below.


  • High-quality templates as regards design and flexibility.
  • Quality website features.


  • Users have to rely on the platform’s inbuilt features.
  • May be a bit difficult to get used to.


Wix is a free online website builder that you can use to create MySpace layouts, Flash websites, and do much more. With the aid of a browser-based interface, you can use Wix to choose from a wide range of design templates or begin with a blank canvas. The website that you create gets hosted on the Wix server. To have control over the domain name, you need to upgrade to a premium package where you pay from $4.95 a month.


  • Dependable site speed
  • Availability of many website templates, which one of the platform’s USPs.
  • In-built drag and drop interface


  • Templates are not interchangeable
  • Free websites hosted on Wix are required to have Wix branding.


Weebly is a free website building platform that enables anyone to create their websites. The platform has more ten 12 million registered users because of its nature as a free website builder and ease of use. The fact that users can create websites within a short period is one of Weebly’s USPs. You can choose the free version of Weebly or opt for the paid version (Pro plan), which provides access to more exciting web design tools.


  • Good site speeds.
  • It has multiple templates to use.
  • User-friendly and efficient editor.


  • A Limited number of blogging tools.
  • Further help needs additional payment.


Webnode is a website builder that offers a range of features to create personal, business, and e-commerce sites. One USP of this platform is the drag and drop web editor. Another USP of Webnode is that while using the platform, you can create a website within minutes. The platform offers a free trial period of 15 days, and after that, there is a paid plan that starts from $3.95 a month.


  • Easy-to-use Interface.
  • It has an Inbuilt mobile version.
  • Many language platforms.


  • Limited templates.
  • Poor support.
  • Limited paid version features.


Webs is a free website creator with more than 55 million websites designed. The platform targets small businesses and entrepreneurs and has many of the features that other online website creators have. Also, a critical USP of Webs is that sites created using the platform are compatible with Google Checkout and PayPal. It means that you can use Webs to add e-commerce functionalities in your website.

In addition to the free trial version of Webs, you can pay for more features from the platform, starting at $5.99.


  • It is a reliable option for building a robust, free website.
  • Instinctive drag-and-drop editor.
  • Has an app store that makes it possible for you to integrate more third-party applications.


  • It has only 40 templates compared to Wix, which has more than 500.
  • It has a long loading time.
  • Cannot modify HTML/CSS codes.

Website Design Companies in Hong Kong

There are several companies providing web design services in Hong Kong. Seven of these companies and details about them are listed below.

MediaOne Marketing

MediaOne Marketing is an integrated digital marketing company that not only specialises in web design, but SEO optimisation, content marketing, PPC marketing and Social Media marketing as well. If you’re looking for your website to draw in customers, and reach new markets, MediaOne is definitely the agency to work with!

DMA | Digital Marketing Agency

DMA is involved in web design and also provides other related digital marketing services. You can rely on this company whether you need a website for a start-up or an established corporation. designs websites and also provides related services such as SEO and digital marketing. You can use this company’s services whether you have a small business or a large corporation.


In addition to building websites, iCrossing also provides other types of digital marketing services, including developing mobile applications and carrying out social campaigns. You can rely on this company if you would like to build any kind of website for your business.

Digital Butter

Digital Butter specialises in website design, website development, online marketing, and e-commerce. The company provides specialized solutions to help small businesses, startups, corporate enterprises, and e-commerce businesses, with competitive rates for each category.


WeCreate provides web design services as well as branding, app development and e-commerce solutions. You can use the company’s services if you need any kind of website design service, from building a simple website to creating a multifaceted e-commerce site.


Creatix designs websites and web application layouts for organisations. Therefore, you can use Creatix if you are looking for a company that has professional web designers and web developers.

Visible One

Visible One is a technology company that provides bespoke result-oriented solutions to help businesses digitize their operations. The company is renowned for building responsive websites for small and medium-sized enterprises and other types of organisations. Visible One makes websites at prices ranging from $6000 to more than $100,000.

Other Website Design Resources

Other web design resources are useful in simplifying the website design and development process. Examples of these resources are listed below.

Web Mobile-Friendliness Optimization Resources

Web mobile-friendliness optimization resources get entrenched to make websites mobile-friendly. Such resources include:

  • Mobile-Friendly Test from Google
  • BrowserStack
  • Mobile Friendliness Tool from W3C

Design Tools

There are different types of tools used in web design. Examples include the following:

Web Design Inspiration

There are various resources that you can use for web design inspiration. These include:

Royalty-free Photography

These resources provide help with photographs required for websites. Some of the royalty-free photography resources include:

Typography Font Packs

Typography font packs are font resources that you can use in your website design. Examples of these resources are listed below.

Web Design & Digital Marketing in Hong Kong

Successful website design is essential for any business in today’s digital environment. This article has provided the meaning of website design and discussed various necessary things that you need to know about designing a good website. These include the importance of an excellent site, the critical elements of website design, the conventional methods for creating websites and best practices of website design, the latest web design trends in 2020, and the difference between website design and website development.

Given that your website is the image of your business, you need to have it well designed. A good website can improve your brand’s consistency, augment the brand’s recognition, and establish trust with your customers and other partners. If you are looking for a company that can help you design and develop a website that attains the attributes mentioned above, you should try the services of MediaOne.

At Mediaone, our experienced team of developers and designers work closely with each of our clients to ensure that we help you take your business to the next level! By building a well-designed, informative, and interactive website, you can be sure to attract more keen customers to your business!