웹페이지에 보이는 콘텐츠 중, 블로그 글·뉴스 기사·포럼 게시글처럼 독립적으로 배포 가능하고 재사용 가능한 콘텐츠는 <article> 태그로 감쌉니다.
이번 글에서는 Feedly를 통해 RSS피드를 구독하는 방법을 안내하고, 동시에 <article> 태그의 개념과 실용성을 함께 이해해 보겠습니다.
📘 RSS란 무엇인가요?
RSS로고
위와 같은 로고를 본 적이 있는 사람도, 본 적이 없는 사람도 있을 것입니다. 블로그를 즐겨 보던 시절, 매일 자주 가는 웹사이트를 일일이 방문하지 않아도, 새 글이 올라오면 자동으로 내 구독함에 들어오던 그 기능… 기억나시나요? 티스토리, 네이버 블로그, 언론사 홈페이지까지 왼쪽 아래 구석 어딘가에 늘 붙어 있던 그 주황색 아이콘. 바로 RSS입니다.
RSS가 등장하며 여러 플랫폼에 흩어져 있는 콘텐츠를 ‘찾아가는’ 것이 아니라 하나의 피드로 ‘받아보는’ 방식으로 소비하기 시작했습니다. 이 경험이 웹에서 콘텐츠를 하나의 독립된 단위(article)로 다루는 필요성을 강화시켰고, 바로 그 구조화의 연장선상에서 HTML5의 <article> 태그가 등장한 겁니다.
📌 정리
RSS (Really Simple Syndication)는 웹 콘텐츠의 업데이트 정보를 자동으로 수집하는 기술입니다.
RSS 피드는 구조화된 XML 데이터로 제공되며, 일반적으로 글 제목, 본문 요약, 링크, 작성일 등을 포함합니다.
웹페이지의 시맨틱 구조가 잘 정리되어 있다면, RSS 생성기나 리더기가 해당 글의 정보를 정확히 읽어낼 수 있습니다.
※ 이때 각 글이 <article>로 명확히 구분되어 있어야, RSS가 글 단위로 정확히 인식할 수 있습니다.
🤝 RSS는 어떻게 글을 찾아낼까?
RSS는 웹사이트의 각 포스트를 "콘텐츠 단위"로 추출해야 합니다. 이 콘텐츠 단위는 대부분 <article> 또는 <entry>와 같은 시맨틱 태그에 기반합니다.
▲ Feedly에 RSS 주소를 입력하면 해당 블로그의 피드를 구독할 수 있습니다.▲ Feedly는 RSS의 각 콘텐츠를 <article> 처럼 시각화하여 보여줍니다.
🤔 왜 지금 RSS를 배워야 할까?
RSS는 요즘 트렌드에서 한발 물러난 기술처럼 보일 수 있습니다. 하지만 <article> 태그를 왜 써야 하는지를 이해하려면, RSS처럼 "정보 단위를 구조화해서 배포"하던 기술의 원리를 아는 것이 매우 중요합니다.
HTML5에서 <article> 태그가 도입된 핵심 이유는, 블로그 글, 뉴스 기사, 포스트처럼 하나하나가 독립적으로 배포 가능한 콘텐츠 단위를 정의하기 위해서였습니다.
이와 정확히 일치하는 철학을 바탕으로 만들어진 것이 바로 RSS입니다. RSS에서는 각각의 글이 <item> 혹은 <entry>라는 단위로 정의되고, 제목, 링크, 요약 등이 함께 구조화되어 전달됩니다.
▲ RSS 피드는 각 글을 entry또는 item 단위로 표현하며, 이는 HTML의 article과 동일한 역할을 합니다. 위는 티스토리 블로그의 RSS주소에 접속하였을 때 보이는 XML형식의 피드입니다.
즉, RSS를 이해하면 <article>의 역할과 구조가 왜 필요한지를 실제 정보 유통 시스템에서 체감할 수 있습니다.
단순히 "지금 많이 쓰이는 기술이냐"를 따지는 것이 아니라, 웹 문서를 어떻게 구조화할 것인가라는 설계의 본질을 이해하는 데에 RSS는 여전히 유효한 학습 도구입니다.
그래서 이 글에서는 RSS를 소개하고 Feedly와 연결해 보는 과정을 통해, <article>의 존재 이유를 실감할 수 있도록 설계했습니다.
🧠 <article> 태그, 단순한 시맨틱 이상
이처럼 <article>은 단순히 "글 본문을 감싸는 태그"를 넘어, 콘텐츠의 단위를 정의하고 RSS와 같은 외부 시스템과 연결되는 중요한 인터페이스 역할을 합니다.
콘텐츠의 독립성과 배포 가능성
메타 정보 (<header>, <time>, <footer> 등)와의 연계
외부 서비스(FB Instant, AMP, RSS 등)에서의 활용
<html>
└── <body>
├── <header> ← 사이트 전체의 머리말
│ └── 로고, 네비게이션 등
│
├── <main> ← 주요 콘텐츠 영역
│ ├── <article> ← 독립적인 콘텐츠 블록
│ │ ├── <header> ← 기사나 글의 머리말 (제목, 작성일 등)
│ │ ├── <section> ← 본문 내용
│ │ └── <footer> ← 기사 관련 정보 (작성자, 태그 등)
│ │
│ ├── <article> ← 또 다른 콘텐츠 블록
│ │ └── ...
│ │
│ └── 기타 섹션 등 ← 예: <section>, <aside> 등
│
└── <footer> ← 사이트 전체의 바닥글
└── 저작권, 연락처, 링크 등
정리: <article>은 단순한 시맨틱 태그가 아니라, “이 정보는 독립적으로 배포 가능한 콘텐츠 단위인가?”라는 질문에 답하는 구조입니다. RSS가 구조화된 정보를 소비하는 방식이었다면, <article>은 그 구조를 HTML 안에서 명확히 표현한 것입니다.
🧵 마무리
시맨틱 태그는 단순히 HTML을 구분 짓는 도구가 아니라, 콘텐츠 구조화와 외부 시스템 연동을 위한 표준화된 약속입니다.
이번 부록 글에서는 RSS와 Feedly를 예로 들어 <article> 태그의 실질적인 쓰임을 소개했습니다.
댓글 영역