HTML(Hyper Text Markup Language)
what is html?
브라우저의 주소창에 원하는 사이트의 url을 입력하고 enter 키를 누르면, 우리가 원하는 웹 사이트를 볼 수 있다. 또는 컴퓨터에 저장되어있는 이미지, pdf 파일 등을 브라우저를 통해 열어볼 수도 있다.
웹 사이트 뿐만 아니라 이미지, pdf까지 우리가 "브라우저"를 통해서 보는 모든 것들은 "html"이라는 파일이며, 이 파일은 다양한 태그들로 이루어져 있다. 웹사이트에 스타일과 사용자와의 상호작용 기능을 더해주는 css파일, js파일도 결국 html의 태그로 삽입되어 보여진다. 즉 html이 없으면, css와 js도 없다.
what is html5?
The term HTML5 is essentially a buzzword that refers to a set of modern web technologies. This includes the HTML Living Standard(HTML의 가장 최신 표준), along with JavaScript APIs to enhance storage, multimedia, and hardware access(HTML 기능 이외의 부분을 향상시키기 위한 브라우저 기술).
Any modern site should use the <!DOCTYPEhtml> tag, which will ensure that you are using the latest version of HTML.
what is tag? | Semantic tag
<h1> content </h1>
<p lang="ko"> 안녕하세요 </p>
웹 사이트에는 다양한 정보들이 담겨있다. 예를 들어 유튜브에는 동영상을 서치할 수 있는 검색창, 지금 인기있는 동영상 목록, 사용자와 관련된 정보를 보여주는 메뉴 등 다양한 컨텐츠를 담고있는 정보가 있다.
이런 정보들을 하나의 html에 집어 넣을 때, 각 정보의 의미에 따라 적절한 태그를 사용하고, 그 태그만으로는 정보의 의미가 충분히 전달되지 않을 때 attribute를 이용한다. 태그의 종류에 따라 꼭 필요한 attribute는 달라질 수 있다. 이렇게, 담고자 하는 정보를 의미 구조에 따라 빌드업 하는 것을 Semantic Markup이라고 한다. SEO(Search Engine Optimization), Accessibility(ex. screen reader), Maintainability를 위해 중요하다.
import css & js
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="style.css">
<script defer src="main.js"></script>
</head>
