Internet has evolved a lot since first website was made. Hence, the W3C has laid down standards to make html content accesscible and user-friendly to all users. Layout options and the standards implementented to make content acessible by assistive technologies.

Below is a sample of standard layout to address landmark region for users of assistive technologies.

    <header role="banner">

        <nav class="navbar navbar-default" role="navigation">
            <a class="navbar-brand" href="#">Brand Name</a>
            <form class="navbar-form" role="search">...</form>
        </nav>

    </header>

    <main role="main" class="page page-main">

        <div class="page-heading">
            <p>Page Title and breadcrumbs Go Here</p>
        </div>

        <aside role="complementary" class="page-sidebar">
            <p>Page sidebar goes here.</p>
        </aside>

        <div class="page-content">
            <p>Page content goes here.</p>
        </div>

    </main>

    <footer role="contentinfo">
        <p>Put copyright, etc. here.</p>
    </footer>
                        

Click here to check an example.

Related classes: