Skip to content

use of non-semantic html elements #2

@RTC4rush4

Description

@RTC4rush4

it's advisable to use semantic elements rather than just plain divs.
for example: navbar container should nav instead of div,
the links must wrapped in ul and link in li element.
use axe devtools extension to auto-check

 <div id="nav-bar">
      <div id="links-div">
        <Link to="/" className="links">
          <span className="links-text">Home</span>
        </Link>
        <Link to="/skills" className="links">
          <span className="links-text">Skills</span>
        </Link>
        <Link to="/projects" className="links">
          <span className="links-text">Projects</span>
        </Link>
      </div>
      <div id="icons-div">
        <a
          href={"https://github.com/atharva-kakarot"}
          target={"_blank"}
          className="links"
        >
          <i className="bi bi-github"></i>
        </a>
        <a
          href={"https://www.linkedin.com/in/Atharva-Karanjekar"}
          target={"_blank"}
          className="links"
        >
          <i className="bi bi-linkedin"></i>
        </a>
        <a
          href={"mailto:atharva.kakarot@gmail.com"}
          target={"_blank"}
          className="links"
        >
          <i className="bi bi-envelope"></i>
        </a>
        <a
          href={
            "https://www.instagram.com/karanjekar_atharva?igsh=MWk2NXlqbmMOamw%Yw=="
          }
          target={"_blank"}
          className="links"
        >
          <i className="bi bi-instagram"></i>
        </a>
      </div>
    </div>

https://www.learn-html-css.com/learn-to-code-html/html-5-semantic-elements

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions