Skip to content.
Personal tools

Components of a Website

Document Actions

A website can be divided into pieces a lot of different ways. You can divide up the process of development into stages, or you can look at the individual parts. But a website is not like a car. The pieces don’t screw together or came apart in the same way. What makes a website work is the interaction between components that are separated in space and, possibly, time. Some of the pieces are more theoretical, such as the layout and the navigation structure. It’s like the frame of the car, except that you can’t actually see the frame. Just the things hanging on it.

Here are some of the components that hold a website together:

  • Front End Elements. People often describe the website as having a front end and back end. In this analogy, front end is what you see, back end is what you don’t. Simple enough, except that you can’t really see the navigation structure, not all at once. But it’s a place to start. Good front-end components include the following:
  • The navigation structure. This is not the same as the sitemap, though that might represent it. The navigation structure is the order of the pages, the collection of what links to what. Usually it is held together by at least one navigation menu.
  • The page layout. This is the way things appear on the page. Is the navigation menu on the top or along the side? Are there images above the text area? Tables? Good layout is as important as any other element of design. Bad layout makes a website look crowded and slapdash. Good layout allows the eye to find what it seeks easily.
  • Logo. A good website has a unifying graphic around which it is built. The graphic represents your company, your organization. It often sets up the color scheme and the style elements used throughout. The logo ties the website to everything else your company does, though the printed materials, signs, whatever.
  • Images. Photos, graphics, navigation bars, lines and flourishes, animations can all be placed on a website to bring it to life. Or, in some cases, bury it.
  • Contents. Few websites exist just to be looked at. The internet began as a method of sharing information. As it evolved into the World Wide Web, it became rich in all kind of media. But it still exists primarily to communicate. Well written internet-ready text is a special kind of text. Usually the information is broken into readable chunks. It is formatted to be easily scanned, and it is often optimized for search engines as well as human eyes.
  • Graphic Design. Many of the elements described, such as the logo, the navigation menus, the layout, images, etc., fall under the general category of graphic design. But graphic design is more than the sum of these parts. It is the overall look and feel the website will have as a result of proper use and integration of all these elements. A website with bad graphic design is usually obvious to everyone except the person who put it together. But doing graphic design well takes a special combination of talent, skill, and education.
  • Back End elements. Some websites are entirely static. They are the same every time you visit. You never give them information, there are no polls, bulletin boards, or referral forms. If you want to find something on the website, there is no search box, you just look around until you find it. But such sites are growing more rare as the internet becomes an ever greater part of people’s lives. Modern sites are searchable. They offer new images on each visit. They allow the user to request more information, or to post their own thoughts. Many can be updated directly from a simple panel or word-processing program. A lot of websites are datadriven, meaning that web pages are actually created on the fly, in response to the specific needs of the user. All of these functional elements are called back-end elements. In some cases there are many different ways to do the same thing. So the line between elements is often blurry.
  • Content Management System. This is the ability to update your website without having to directly edit the html. A robust content management system allows for documents to be prepared, edited, approved, and tracked prior to publication. Simple systems create areas on a web page that can be easily changed on a regular basis.
  • E-Commerce. Purchasing items from the internet has begun more and more common. The internet allows small merchants to reach a world-wide audience, while other retailers are able to maintain huge inventories of immense variety. New levels of convenience are possible, such as mail-order rentals of DVDs and games. The simple ability to safely process credit-card transactions over the internet is where this process begins.
  • Shopping Cart. If you have one or two products, it’s fine if visitors click a couple times, fill out information, and purchase the product. If you have a lot of different things for sale, you need a shopping cart. This is just a way for visitors to pick out different items and make a single purchase at the end of the process.
  • Site Search. Among all the information on the Web, somebody found yours with a simple search and a couple clicks. Do you want them to slow down and plow through pages and pages of text to find that thing they are looking for? Only if you want to lose nine out of ten visitors.
  • Blog feature. Blogs are much in the news these days. Blogs can be done independently, or as part of your website. Some content management systems have blog modules. Specialized blogging software can be installed on your server, or you can use blogging services.
  • Image-rotation. Presenting new images each time someone visits your page gives it a sense of life. Photos can be rotated, as can pieces of text, such as quotes or service descriptions.
  • Chatroom. There are a number of ways to allow people to interact online. A bulletin board allows people to post up messages on a topic. Chatroom allows users to comment back and forth in real time.
  • Contact forms. Most websites need some kind of contact form. Even if you are just giving information away, you still might want people to thank you for it. More likely you want some ongoing relationship to spring from visits to the website. Whether the goal is commerce or political organizing, contact forms are a starting point for interaction.
  • Referral forms. Viral marketing takes many forms. If someone likes your site, and has an easy, one-push way to notify her friends, you’ve turned your visitors into salespeople.
  • Newsletter registration. If you have the kind of content that is updated periodically, there are few better ways to build a regular readership than newsletters. Newsletters keep you in front of potential clients, as well as keeping your current clients in the loop about your new products, services, or campaigns. The fastest way to build a legitimate newsletter mailing list is to allow people to opt in at your website.
  • Online databases. Databases allow us to store, sort, search through, and display large amounts of information. Online databases bring this technology seamlessly to the Web.
  • Password protected sections. The public area of your website is a great way to serve a variety of audiences. But what if you have a membership that deserves better, more comprehensive content? Or what if you want certain registered visitors to be able to perform online actions? You may have a section of your website set aside for your own internal processes. This is easily done by creating password protected sections.
  • Downloadable files. From simple flyers to hundred page documents, e-books, music files, and even movie clips can be downloaded from websites. This is an easy way to distribute files all over the world.
  • Multi-media. Some websites call for more than just text and images. Photo-tours, video-clips, sound-clips all can add to the experience if they are well matched to the type of site and profile of the target audience.
  • Security. All kinds of information can be found hidden on websites. Trade secrets, proprietary programming, client credit card numbers, and every imaginable piece of personal data. Press releases have been uncovered early, strictly internal memos have been leaked, all because the internet has many ways of exposing data. If you are passing information online that is not meant for everyone, then you want to ensure you have the right level of security.

Other components. Some elements that are essential to a website aren’t properly described as either front-end or back-end components. Still, a website doesn’t work right without them.

  • Hosting. Hosting is where your website is physically located. On a server, somewhere, are a set of files that are transmitted to user computers when they call your name.
  • Domain Name. This is the address. When someone asks to see your website, they put this address into the internet, and your site is served up to them.
  • Online Promotion. Not exactly part of the website, but often part of the design as well as the activity surrounding its launch is the online promotion. A site with no visitors is like a huge monument built in an uninhabited desert.