Day 7 - 주간 복습 + 퀴즈

Day 7: Week 1 주간 복습 + 퀴즈

📖 오늘 배울 내용

축하합니다! 🎉 벌써 Week 1이 끝났어요! 오늘은 이번 주에 배운 모든 내용을 복습하고, 재미있는 퀴즈로 실력을 확인하는 시간이에요!

💡 Week 1 돌아보기

• Day 1: HTML과 태그의 기본 개념
• Day 2: h1 태그 - 가장 큰 제목
• Day 3: h2, h3 태그 - 중간 크기 제목들
• Day 4: h4, h5, h6 태그 - 작은 크기 제목들
• Day 5: 복습 - 제목 태그 완전 정복
• Day 6: 실습 - 책 목차 만들기

정말 많이 배웠죠? 자랑스러워요! 🌟

---

1. Week 1 핵심 요약 📚

📌 HTML 기본 개념

개념	설명
HTML	웹페이지를 만드는 언어 (HyperText Markup Language)
태그	웹브라우저에게 지시하는 명령어 (<태그명>내용</태그명>)
여는 태그	<h1> 처럼 시작하는 태그
닫는 태그	</h1> 처럼 끝나는 태그 (슬래시 / 있음)

📌 제목 태그 완전 정리

태그	크기	용도	사용 횟수	예시
<h1>	가장 큼	페이지 제목	1번만!	책 제목
<h2>	큼	주요 챕터	여러 번	제1부, 제2부
<h3>	중간	소제목	여러 번	1장, 2장
<h4>	작음	세부 제목	여러 번	1-1절, 1-2절
<h5>	더 작음	상세 분류	여러 번	세부 항목
<h6>	가장 작음	최소 단위	여러 번	상세 설명

📌 반드시 기억할 규칙 5가지

1. h1은 한 페이지에 딱 한 번만! ⭐
2. 순서대로 사용하기! (h1 → h2 → h3 → h4 → h5 → h6)
3. 순서 건너뛰지 않기! (h2 다음 바로 h5 안 돼요)
4. 닫는 태그 꼭 쓰기! (<h1>제목</h1>)
5. 의미 있게 사용하기! (진짜 제목일 때만)

---

2. 종합 퀴즈 - 실력 테스트 🧠

이제 그동안 배운 내용을 퀴즈로 확인해볼까요? 총 10문제예요!

📝 퀴즈 1. HTML의 의미는?

정답 보기 👆

정답: HyperText Markup Language
설명: HTML은 웹페이지를 만들기 위한 마크업 언어예요. Hyper(초월한) + Text(텍스트) + Markup(표시) + Language(언어)의 약자랍니다!

📝 퀴즈 2. 태그의 구조는?

다음 중 올바른 태그 구조는?

A) <h1>제목<h1>
B) <h1>제목</h1>
C) h1>제목</h1>
D) <h1 제목 /h1>

정답 보기 👆

정답: B) <h1>제목</h1>
설명: 태그는 여는 태그 <태그명>과 닫는 태그 </태그명>으로 이루어져요. 닫는 태그에는 슬래시(/)가 있어야 해요!

📝 퀴즈 3. 제목 태그는 몇 개?

정답 보기 👆

정답: 6개 (h1, h2, h3, h4, h5, h6)
설명: HTML에는 h1부터 h6까지 총 6개의 제목 태그가 있어요. Heading(제목)의 약자 h에 1부터 6까지 숫자를 붙여서 사용해요!

📝 퀴즈 4. 가장 큰 제목 태그는?

A) h6
B) h3
C) h1
D) 크기는 모두 같다

정답 보기 👆

정답: C) h1
설명: h1이 가장 크고, 숫자가 커질수록 제목이 작아져요. h1 > h2 > h3 > h4 > h5 > h6 순서로 작아진답니다!

📝 퀴즈 5. h1 태그 사용 횟수는?

정답 보기 👆

정답: 한 페이지에 1번만 사용 가능
설명: h1은 페이지의 가장 중요한 제목이에요. 책 표지가 하나만 있듯이, h1도 한 페이지에 딱 한 번만 사용해야 해요! h2~h6는 여러 번 사용 가능하답니다.

