The basics of web design - part 1: planning

As is the case for other media forms, one basic design maxim holds true for web sites as well: the better the preparation, the easier it is to execute the plans. It does not matter if the website is for you, your company, or if you are developing it for somebody else–good planning is fundamental for favorable final results. For this reason, it’s advisable to set aside adequate time for brainstorming, drafting concepts, and tweaking improvements. Taking the following points into account will help you incorporate a more compelling and appropriate structure into your website.

What should the website achieve?

Before the planning process of a website can begin, it is important to first know what you aim to achieve: what is the goal of your website? The project’s objective is the bedrock for your entire work process: every element of the homepage should be oriented on the task at hand. For example, a website can aim to increase the publicity of its content or, in the case of an e-commerce website, have the purpose of attracting the maximum number of clients in order to sell more products. As a general rule, websites should be considered the flagship portrayal of the company or institution they represent. Whatever the intention of your website, it is imperative that the goal of the site is reflected in both its layout and design.

What type of content works best?

Carefully considering what type of content should be covered and how this should be processed is the next step in the design process. Is the website more text focused? Or do pictures and video take center stage in its appearance? Do users need an account to fully utilize the site? Is setting up a payment method necessary? Try fleshing out a vision with your colleagues about which measures and content best serve the overall target. Carrying out this oft-too-overlooked step can yield more precise concepts for the planned website and may simplify subsequent steps of the project.

Target audience and user expectations

Who are you trying to reach? Make sure to always focus on the assignment at hand when choosing the target audience for your website: when selling a product or a service, ensure that the target audience has been defined and that the web design has been tailored to its specific requirements. The same rules apply to information portals or theme-specific forums. Essentially, it is up to every website operator to be aware of whom they are addressing, no matter the purpose of the content.

Many fields already have an established style for their content. Shopping websites, for instance, generally feature search and sort functions for their products. Every sector and target group is characterized by its own unique set of qualities that shape their online presentation and content. Knowing your users’ expectations is crucial, even if your website is to perform beyond the typical range of functions normally associated with its intended purpose.

The sitemap’s structure

Sitemaps are diagrams that depict the links and page structure of a website’s individual pages. Whether with pen and paper or on your computer, creating a sitemap allows you to visualize the hierarchy of your website and gain a general overview of how the page should look. A well thought-out site map does not only structure content — it also determines the site’s navigation. Sitemaps also serve the purpose of laying out which links lead to which websites. Pages can be sorted in order of their importance, and descriptions for future content can also be drafted. As with every part of the web design process, the page structure should be neatly arranged and not contain too many subpages on a specific topic.

The site layout

In contrast to the sitemap, which plots the final design, the site layout deals with the arrangement and function of content on the site’s individual pages. The location of menus, how users access menu sub items, and where the site’s logo is positioned are all examples of important decisions that are made when hammering out the details of your layout. Knowing which additional aspects should be incorporated into the site’s layout depends heavily on the type of content that is displayed. Further website functions whose implementation need to be carefully considered are:

  •  comment functions for visitors
  • social media buttons that allow users to “like” and share content
  • ads, banners, and videos of advertising partners
  • affiliate links to partner companies that are advertising on your website.

It is additionally worthwhile to get an early start in thinking about whether to optimize your website display for various devices (PC, tablet, smartphone, etc.). It is often necessary for the site’s individual components to be rearranged to fit the specific needs of these different devices. The sitemap and layout are largely entwined with one another and should therefore be simultaneously integrated into the planning process.

SEO (search engine optimization)

A thoughtfully executed internet presence caters to the needs of both site visitors as well as search engines, like Google. Improving content that appeals to the whims of search engine algorithms is known as search engine optimization. SEO helps websites appear higher up in search result lists when topics that are relevant to their content are searched for by a user. Google’s dominant position in the US market means that many websites aim to optimize their content specifically with the California-based company’s algorithms in mind. A higher ranking in Google’s search results means that more potential customers or users will be able to locate your site. A carefully planned SEO strategy is therefore an integral part of increasing the reach of your website.

Good, topic-related content ensures that your website is highly frequented and remains interesting for your target group. There are additional methods that can help you optimize your site’s content for a search engine, and you don’t need to be an SEO expert to implement them: always keep in mind exactly what your target group will be searching for on Google & Co. These terms and keywords need to be integrated into your website’s texts as often and strategically as possible. Aspects, such as the latter one, are what search-engine software (crawlers) looks for when indexing content and determining how to rank your website. The most important SEO tips and tricks can be found in our article ‘The basics of search engine optimization’.

SEO with rankingCoach from 1&1 IONOS!

Boost your Google ranking by optimising your website without prior knowledge!

Easy
Tailored to you
24/7 support

Professional web design vs. toolkits/CMS

Setting up an internet site is no longer an undertaking that needs to be left to the pros. Content Management Systems (CMS) conveniently remove much of the hassle commonly associated with carving out a convincing web presence.

CMSs offer users a graphical interface that gives professional and aspiring designers alike the ability to customize content by adding on and adjusting different components. Previous experience in programming languages, while helpful, is not required for use. The range of functions of these homepage toolkits varies quite significantly depending on the program. Most providers offer a range of different packages with varying prices depending on the desired performance. Freeware versions are also available, though their selection of features do tend to be limited and should only be used for rudimentary websites.

Those seeking to set up a professional homepage should be well-versed in the fundamentals of programming languages such as HTML and CSS. These programs give users more elbowroom for many of their design needs. It should be noted, however, that maintaining a site built directly on source code generally requires more time and energy than is needed with a conventional CMS. Outsourcing the construction of your site to a professional is also an option to be considered. Always be aware of which goals and expectations you have for your site prior to contacting a professional agency. These should be clear to both parties before work on the project starts.

The website builder from 1&1 IONOS

MyWebsite is the ultimate solution for your professional web presence, including a personal consultant! 

SSL certificate
Free Domain
24/7 support

Drafting a schedule

As soon as you know the type of content your site is to offer and have worked out the details of its structure and design, the final step involves drafting a schedule for your web presence. For larger projects, it may make sense to subdivide your schedule into several different stages (e.g. drafting basic content, implementing foundational design, etc.). No matter how you decide to set up your timetable, it should always cover all the most important steps of the design process while remaining clear and easy to understand. Don’t forget that some individual portions of your project may need to be adjusted as you progress through the various stages; a good schedule always allows enough wiggle room for corrections.

The next steps

Once the aforementioned steps have been completed and their various kinks have been ironed out, the scaffolding of your website should be starting to take shape. Now it is time to implement these points. Further aspects should also be considered when you finally break ground on your cyber construction site.

In the next part of our web design basics series we will be covering how to practice user-friendly homepage design and what things you need to be mindful of when using logos and colors.


Wait! We’ve got something for you!
Get your .co.uk domain now, the first year is free.

Enter the web address of your choice in the search bar to check its availability.
12 month for £0/year
then £10/year