프론트엔드, 백엔드 개발자를 위한 HTML, CSS 강의 06강 - Markup 이란?의 일정은 언제인가요?

프론트엔드, 백엔드 개발자를 위한 HTML, CSS 강의 06강 - Markup 이란?은(는) 2026-04-02부터 2026-04-02까지 진행됩니다.

프론트엔드, 백엔드 개발자를 위한 HTML, CSS 강의 06강 - Markup 이란?

태그: 기타 html강의 css강의 웹개발
시작일: 2026-04-02
종료일: 2026-04-02
수정일: 2026-04-01

https://www.youtube.com/watch?v=Nmw1u2VeUsg

1. 이건 꼭 알아야 한다[^1]

[? 질문] 웹문서(HTML)를 만든다는 말에서 ‘마크업(markup)’은 정확히 무엇을 뜻하는가[^2]
[= 답] 문서의 순수 텍스트(콘텐츠) 중 특정 범위를 “이것은 하이퍼텍스트다/제목이다/목록이다/강조다”처럼 특별한 의미로 구별해 브라우저가 처리할 수 있게 표시(표식)하는 행위/방법이 마크업이다.[^6]

[? 질문] 왜 단순히 색을 칠하거나(사람이 보기 위한 표시) 다른 기호를 붙이는 방식이 아니라, HTML처럼 ‘태그’로 감싸는 방식을 쓰는가[^7]
[= 답] 브라우저가 이해 가능한 방식으로 의미를 부여해야 하고, 임의의 기호는 **예약어 문제(콘텐츠로 쓰기 어려움)**와 중첩 표현의 한계를 낳기 때문에, 범용적으로 쓰기 좋은 꺾쇠(< >) 기반의 태그 감싸기 방식이 채택되었다.[^20]

[? 질문] HTML에서 마크업을 수행하는 “도구”는 무엇이며, 어떤 종류가 있는가[^22]
[= 답] HTML에서는 마크업을 위해 **태그(tag)**를 사용하며, 링크/목록/문장/문서 바깥틀 등 다양한 요소를 구분하는 많은 태그들이 있다(예: ul, 문장 태그, body 등).[^24]

2. 큰 그림[^3]

이 강의는 웹문서를 만드는 첫 시간으로, “웹문서(HTML)가 하이퍼텍스트를 포함한다”는 말에서 출발해 마크업이라는 용어가 왜 필요하고 무엇을 의미하는지, 그리고 HTML에서 마크업을 수행하는 기본 도구인 태그가 어떤 방식으로 작동하는지를 설명한다.[^4] 즉 “텍스트 콘텐츠”에 “특별한 의미(링크/강조/목록/구조)”를 부여하는 체계가 왜 태그 형태로 발전했는지를 단계적으로 풀어준다.[^10]

웹문서의 콘텐츠는 기본적으로 순수 텍스트이며, 그중 일부를 하이퍼텍스트 등으로 만들려면 컴퓨터(브라우저)가 알아볼 수 있는 **표식(표시자)**가 필요하다.[^6]
마크업을 위한 표식은 임의 기호로도 가능해 보이지만, 실제로는 예약어 충돌과 중첩(계층) 표현 문제 때문에 범용적이고 일관된 규칙이 필요하다.[^18]
HTML은 이러한 요구를 해결하기 위해 태그로 범위를 감싸는 방식을 사용하며, 링크뿐 아니라 이미지/목록/문장/문서 구조 등 다양한 요소를 태그로 구분한다.[^24]

3. 하나씩 살펴보기[^2]

3.1 “웹문서를 만든다”의 첫 관문: 마크업 용어 이해[^2]

📸 0:04

강의자는 “오늘은 웹문서를 만들어보는 첫 번째 시간”이라고 하면서, 첫 시간에 가장 먼저 짚고 넘어갈 주제로 **마크업(markup)**이라는 용어 이해를 제시한다.[^2] 웹 개발을 배울 때 HTML이 무엇인지, 웹문서가 무엇인지 이야기하면 자주 등장하는 단어가 마크업이기 때문에, 이를 개념적으로 먼저 정리하겠다는 흐름이다.[^6]

