mirabo01 님의 블로그

  • 홈
  • 태그
  • 방명록
  • 소개
  • 개인정보처리방침
  • 문의

웹표준 1

3. 🏗️ 시맨틱 태그와 구조화된 HTML 작성법 — 의미 있는 웹페이지 만들기

HTML을 ‘잘’ 쓴다는 건 단순히 화면에 보이는 걸 만드는 게 아니다.검색엔진, 보조기기, 개발자, 브라우저가 모두 이해할 수 있는 구조로 작성해야 한다.이번 글에서는 HTML5의 핵심 개념인 시맨틱(Semantic) 태그를 중심으로,의미 기반의 문서 설계 방법을 완벽히 정리해본다.💡 1. 시맨틱 태그란 무엇인가?“시맨틱(semantic)”이란 ‘의미 있는’이라는 뜻이다.HTML5 이전에는 모든 영역이 와 으로만 구분됐다.하지만 이렇게 작성된 페이지는 컴퓨터가 내용을 이해하지 못한다.예를 들어 👇 이건 브라우저에게 “여기가 무엇을 의미하는지” 아무런 정보를 주지 않는다.반면에 👇 이 코드는 구조적 의미를 전달한다.검색엔진, 스크린리더, 크롤러가“이건 페이지의 상단 / 본문 / 하단”임을..

frontend/html 2025.11.05
이전
1
다음
더보기
프로필사진

mirabo01 님의 블로그

코딩과 개발 지식을 쉽게 정리하고 공유하는 블로그입니다.

  • 분류 전체보기 (240)
    • git (12)
    • 네트워크 (2)
    • frontend (123)
      • html (7)
      • css (11)
      • javascript (58)
      • react (44)
    • backend (26)
    • infra (22)
    • docker (9)
    • react-native (16)
    • AI (19)
    • 기타 (10)

Tag

Kubernetes, Go실무, AI개발, RN입문, 쿠버네티스, Go, 리소스관리, GoAPI, Golang, AI프로그래밍, 운영, RN실무, Go기초, Go동시성, nethttp, ReactNative, 인프라, OpenClaw, ai코딩, 컨테이너,

최근글과 인기글

  • 최근글
  • 인기글

최근댓글

공지사항

  • 블로그 안내

페이스북 트위터 플러그인

  • Facebook
  • Twitter

Archives

Calendar

«   2026/04   »
일 월 화 수 목 금 토
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30

방문자수Total

  • Today :
  • Yesterday :

Copyright © AXZ Corp. All rights reserved.

티스토리툴바