 |
| language_HTML |
오늘날 웹 페이지 표시를 위해 개발된 마크업 언어다. 또한 제목, 단락, 목록 등과 같은 본문을 위한 구조적 의미를 나타내며 링크, 인용과 그 밖의 항목으로 구조적 문서를 만들 수 있는 방법을 제공한다. 괄호에 둘러싸인 '태그'로 되어 있는 HTML 요소 형태로 작성한다. CSS와 자바스크립트와 함께 사용되곤 한다. 이 언어에 대해 알아보고자 한다.
마크업 언어 HTML의 역사
1991년에 팀 버너스리에 의해 HTML 1.0이 개발되었다. 이 버전은 웹의 초기 단계에서 사용되었으며, 텍스트의 구조화와 하이퍼링크를 위한 기본적인 마크업 요소들을 포함하고 있었다. 태그는 간단하게 <tag>와 </tag>와 같은 형식으로 작성되었고, 이 버전에서는 이미지나 테이블과 같은 고급 요소는 지원되지 않았다. 1995년, 2.0이 발표되었다. 이전보다 다양한 요소와 기능이 추가되었다. 이미지, 폼 요소, 링크와 관련된 태그들이 도입되었으며, 이를 통해 사용자와의 상호작용이 개선되었다. 또한, 테이블을 생성하기 위한 태그들도 추가되었다. 3.2 버전은 1997년에 발표되었다. 이 버전에서는 다양한 기능과 태그들이 추가되었다. 프레임, 폼 요소와 관련된 개선이 이루어졌으며, 테이블, 이미지 맵, 폼 요소들에 스타일을 적용할 수 있는 태그들이 도입되었다. 또한, 스타일 시트의 개념이 처음 소개되었다. 스타일 시트는 웹 페이지의 스타일과 레이아웃을 제어하기 위한 방법을 제공했다. 1999년 4.01이 발표되었다. 이 버전은 웹 표준화 단체인 W3C에서 공식 표준으로 제정했다. 4.01에서는 프레젠테이션과 구조를 분리하기 위한 노력이 진행되었다. 스타일 시트와 스크립트를 사용하는 방법이 개선되었고, 프레임, 폼, 테이블 등에 관련된 요소들이 개선되었다. XHTML 1.0이 1999년 발표되었고, 엄격한 XML의 규칙을 따랐다. 웹 문서의 구조와 의미를 더욱 명확하게 정의하고 웹 호환성을 향상하는 것이 목표였다. 2014년 W3C에서 HTML 5를 공식 표준으로 지정했다. 이전 버전의 단점을 보완하고 새로운 기능을 도입하여 웹의 진화에 기여했다. 오디오, 비디오, 그래픽, 캔버스 등의 멀티미디어 기능을 내장했다. 로컬 저장소, 웹 워커, 웹 소켓 등을 통해 오프라인 작업, 백그라운드 작업, 실시간 통신 등을 지원한다.
특징
웹 페이지의 구조를 정의하기 위한 태그를 사용한다. 각각의 태그는 특정한 의미와 역할을 가지며, 웹 브라우저는 이러한 태그를 해석하여 적절한 형태로 페이지를 표시한다. 일반적으로 시작 태그와 종료 태그로 이루어지며, 시작 태그는 `<tag>` 형태로 작성되고, 종료 태그는 `</tag>` 형태로 작성된다. 요소들을 중첩하여 계층 구조로 표현할 수 있다. 이에 따라 웹 페이지의 구조를 명확하게 표현할 수 있고, 스타일이나 스크립트 등의 추가 작업을 수행하기에 용이하다. 예를 들어, `<body>` 요소 안에는 `<header>`, `<nav>`, `<main>`, `<footer>` 등의 요소들이 중첩될 수 있다. 한편, HTML은 다양한 요소를 제공하여 웹 페이지를 구성할 수 있다. 텍스트를 나타내는 요소(`<p>`, `<h1>`, `<span>` 등), 이미지를 표시하는 요소(`<img>`), 링크를 생성하는 요소(`<a>`), 목록을 만드는 요소(`<ul>`, `<ol>`, `<li>`), 테이블을 생성하는 요소(`<table>`, `<tr>`, `<td>` 등), 폼 요소(`<form>`, `<input>`, `<select>`, `<textarea>` 등) 등이 있다. 각각의 태그는 특정한 의미를 갖고 있으며, 이에 따라 웹 페이지의 구조와 콘텐츠를 의미상으로 설명할 수 있다. 예를 들어, `<h1>` 요소는 페이지의 주요 제목을 나타내고, `<nav>` 요소는 내비게이션 링크를 포함하는 섹션을 정의한다. 검색 엔진이 페이지를 이해하고 콘텐츠를 분석하는 데 도움이 된다. 이 언어는 웹 접근성을 고려하여 설계되었다. 모든 사용자, 포괄적으로는 장애를 가진 사용자나 다양한 디바이스를 사용하는 사용자들도 웹 콘텐츠에 접근할 수 있도록 해준다. 위 언어는 시맨틱한 요소, 대체 텍스트 제공, 키보드 접근성 등을 지원하여 웹 페이지의 접근성을 향상할 수 있도록 한다.
단점
구조를 정의하기 위한 마크업 언어로 설계되었지만, 옛 버전에서는 의미적인 요소의 부재로 인해 구조가 명확히 드러나지 않는다. 예를 들어, `<div>` 요소는 일반적으로 구조를 정의하기 위해 사용되지만, 그 자체로는 어떠한 의미도 갖고 있지 않다. 스타일링에도 제한이 있다. 스타일과 레이아웃을 자세하게 제어하려면 CSS를 사용해야 한다. HTML은 스타일링을 위한 일부 요소들을 제공하지만, 복잡한 디자인이나 고급 레이아웃을 구현하기 위해서는 CSS와 함께 사용해야 한다. 웹 브라우저에 따라 일부 기능이나 레이아웃이 다르게 표현될 수 있는 호환성 문제가 있다. 특히 구형 웹 브라우저에서는 최신 HTML 표준을 지원하지 않는다. 따라서 개발자는 다양한 웹 브라우저와 버전에 대한 호환성을 고려하여 개발해야 한다. 사용자로부터 입력을 받을 수 있는 폼 요소를 제공한다. 그러나 잘못된 구현이나 취약한 보안 설정으로 인해 크로스 사이트 스크립팅(XSS) 및 기타 보안 취약점이 발생한다. 이러한 취약점을 최소화하기 위해 적절한 입력 유효성 검사, 데이터 필터링 및 보안 조처를 해야 한다. 대규모 프로젝트에서 HTML만을 사용하여 웹 페이지를 관리하면 유지보수가 어렵다. 반복적인 코드 작성을 유발할 수 있고, 변경 사항을 전체 페이지에 적용하기 어려울 수 있다. 이를 해결하기 위해 템플릿 엔진이나 프론트엔드 프레임워크를 사용하여 코드 재사용성과 유지보수성을 향상할 수 있다.
결론
HTML은 웹의 기본적인 구성 요소로써, 웹 페이지의 구조와 콘텐츠를 정의하는 데 사용된다. 이러한 특징들을 통해 웹 페이지의 구조를 명확히 정의하고, 검색 엔진이나 웹 브라우저 등과 같은 도구들이 웹 콘텐츠를 해석하고 처리할 수 있도록 한다.
댓글
댓글 쓰기
안녕하세요. 부투하는코린이 입니다. 욕설, 비방, 관련없는 광고성 댓글은 삭제될 수 있습니다. 감사합니다.