또한 강의자는 ‘웹문서(HTML)’를 설명할 때 흔히 “하이퍼텍스트를 가진 문서”라는 표현이 등장한다는 점을 상기시킨다.[^5] 여기서 하이퍼텍스트를 문서에 포함한다는 것이 실무적으로 무엇을 뜻하는지, 그리고 그것을 구현하기 위해 왜 “마크업”이 필요한지가 뒤에서 본격적으로 전개된다.[^7]

3.2 하이퍼텍스트를 문서에 “포함”한다는 뜻: 텍스트 중 일부를 특별 취급하기[^5]

📸 0:35

강의자는 “문서에는 수많은 텍스트가 있고 우리는 그 텍스트를 콘텐츠라고 한다”는 전제를 둔다.[^6] 그 콘텐츠 중에서 특정 문자/단어(예: 강의에서 예로 든 “무궁화”)를 사용자가 더 궁금해해서 관련 문서를 찾아보고 싶게 만들려면, 그 특정 단어를 하이퍼텍스트로 만들고 싶어질 수 있다고 설명한다.[^8]

여기서 핵심은 “사람이 보기엔” 단어에 색을 칠하거나 밑줄을 긋는 등으로 특별함을 표시할 수 있지만, “브라우저 같은 녀석”이 그 텍스트 조각을 특별한 의미를 가진 대상으로 인식하도록 하려면 별도의 방식이 필요하다는 점이다.[^9] 즉, 사람의 시각적 표시(색깔 등)는 ‘사람이 알아보기 위한 표시’일 뿐이고, 브라우저가 그 텍스트에 대해 “이건 링크다” 같은 의미 처리를 하려면 컴퓨터가 이해하는 규칙으로 표식을 해야 한다는 문제의식이 제기된다.[^9]

3.2.1 표식(표시자)의 필요성: “이 부분은 하이퍼텍스트다”라고 구별하기[^6]

강의자는 여기서 질문을 던진다.[^7]

[? 질문] 문서 콘텐츠 중 특정 단어를 하이퍼텍스트로 만들고 싶다면 “무엇이 필요할까요?”[^7]
[= 답] 그 부분을 하이퍼텍스트라고 **표시할 수 있는 표시자(표식)**가 필요하며, 그 표시 행위/체계를 마크업이라고 부른다.[^10]

즉 마크업은 “텍스트에 어떤 의미를 덧붙여 구별하는 표시”라는 관점에서 소개된다.[^10] 강의자는 “무궁화” 같은 특정 단어를 골라서 그것을 하이퍼텍스트로 만들려면, 그 단어 앞뒤에 “얘는 하이퍼텍스트라는 특수한 의미를 갖고 있다”고 브라우저가 알아볼 수 있는 방식으로 구분해야 한다고 설명한다.[^9]

3.3 마크업은 ‘범위를 감싸는 것’: 어디부터 어디까지가 특별한가를 지정[^11]

📸 1:33

강의자는 하이퍼텍스트로 만들 텍스트 조각을 구별하는 방법을 설명하면서, 결국 필요한 것은 “이 단어(또는 구간)의 범위를 어떻게 하이퍼텍스트로 구별할 것인가”라고 정리한다.[^11] 그리고 그 구별을 위해 특정 범위를 감싸는 행위 자체를 “마크업”이라고 부른다고 말한다.[^11]

즉 마크업은 단순히 ‘표시’라는 추상적 말이 아니라,

문서 내에서 특별 취급할 **구간(범위)**를 잡고[^11]
그 구간을 어떤 규칙으로 감싸서[^11]
브라우저가 “감싸진 구간은 특별한 의미를 가진다”라고 해석하게 하는 것[^9]

이라는 구조로 설명된다.[^11]

이어서 강의자는 “중요한 건 이 마크업을 어떤 식으로 할 것인가, 이제 이게 문제가 되는 거죠”라고 하며, 마크업 방식을 둘러싼 설계 문제(어떤 기호/규칙을 써야 하는가)로 논의를 확장한다.[^12]

3.4 현재 웹에서 쓰는 기본 마크업 형태: 꺾쇠(< >)로 감싸는 방식(태그 구조의 원형)[^13]

📸 1:54

강의자는 현재 사용하는 마크업 방식으로 “꺾은 괄호(꺾쇠) 형태”를 제시한다.[^13] 설명의 포인트는 다음과 같다.

시작을 나타내는 표식에는 /가 없고, 끝을 나타내는 표식에는 /가 들어간다.[^14]
시작 표식부터 끝 표식까지의 구간이 “마크업된 범위”가 된다.[^14]
꺾쇠 안에 들어간 알파벳(예: <a>, <b> 같은 이름)은 콘텐츠로 인식되지 않는다.[^15]

즉, 문서에 실제로 보여줄 “콘텐츠”와, 그 콘텐츠에 의미를 부여하기 위한 “표식 정보(태그 이름 등)”가 분리된다는 점을 강조한다.[^15]

3.4.1 꺾쇠 안의 글자는 ‘콘텐츠’가 아니라 ‘의미 지정 정보’[^15]

강의자는 꺾쇠 안쪽의 문자가 콘텐츠로 읽히지 않는다는 점을 장점으로 든다.[^15] 이 덕분에 마크업 표식 안에 특정 문자를 넣어 “이 영역은 이런 의미다”를 표현할 수 있고, 이를 통해 콘텐츠 자체에 손대지 않으면서도 의미를 부여할 수 있다고 말한다.[^16]

[!NOTE] “표식 정보”와 “콘텐츠”의 분리라는 핵심
꺾쇠 안쪽은 브라우저가 화면에 표시할 텍스트(콘텐츠)로 취급하지 않고, 해석을 위한 지시(의미 부여)로 취급한다는 점이 이후 HTML 문법의 기초가 된다.[^15]

3.5 다른 마크업 방식들도 가능하지만, 왜 문제가 되는가: 예약어 충돌과 중첩의 어려움[^17]

📸 2:34

강의자는 “마크업을 하기 위해 수많은 방법을 고민해 쓸 수도 있다”고 말하며, 다른 대안들을 예로 든다.[^17] 예컨대:

특정 기호를 이용해서 감싼다거나[^17]
앞에 어떤 작은 표식을 붙인다거나[^17]
중간 구분자 같은 것으로 마커(표시)를 한다거나[^17]

같은 방식들이 가능해 보인다는 것이다.[^17]

하지만 강의자는 이런 임의 기호 기반 방식들이 실제로는 큰 문제를 만든다고 설명한다.[^18]

3.5.1 문제 1: 마크업 기호는 “특수한 의미”를 가져 예약어가 된다[^18]

마크업에 어떤 기호를 쓰기로 결정하는 순간, 그 기호는 문서에서 “특수한 의미”를 갖게 되어 사실상 **예약어(예약 기호)**가 된다.[^18] 그러면 그 기호를 더 이상 “콘텐츠로는” 마음대로 쓸 수 없게 된다.[^18] 강의자는 예로 “콘텐츠에서 대괄호(같은 기호)를 쓴다는 것은 문제를 발생시킬 수 있다”는 취지로 이야기하며, 마크업용 기호가 콘텐츠 표현을 제약하는 상황을 문제로 든다.[^19]

정리하면:

마크업용으로 채택한 기호는 해석 규칙을 갖게 되고(예약됨)[^18]
콘텐츠에 그 기호가 자연스럽게 등장해야 할 때 충돌이 생긴다.[^19]

3.5.2 문제 2: 마크업은 한 번으로 끝나지 않고 “중첩”이 필요하다[^20]

강의자는 또 다른 문제로 **중첩(nesting)**을 든다.[^20] 문서에서 어떤 단어를 하이퍼텍스트로 마크업하면서도, 더 큰 단위의 범위를 또 다른 의미로 감싸야 할 수 있다는 것이다.[^20] 예컨대(강의가 구체 예시를 길게 들진 않지만), 현실적으로는 “작은 요소”와 “큰 구조”가 겹겹이 존재하는 문서 구조가 흔하다는 뜻이다.[^20]

이때 임의의 기호/표식만으로 중첩을 표현하려고 하면:

중첩 단계가 많아질수록 다른 기호를 계속 추가로 도입해야 하고[^20]
그 기호들은 점점 콘텐츠로 사용하기 어려워지며(예약 충돌 확대)[^20]
결국 “기호가 자꾸 사라진다/컨텐츠로 사용할 수 있는 여지가 줄어든다”는 취지의 문제가 생긴다[^20]

라고 설명한다.[^20]

[!IMPORTANT] 중첩 문제의 요지
문서는 계층 구조를 갖기 쉬운데(작은 범위/큰 범위), 마크업이 중첩될수록 “표식용 기호”와 “콘텐츠”를 안정적으로 분리하는 규칙이 없으면 표현 체계가 금방 한계에 부딪힌다.[^20]

3.6 범용적인 마크업 형식의 등장: 꺾쇠 기반의 감싸기 규칙[^21]

📸 3:52

강의자는 이러한 문제의식 속에서(강의에서는 “IBM에서…”라는 언급으로) 문서 내 특정 블록을 마크업할 때 범용적으로 사용할 수 있는 마크업 형식이 제안/정착되었다는 흐름을 제시한다.[^21] 핵심은 임의 기호가 아니라, 콘텐츠와 구분되는 전용 표기 영역을 만들어 그 안에 ‘의미’를 적게 하는 방식이다.[^21]

그 예시로 강의자는 꺾쇠로 감싸는 형태를 보여주며, 마크업 영역에 대해 “굵게(Bold) 인식하게 하자” 같은 의미를 부여할 수 있다고 설명한다.[^22] 즉:

어떤 구간을 꺾쇠 기반 표식으로 감싼다.[^22]
감싼 영역에 대해 “두껍게 표현하라(볼드)” 같은 처리를 하도록 의미를 정한다.[^22]

여기서 강조하는 포인트는 “볼드”가 목적이라기보다, 일관된 감싸기 규칙이 있으면 그 안에 들어갈 ‘의미 이름’을 무엇이든 둘 수 있고, 브라우저/해석기가 이를 구분해 처리할 수 있다는 점이다.[^23]

3.6.1 감싸기 규칙의 장점: 일관성, 의미 확장성, 콘텐츠와의 분리[^23]

강의자는 예로 볼드뿐 아니라 이탤릭 같은 다른 의미도 같은 규칙으로 확장할 수 있다고 말한다.[^23] 즉, 기호를 새로 발명하는 게 아니라,

같은 꺾쇠 규칙을 쓰고[^23]
안쪽의 “이름(의미)”만 바꿔[^23]
서로 다른 처리를 하게 할 수 있다[^23]

는 것이다.[^23]

또한 중첩이 일어날 때도, “바깥의 콘텐츠”와 “마크업을 위한 내용(표식)”이 완전히 구분될 수 있어 혼란이 줄어든다고 설명한다.[^23] 그리고 이런 방식이 반복적으로, 일관되게 사용 가능하다는 점을 장점으로 든다.[^23]

3.7 HTML에서도 같은 방식 사용: ‘태그’라는 이름과 ‘마크업’이라는 행위[^24]

📸 5:10

강의자는 앞에서 설명한 “꺾쇠로 감싸서 범위를 지정하는 방식”이 HTML에서도 그대로 사용된다고 말한다.[^24] 그리고 이때 범위를 감싸는 도구(꺾쇠로 만든 표식 덩어리)를 **태그(tag)**라고 부른다고 정리한다.[^24]

즉 관계를 명확히 하면:

마크업: 문서 콘텐츠의 특정 범위를 특별한 의미로 구별해 표시하는 행위/체계[^10]
태그: HTML에서 마크업을 수행하기 위해 사용하는 구체적 문법 도구(감싸는 표식)[^24]

강의자는 “태그를 이용해서 마크업을 하게 되고, 마크업 때문에 우리가 특별 대우를 할 수 있게 된다”는 취지로, 태그 → 마크업 → 브라우저 처리(특별 취급)라는 연결을 강조한다.[^24]

3.8 웹문서는 하이퍼텍스트만이 아니다: 문서의 다양한 요소를 구분하는 태그들[^25]

📸 5:28

강의자는 웹문서를 “하이퍼텍스트를 포함한 문서”라고 말할 수는 있지만, 웹문서가 하이퍼텍스트만으로 이뤄진 것은 아니라고 선을 긋는다.[^25] 문서를 표현할 때는 다양한 요소가 존재한다고 말한다.[^25]

강의에서 열거하는 요소 예시는 다음과 같다.

이미지가 있고[^25]
목록이 있고[^25]
문장(문장 단위의 텍스트)이 있다[^25]

이런 다양한 요소들을 구분(구획)하기 위해서도 “구분자/표식”이 필요하며, 이를 위해 HTML에서는 태그를 사용한다는 설명으로 이어진다.[^25]

3.8.1 예시로 제시된 태그들: 목록, 문장, 문서의 바깥 틀[^26]

강의자는 “목록을 표현할 때는 ul 태그”, “문장을 구분하기 위한 문장 태그”, 그리고 “무엇보다 회(??)사를 만들 때 가장 바깥을 감싸는 것으로서 body” 같은 태그가 있다고 말하며, 여러 태그의 존재를 예시로 든다.[^26] (중간에 음성 인식이 다소 흐릿하지만, 요지는 ‘목록/문장/바깥 구조’에 해당하는 대표 태그들이 있다는 점을 보여주는 것이다.)[^26]

그리고 이런 태그들이 “외에도 많이” 존재하며, 앞에서 보여준 것은 일부라고 덧붙인다.[^26]

[!TIP] 이 강의가 주는 학습 관점
태그는 단순히 링크를 만드는 도구가 아니라, 문서에 존재하는 여러 요소(이미지/목록/문장/구조)를 컴퓨터가 이해할 수 있게 구분해주는 ‘문서 구조 언어’의 부품으로 등장한다.[^25]

3.9 “태그가 너무 많아 보인다”는 두려움 다루기: 걱정하지 말고 하나씩 익히기[^27]

📸 6:37

강의자는 태그 예시를 늘어놓은 뒤, 학습자 입장에서 흔히 느끼는 감정을 언급한다.[^27]

태그가 많아 보이면 겁을 먹게 되고[^27]
“배워야 할 게 많다”는 압박이 생기며[^27]
“마음은 급한데 이걸 다 언제 알지” 같은 마음이 들 수 있다[^27]

이에 대해 강의자는 “걱정하지 마세요”, “그렇게 많지 않습니다”라고 말하며, 하나씩 배우다 보면 어느새 태그들을 알게 된다고 학습 불안을 완화한다.[^28] 핵심 메시지는 ‘처음엔 많아 보이지만 점진적으로 익숙해진다’는 것이다.[^28]

3.10 이번 강의 마무리: 오늘 배운 것과 다음 시간 예고[^29]

📸 7:06

강의자는 오늘 다룬 내용을 정리한다.[^29]

오늘은 마크업의 의미를 설명했고[^29]
마크업을 할 때 사용하는 도구가 태그라는 점을 이야기했으며[^29]
태그의 종류로 여러 예시가 있다는 것을 보여줬다[^29]

그리고 다음 시간에는:

