Web Design: 9 Basic Types of Web Pages

In this article, let's review basic types of web pages you can find on diverse websites around the Web. Packed with web design examples and tips.

For most people of today, it’s already hard to imagine life out of the Web. Various websites help us with everyday tasks like cooking or shopping, support our education with tons of data, keep us quickly informed with plenty of news, help us manage, calculate, work, and communicate. According to Internet Live Stats, it’s almost 1.8 billion websites for August 2020. So, the diversity of websites needs more and more various design approaches and solutions. Yet, whatever diverse are websites, there are some basic pages typical for most website structures. In this article, we offer you to review 16 basic types of web pages you can come across around the Web.

Home Page

Home page is one of the most strategic pages of any website. It is called home as it is typically a starting point where the user gets a core introduction to the website and chooses the direction of his further journey around it. Home pages usually contain links to the most important interaction zones. In other words, it can be also named the initial page or index page. Home page is the start of users’ journeys if they are directed to the website by search engines so in most cases, it is the page visited by the biggest number of website users.

Home page often contains a search field, basic onboarding functionality for personalized sites, and different areas of navigation showing users diverse categories of data. It might also contain engaging welcome messages and copy blocks featuring slogans and/or explaining the benefits of the website or brand it presents. So, in the case of web marketing, it is recommended to design the home page in consistency with a company or product branding to give a strong visual association.

The look and structure of the home page may also differ for the websites where users sign up and create accounts. In this case, it often happens that the home page looks different for users that are logged in and the ones that aren’t. For example, for logged-in users on social networking websites, the home page may look like the feed of all the updates while the logged-out users will perhaps see the page presenting the benefits of the website and the registration form. On ecommerce websites, the home page often shows the hot deals and provides quick access to different categories of goods.

Depending on the business goals and target audience, design solutions for home pages may be very different: some of them are based around informativeness while the others aim to “shock and awe” a visitor with the wow-effect of media content or animation, this way catching attention, creating the necessary mood and engaging to see more.

Feed Page

Feed (or news feed) page is found on websites that often update content. In other words, it’s a content stream users can scroll through and check what’s been updated on the website. On the feed page, the content is presented in blocks or elements that are similar and repetitive. For instance, an editorial feed will be presented by the list of news or articles whereas on the social networking site the feed will often show the updates from the followed users or pages. Also, the presentation of the feed can be different from text-only and super minimalist to the one using big complex blocks of content including both text and media like photos, illustrations, or even video previews.

Menu Page

This page is usually about navigation goals. As well as a typical menu control, the menu page presents a sort of list giving access to different content categories and interaction zones. It is not always needed: the websites with simple structure often use just the menu controls integrated into the web layout that doesn’t require transitions to a separate page. However, the separate menu page allows designers to focus the user’s attention on the options without distractors around. What’s more, in many cases separate menu page supports the minimalistic approach for other pages.

About Page

This is a web page that allows visitors to get quickly informed about the company, product, or person behind the website. It is an important part of strong branding and the shortcut to telling the audience about the benefits of what they can find on this website or do with its help, so when visitors want to get a concise introduction of the brand they look for this page. The link to About page can often be found in the website header or footer, or both.

404 Page

The 404 pages can be found on any website. Technically, 404 or Not Found is the error message in HTTP (Hypertext Transfer Protocol) response code: it is sent in case a user got successfully connected with the server, but for some reason couldn’t get the content that was requested. It can happen, for example, when users tap the link to the page which has been deleted, dead, or if the link itself is broken; in this situation, the website server forms and sends the 404 webpages to inform the user that the content cannot be found.

The most basic solution for a page of this kind is a simple layout with just a line of copy saying that “nothing can be found here”. Nevertheless, these days the vast majority of websites apply the customized 404 webpages that can serve much more strategic goals or at least add some fun to that annoying case. What’s more, a creative approach to this error page can also effectively support website or brand promotion. A well-crafted and stylish 404 webpage not only informs visitors but also navigates them to other pages, entertains, or just gives a moment of aesthetic pleasure.

Blog Page

In our article devoted to different types of websites, we’ve answered a popular question if a blog is a website itself or a part of a website. Put shortly, it can be both. The term “blog” is used in two different meanings today.

Basically, a blog is a type of website devoted to providing information or discussion on particular topics. It is a kind of journal or diary people keep online, sometimes just sharing their thoughts or expertise and also inviting readers to discuss the problem in comments. With a variety of blogs today, you may find the personal and professional ones, some of them will be devoted to daily life while the others will cover narrow themes or areas. Bloggers share posts that become the basic content around which the website performs. In this case, a blog is a type of website.

Nevertheless, in the last decade or two, the situation has evolved. In most spheres, the competition is incredibly high on the Web. To keep above the ocean and get high ranks in search engines, the websites need not only to correspond to the technical and design requirements but also constantly update their content. This is when blogs have come into play. Now, you can find blogs incorporated into e-commerce and corporate websites, educational platforms, and portfolios. And this is the case when a blog is not a type of website, it is a part of the website presenting interesting news and articles around the website theme.

In the latter case, the website needs a blog page that will show the feed of articles. The way of their presentation may be different, from just a chronological list to different sections and featured articles, depending on the frequency of adding new posts and preferences of what to show to visitors.

Article Page

This web page shows visitors a full article in a blog, news platform, educational website, or any text-based website. The article page presents a particular article, news, or report. It’s crucial to design it according to typical eye-tracking patterns so that a big amount of text could be easily skimmed. Also, a solid and well-thought-out visual hierarchy helps visitors to quickly prioritize the content: for example, the headline should be the most prominent text part to be noticed on the page, as well as the H1 and H2 headings should be easily distinguished. Quite often, at the end of the article page, you can find the blocks of related content helping to engage a reader into further interaction with the website. Another essential aspect to consider is enough white space that divides text blocks making them more scannable and digestible. And consider using images that will not only illustrate the article but also will make the page look more eye-pleasing, add emotional appeal as well as make text look easier to perceive.

Portfolio Page

As it’s clear from the name, this type of page is typical for websites whose goal is professional presentation, most often for people or teams that create visual content such as photography, designs, art, videos, or physical goods, for example, hand-made stuff, clothing, exclusive decore, etc. You can find such pages on professional platforms where users can create their own portfolios. Or it can be a special page on the personal website. The goal of this page is to show the projects to customers at their best, so it recommended to work well on high-quality images of the goods or designs and the original way to perform them with a pinch of wow-effect to the website visitors.

Services Page

This page has quite a similar goal as the previous one: it presents professionals to their potential clients. However, instead of showing the projects and goods as on the portfolio page, this page gives an introduction to the services the company or individual offers. Again, this is not the page where visitors are going to spend much time reading huge bulks of texts, so make the presentation highly readable and easily scanned due to the bullet lists and clear concise descriptions without much jargon. Images can also be really helpful here as they are perceived faster than text and have a great power of setting the needed mood and emotionally amplifying the brand message. As not all the services can be shown with quality photos, custom illustrations and icons can be used instead.