본문 바로가기

웹 < 프론트앤드 >/HTML

HTML 기본 구조 및 코딩의 기본

728x90
반응형

 

<<!doctype html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport"
        content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
</head>
<body>

</body>
</html>

초기 기본 HTML파일을 생성할때 / index.html 형식을 많이 사용

 

 

<<!doctype html> /* HTML이 지켜야 하는 표준을 알려주는 DTD (Document Type Definition)*/
<html lang="en"> /* HTML 의 언어 지정*/
<head>
  <meta charset="UTF-8">
  <meta name="viewport"
        content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
</head>
<body>

</body>
</html>

 

 

TAG

 meta = 정보를 알리다 

-> meta 태그는 븝라우저에 보이는 내용은 아닙니다.

     검색 엔진 최적화를 하는 데 중요한 태그이며 하나의 웹 사이트 정보를 담는 중요한 태그입니다.

    meta 태그의 내용은 검색 엔진이 웹 사이트를 파악할때 기본으로 사용하고 있습니다.

 

코딩의 기본

 

1) 일관성 있고 표준화된 코드를 사용합니다.

   -> HTML 파일 속에 사용된 코드는 일관성을 가지고 마크업되어 있어야 합니다.

        약속된 언어로 공통 구조를 마크업하여 표준화된 방법으로 제공한다면 일관성 있는 코드 사용으로

        가독성을 높히고 구조는 그룹화되어 체계적으로 제공할수 있습니다.

 

2)  접근성을 지키며 작성합니다.

      -> 웹에서 제공하는 모든 문서의 정보는 비장애인과 고령자도 동등하게 접근하고 이용할 수 있도록

           만들어야 합니다. 이것을 웹 접근성이라 하며 웹 접근성 준수는 법적 의무 사항입니다.

 

3) 가독성을 고려하여 작성합니다.

     -> HTML 태그는 가독성을 고려해서 작성해야 합니다. HTML로 작성된 코드가 사용자에게 전달되는

          것에만 목적이 있는 것은 아닙니다.

          여러 사람과 협업하여 웹 사이트를 만들수도 있기에 코드의 가독성을 고려해서 작업해야 합니다.

 

 

728x90
반응형

'웹 < 프론트앤드 > > HTML' 카테고리의 다른 글

HTML 문서의 레이아웃  (0) 2023.04.12
Doctype, HTML, HEAD, BODY  (0) 2022.11.14
HTML  (0) 2022.10.30