Basic Html Website Code

5 min read Jul 03, 2024
Basic Html Website Code

Basic HTML Website Code

This article will guide you through the fundamentals of creating a simple website using HTML.

What is HTML?

HTML stands for HyperText Markup Language. It is the core language used for structuring and presenting content on the World Wide Web. HTML documents are plain text files that contain tags, which define different elements and their attributes. These tags tell the web browser how to display the content.

Setting Up Your HTML Document

  1. Create a New Text File: Open your favorite text editor (like Notepad, Sublime Text, or VS Code) and create a new file.
  2. Save the File: Save the file with a .html extension. For example, "index.html".

Basic HTML Structure

Every HTML document follows a basic structure:




    
    
    My Website Title





Explanation:

  • <!DOCTYPE html>: This declaration tells the browser that this is an HTML5 document.
  • <html lang="en">: This tag defines the root of the HTML document. The lang attribute specifies the language of the document (in this case, English).
  • <head>: This section contains metadata about the document, such as the title, character set, and links to external resources.
  • <meta charset="UTF-8">: Specifies the character encoding for the document, allowing for displaying various characters.
  • <meta name="viewport" content="width=device-width, initial-scale=1.0">: Sets the viewport for responsive design, ensuring the website adapts to different screen sizes.
  • <title>My Website Title</title>: Sets the title that appears in the browser tab or window.
  • <body>: This section contains the visible content of the website, including text, images, and other elements.

Basic HTML Elements

Here are some basic HTML elements you can use:

  • <h1> to <h6>: Heading tags, used for different levels of headings (h1 being the largest).
  • <p>: Paragraph tag, used to define paragraphs of text.
  • <br>: Line break tag, used to insert a line break.
  • <img>: Image tag, used to embed images.
  • <a>: Anchor tag, used to create links.
  • <b> and <strong>: Bold text tags.
  • <i> and <em>: Italic text tags.
  • <ul> and <li>: Unordered list tags.
  • <ol> and <li>: Ordered list tags.

Example: Creating a Simple Website




    
    
    My Simple Website


    

Welcome to My Website

This is a simple website created with basic HTML.

My Website Image
  • Item 1
  • Item 2
Visit Example Website

This code will create a simple website with a heading, a paragraph, an image, an unordered list, and a link.

Conclusion

This is a basic introduction to HTML. By understanding the structure and basic elements, you can start creating your own simple websites. Remember to practice and explore different elements to expand your knowledge and create more complex and engaging content.