하이퍼텍스트를 구분하기 위해 사용하는 “마크업 제작(??)”이 어떤 것이 있는지(즉 링크 관련 태그 등) 더 다루고[^30]
수제 컬(아마 CSS를 의미하는 맥락으로 보임)에서 문서를 만들게 되면 무엇이 달라지는지 간단히 살펴보며[^30]
하이퍼텍스트를 이용한 문서를 직접 만들어보는 시간을 갖겠다고 예고한다[^30]

로 끝맺는다.[^30]

4. 핵심 통찰[^10]

[c 마크업은 “보기 좋게 꾸미기”가 아니라, 텍스트 콘텐츠 일부에 브라우저가 이해할 “의미”를 부여해 구별하는 체계다.] [^10]
[h 하이퍼텍스트는 콘텐츠의 ‘일부 범위’를 특별 취급하는 것이므로, 마크업은 본질적으로 “범위 지정(감싸기)” 문제다.] [^11]
[h 임의 기호 기반 마크업은 예약어 충돌(콘텐츠 제약)과 중첩 표현의 확장성 한계 때문에 실전에서 유지되기 어렵다.] [^18]
[h 꺾쇠(< >) 기반 태그 방식은 콘텐츠와 표식 정보를 분리하고, 동일한 규칙으로 다양한 의미를 확장/중첩할 수 있게 한다.] [^23]
[m HTML에서 태그를 배우는 것은 “링크 문법”만이 아니라, 문서의 구성 요소(목록/문장/이미지/구조)를 구분하는 언어를 배우는 과정이다.] [^25]

실행 시사점(학습/실무)
- 태그를 볼 때 “어떻게 보이게 하지?”보다 “이 구간의 의미가 무엇이지?”를 먼저 해석하는 습관을 들인다.[^24]
- 문서에서 요소가 겹겹이(중첩) 들어가는 상황을 전제로, 태그가 범위를 감싸는 구조라는 점을 계속 의식하며 연습한다.[^20]
- 태그 개수가 많아 보여도, 실제 사용은 반복 패턴이 많으므로 하나씩 직접 써보며 익숙해지는 접근이 유효하다.[^28]

5. 헷갈리는 용어 정리[^10]

콘텐츠(content): 문서에 들어 있는 순수 텍스트(및 표현 대상)로, 마크업 표식과 구분되는 “표현의 재료”를 뜻하는 맥락으로 사용된다.[^6]
하이퍼텍스트(hypertext): 문서의 특정 단어/구간을 다른 문서와 연결해 “더 알아보기/찾아가기”가 가능하도록 만든 텍스트(링크 대상 텍스트)라는 취지로 설명된다.[^8]
마크업(markup): 문서에서 특정 범위를 “특별한 의미(예: 하이퍼텍스트)”로 구별하기 위해 표식으로 감싸 표시하는 행위/방법.[^10]
태그(tag): HTML에서 마크업을 수행하기 위해 사용하는 꺾쇠 기반 감싸기 표식(시작/끝으로 범위를 만든다).[^24]
예약어(예약 기호): 마크업에 사용하기로 정한 기호/표식이 “특수한 의미”를 갖게 되어 콘텐츠로 자유롭게 쓰기 어려워지는 문제를 설명할 때 사용된 개념.[^18]
중첩(nesting): 마크업이 한 번으로 끝나지 않고 더 큰 범위/다른 의미로 겹겹이 감싸야 하는 상황(계층 구조)을 뜻한다.[^20]

참고(콘텐츠 정보)[^1]

제목: 프론트엔드, 백엔드 개발자를 위한 HTML, CSS 강의 06강 - Markup 이란?[^1]
채널: 뉴렉처[^1]
길이: 7분 32초[^1]
링크: https://www.youtube.com/watch?v=Nmw1u2VeUsg[^1]
키워드(제공): html강의, css강의, 웹개발, 웹문서만들기, 마크업이란?[^1]

