코딩 2

AI를 이용한 티스토리 웹디자인 공부 - [DAY 2] DOM 트리와 시맨틱 태그

Day 2 — DOM Tree와 시맨틱 태그 (개념 재정립)오늘은 HTML을 '쓰는' 연습보다, 구조를 '읽는 눈'을 키우는 날입니다👉 일단 이것만• HTML = 텍스트 파일 그 자체• DOM = 브라우저가 그 텍스트를 읽고 만들어낸 구조체• CSS = 그 구조 안에서 꾸밀 대상을 찾는 방법📌 조금 더 풀면 이렇습니다:HTML은 결국 텍스트 파일입니다.브라우저는 이걸 받아서 화면에 그리기 위해 내부적으로 '구조'로 변환합니다. 이게 DOM입니다.CSS가 실제로 적용되는 대상은 원본 HTML 파일이 아니라, 브라우저가 만들어낸 이 구조(DOM)입니다.👉 어디에 CSS를 넣을지 찾으려면, 이 "구조(DOM)"를 읽을 수 있어야 합니다.1. DOM Tree = 단순 구조가 아니다많이들 헷갈리는 부분입니다..

코딩/웹디자인 2026.04.20

AI를 이용한 티스토리 웹디자인 공부 - [DAY 1] HTML 가이드

Tistory Skin GuideDay 1 — 웹 작동 원리 (개념 리셋)1. URL을 입력하면 벌어지는 일1사용자: 주소창에 URL 입력2브라우저: "서버가 어디 있지?" → DNS 조회→ 도메인 이름을 실제 서버 주소(IP)로 변환하는 과정입니다.3요청: 브라우저 → 서버 "페이지 파일 줘" (**HTTP 요청**)→ 서버에 "GET /index.html" 같은 메시지를 보내 콘텐츠를 요청합니다.4응답: 서버 → 브라우저 HTML 전달 (**HTTP 응답**)5렌더링: 브라우저가 HTML 해석 → 화면 출력💡 왜 배울까요? 이 과정을 이해해야 웹이 단순한 화면이 아니라 '요청과 응답'으로 이루어진 구조라는 것을 알 수 있기 때문입니다.🎯 핵심: 브라우저가 받는 것은 결국 텍스트 파일입니다.→ 이 ..

코딩/웹디자인 2026.04.16