📝 퀴즈 6. 올바른 태그 순서는?

A) <h1> → <h5> → <h2>
B) <h1> → <h2> → <h3>
C) <h3> → <h1> → <h2>
D) <h6> → <h5> → <h4>

정답 보기 👆

정답: B) <h1> → <h2> → <h3>
설명: 제목 태그는 h1부터 시작해서 h2, h3, h4, h5, h6 순서대로 사용해야 해요. 계단을 한 칸씩 내려가듯이 순서를 지켜야 합니다!

📝 퀴즈 7. 다음 코드의 문제점은?

<h1>우리 반 소개</h1>
<h2>남학생</h2>
<h5>김철수</h5>

정답 보기 👆

정답: h2 다음에 바로 h5를 사용했어요 (h3, h4를 건너뛰었어요)
설명: 제목 태그는 순서를 건너뛰면 안 돼요. h2 다음에는 h3이 와야 하고, 그 다음 h4, 그 다음 h5가 와야 해요!

올바른 코드:
<h1>우리 반 소개</h1>
<h2>남학생</h2>
<h3>김철수</h3>

📝 퀴즈 8. 책 목차를 만들 때, 책 제목에 사용할 태그는?

A) h6
B) h3
C) h2
D) h1

정답 보기 👆

정답: D) h1
설명: 책 제목은 페이지에서 가장 중요한 제목이므로 h1을 사용해요. 그리고 h1은 한 페이지에 한 번만 사용하니까 책 제목에 딱 맞아요!

📝 퀴즈 9. 다음 중 올바른 코드는?

A) <h1>제목</h1>
   <h1>또 다른 제목</h1>

B) <h1>제목</h1>
   <h2>소제목</h2>

C) <h2>제목</h2>
   <h1>더 큰 제목</h1>

D) <h1>제목

정답 보기 👆

정답: B) <h1>제목</h1> <h2>소제목</h2>
설명:
A는 h1을 두 번 사용해서 틀렸어요 (h1은 한 번만!)
B가 정답! h1 다음에 h2가 순서대로 왔어요
C는 h1이 먼저 와야 하는데 h2가 먼저 와서 틀렸어요
D는 닫는 태그가 없어서 틀렸어요

📝 퀴즈 10. 제목 태그 사용의 올바른 목적은?

A) 글자를 크게 보이게 하려고
B) 의미 있는 제목을 표시하려고
C) 페이지를 예쁘게 꾸미려고
D) 색깔을 바꾸려고

정답 보기 👆

정답: B) 의미 있는 제목을 표시하려고
설명: 제목 태그는 단순히 크게 보이게 하려고 쓰는 게 아니에요. 진짜 제목이 있을 때, 의미 있는 제목을 표시할 때 사용해야 해요. 크기나 색깔은 나중에 CSS로 바꿀 수 있어요!

---

3. 실전 종합 예제 - 완벽한 웹페이지 🎨

이제 배운 모든 것을 활용해서 완벽한 웹페이지를 만들어볼게요!

예제: 우리 학교 소개 페이지

<h1>행복초등학교에 오신 것을 환영합니다</h1>

<h2>학교 소개</h2>

<h3>학교 연혁</h3>
<h4>설립 역사</h4>
<h5>개교</h5>
<h6>1985년 3월 1일</h6>
<h5>기념일</h5>
<h6>매년 3월 1일 개교기념일</h6>

<h3>학교 시설</h3>
<h4>교육 시설</h4>
<h5>일반 교실</h5>
<h6>총 24개 교실</h6>
<h5>특별 교실</h5>
<h6>과학실, 음악실, 미술실, 컴퓨터실</h6>

<h4>편의 시설</h4>
<h5>도서관</h5>
<h6>장서 10,000권 보유</h6>
<h5>체육관</h5>
<h6>농구장, 배구장 겸용</h6>

<h2>학교생활</h2>

<h3>학급 편성</h3>
<h4>1학년</h4>
<h5>1학년 1반</h5>
<h6>담임: 김선생님, 학생 수: 25명</h6>
<h5>1학년 2반</h5>
<h6>담임: 이선생님, 학생 수: 24명</h6>

