html structure

jiin lee·2024년 1월 5일
0

frontend-javascript이론

목록 보기
13/15

프로그래밍은 생소하고 기계적으로 보일 수 있지만, 여러 면에서는 인간의 세계와 유사합니다. 이를 HTML 페이지의 구조를 살펴보면 더 쉽게 이해할 수 있습니다. HTML 페이지는 및 와 같은 요소를 포함하는데, 이것은 창조의 과정이며 창조자로서 필요한 모든 기본 블록에 익숙해져야 합니다. 많은 것을 배워야 하지만 어떤 큰 일도 기본 기초부터 시작됩니다.

HTML의 기본 태그

HTML 페이지의 논리적인 구조를 형성하는 많은 HTML 태그 중 몇 가지가 기본으로 간주됩니다.
구조는 , , 및 로 세 가지 주요 섹션으로 나눌 수 있습니다.

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>페이지 제목</title>
</head>
<body>
  <h1>this is a heading</h1>
  <p>this is a paragraph</p>
</body>
</html>

이 HTML 페이지에는 제목과 단락이 포함되어 있습니다.

이것은 꽤 기본적으로 보이지만 HTML로 훨씬 더 많은 작업을 할 수 있습니다.

텍스트의 구조를 사용자 친화적으로 사용자 지정하고 시각적으로 표현하며 단락, 양식, 그림, 제목 및 표를 표시할 수 있습니다. 하이퍼텍스트 마크업 언어는 텍스트를 서식 지정하여 인터넷 사용자에게 더 친숙하게 만드는 기능을 제공합니다. 명확하고 논리적인 마크업이 있는 텍스트를 읽는 것이 비구조적인 텍스트를 헤치지 않는 것보다 훨씬 편리합니다.

이전 예제의 코드로 돌아가서 나열된 태그를 자세히 살펴보겠습니다.

요소는 현재 문서의 유형=여기서는 html이겠네 그럼

을 지정하는 DTD(Document Type Definition)입니다. 브라우저가 웹 페이지를 표시하는 데 사용되는 HTML 표준을 정의하는 데 필요합니다. 이것은 짝이 지어지지 않은 태그 중 하나입니다.

태그는 **문자 인코딩을 지정하는 charset 속성**이 있는 문서입니다. 지정되지 않으면 일부 브라우저에서 텍스트 대신 알 수 없는 문자가 표시될 수 있습니다. 태그는 HTML 문서임을 나타냅니다. 태그는 _**브라우저와 검색 엔진이 데이터를 처리하는 데 도움을 주는 요소를 저장하는 데 사용됩**_니다. 태그는 HTML 문서 제목을 포함합니다. 이 태그는 필수는 아니지만 대부분의 인터넷 페이지에 여전히 포함되어 있습니다. <body> 태그는 _**페이지 콘텐츠 영역을 정의합니다. 이는 주요 브라우저 창에 표시된 내용을 감싸고**_ 있습니다. <h1> **태그는 본문 내에서 페이지 제목을 포함**하고, <p> **태그는 단락을 담당**합니다. 이러한 태그는 주요 섹션은 아니지만 예시로 여기에 제공되며, 기본적인 것에서 창의적인 것으로 나아가면서 유용하게 사용될 수 있습니다. # 기본 HTML 페이지 구조 다음은 기본 HTML 페이지 구조의 시각화입니다. HTML 페이지 구조는 HTML 요소의 중첩 원칙을 나타냅니다.

보시다시피 이 구조는 우리의 해부학과 유사합니다.
이 유사성은 여러분이 HTML을 더 잘 이해하는 데 도움이 되길 바랍니다.

결론

확실히 인간과 웹 페이지는 훨씬 더 복잡하고 다양합니다. 현대의 페이지는 매우 크며 내에 많은 다른 태그를 포함할 수 있지만 기본 구조는 항상 동일합니다. 생각해 보면 이것도 매우 인간적인 것이죠.

profile
creative engineer

0개의 댓글

관련 채용 정보