Day 74 - 주간 복습 + 퀴즈

Day 74 - 주간 복습 + 퀴즈

🎯 학습 목표

• Week 12 전체 내용 종합 복습하기
• 주석과 특수문자 완벽 정리
• 종합 퀴즈로 이해도 점검하기
• 실전 코딩 문제 풀어보기
• 다음 주 학습 내용 미리보기

📅 Week 12 학습 내용 돌아보기

Day 68

주석 달기 방법
<!-- --> 문법

Day 69

주석의 활용
코드 비활성화, TODO

Day 70

특수문자 기초
&nbsp;, &lt;, &gt;

Day 71

저작권/상표
&copy;, &reg;, &trade;

Day 72

한글 특수문자
&amp;, &middot;, &bull;

Day 73

실습 프로젝트
종합 활용

📊 핵심 개념 총정리

1. HTML 주석

💡 주석 문법과 활용

항목	내용
문법	<!-- 주석 내용 -->
특징	화면에 안 보임, 소스에서는 보임
활용 1	코드 설명
활용 2	섹션 구분
활용 3	코드 비활성화
활용 4	TODO/FIXME 메모
주의	비밀정보 금지!

2. HTML 엔티티 총정리

💡 이번 주에 배운 모든 엔티티

엔티티	결과	의미	용도
 	(공백)	Non-Breaking Space	공백 여러 개
&lt;	<	Less Than	작다 기호
&gt;	>	Greater Than	크다 기호
&copy;	©	Copyright	저작권
&reg;	®	Registered	등록상표
&trade;	™	Trademark	상표
&amp;	&	Ampersand	앰퍼샌드
&quot;	"	Quotation	큰따옴표
&middot;	·	Middle Dot	가운데 점
&bull;	•	Bullet	불릿 기호

3. 핵심 공식

주석 = <!-- 내용 -->

엔티티 = &이름;

필수 엔티티:
&nbsp;  → 공백
&lt;    → <
&gt;    → >
&amp;   → &

저작권/상표:
&copy;  → ©
&reg;   → ®
&trade; → ™

구분 기호:
&middot; → ·
&bull;   → •

⚠️ 자주 하는 실수 정리

❌ 이렇게 하면 안 돼요!

실수	올바른 방법
&nbsp (세미콜론 없음)	  (세미콜론 필수)
<!- 하이픈 하나	<!-- 하이픈 두 개
주석에 비밀번호	비밀정보 절대 금지!
<p> 그대로 표시	&lt;p&gt; 사용
등록 안 된 상표에 ®	™ 사용 (등록 전)

🧠 종합 퀴즈 (15문제)

📚 Part 1: 주석 (5문제)

1. HTML 주석의 올바른 문법은?
   ① // 주석
   ② /* 주석 */
   ③ <!-- 주석 -->
   ④ # 주석
2. 주석 시작 부분의 올바른 형태는?
   ① <!-
   ② <--
   ③ <!--
   ④ <!
3. 주석의 특징으로 올바른 것은?
   ① 화면에 작은 글씨로 표시된다
   ② 화면에 안 보이고 소스에만 있다
   ③ 브라우저가 실행한다
   ④ 주석 안에 주석을 넣을 수 있다
4. TODO 주석의 의미는?
   ① 완료된 작업
   ② 삭제할 코드
   ③ 나중에 할 일
   ④ 테스트 코드
5. 주석에 절대 넣으면 안 되는 것은?
   ① 코드 설명
   ② 할 일 메모
   ③ 비밀번호
   ④ 섹션 구분

📚 Part 2: 기본 엔티티 (5문제)

6. &nbsp;의 용도는?
   ① 줄바꿈
   ② 공백 여러 개
   ③ 탭
   ④ 들여쓰기
7. &lt;가 표시하는 기호는?
   ① >
   ② &
   ③ <
   ④ =
8. <p>를 화면에 보여주려면?
   ① <p>
   ② &lt;p&gt;
   ③ [p]
   ④ /p/
9. &가 HTML에서 특별한 이유는?
   ① 태그 시작 기호
   ② 엔티티 시작 기호
   ③ 주석 시작 기호
   ④ 속성 시작 기호
10. 엔티티 끝에 반드시 필요한 것은?
    ① 콜론 (:)
    ② 마침표 (.)
    ③ 세미콜론 (;)
    ④ 쉼표 (,)