<h3>특별 활동</h3>
<h4>운동부</h4>
<h5>축구부</h5>
<h6>매주 화, 목요일 연습</h6>
<h5>농구부</h5>
<h6>매주 월, 수, 금요일 연습</h6>

<h4>예체능부</h4>
<h5>합창부</h5>
<h6>매주 수요일 음악실</h6>
<h5>미술부</h5>
<h6>매주 금요일 미술실</h6>

💡 이 예제의 좋은 점

• ✅ h1은 딱 한 번만 사용 (학교 이름)
• ✅ 제목 태그를 순서대로 사용
• ✅ 계층 구조가 명확함
• ✅ 같은 수준은 같은 태그 사용
• ✅ 모든 태그를 올바르게 닫음

---

4. Week 1 성취도 자가 진단 📊

다음 항목들을 체크하면서 여러분의 실력을 확인해보세요!

✅ 지식 체크리스트

HTML이 무엇인지 설명할 수 있다

태그의 구조를 이해하고 설명할 수 있다

h1부터 h6까지 모든 제목 태그를 안다

제목 태그의 크기 순서를 안다 (h1이 가장 큼)

h1은 한 페이지에 한 번만 쓴다는 것을 안다

제목 태그를 순서대로 사용할 수 있다

여는 태그와 닫는 태그를 올바르게 쓸 수 있다

책 목차 같은 계층 구조를 만들 수 있다

제목 태그 사용의 자주 하는 실수를 알고 피할 수 있다

혼자서 간단한 웹페이지를 만들 수 있다

📊 결과 확인:
10개 모두 체크 → 완벽해요! 🌟 Week 2로 고고!
7-9개 체크 → 아주 잘했어요! 😊 조금만 더 복습!
4-6개 체크 → 괜찮아요! 💪 Day 1-6 다시 보기!
0-3개 체크 → 천천히 다시 시작해요! 📚 서두르지 마세요!

---

5. Week 2 미리보기 👀

📚 다음 주에 배울 내용

Week 2: 문단의 기초 (Day 8-14)

• Day 8: 문단 태그 p 배우기
• Day 9: 줄바꿈 br 태그
• Day 10: p와 br의 차이점
• Day 11: 수평선 hr 태그
• Day 12: 복습 - 문단 나누기 연습
• Day 13: 실습 - 짧은 일기 쓰기
• Day 14: 주간 복습 + 퀴즈

이제 문장과 문단을 만드는 법을 배워요! 📝

---

🎯 Week 1 마무리 정리

🎉 여러분, 정말 축하합니다!

일주일 동안 열심히 공부해서 HTML의 가장 기초가 되는 제목 태그를 완벽하게 마스터했어요!

지금까지 배운 것:

• ✅ HTML과 태그의 개념
• ✅ h1~h6 제목 태그 6개 전부
• ✅ 제목 태그 사용 규칙 5가지
• ✅ 계층 구조 만들기
• ✅ 실전 책 목차 만들기

앞으로 할 것:

• 📝 문단 만들기 (p, br 태그)
• 📏 수평선 그리기 (hr 태그)
• ✍️ 텍스트 꾸미기
• 🎨 더 멋진 웹페이지 만들기

Week 1을 완료한 여러분, 정말 대단해요! 자신감을 가지고 Week 2로 출발! 🚀

---

📚 Day 8: 문단 태그 p 배우기

다음편부터는 Week 2가 시작돼요!
문단을 만드는 <p> 태그를 배우면서
진짜 문장이 있는 웹페이지를 만들어봐요! 📝✨

---

📝 Week 1 완료 축하 메시지

"처음 시작이 반이라고 했죠?
여러분은 이미 HTML 마스터의 길에 첫 발을 내디뎠어요!
Week 1 완주, 정말 자랑스럽습니다! 🎉🌟💪"

✅ Week 1 최종 체크리스트

Day 1-6까지 모든 내용을 이해했나요?

퀴즈 10문제 중 7문제 이상 맞혔나요?

직접 코드를 작성해봤나요?

자주 하는 실수를 이해하고 피할 수 있나요?

Week 2를 배울 준비가 되었나요?

모두 체크했다면 Week 1 완전 정복! 🎊
이제 Week 2로 Go Go! 🚀