- Introduction to HTML
- What is HTML
- Structure of an HTML Document
- Importance of Doctype
- Tags
- Elements
- Attributes
- Example with Tags, Elements, and Attributes
- Understanding the head and body Tags in HTML
- The Head Tag
- The Body Tag
- HTML Text Fundamentals
- Text Formatting Tags
- Paragraphs
- Strong Emphasis
- Emphasis
- Nuances of White Space in HTML
- Convention of Using Lowercase for Tags
- Working with Lists and Links in HTML
- Creating Ordered and Unordered Lists
- Ordered Lists
- Unordered Lists
- Creation of Hyperlinks Using the <a> Tag
- Creating Internal Links
- Creating External Links
- Adding Images and Media in HTML
- Embedding Images Using the <img> Tag
- Embedding Videos and Audio
- Video
- Audio
- Responsive Media Using HTML5
- Working code for embedding images, videos, and audio
- HTML Forms and Input Types
- Overview
- Creating Forms with the <form> Tag
- Importance of the <label> Tag for Accessibility
- Working code for HTML Forms and Input Types
- Tables in HTML
- Tables in HTML Overview
- Creating and Structuring Tables
- Importance of Table Accessibility
- Styling Options
- Working code for Tables in HTML
- Semantic HTML
- Semantic HTML Overview
- Importance of Semantic HTML
- Header Tag
- Nav Tag
- Article Tag
- Section Tag
- Footer Tag
- Example of a Semantic HTML Layout
- Advanced HTML Attributes
- Advanced HTML Attributes Overview
- The id Attribute
- The class Attribute
- The style Attribute
- Custom data Attributes
- Complete working code for Advanced HTML Attributes
- HTML Document Head
- HTML Document Head Overview
- Title Tag
- Meta Tags
- Link Tag
- Script Tag
- Working Code Sample
- Building a Simple Webpage Using HTML
- Project
- Project Overview
- Key Takeaways
- Course Summary
Link Tag
<link> Tag
This section is dedicated to linking resources such as stylesheets, icons, and pre-connect URLs.
Regarding SEO implications and best practices for script loading; Properly linking stylesheets ensures that the page is styled correctly and loads efficiently. Utilizing rel="pre-connect" enhances loading times by resolving DNS lookups of time.
Example:
| <link rel="stylesheet" href="styles.css"> <link rel="icon" href="favicon.ico" type="image/x-icon"> <link rel="preconnect" href="https://example.com"> |
ChatGPT
Python
PowerShell
PL/SQL
Spring Boot
CSS
