본문 바로가기
국비학원 전 강의 필사/생활코딩 요약 해보기

#13 문서의구조와 슈퍼스타들 - <WEB1-HTML & Internet>

by kkooHan 2022. 8. 13.

 

 

출처 : https://www.youtube.com/c/%EC%83%9D%ED%99%9C%EC%BD%94%EB%94%A91/featured

 

생활코딩

일반인에게 프로그래밍을 알려주는 온라인/오프라인 활동 입니다. 채널 공개키 : MIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQDbU/jgeYLWbmUB5pk/wlqMs+2qsOOPgN2ydxOsrWe8JJUXzj5ovsUmjfBSwLjajT6SyO00ulne3zja2PzEZC2wnJCgvZ6lr/ZLvA9yUqmrKRNa

www.youtube.com

 

 

 

 

 

 

요약 :

 

문장이 모이면 페이지가 된다.

페이지가 모이면 책이 된다.

 

 

책에는 표지가 있고

표지에는 제목과 저자가 표기된다.

 

 

정보가 많아짐에 따라서

그 정보를 잘 정리 정돈하기 위한

체계, 혹은 구조라는 것이 필요하다.

 

 

이번 시간에는 구조를 만드는 방법을 공부하겠다.

 

 

 

 

 

슈퍼스타 태그들에 대해서는

의도적으로 언급하지 않았다.

 

 

제목을 허접하게 파일명이 아니라

제목으로 정해보겠다.

제목을 적고 <title>로 감싸기.

 

 

제목을 정하면 사용자뿐만 아니라 검색엔진에도 제목을 알려줄 수있다.

책 표지 같은 느낌.

타이틀을 안 쓰는 것은 굉장한 손해.

 

 

 

 

한글을 그냥 입력하면 브라우저는 한글을 출력하지 못한다.

utf-8로 열어줘야 한글이 제대로 출력된다.

(컴퓨터는 0과1로만 정보를 저장한다.)

 

 

<meta charset="utf-8">

char(character) : 문자

set : 규칙

 

 

1. 본문

2. 본문을 설명하는 부분 -> <title>, <meta charset="utf-8">

 

 

1. 본문은 <body> 태그로 묶기로 약속했다.

2. 본문을 설명하는 부분은 <head> 태그로 묶기로 약속했다.

 

 

고위직 태그들(<head>, <body>)을 감싸는

단 하나의 최고위 층 태그 : <html>

 

 

<html> 태그 위에는 관용적으로

<!DOCTYPE html> 이라고 써줘야 한다. -> "이 문서는 html이다."

 

 

아무 웹사이트에서나 '페이지 소스 보기'를 통해 

소스를 보면 우리가 그동안 배운 태그들이 보인다.

 

 

 

 

생활코딩님은 '시력이 좋아졌다'라고 표현한다.

태그들을 배운 이후 보이기 시작하고, 들리기 시작하다

우리는 그러한 혁명적인 능력을 갖게 된 것이다.

축하드려요~

 

 

이렇게 해서 HTML 구조를 작성하는 방법을 살펴 봤다.

그리고 그 과정에서 정말 빈도수가 높은 태그들을 살펴봤다.

고생하셨어요~

 

 

 

 

 

느낀점 : 

charset에 대해서 알게 되었고

기본적인 구조에 대해 알게 되었다.

앞으로 공부할 내용이 궁금하다. 더 배우고 싶다.

(이렇게 만드신 생활코딩님의 능력... 리스팩)

댓글