# 필수기본태그
<strong> 굵게
<u> 밑줄
<h1> 제목
<br> 줄바꿈, 닫지 않음(즉 쌍이 아님)
<p> 단락 (paragraph) </p >
<ul> 부모태그(구분짓기 위해)
<li> list1(항목) </li>
<li> list2(항목) </li>
</ul>
Ctrl+화살표 : 커서 여러개 한번에 입력가능
# ol과 ul의 차이
<ol> orderedList <점으로 뜸>
<ul> unorderedList
cf. 단락 사이의 간격을 정교하게 조절하고 싶을 때 CSS (좀더 정교함)
<p style="margin-top:40px;">
<img src=""> //src : source
<!doctype html> 이 문서가 html이라는 관용적 표현
<html> 최상위 태그
<head> body를 설명
<title> 제목, 검색엔진 노출 결정
<meta charset="utf-8"> 문서를 읽는 방식 결정, 한글 깨짐 방지
</head>
</html>
<body> 본문 시작
<h1> WEB </h1>
<ol>
<li> HTML </li>
<li> CSS </li>
</body>
W3C에 의해 발표
html specification html 명세(만드는 법, 사용법)
링크 태그 (hyper reference)
<a href = "링크" target="_blank" title="html5 specification"> //링크 새탭 툴팁(클릭하면 작은 박스로 알려줌)
# 인터넷의 작동 원리
Web Browser = Client에서 request ( 원하는 내용이 담긴 .html 전송)
Web Server = Server의 response (응답이 담긴 .html 전송)
- 배우는 방법 : web hosting (회사에 맡김) | web server (직접 다 배움)
# 웹호스팅
인터넷이 연결된 컴퓨터 host
host를 빌려주는 회사 web hosting ex.github
free static web hosting [static은 일정 트래픽까지 무료]
ex. Google Cloud Storage, Azure Blob, Amazon S3
깃헙에서 웹호스팅 (Setting - GitHub pages - None을 main으로 변경 → 웹 주소 얻을 수 있음)
Apache 웹서버 프리소스
아파치 설치법을 모를 때 how to install apache http server os 2021
how to easily install apache on Window
비트나미 매니저
설치 경로로 들어가 manager windows 클릭
초록불 들어오면 켜져있고, 빨간불 들어오면 꺼짐
Go to Application 클릭해서 서버가 연결되어있는지 확인
다음 강의 목록
WEB1 HTML & Internet
WEB2 CSS : HTML 꾸미기
WEB2 JavaScript : 사용자와의 상호작용 → web front end engineer | web interactive designer
WEB2 JSP, PHP, Node.js → 일괄 변경, 효율적 수정 → back end engineer
비트나미 사용법
Internet Protocol Address : IP주소 | 웹브라우저가 속해있는 컴퓨터를 가리키는 웹서버
http://127.0.0.1/index.html
웹브라우저 htdoc 디렉토리에서 index.html 찾도록 설정되어 있음웹브라우저에서 127.0.0.1은 자기 자신을 의미
사용자 눈엔 차이가 없지만,기존에 파일을 브라우저로 열었을 때는 웹서버가 개입하지 않고 브라우저가 직접 열었다면이제는 다른 컴퓨터에 있는 웹브라우저와 웹서버가 통신 규약((Hyper Text Transfer Protocol))에 의해 작동하는 것
두 대의 컴퓨터 연결 위해 같은 네트워크에 접속해있어야함
의미론적인 웹 만들기
<ol>과 <ul>은
li 그룹이 여럿일 때 각 그룹을 식별
순서가 있을 때 ol 없을 때 ul로 감싸줌
출력화면에 차이가 없어도 <nav>를 쓰는 이유브라우저가 해석 할 때 의미 분명
화면낭독기의 효율 높임
<nav> : 동작이나 기능이 들어간다는 뜻
링크 연결
<nav>가 없다면 그냥 컨텐츠
<h1> ~부분도 <header>로 감싸줄수 있음
<article> 본문
