HTML이란
:Hyper Text Makeup Language의 약자로 웹 문서를 만들기 위해 사용되는 기본적인 웹 언어를 말합니다.
어떤 페이지이든 사이트에서 Ctrl+U를 누르면 웹 언어로 된 페이지의 정보를 볼 수 있습니다. 웹(web)은 HTML, CSS, Java Script 등 다양한 언어가 있는데 오늘 알아볼 HTML은 어떤 문서의 구조, 뼈대를 나타내는 언어라고 할 수 있습니다. 이런 HTML 언어로 작성된 문서가 홈페이지이며 이를 사용자에게 보여주는 것이 웹 브라우저라고 합니다. 웹 브라우저의 종류는 익스플로러, 크롬, 오페라, 사파리 등이 있습니다.
HTML의 기본 구조
모든 웹 문서들은 HTML의 기본 구조를 갖고 있는데 시작할 때는 <>로 시작해서 닫을 때는 </>를 이용해서 마무리합니다. <는 꺾새라고 읽으며 /는 슬래쉬라고 읽습니다. 우리는 <> 안에 쓰는 것을 태그라고 읽으며 웹 문서를 만드는 것은 코딩 관련 프로그램이 아니어도 메모장으로 만들 수 있습니다. 초보자의 경우 단축키에 습관을 들이는 것보다 메모장으로 태그의 철자를 익힌 후에 프로그램을 쓰는 것을 추천드립니다. 우리가 자주 보는 웹 페이지들의 HTML 문서는 아래와 같은 형태로 이루어지는데 가장 기본적인 형태는 다음과 같습니다.
- <html>
웹 문서의 시작에 쓰이는 DOCTYPE 선언은 HTML로 작성된 문서를 웹 브라우저에게 버전 정보를 알려주는 역할을 한다. 이는 웹 브라우저의 호환성을 높이기 위해 선언하는 것이며 항상 문서의 최상단에 위치한다. 문자의 대소 문은 상관없다.
- <head>
웹 문서의 head 부분의 시작을 알리는 태그. 홈페이지의 특이사항을 입력한다.
페이지 상단의 탭 정보 입력을 하는 칸이라고 생각하면 된다.
- <meta charset="utf-8">
char = 문자, set = 규칙. utf-8이라는 프로그램으로 문서를 읽으라는 뜻을 말한다. 이는 W3C에서 개발한 다국어 지원 코드로 html 파일을 인코딩할 때 한글이 깨지지 않고 볼 수 있도록 인코딩 방식을 알려주는 코드이다. 이 코드를 사용하지 않으면 html 문서를 정상적인 형태로 볼 수 없다.
- <title>
웹 페이지 상단 탭에 들어갈 제목을 알려주는 역할을 한다.
- <body>
우리가 보는 웹 페이지를 들어갔을 때 보이는 화면을 보여주는 태그이다. 본문의 내용을 나타내는 정보를 입력하며 body 부분의 태그 안에는 사진이나 영상, 글 등 다양한 내용의 태그를 입력할 수 있다.
위처럼 기본적인 태그를 이용해서 나만의 웹페이지를 만들 수 있으며 상세 태그를 통해서 내가 원하는 대로 꾸밀 수 있다. 중요한 것은 저장 시 이 파일이 html 문서라는 것을 알려주기 위해 파일 이름 뒤에. html이라는 표시를 해주어야 웹 문서로 인식한다. 또한 파일 형식을 텍스트 문서(*. txt)가 아닌 모든 파일로 저장해야 파일을 열었을 때 정상적인 웹 문서의 형태를 볼 수 있다.
The average web page에서는 평균적으로 사용되는 수많은 태그 중 가장 많이 쓰이는 태그들을 통계한 자료를 올려놓았는데 10위까지만 알아보겠습니다. 1위 <html> 100%, 2위 <head> 100%, 3위 <body> 98.8%, 4위 <title> 97.1%, 5위 <meta> 95.4% 로 위에서 설명되었던 기본 구조가 가장 많이 쓰이는 것을 알 수 있습니다. 6위 <div> 93.1% 글의 구역을 정하고 분할할 때 쓰는 태그, 7위 <a> 92.6% 링크를 걸 때 사용하는 태그, 8위 <script> 90.4% script 코드를 넣는 태그, 9위 <link> 89.5% css 파일을 연결하는 태그, 10위 <img> 88.9% 사진을 넣을 때 입력하는 태그로 웹 페이지를 볼 때 가장 잘 보이고 잘 사용하는 것들이 높은 사용 빈도를 보였음을 알 수 있습니다.
'web' 카테고리의 다른 글
| 웹 언어 css에 대해 알아보자 (0) | 2022.11.03 |
|---|
댓글