23.05.08~ / 취업준비_이력서 스터디, 데일리 과제
Q. <li>요소와 <ul>요소의 관계?
<li>태그는 목록의 항목을 나타내는 태그이다.
따라서 목록을 담는 <ul>태그의 자식요소여야한다.
만약 <li>태그로 작성하지 않고 다른 태그로 작성하더라도 문제는 없지만, 태그의 의미에 맞게(시멘틱하게) HTML을 작성하는것이 다른 개발자가 보았을 때 쉽게 이해할 수 있기 때문에 협업의 측면상 중요하다.
<ol>태그 안에도 <li>태그를 작성할 수 있으며, 차이점은 <ul>태그의 경우 정렬되지 않은 목록을 나타낼 때 사용하는 태그이고, <ol>태그는 정렬된 목록을 나타낼 때 사용하는 태그입니다.
Q. Semantic HTML의 필요성?
Semantic하게 HTML을 사용한다면 태그의 의미에 맞춰 기계와 사람에게 정보를 전달해 줄 수 있다. 예를 들어 <h1>태그는 제목, <article>태그는 한 덩어리의 정보라는 것을 알 수 있다. 만약 회사를 홍보하려하는데 <p>태그 안에 회사 이름을 넣게되면 검색엔진이 약해지기 때문에 악영향을 끼칠 수 있다. 또한 작성의 편의만을 위해 모든 태그를 <div>로 작성하면 클래스명과 아이디를 각각 주어야하는데 코드가 더러워지고 협업 시 타인이 파악하기 힘들어지게 될 수 있는 것이다.
시멘틱 태그의 대표적 예시
<article>: 문서에서 독립된 영역<aside>: 사이드영역 또는 광고<footer>: 꼬리말<header>: 머리말<main>: 주요 컨텐츠 영역으로 한페이지에 한개만 사용<section>: 구역을 나누어 여러 컨텐츠 작성
｡˚⋆｡˚ ☁︎˚｡⋆｡˚☽˚｡⋆˚ ☁︎˚