WEB1 - 10. html이 중요한 이유 |
일반인이 제목을 작성하는 방식 (시각적인 제목만 코딩) |
지식인이 제목을 작성하는 방식 (제목이 코딩) |
||
<span style="font-size:24px">coding</span> | <h3>coding</h3> |
검색엔진에 coding을 검색하면
검색엔진은 태그를 근거로 해서 정리하기 때문에
일반인 웹페이지 1억개와 지식인 웹페이지 1억개 중 제목이 코딩인 사이트와 그냥 시각적으로만 제목처럼 보이는 ‘coding’이라는
정보를 가지고 있는 사이트 중에 지식인의 사이트를 우위에 놓을 것이다.
검색엔진에 노출되지 않는다는 것은 실질적으로 존재하지 않는다는 것.
웹페이지를 만들 때 화려하고 편리한것보다 정보를 탄탄히 하는 것이 훨씬 더 중요하다.
예쁘게 하기위해 이미지로 글을 쓰게 되면 검색엔진에서는 존재하지 않는 페이지가 됨
html을 의미에 맞게 정확하게 사용하는 것은 비즈니스에서 중요한 문제
웹이 중요하게 생각하는 "접근성"
어느 누구나 읽을 수 있어야 한다. 휴머니즘적인 측면에서도 중요한 기술
(for 시각장애인들 alt="이미지 안의 텍스트나 이미지에 대한 설명 글 필요")
WEB1 – 11. 최후의 문법 속성 & img |
이미지를 웹페이지에 추가시키는 태그
src = 'source' 줄인말
언플래쉬닷컴 이미지활용
<img src="coding.jpg" width="100%" alt="">
ㄴ속성(Attribute)
WEB1 - 12. 부모자식과 목록 |
<parent>
<child></child>
</parent>
목록(list) = <li>
li의 부모 태그 = <ul></ul>
(unordered list)
숫자 넘버링 목록 태그= <ol></ol>
(ordered list)
※ol태그는 자주 사용되지않음
WEB1 - 13. 문서의 구조와 슈퍼스타들 |
정보가 많아졌을 때 정리할 수 있는 구조를 작성하는 법
출처 입력
정말로 중요한 순서
컴퓨터는 0과1로 저장되기 때문에
utf-8로 열길 명령해야함
<meta charset="utf-8">
character는 문자
set은 규칙
<!DOCTYPE html>
<html>
<head>
<title>본문</title>
<meta charset="utf-8"> //utf-8로 저장되어 있다
</head>
<body>
</body>
</html>
WEB1 - 14. HTML 태그의 제왕 |
태그가 웹의 왕국이라면 이 태그는 이 왕국의 제왕.
150개의 태그를 아래에 둔 이 태그의 이름은?
검색엔진들은 이 태그 덕분에 전세계 웹을 항해하면서 웹페이지를 발견할 수 있었음.
이 태그 덕분에 최고의 검색결과를 만들 수있음.
이태그는 도시의 기과 인체의 혈관 같음.
우리가 백번도 넘게 사용하는 태그.
Hyper Text = a(anchor(닻)의 첫글자)
출처 입력
html specification는
html을 만드는 w3c라는 국제기구에서 만든 공식사용설명서
w3c 멤버들이 모여 미래의 웹의 기술을 결정하고 발표한 것= w3c recommendation
링크를 통해서 정보를 탐험하고 문제를 해결하고 있다면,
또 그 과정이 즐겁다면 나는 이미 공부를 잘하고 좋아하고 있는 것이다.
<!DOCTYPE html>
<html>
<head>
<title>본문</title>
<meta charset="utf-8">
</head>
<body>
<a href="#" target="_blank" //새탭 title="">//툴팁 : 마우스 오버됐을 때 설명박스생기는것
// href = h(hyper text) ref(reference)
</body>
</html>
WEB1 - 15. 웹사이트 완성 |
링크는 본드 또는 실
웹 책 대신 웹사이트라 표현
<!DOCTYPE html>
<html>
<head>
<title>본문</title>
<meta charset="utf-8">
</head>
<body>
<h1><a href="index.html">web</a></h1>
<ol>
<li><a href="1.html">html</a></li>
<li><a href="2.html">css</a></li>
<li><a href="3.html">javascript</a></li>
</ol>
<h2>html</h2>
</body>
</html>
WEB1 - 16. 원시웹 |
수업의 목표
1. 웹페이지를 만드는 것
: 코딩이 무엇인가를 파악하는 것이 목표
2. 내가 만든 웹페이지를 인터넷을 통해서 누구나
가져갈 수 있게 하는 것
: 인터넷이 무엇인지 이해 하는 것
Internet | Web |
인터넷이 도시 | 웹은 건물하나 |
도로 | 자동차 한 대 |
운영체제 | 그 위에 있는 프로그램 하나 |
웹의 역사
1960 인터넷 등장
미국 핵 공격에 견딜 수 있는 통신시스템 개발,
중앙 집권형에서 정보 분산형
기업, 연구소, 대학, 군대에서만 사용
1990 웹 등장
웹의 고향은 스위스 swiss
스위스에 무엇이 있느냐 제네바 유럽 입자 물리 연구소
강입자 가속기(LHC)-> 아주 작은 입자를 보는 장치
인류의 현미경, 둘레가 27km
쇠로 된 튜브 안으로 아주 작은 입자를 고속 회전시켜서
입자와 입자를 충돌 시킬 때 어마어마한 에너지가 방출되면서
어떠한 작은 입자(힉스보선)를 발견할 수 있을 것이다라는 가설
-피터 힉스(노벨 물리학자 수상자)
127개국에서 모인 12000명의 엔지니어와 물리학자가 있는 곳
1980년에 비정규직 프로그래머로
팀 버너스 리가 취직
Enquire Within Upon Everything(무엇이든 물어보세요)라는 책에서 나온 첫 글자
enquire 웹의 전신을 10년동안 만듦
1990년대 연구소에 인터넷이 들어오고
1990.10 최초의 웹편집기 개발
1990.11 최초의 웹브라우저 world wide web 프로그램 개발
1990.12.24. 웹서버라는 프로그램을 만듦
info.cern.ch 웹의 메소포타미아(웹의 성지)
'생활코딩 > html' 카테고리의 다른 글
공부정리_HTML(17~20강,부록) (0) | 2021.09.12 |
---|---|
공부정리_HTML(1~9강) (0) | 2021.09.12 |