[^1]: 제공된 콘텐츠 메타데이터(제목/채널/길이/링크/키워드). [^2]: @[00:04] "웹문서를 만들어보는 첫 번째 시간" / @[00:06] "첫번째 시간으로 ... 마크업 ... 용어에 대한 이해" [^3]: @[00:04] "웹문서를 만들어보는 첫 번째 시간" [^4]: @[00:06] "마크업 ... 용어에 대한 이해" [^5]: @[00:15] "하이퍼텍스트를 가지고 있는 ... 문서를 만들자" [^6]: @[00:35] "수많은 텍스트 ... 컨텐츠" / @[00:40] "컨텐츠에서 특정 문자 ... 하이퍼텍스트" [^7]: @[00:46] "그러면 뭐가 필요할까요" [^8]: @[00:58] "무궁화 ... 좀 더 궁금하다 ... 관련된 문서를 ... 찾고 싶다 ... 하이퍼텍스트" [^9]: @[01:20] "색깔 ... 인간 ... 브라우저 ... 특별 ... 앞 뒤 ... 특수한 의미" [^10]: @[00:50] "표시자가 필요" / @[00:54] "마크업" / @[00:58]~@[01:11] 예시(무궁화) 맥락 [^11]: @[01:33] "어떤... 방식으로 ... 하이퍼텍스트로 구별 ... 범위 블록으로 감싸는 것을 ... 마크업" [^12]: @[01:44] "마크업을 어떤 식으로 할 것인가 ... 문제가" [^13]: @[01:54] "현재 우리는 ... 사용해서 마크업" [^14]: @[01:57] "여기에서는 /가 안 들어갔죠" / @[02:00] "시작" / @[02:03] "끝나는 부분" [^15]: @[02:12] "안쪽에 있는 알파벳은 ... 컨텐츠로 인식되지 않는다" [^16]: @[02:21] "특정 문자를 ... 의미까지 부여" [^17]: @[02:34] "수많은 방법" / @[02:39]~@[02:51] 기호/표식 예시 나열 [^18]: @[02:54] "문제는 ... 특수한 의미 ... 예약어" / @[02:57] "컨텐츠로는 ... 쓸 수 없는" [^19]: @[03:04] "컨텐츠에서 ... 쓰는 것은 문제" [^20]: @[03:27] "1단계로 끝내는 ... 중첩" / @[03:34] "중첩이 ... 또 다른 기호" / @[03:40] "컨텐츠로 사용할 수 ..." [^21]: @[03:52] "IBM ... 특정 블럭을 마크업 ... 범용적으로 ... 마크업 형식" [^22]: @[04:01] "꺾쇠를 이용해서 감싼" / @[04:08]~@[04:17] "볼드 형태 ... 두껍게 표현 ... 마크업" [^23]: @[04:31]~@[05:04] "일관되게 ... 다른 기호가 아니라 ... 아무거나 ... 이탤릭 ... 중첩 ... 컨텐츠와 ... 완전히 구분 ... 반복적으로" [^24]: @[05:10] "html에서도 그대로" / @[05:12]~@[05:18] "태그" / @[05:18] "태그를 이용해서 마크업" [^25]: @[05:28] "웹문서 ... 하이퍼텍스트" / @[05:40] "하이퍼텍스트만 ... 아니다" / @[05:45]~@[05:53] "이미지 ... 목록 ... 문장" [^26]: @[05:58]~@[06:22] "태그 ... ul ... 문장 ... body ... 외에도 많은 태그" [^27]: @[06:37]~@[06:45] "겁을 먹게 됩니다 ... 배워야 할 게 많다 ... 다 언제 알지" [^28]: @[06:52]~@[06:59] "그렇게 많지 않습니다 ... 하나씩 ... 어느새 ... 다 알게" [^29]: @[07:06] "오늘은 마크업 의미 ... 태그 ... 태그의 종류" [^30]: @[07:14]~@[07:30] "다음 시간에는 ... 하이퍼텍스트 ... 문서를 직접 만들어보는 시간" / @[07:30] "고생 많으셨고 ... 돌아오겠습니다"