askvity

How to Read HTML?

Published in HTML Viewing 3 mins read

HTML files are designed to be viewed in a web browser, not read like plain text documents. Here's how you can access and view HTML content:

Viewing HTML Files in a Web Browser

The primary way to "read" HTML is by opening the .html file in a web browser. Web browsers like Chrome, Edge, and Firefox interpret the HTML code and display the webpage accordingly.

Steps to Open an HTML File

  1. Locate the file: Find the HTML file on your computer's storage.
  2. Right-click (or double click on Mac): Right-click on the file or double-click if you are on a Mac.
  3. Select "Open With": Choose the "Open With" option from the context menu.
  4. Choose Your Browser: Select your preferred web browser (Google Chrome, Microsoft Edge, Firefox, etc.) from the list of applications.
  • The web browser will then load the HTML file and render it as a webpage.

Understanding What You See

When you open an HTML file in a web browser, you're not seeing the raw HTML code directly. Instead, you are seeing the result of the browser's interpretation of the HTML tags. These tags are instructions telling the browser how to display text, images, links, and other content.

What You Don't Directly Read

  • Raw HTML Code: The actual text with HTML tags will not be visible. For example <p>This is a paragraph.</p> would simply appear as "This is a paragraph." in your browser window.

What You Do See

  • Formatted Content: Text will be formatted using tags like headings (<h1>, <h2>, etc.), paragraphs (<p>), and lists (<ul>, <ol>, <li>).
  • Images: Images embedded in the HTML will be displayed.
  • Links: Hyperlinks will appear as clickable text or buttons that direct the user to other pages or locations.
  • Interactive Elements: Form elements (<input>, <textarea>, <button>) will be visible and functional.

How To View The Underlying HTML Code

While the browser displays the rendered version of your HTML file, you can also view the underlying code.

  1. Open Your HTML Page: Load the HTML file in your web browser.
  2. Right-click (or Control-click on Mac) Anywhere on the Page: Select "Inspect" or "Inspect Element".
  3. View the HTML: A developer tools panel will open, usually on the side or bottom of your browser window, and show the raw HTML code.
  • This code is what the browser uses to display the webpage.
Action Description
Open With Use this to open your HTML file in a browser for viewing
Inspect Element Reveals the underlying HTML code as the browser sees it.

Example

An HTML file with the code:

<!DOCTYPE html>
<html>
<head>
<title>My First Webpage</title>
</head>
<body>
<h1>Welcome to my page!</h1>
<p>This is a sample paragraph.</p>
<a href="https://www.example.com">Click here!</a>
</body>
</html>

would render in a browser like this:

  • The title “My First Webpage” will be in the browser tab or window's title bar.
  • The text "Welcome to my page!" will be displayed as a level one heading.
  • The paragraph will say "This is a sample paragraph."
  • "Click here!" will appear as a clickable link that directs the user to https://www.example.com

Related Articles