웹 표준

웹 표준

---

• 웹 표준이란 W3C(World Wide Web Consortium)에서 권고하는 ‘웹에서 표준적으로 사용되는 기술이나 규칙’입니다.
• 사용자가 어떠한 운영체제나 브라우저를 사용하더라도 웹페이지가 동일하게 보이고 정상적으로 작동할 수 있도록 하는 웹 페이지 제작 기법을 담고 있습니다
• 크롬, 에지, 사파리, 오페라, 파이어폭스 등 최신 웹 브라우저들은 모두 웹 표준을 지원합니다.
• 웹 표준에 따라 페이지를 작성하면 유지 보수에 용이하고, 웹 호환성을 확보하고, 검색 효율성이 증대되면서, 웹 접근성 향상이 향상된다.

 

Semantic HTML

---

• 시맨틱 HTML은 웹 문서의 구조와 의미를 명확하게 표현하기 위해 HTML 태그를 사용하는 것을 말합니다.
• 이를통해 해당 문서가 어떤 내용을 담고 있는지, 어떤 구조를 가지고 있는지를 코드로 나타내는 것이 가능해집니다.
• 또한, 시맨틱 HTML을 사용하면 검색 엔진이 HTML 코드를 보고 문서의 구조를 쉽게 파악하여, 검색 결과에 노출시키기 쉬워집니다.
• 웹 접근성 또한 높일 수 있는데, 대표적인 예로 시각 장애인 등의 장애를 가진 사용자들이 스크린 리더를 통해 콘텐츠를 더욱 쉽게 이해할 수 있도록 합니다.
• 추가적으로, 다수의 개발자와 협업할때 개발자 간 소통을 원활하게 할 수 있습니다. 
• 시맨틱 HTML의 대표적인 태그로는 header, nav, article, section, aside, footer 등이 있으며, 이러한 태그들을 적절하게 사용하여 웹 문서의 의미를 명확하게 전달할 수 있습니다.

 

Semantic HTML의 대표 태그 

---

시맨틱 HTML은 웹 문서의 구조와 의미를 명확하게 전달하기 위해 다양한 태그를 제공합니다. 그 중 대표적인 태그들은 다음과 같습니다.

• header: 웹 페이지 상단에 위치하며, 로고나 메뉴 등의 내용을 담습니다.
• nav: 웹 페이지에서 메뉴,목차 등을 담고 있는 요소입니다.
• article: 웹 페이지에서 독립적인 컨텐츠를 담는 요소입니다. 각각의 <article>을 구분하기 위한 수단이 필요하며, 보통 제목(<hgroup>)을 포함하는 방법을 사용합니다.
• section: 웹 페이지의 섹션을 나타내는 요소입니다.  딱히 적합한 의미의 요소가 없을 때 사용하며, 제목(<hgroup>)을 포함하는 경우가 많습니다.
• aside: 웹 페이지의 주요 콘텐츠와는 관련성이 적은 사이드바 등의 요소를 담습니다.
• footer: 웹 페이지 하단에 위치하며, 저작권 정보 등을 담습니다.
• hgroup:제목을 표시할 때 사용하는 요소로, <h1> ~ <h6> 요소가 <hgroup>입니다.