HTML 문서의 뼈대를 이루는 구조 태그와 시맨틱 태그들을 정리한 카테고리입니다. 각 태그의 쓰임새와 예제를 통해 구조적이고 의미 있는 마크업을 익혀보세요.
스타일을 페이지 안에 직접 쓴다고? <style> 태그로 내부 CSS 다루기 1. <style> 태그가 뭐예요? <style> 태그는 HTML 문서 안에 CSS를 직접 작성할 수 있는 태그입니다. 보통 <head> 영역에 위치해서, 브라우저가 문서를 불러올 때 함께 스타일 정보를 읽어들이죠. 즉, HTML과 CSS가 한 파일 안에서 만나는 방식이에요. 처음 CSS를 배울 때는 한눈에 구조와 스타일을 확인하기 좋아서 많이 … 더 읽기
웹페이지를 외부와 연결해주는 열쇠, <link> 태그 완전정복 1. <link> 태그가 뭐예요? HTML 문서만으로는 디자인도 없고, 아이콘도 없고, 웹사이트가 딱딱하게 느껴질 수 있어요. 이럴 때 <link> 태그를 사용하면 외부의 리소스—예를 들어 CSS, 파비콘(favicon), 글꼴 등—를 불러올 수 있어요. 이 태그는 <head> 내부에 위치하며, 웹페이지가 로드될 때 필요한 외부 리소스를 브라우저에게 알려주는 역할을 해요. 즉, 스타일과 정체성을 … 더 읽기
HTML에서 꼭 써야 할 <meta> 태그, 왜 중요할까? 1. 보이지 않아도 없어선 안 될 태그 브라우저 창을 열었을 때 가장 먼저 만나는 건 눈에 보이는 콘텐츠가 아닙니다. 페이지 상단의 <head> 영역, 그 안에 숨어 있는 <meta> 태그가 사이트의 기본 성격을 정해요. 이 태그들은 ‘웹사이트 설명서’ 같은 존재로, 인코딩 방식, 검색엔진 노출, 모바일 화면 대응까지 조용히 … 더 읽기
HTML에서 제목은 어디에 쓰는 걸까? <title> vs <h1> 1. 겉과 속이 다른 두 제목 웹페이지를 처음 열었을 때, 브라우저 탭에 보이는 문구와 화면 안에 있는 큰 글자가 다르다는 걸 느껴본 적 있나요? 사실 이 둘은 모두 ‘제목’이라는 역할을 하지만 서로 전혀 다른 영역에서 활동합니다. <title>은 무대 뒤에서 조명을 조절하는 조명감독 같은 존재고, <h1>은 무대 위에서 … 더 읽기
HTML 기초 문법 10가지 – 헷갈리는 것만 쏙 골라 정리 HTML 태그는 알겠는데, 왜 화면에 안 나올까요? HTML 태그를 배웠는데도 원하는 대로 화면에 안 나오는 경험, 누구나 해봤을 거예요. 그건 대부분 기초 문법에서 놓치는 부분이 있기 때문입니다. 이 글에서는 HTML을 처음 쓰는 사람도 태그를 정확하게 이해하고, 구조적인 문서를 만들 수 있도록 꼭 필요한 문법 10가지를 … 더 읽기
HTML 문서 구조란? HTML 태그는 아는데, 어디에 써야 할지 막막하다면 처음 HTML을 배우면 태그 하나하나는 익히기 쉬운데, 막상 페이지를 만들려 하면 뭐부터 써야 할지 막막해진다. 이럴 땐 문서 구조가 머릿속에 없기 때문이다. 건축으로 치면 설계도 없이 벽돌부터 쌓으려는 것과 비슷하다. 이 글에서는 HTML 문서의 기본 구조를 실제 웹사이트처럼 구성해보며, 태그들이 어디에 어떻게 들어가는지를 입체적으로 다뤄본다. … 더 읽기