HTML5

HTML이란 무엇입니까?
HTML은 HyperText Markup Language의 약자로 많은 초보자에게 혼란스러운 용어일 수 있습니다. HTML을 설명하는 가장 좋은 방법은 각 단어의 의미를 조사하는 것입니다.

HyperText는 다른 텍스트에 대한 링크가 포함된 텍스트를 나타냅니다. 다른 페이지로 이동하는 강조 표시되거나 밑줄이 그어진 링크를 클릭할 때마다 하이퍼텍스트를 사용하고 있는 것입니다. 점점 더 많은 페이지가 서로 연결하기 위해 하이퍼텍스트를 사용함에 따라 페이지의 "웹"이 형성되기 시작합니다. 여기에서 World Wide Web이라는 용어를 얻습니다.

마크업은 문서 데이터를 표시하는 방법을 웹 브라우저에 알리기 위해 문서에 삽입되는 특수 기호 또는 코드를 말합니다. 예를 들어 마크업 코드는 구문을 볼드체 또는 이탤릭체 텍스트로 표시하도록 브라우저에 지시하거나 문서의 어느 부분이 제목이고 어느 부분이 단락인지 브라우저에 알려줄 수 있습니다. HTML은 마크업 코드를 사용하는 여러 언어 중 하나일 뿐입니다.

언어는 코드가 표준화되었다는 생각을 말합니다. 일반 구어와 마찬가지로 HTML을 작성할 때 모든 사람이 따라야 하는 특정 규칙이 있습니다. 이는 모든 브라우저가 코드를 이해하고 해석할 수 있도록 하기 위한 것입니다. 다양한 프로그래밍 언어가 있으며 Java, Python 및 Ruby와 같이 널리 사용되는 언어에 대해 들어 보셨을 것입니다. 각 언어에는 고유한 규칙 집합이 있으며 많은 언어를 HTML과 함께 사용하여 놀라운 웹 페이지와 응용 프로그램을 만들 수 있습니다.

HTML 코드는 어떻게 생겼습니까?
기본적으로 HTML 코드는 일반 텍스트처럼 보입니다. HTML 코드의 가장 식별 가능한 기능은 꺾쇠 괄호를 사용하는 것입니다. 이러한 꺾쇠 괄호는 문서 데이터를 표시하는 방법을 브라우저에 알려주는 마크업 코드를 묶습니다.

다음은 간단한 HTML 5 코드의 예입니다.

HTML5 소개

2014년 10월 W3C(World Wide Web Consortium)에서 게시함

HTML의 가장 향상된 최신 버전입니다

.

HTML 4.02=1,XHTML 1.0 및 XHTML 1.1을 대체함

World Wide Web에서 콘텐츠를 구성하고 제공하기 위한 표준입니다.

이전 버전과의 호환성을 보장합니다.

HTML 5에 도입된 새로운 기능

새로운 의미 체계
> DOM 생성에 도움이 되는 새로운 태그 모음을 제공합니다.

캔버스
> 웹 페이지에서 도형과 도면 및 런타임을 렌더링하는 데 도움이 됩니다.

지리적 위치
> 요청을 하는 클라이언트의 지리적 위치. 위치에 따라 서비스를 제공할 수 있습니다.

마이크로데이터
> HTML의 태그 내에서 메타데이터를 꺼낼 때.

웹 스토리지
> 월드 와이드 웹에서 저장 시설을 제공합니다.

웹 메시징
> html5를 사용하여 네트워크를 통해 메시지를 보내는 기능을 제공합니다.

인덱스DB
> 데이터를 저장하는 또 다른 방법으로 대량의 데이터를 저장하기 위한 것입니다.

멀티미디어
>

HTML5 페이지 구조

(머리글, 탐색, 본문, 기사, 섹션, 따로, 바닥글, 주소)

<header>
<div id="logo">HTML</div>
<nav>  
<ul>
    <li><a href="/">Home</a>
    <li><a href="/link">Page</a>
</ul>
</nav>
</header>
<main role="main">
<article>
<h2>Title 1</h2>
<p>Content 1</p>
</article>
<article>
<h2>Title 2</h2>
<p>Content 2</p>
</article>
</main>
<section>
A group of related content
</section>
<aside>
Sidebar
</aside>
<footer>
<p>&copy; HTML CheatSheet</p>
<address>
Contact <a href="mailto:[email protected]">me</a>
</address>
</footer>

참조할 수 있는 최고의 리소스

HTML Cheatsheet
2. HTML Standard
3. MDN Docs

Emmet

Emmet : Emmet is a must use web developer toolkit. With Emmet you can rapidly create your markup.