article element - by. UXKM
요약 설명
<article>요소는 문서, 페이지, 애플리케이션 등에서 독립적으로 구분되어 재사용 가능한 콘텐츠 단위를 나타내는 시맨틱 태그입니다.
블로그 글, 뉴스 기사, 포럼 게시글, 댓글 등과 같이 자체적으로 완결된 내용을 가진 콘텐츠에 적합하며, 외부로 공유하거나 따로 읽어도 의미가 전달되는 구조여야 합니다. 보통 제목(<h1>~<h6>)과 본문을 포함하며, 다른 시맨틱 요소(<section>,<aside>,<footer>등)와 함께 사용될 수 있습니다.
주요 역할 및 특징
-
독립적인 콘텐츠 그룹화
-
<article>은 문서 내에서 독립적으로 의미를 가지는 콘텐츠를 감싸는 데 사용됩니다. - 예를 들어, 블로그 글, 뉴스 기사, 제품 정보 등이 해당됩니다.
-
-
재사용 가능성
-
<article>내의 콘텐츠는 다른 문서나 환경에서도 독립적으로 사용할 수 있습니다. -
RSS 피드와 같은 외부 시스템에서도
<article>내용이 활용될 수 있습니다.
-
-
제목 포함 권장
<article>은 보통 제목(<h1 ~ h6>)과 함께 사용하여 독립적인 콘텐츠임을 명확히 표현합니다. -
다른 요소와의 관계
-
<section>은 문서의 주제를 그룹화하는 반면,<article>은 독립적으로 사용할 수 있는 콘텐츠에 사용됩니다. -
<article>은 중첩되어 사용될 수 있으며, 각<article>은 자기완결적인 콘텐츠를 의미합니다.
-
-
SEO 및 접근성
검색 엔진과 스크린 리더는
<article>을 통해 문서 내에서 중요한 콘텐츠를 식별할 수 있습니다.
CSS 기본 값
<article> 요소는 기본적으로 블록 레벨 요소입니다.
기본 문법
속성
<article> 요소는 고유 속성을 가지지 않으며,
글로벌 속성(class, id, style, aria-*, data-* 등)만 사용할 수 있습니다.