The
<section> element in HTML is a semantic element used to define sections
in a document, such as chapters, headers, footers, or any other grouping of content.
The <section> element represents a generic section of a document. It's typically used to group content under a specific theme or topic.
Why Use the <section> Element?
1. Semantic HTML: By using <section>, you provide meaning to your code. It tells search engines and browsers that the content inside this tag is a distinct section of the webpage.
2. SEO Benefits: Search engines can understand the content better, which can improve SEO. It gives search engines clues about the structure and content type.
3. Accessibility: Screen readers and other assistive technologies can better interpret and navigate the content when semantic tags are used.
4. Organization: Helps in organizing and structuring the HTML content in a clear and meaningful way. It makes the code more readable and maintainable.
section-tag.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Section Element Example</title> <style> section{ margin: 15px; background-color: rgb(222, 231, 244); } footer{ background-color: rgb(214, 214, 235); margin-top: 20px; width: 30vw; padding: 10px } </style> </head> <body> <header> <h1>Welcome to My Website</h1> </header> <section> <h2>About Me</h2> <p>Hello! I'm a web developer with a passion for creating interactive and user-friendly websites.</p> </section> <section> <h2>My Projects</h2> <p>Here are some of the projects I've worked on:</p> <ul> <li>Project A - A web-based application for Leave management.</li> <li>Project B - A responsive website for a restaurant.</li> <li>Project C - An e-commerce site with integrated payment gateway.</li> </ul> </section> <footer> Contact me: harikrishna@example.com </footer> </body> </html>
No comments:
Post a Comment