HTML | Layout
Page layout is the part of graphic design that deals with the arrangement of visual elements on a page. Page layout is used to make the web pages look better. It establishes the overall appearance, relative importance, and relationships between the graphic elements to achieve a smooth flow of information and eye movement for maximum effectiveness or impact.
- divs have a special class/id associated with them.
<div class = "header"> ..... </div> <div class = "section"> ..... </section> <div class = "footer"> ..... </footer>
Page Layout Information:
- Header: The part of the front end which is used at the top of the page. <header> tag is used to add a header section on web pages.s
<header> <h1> ----- </h1> <h2> ----- </h2> ---------------- ---------------- </header>
- Navigation bar: The navigation bar is the same as the menu list. It is used to display the content information using hyperlinks. <nav> tag is used to add the nav section(nav elements) in web pages.
<nav> <ul> <li> ..... </li> <li> ..... </li> </ul> </nav>
- Index / Sidebar: It holds additional information or advertisements and is not always necessary to be added to the page.
- Content Section: The content section is the central part where content is displayed.<main> tag is used to add the main content of the webpages.
- Footer: The footer section contains the contact information and other query related to web pages. The footer section is always put on the bottom of the web pages. The <footer> tag sets the footer on web pages.
<footer> ..... </footer>
- Google Chrome
- Microsoft Edge