요즘 사회에는
웹 개발, 웹 퍼블리싱(웹 디자인, 웹 프로그래밍의 중간 단계)를
요구하고 있습니다.
잘 알려진 유튜브, 넷플릭스, 아마존 쿠팡 등의 서비스는
웹으로 서비스를 활용하고 있습니다.
즉 '서비스'가 주도하는 시대입니다.
서비스를 통해서 새로운 가치 창출이 발생하는데
이 서비스는 WEB에서 이루어집니다.
WEB은 일종의 연결고리라고 할 수 있습니다.
Windows끼리나 데스크탑과 랩탑, 태블릿과 스마트폰,
안드로이드와 아이폰 등의 연결고리 역할을 하는 매개체입니다.
예전에는 하나의 서비스를 만들기 위해 수십개의 애플리케이션을
만들어야 했던 시절이 있지만
빠르게 변화하는 시대에 살아남기 위해 나날이 발전하고 있습니다.
WEB을 구성하는 것이 바로 HTML입니다.
HTML (Hyper Text Mark-up Language)
Hyper Text는 일종의 링크(Link)라고 생각하면 됩니다.
Mark-up Language 는 태그(Tag)를 사용해서 문법을 표기하는
언어입니다.
하지만 프로그래밍 언어는 아닙니다. (★)
표현 언어라고 할 수 있습니다.
Mark-up Language는 브라우저 화면에 뭔가를 출력하는
기능만 있는 언어입니다.
즉, 웹사이트를 만들 때 쓰는 디자인 언어이고,
인터프리터 방식의 언어입니다.
컴퓨팅 언어에는
컴파일러 언어가 있고
인터프리터 언어가 있는데
컴파일러 언어는 Java로 컴파일하면 .class파일이 실행되고,
인터프리터 언어는 .html 작업을 해서 실행을하면
한줄씩 기계어로 번역해서 실행합니다.
인터프리터 언어는 치명적으로 작용하는 점이 있는데
잘못된 상태에서 실행을 해도 error는 나오지 않기때문에
결과가 어떻게 될지 아무도 모릅니다.
HTML의 기본 구조를 살펴봅시다.
<!DOCTYPE html>
<html>
html 태그는 문서의 모든 내용을 감싸는 역할을 합니다.
문서 그 자체라고 할 수 있습니다.
문서의 시작과 끝을 담당하고
루트태그 (Root Tag)라고도 불립니다.
<head>
head태그는 <html>의 하위 태그입니다.
meta와 title태그 등을 포함합니다.
<meta charset="UTF-8">
meta 태그는 문자 인코딩 방식 및
문서 키워드, 요약 정보를 포함하고 있는 태그입니다.
<title>Insert title here</title>
title은 웹사이트의 제목을 정하는 태그입니다.
</head>
<body>
body태그는 브라우저에 출력할 내용들을 담은 태그입니다.
이 안에 있는 내용은 화면에 출력이 되고,
텍스트, 이미지, 동영상, 음악 등이 이에 해당합니다.
</body>
</html>
<!-- --> 는 주석처리인데
ctrl + shift + /로도 만들 수 있습니다.
태그의 형태는 하나의 DOM(Document Object Model) 객체라고 부릅니다.
DOM 객체의 형태입니다.
<태그명 속성명 = "값" 속성명 = "값" ... > : 시작 태그
텍스트 : 내용
</태그명> : 종료태그
간혹가다가 시작 태그만 있는 경우도 있습니다. (예시 : <meta charset="UTF-8">)
반대로 시작태그와 종료태그만 있는 경우도 있습니다. ( 예시 : <AAA> </AAA>)
중간에 텍스트가 없으면 <AAA/>로도 표현할 수 있습니다.
하지만 가독성을 위해서 남발하지 않는 게 좋습니다.
'HTML > 이론' 카테고리의 다른 글
| [HTML] 테이블 (0) | 2025.01.10 |
|---|---|
| [HTML] Anchor tag (0) | 2025.01.09 |
| [HTML] Multimedia (0) | 2025.01.09 |
| [HTML] 태그 (0) | 2025.01.09 |
| [HTML] Eclipse HTML 초기 설정 (1) | 2025.01.09 |
