Understanding the basics of a webpage

The basics of a webpage can be easy to understand or made more complicated by extras added to a page or a browser that distract someone from the information. Below is a quick rundown of what you would typically see on your website or another website.

Screenshot of the Our Work page on the Web Services website with elements of the screen highlighted in green.
  1. Browser Tab – most browsers have “tabs” that allow you view a site and keep it visible for reference so you can have multiple tabs of websites open at a time. The tab for the webpage you are looking at will usually include the page’s title and website title to help you understand what information is contained within the tab if you are looking at more than one tab.
  2. Address Bar – this contains the webpage’s URL, or address, and this can be copied to use for a link to that page from another page on the same site or other website.
  3. Main Navigation – this is the location of the webpages on a website, and acts as an index of sorts for all of the pages. Some websites have few pages or large number of pages depending on that website’s visitors, and focus. This is the main place for visitors to look for information, so it’s good to keep this well organized and easy to view.
  4. Bread Crumb – this feature is a way of helping a visitor understand the context of where they are with the site’s content. In the example above, it indicates that the view is over the Overview of the “Our Work” page. This will update to show you the path of the next page visited on the website.
  5. Page Title and Content – The title text of the page, which also appears in the navigation, is the largest text on the screen. This is for accessibility and usability of the page. Below the page title is the content of the page where visitors find the information they are seeking.
  6. Sub-navigation Menu – this is a navigation menu for easy of navigating around other pages that fall underneath the same Parent page. This helps visitors see related content and click on it more easily than forcing them to shift their focus back to the main navigation each time they want to go to a related page.