웹 개발 여정 2주차 요약

카테고리

프로그래밍/소프트웨어 개발

서브카테고리

웹 개발

대상자

초보 웹 개발자 및 프론트엔드 학습자

난이도: 기초 수준 (HTML/CSS 기초 문법 및 프로젝트 구조 이해)

핵심 요약

• HTML 태그(, alt 속성)와 CSS 선택자(tag, class, ID)를 활용한 웹 페이지 구조화
• 절대/상대 경로 이해 및 파일/폴더 구조 정리로 프로젝트 확장성 향상
• HEX, RGB, HSL 색상 시스템을 활용한 시각적 계층 구조 설계

섹션별 세부 요약

1. HTML 기초 학습

• 태그와 alt 속성을 통해 이미지 삽입 및 접근성/SEO 향상
• 웹 기반 생일 초대장 프로젝트를 통해 레이아웃 및 미디어 임베딩 실습
• 반응형 구조와 파일 구조 정리(이미지/스타일시트 연결)

1. CSS 적용 및 디자인

• 외부 CSS 파일 적용(external CSS) 및 선택자(tag, class, ID) 활용
• HEX, RGB, HSL 색상 시스템을 통한 일관된 색상 계층 설계
• 시맨틱 HTML을 통한 SEO 및 접근성 강화

1. 프로젝트 구축 및 핵심 인사이트

• 포트폴리오 프로젝트(HTML만 사용)로 기본 구조 및 태그 사용법 정리
• 파일 경로 이해 및 폴더 구조 정리로 프로젝트 확장성 개선
• 일일 30분의 꾸준한 실습이 기술 습득에 효과적임 강조

결론

• HTML/CSS 기초 문법과 파일 구조 정리는 웹 개발의 핵심 기초
• 시맨틱 HTML과 색상 시스템(HSL/RGB) 활용은 UI/UX 품질 향상에 기여
• 개방형 프로젝트 공유(GitHub, LinkedIn)를 통해 실무 적용 및 피드백 확보
• 일관성과 꾸준한 실습이 기술 습득의 핵심이며, 실전 프로젝트를 통해 경험 쌓기 권장