비디오: [HTML 과 CSS 를 이용하여 홈페이지만들기 코딩과정 특별강좌] 기초부터 배우기 2024
의미 론적으로 관련성있는 페이지를 만드는 것은 iPad가 등장하기 훨씬 전부터 웹에서 우수 사례 였지만 HTML5는 웹 페이지를 디자인 할 때 의미를 어떻게 사용하는지 일관성있게 만드십시오. 의미 적으로 관련있는 페이지를 만드는 아이디어는
의미 또는 의미 를 가진 "웹 데이터"를 상상 한 World Wide Web, Tim Berners-Lee의 발명가로부터 온 것입니다 >.
예를 들어, 페이지에서 가장 중요한 제목은 제목 1 또는
태그로 지정해야합니다. 마찬가지로 대부분의 웹 디자이너는 머리글과 바닥 글과 같은 이름을 가진 사이트의 주요 섹션에 대한 클래스 또는 ID 스타일을 정의하여 페이지의 역할과 중요성을 식별합니다.
HTML5는 일련의 새로운 의미 요소를 추가하여이 개념을 한 걸음 더 나아가게합니다. 클래스 또는 ID 스타일을 만들어 태그에 적용하는 대신 HTML5에서와 같은 이름의 태그를 사용하면됩니다.
따라서
와 같은 ID 스타일을 사용하는 대신 간단하게 사용할 수 있습니다. 그러나 태그와 매우 비슷하지만 이름에 해당하는 스타일 규칙 집합을 정의하지 않는 한 새 태그 는 아무 것도 수행하지 않습니다. 이런 식으로 생각하십시오: 웹 페이지를 볼 때 일반적으로 페이지의 어느 부분이 헤더 (링크가있는 탐색 영역이 있음)와 바닥 글 (저작권 및 그 외 세부 사항). 그러나 웹 페이지를 해석 할 필요가있는 봇, 독자 및 기타 프로그램 중 어느 누구도 디자인을 "볼"수 없으므로 의미를 사용하는 것이 중요합니다.
페이지의 의미 구조는 내용의 스타일 및 위치와는 독립적 일 수 있으므로 인식 가능한 섹션이 논리적 구조를 구성하기 때문에 의미가있는 페이지를 만들 수 있습니다. 페이지를 볼 수있는 방문자의 경우 머리글이나 바닥 글과 같은 섹션의 스타일을 지정하여 원하는 방식으로 브라우저에 표시 할 수 있습니다.