한눈에 보는 정의
웹페이지의 내용과 구조를 표시하는 언어. 제목, 문단, 이미지, 링크가 무엇인지 브라우저에 알려 준다.
이런 말로 들어요
- 본문 제목은 HTML 제목 태그로 바꿔야 검색에 유리해요.
- HTML만 있고 스타일은 아직 안 입힌 상태입니다.
그림으로 보기
HTML은 내용과 구조, CSS는 모양, 자바스크립트는 클릭 같은 동작을 맡습니다.
하캄솔루션 자체 제작 설명도식자세히 알아보기
HTML은 집의 뼈대에 해당합니다. 무엇이 제목이고 어디가 본문인지 표시하고, 모양은 CSS가, 움직임은 자바스크립트가 맡습니다. 제목·목록·버튼을 뜻에 맞는 태그로 쓰면 검색엔진과 화면 낭독기도 내용을 더 잘 이해합니다.
실무 예시
예를 들어 굵게만 처리한 글자 대신 제목 태그(h2)로 소제목을 표시하면, 검색엔진과 시각장애인 사용자 모두 글 구조를 파악할 수 있습니다.
함께 살펴볼 점
화면에 보이는 모양만 맞추려고 모든 요소를 의미 없는 상자 태그로 만들면 접근성과 검색 이해도가 떨어집니다.
AI에게 이렇게 요청해 보세요
이 섹션 HTML을 시맨틱 태그(header, main, section, h1~h3, button)로 다시 짜 줘. 화면 모양은 바꾸지 말고 구조만 고쳐 줘.
코딩·작성 도구에 붙여 쓰기 전에 내 상황에 맞게 바꾸고, 결과는 직접 확인하세요.출처와 검토 정보
- HTML - Glossary | MDN 새 창
MDN 용어집에서 HTML이 웹페이지 구조를 기술하는 언어라는 정의를 확인했습니다.
자료 확인 - HTML: HyperText Markup Language | MDN 새 창
HTML·CSS·자바스크립트의 역할 분담을 확인했습니다.
자료 확인
내용 검토
최초 발행 · 내용 수정