📚 Part 3: 저작권/상표 및 한글 (5문제)

11. © 기호를 표시하는 엔티티는?
    ① &copyright;
    ② &copy;
    ③ &c;
    ④ &right;
12. ®와 ™의 차이점은?
    ① 같은 의미
    ② ®가 더 큰 기호
    ③ ®는 등록상표, ™는 일반상표
    ④ ™가 법적 보호가 강함
13. 홍길동·김철수를 작성하려면?
    ① 홍길동-김철수
    ② 홍길동&middot;김철수
    ③ 홍길동&dot;김철수
    ④ 홍길동.김철수
14. &middot;와 &bull;의 차이는?
    ① 같은 크기
    ② middot이 더 크다
    ③ bull이 더 크다
    ④ 위치가 다르다
15. "안녕"을 안전하게 표시하려면?
    ① "안녕"
    ② &quot;안녕&quot;
    ③ '안녕'
    ④ [안녕]

✅ 정답

Part 1: 1-③, 2-③, 3-②, 4-③, 5-③

Part 2: 6-②, 7-③, 8-②, 9-②, 10-③

Part 3: 11-②, 12-③, 13-②, 14-③, 15-②

🏆 점수 확인

13-15개: 완벽해요! 주석과 특수문자 마스터!

10-12개: 잘했어요! 조금만 더 복습하면 완벽!

7-9개: 괜찮아요! 헷갈리는 부분 다시 확인!

6개 이하: Day 68-73 내용을 다시 복습해보세요!

💡 실전 코딩 문제

✏️ 코딩 문제 1

다음 정보로 웹사이트 푸터를 작성하세요:

• 회사명: ABC Company (상표)
• 저작권: 2026년
• 메뉴: 홈, 소개, 연락처 (불릿으로 구분)

정답:

<footer>
    <p>홈 &bull; 소개 &bull; 연락처</p>
    <p>&copy; 2026 ABC Company&trade;. All rights reserved.</p>
</footer>

✏️ 코딩 문제 2

다음 문장을 화면에 그대로 보이게 작성하세요:

"<strong> 태그는 텍스트를 굵게 만듭니다."

정답:

<p>&lt;strong&gt; 태그는 텍스트를 굵게 만듭니다.</p>

✏️ 코딩 문제 3

다음 정보를 포함한 회사 정보를 작성하세요:

• 대표: 홍길동, 김철수 (가운데 점으로 구분)
• 설립: 2020년 1월 15일 (가운데 점으로 구분)

정답:

<p>대표: 홍길동&middot;김철수</p>
<p>설립: 2020&middot;01&middot;15</p>

📝 Week 12 요약

✅ 이번 주 핵심 학습 내용

• 주석: <!-- --> 문법, 코드 비활성화, TODO/FIXME
• &nbsp;: 공백 여러 개 표시
• &lt;, &gt;: 꺾쇠괄호, 태그 표시
• &copy;, &reg;, &trade;: 저작권, 등록상표, 상표
• &amp;: 앰퍼샌드 (&)
• &middot;, &bull;: 가운데 점, 불릿

🎯 실전 활용

• 회사 소개 페이지 제작
• HTML 태그 설명 문서
• 푸터 저작권 표시

🔮 다음 주 예고: Week 13

📅 Week 13: CSS 입문

Day	주제
Day 75	CSS란 무엇인가요?
Day 76	인라인 스타일
Day 77	내부 스타일시트
Day 78	외부 스타일시트
Day 79	3가지 방법 비교
Day 80	실습 - CSS 적용해보기
Day 81	주간 복습 + 퀴즈

미리보기: HTML에 스타일을 입히는 CSS를 배웁니다! 색상, 크기, 레이아웃 등을 꾸밀 수 있어요!

📚 참고 자료

🔗 복습 자료

• Day 68-73: 이번 주 학습 파일 다시 읽어보기
• MDN Web Docs: HTML 엔티티 레퍼런스
• 실습: 더 많은 엔티티 찾아보기

🎓 Week 12 완료!

주석과 특수문자 마스터를 축하합니다! 🎉

이제 HTML 문서에서 어떤 특수문자든 자유롭게 표현할 수 있어요!

다음 주에는 CSS를 시작합니다! 드디어 예쁘게 꾸미기 시작!

---

Day 74 - 주간 복습 + 퀴즈 | EPUB 제작 365일 마스터 과정