오늘은 시멘틱 마크업, 논리적인 순서 마크업에 대해 알아보겠습니다. ✔️시멘틱 마크업 먼저 시멘틱 (semantic)의 사전적 뜻은 '의미론적인' 정도로 해석합니다. 시멘틱 마크업은 '의미론적인 HTML 태그 문서 작성'을 뜻합니다. 즉, 의미를 잘 전달할 수 있도록 HTML 태그 문서를 작성하는 것을 말합니다. 이미지 출처 그렇다면 시멘틱 마크업을 사용하는 이유는 무엇일까요? HTML 문서들은 보통 시각적인 방법으로 사용자들에게 정보를 전달하지만, 모든 사람들이 정보를 동일하게 받아들일 수 있는 환경이 아닐 수도 있습니다. 예를 들어 시각장애인의 경우 HTML문서의 콘텐츠 정보를 음성으로 전달해 주어야 하는데 이런 경우 전달하려는 태그의 의미가 적절해야 합니다. 또, 시멘틱 마크업은 웹을 개발할 때 생..

오늘은 HTML의 가장 기본적인 블록 구조와, 인라인 구조에 대해 알아보겠습니다. 웹사이트에 필수적으로 구성되어야 하는 구조이므로 잘 알아봐야겠죠? 이미지 출처 블록 레벨 요소(Block-level Element) 블록 요소는 쉽게 하나의 박스라고 생각하면 됩니다. 블록 레벨 요소는 마크업을 할 때 줄이 바뀌는 특성을 가지고 있습니다. 블록 레벨 요소는 텍스트와 인라인 요소를 자식 요소로 포함할 수 있습니다. 블록 레벨 요소 중에는 블록 레벨 요소를 자식 요소로 포함할 수 있는 요소와 포함할 수 없는 요소가 있습니다. margine과 padding을 줄 수 있습니다. 블록 구조 예제 블록 구조 하나의 박스 형태 줄 바꿈이 생김 인라인 요소(Inline Element) 인라인 요소는 텍스트라고 생각하면 됩..