What Is A Webpage?

What Is A Webpage

Date First Published: 16th July 2022

Topic: Web Design & Development

Subtopic: Web Development

Computer Terms & Definitions

Difficulty: Easy

Difficulty Level: 1/10

Learn more about what a webpage is in this article.

A webpage, also spelt as web page, is a single HTML document that makes up a website on the World Wide Web and is viewed by a web browser. Webpages are stored on a web server and when a client makes a request for a webpage, the server delivers it to them. In addition to text, webpages can contain hyperlinks to other pages and files, images, sounds, videos, and animations.

A webpage can be viewed by typing the unique URL into a web browser on a mobile device, tablet, laptop, or desktop computer. CSS is used to define the style of webpages and JavaScript is used to enable interactive effects within web browsers, such as alert boxes. Scripting languages, such as PHP, ASP, or Perl can be used to produce dynamic webpages. Whilst webpages can display other documents, such as images and PDF files, only a HTML document is referred to as a webpage. The PDF files or images themselves would not be considered webpages.

Note: Info Icon

A webpage is not to be confused with a website, which is a collection of several webpages held together to form a site. For example, this article is a webpage and Computerhelp4all is a website.

Types Of Webpages

  • Static webpage – Also known as stationary or flat webpages, these types of webpages deliver the same content each time they are viewed and are delivered exactly as stored, regardless of the identity of the user or other factors. They are simpler to build than dynamic webpages, but are harder to maintain. Static webpages are only made up of HTML and CSS.
  • Dynamic webpage – These types of webpages have content that can change each time they are accessed without the webmaster manually changing the webpage. For example, a dynamic webpage may automatically change based on the time of day the user is visiting it, what the user has visited before, etc. They often access information from a database and are written in scripting languages, such as PHP, ASP, or Perl. Whilst they are easier to maintain, they are harder to build.

How Are Webpages Made Up?

Webpages are made up of the following:

  • A top navbar containing a list of links to important pages on the website and sometimes a search bar.
  • A 'breadcrumb trail' – This is a navigation feature that helps visitors understand where they are and how they got to that webpage. For example, the text above the title of this article is the 'breadcrumb trail'.
  • The main content – Without any content, a webpage is an empty HTML document that is unhelpful to visitors. The requirement of a good webpage is thoughtful content that engages readers. The content may be separated into paragraphs and subheadings.
  • Ads – These are used to fund the website and can be found anywhere on the webpage. Ads can come in different formats, including banner, skyscraper, rectangle, leaderboard, and square.
  • Headings – These create a hierarchical structure for a webpage, put emphasis on important text, and help users navigate through content.
  • Footer – This is located at the bottom of a webpage and contains information, such as a copyright notice, links to essential pages, a sitemap, and contact information. It also indicates to visitors that they have reached the bottom of the page.
  • Sidebars - These may contain featured pages, recently added pages and links to categories.
  • Hyperlinks to other webpages or external sites.
  • Images and videos – These enhance the quality of a webpage and draw visitor's attention.
  • Social media buttons – These provide links to the social media page of a website and make it easier for visitors to share it with other people.

How To Create A Simple Webpage?

This is a very simple example of a webpage and does not contain any interactive elements or styles. In order to add interactive elements, scripting languages, such as JavaScript and PHP need to be used. In order to add styles to elements and define the look and feel, CSS needs to be used. Anyone can create a simple webpage as long as they have the following:

  • A web browser
  • A text editor
  • A computer

1. First of all, copy the HTML below into a text editor. (e.g. Notepad)

<!DOCTYPE html> <html> <head> <title>Type your title here.</title> </head> <body> <h1>Type your heading here.</h1> <p>Type your text here.</p> </body> </html>

2. Save the file with the '.html' file extension.

3. Open the saved file in a web browser and you should see the following output in the screenshot below. Note that this is not a public webpage. It is only stored locally on your computer.

HTML Tutorial Screenshot

The HTML elements used are:

  • <!DOCTYPE html> – All HTML documents must start with this. It is used to inform the browser as to which document type is expected.
  • <html> - Indicates the start of the HTML code. The ending tag </html> indicates the end of the tag.
  • <head> - This is a metadata container placed between the <html> and <body> tag. All the metadata of HTML documents, including the title, description, keywords, etc, are defined here.
  • <body> - This defines the body of the HTML document. In other words, it defines the main content. In this example, the main content only contains text.
Note: Info Icon

The tags with the forward-slash (e.g. </body>) indicate ending tags. Each element must have an ending tag in order for it to be closed.

History

The first webpage was available on the World Wide Web on 6th August 1991 by Tim Berners-Lee. The URL was http://info.cern.ch/hypertext/WWW/TheProject.html. It ran on a NeXT computer at the European Organisation for Nuclear Research CERN. By this time, Tim Berners-Lee had developed all the necessary tools for the World Wide Web, including HTML, HTTP, URLs, a basic web browser, and web server software. The webpage contained information about the World Wide Web project, including how to use it and what it is.


Feedback

  • Is there anything that you disagree with on this page?
  • Are there any spelling, grammatical, or punctuation errors on this page?
  • Are there any broken links or design errors on this page?

If so, it is important that you tell me as soon as possible on this page.