Part01 웹 프로그램 언어의 기초_11

Naver BoostCourse Full-Stack Developer Course

Part 01 웹 프로그래밍 기초

10. HTML 구조 설계

※ Intro

- 웹 페이지를 만드는 것은 문서의 구조를 잡는 것과 같음.

- 제목, 단락 등이 있는 것과 같음.

- 웹 사이트의 문서구조를 만드는 것이 가장 먼저 할 일임.

※ 학습 목표

1. CSS 없이 먼저 HTML 구조를 설계할 수 있음

※ 핵심 개념

- HTML 구조화 설계

※ HTML 구조 설계

- 구조화 설계는 마치 문서를 쓰는 것과 같음.

- 현업에서는 Presentation 문서 형태의 기획서나 디자인 파일을 받아서 그것을 기반으로 HTML 개발 시작

- 즉 어떠한 화면을 보면서 그대로 구현하고, 그 화면을 보면서 구조를 분석해야함.

- 먼저 영역을 나눠서 상단/본문/네비게이션 이런 식으로 큰 부분부터 분리하고 그 뒤에 각 영역 안에 내용

  의 구조를 잡는 것이 일반적임.

- 각 영역 안의 내용 역시 여러가지 형태임. 목록을 나타내거나, 이미지를 나타내거나, 문단을 나타낼 수 

  있음. 이때마다 적절한 태그를 쓰면 됨.

- 그러면서 영역 안에 또 다른 영역이 있다면 점점 안으로 좁혀가면서 HTML tag를 사용하면서 완성해감.

  이때 CSS 코드를 같이 구현하지 않고 HTML로 먼저 문서의 구조를 잡아나가는 것이 개발 단계에서 유리

  그래야 전체 뼈대가 튼튼해질 수 있음.