Frontend


The frontend of a website describes the part that the visitor can see. It includes all displayed content that is visible to public or logged-in users.

Design of the frontend[edit]

The frontend is often called the GUI (Graphical User Interface) because it is the interface that the visitors can see and use. The frontend is mainly used to display various types of content and make the user’s input available to the backend. The displayed content includes the basic structure of the website, such as the navigation. The frontend includes texts, graphics, videos, and other media.

Application examples[edit]

Most software applications have a front end. Even with a database where a majority of the processes run in the background and is invisible to the user, there is a graphical user interface, such as the output table after a data query. Web-based application systems are almost always divided into a front-end and a back-end. In a content management system, the front-end is the interface in which the visitors can view the published content. In the case of a shop system, the front-end also offers the possibility to buy goods, subscribe to a newsletter, be consulted, and much more. In forums and communities, users can view information in the frontend and at the same time, help shape it, actively participate in it, and give advice.

Function extension in front end[edit]

In addition to the simple display of content, various programming languages (such as CSS and JavaScript) can be used to integrate various functions into the front end, for example live chats, links to social media services, or the display of banner ads. In the case of websites which often offer new information, as is the case, for example, with some social media services, the frontend partially updates itself without the user having to manually initiate a refresh.

Frontend.png

Conversion optimization in front end[edit]

The front-end of a website is a key factor for conversions. There are a number of criteria that can be used to optimize the conversion rate in the frontend:

  • Page speed
  • Availability of the website
  • Use of caching
  • High-quality design of the homepage
  • Use of quality seals
  • Continuous use of product images
  • Availability of filter and search functions
  • Good user guidance through navigation
  • Use of call-to-action elements
  • Clear and simple transfer of information

There is a wide range of possible approaches, such as the content, design, user guidance, presentation, navigation, usability, the forms used, page speed, and many more.

The role of templates for the frontend[edit]

In many web-based systems, the front-end can be customized in the source code. With current content management and shop systems, it is also possible to modify the design as desired by means of prepared templates. This allows shop operators to easily test different designs, layouts of the content blocks on the website, and navigation options. These systems are characterized by the fact that the content dynamically adapts to the chosen design without any compatibility problems.

Relevance to search engine optimization[edit]

The frontend also plays an important role for being indexed by search engines. Ideally, website operators use SEO templates, which fulfill certain prerequisites for better indexing. These include, for example: