Carefully designing and perfecting all the elements of website`s design is greatly important for attracting attention of its visitors. The parts, from which a user starts and finishes getting to know a website, are Header and Footer. Thanks to them the page not only looks finished, they also make the conversion better and level up website`s usability.
Header – a part at the top of every page that is meant to simplify the navigation, it is also the first element that attracts user`s attention. With its help a visitor understands what website they are on, how to find the other sections and necessary information.
Footer – the lowest part of a website. It`s meant to logically finish a page, add some extra sections and simplify navigation.
A web-designer must remember that header is the first thing that is seen by a user, which also plays an important role in website`s interface. That`s why a header has to be created with special carefulness and attention.
A Header may include following elements:
- distinguishing symbols of a company such as a logo, a motto etc.;
- site`s menu: sections, catalogues etc.;
- localization options;
- social media links;
- company`s contact information.
Presence of all possible elements listed above is optional. Header`s design is only limited by a desired set of functions and designer`s preferences.
How to design a header that is going to be convenient for users, is going to fit into the style of a page and is going to bring in more conversion? Here are a few advices to achieve these goals:
- Don`t forget about typography. Firstly a visitor usually reads names of sections and information provided on the site, such as offerings of goods and services, descriptions of advantages, contact information. That`s why choosing a readable font, that makes perception of the information easier, is so important.
- Consider purpose and style of a site. If a site is meant to present products or services of a company, design of a header can be limited to links to the main sections of a site. In case with market places, delivery services and online shops it`s not enough. Users have to easily navigate themselves on websites, be able to easily contact a dispatcher or a manager, and also be able to access their accounts.
- Pay special attention to positioning of elements. Company`s logo should be positioned in the top left corner or in the center, and feedback button and contact information in the right corner. It improves the usability a lot and makes navigation simpler, as this positioning of the components is very common.
- Develop a special design for a feedback button. While creating a header for a website designer places a Call To Action button and a connected form that`s meant for data entries. To attract visitor`s attention and for performance of the target action the button should have an understandable title and be noticeable within the main content. The feedback form should contain only the necessary fields and prevent erroneous filling as much as possible.
Sometimes web-designers don`t pay enough attention to website`s footer, as they think that most users just don`t reach the end of a page. It is a mistake as footer completes a variety of important tasks.
- presents information about a company and its services to a visitor;
- guides a visitor;
- helps to complete the target action;
- visually completes a design;
Footer may contain the following elements:
- map of a website – a list of all pages with names of all sections. This element plays a big role helping users to navigate themselves on a website. If there are too many pages, a drop-down menu or links directly to the most popular sections might be placed;
- navigation elements – footer might have extra elements that simplify navigation on a website;
- social media links – placing links to company`s social media profiles and groups provides an extra flow of visitors, holds their attention, notifies them about sales and new products etc.;
- Call To Action – some designers place an extra Call To Action button on a footer to push a client to accept company`s offers one more time;
- contact information – footer usually includes more detailed contact information: a few phone numbers from different service providers, an e-mail address, messengers on which users can contact a company, company`s full address and it`s placement on a map;
- stylized design – a website may be fished with a footer, that matches company`s style and includes contact information.
A well-designed footer doesn`t only logically finish a page and makes a site more aesthetically pleasing, but also helps to increase website`s conversion.
Here are some tips for designing a footer:
- Make footer stand out. Designers usually use darker colors for a footer or use a different way to make it stand out to highlight navigation elements or contact information.
- Pay attention to typography. A readable font should be used for a footer as well as for a header, don`t forget about spacing and legibility of links on a footer.
- Ensure correct hierarchy. While developing a footer separate it to blocks, clearly designate lists and names of sections, consider borders between elements. It`s going to help users sort out content and find necessary information quicker.