HTML은 Hyper Text Markup Language의 줄임말로, 웹페이지를 구성하는 화면의 뼈대를 구축하기 위해 동작하는 언어입니다. 우리는 인터넷을 활용해 많은 업무를 처리합니다. 웹 브라우저만 있으면 어떤 디바이스에서나 인터넷과 연결되는 시대에 살고 있습니다. 이런 다양한 인터넷의 정보를 웹 브라우저에서 사용자에게 보여 줄 때 사용되는 언어가 HTML입니다.
HTML은 어떤 언어입니까?
우리가 컴퓨터에서 사용하는 모든 파일에는 고유의 파일 형식이 있습니다. PPT로 문서를 작성하면 '.ppt'라는 확장자 파일로 저장됩니다. 웹도 마찬가지로 웹 사이트를 사용되는 문서는 웹에 맞는 '.html'이라는 확장자가 붙어서 다른 파일의 확장자와 구분되어 클릭을 하면 웹 브라우저가 실행이 되면서 그 내용이 표시되게 됩니다.
일반적인 문서 프로그램은 내용을 입력하는 프로그램과 이후 내용을 확인하는 프로그램이 동일하지만 웹문서의 경우는 웹 문서를 작성하는 프로그램과 그 내용을 보는 프로그램이 다릅니다. 우리가 일반적으로 이야기하는 웹 브라우저(Web Browser)는 프로그램을 보는 것이고 웹 편집기(Web Editor)는 웹의 문서를 작성하는 프로그램을 의미합니다.
그렇다면 HTML은 무엇일까요? 앞서 HTML은 Hyper Text Markup Language의 줄임말이고 웹 화면의 뼈대를 구축하기 위해 동작하는 언어라고 말씀드렸습니다. 해석하면 HTML은 하이퍼텍스트를 마크업 해주는 언어라고 말할 수 있습니다. 하이퍼 텍스트(Hyper Text)는 웹 브라우저에서 링크를 클릭해서 사이트로 바로 이동할 수 있는 기능을 말하며, 마크업(Markup)은 태그(Tag)를 사용해서 문서의 어떤 부분이 제목이고 어떤 부분이 사진인지 또는 영상인지를 표시하는 것을 말합니다. 즉, 웹에서 자유롭게 이동할 수 있는 웹 문서를 만드는 언어가 HTML입니다.
웹 문서를 열어보면 문서의 소스를 확인할 수 있습니다. 소스에서 꺾쇠괄호(<,>)로 묶여 있는 부분이 HTML 태그이며 이렇게 태그를 붙이는 것이 마크업입니다. 우리가 자주 사용하는 웹 사이트는 HTML과 CSS로 이루어져 있습니다. CSS는 다음 포스팅에서 알아보도록 하겠습니다.
웹 사이트를 만들 때 지켜야 하는 약속을 웹 표준이라고 합니다.
HTML5를 웹 표준 기술이라고 합니다. 왜 이런 표준 기술이 필요할까요? 우리의 세상은 표준화된 단위를 사용합니다. 옷의 사이즈, 부피와 길이를 측정하는 단위 등 우리는 이런 표준단위를 통해 내가 필요한 물건을 구매하기 전 그것이 나에게 맞는지 나의 상황에 사용할 수 있는지를 판단합니다. 만약 이런 표준단위가 없다면 우리는 우리가 필요한 것들을 직접 만들어야 하는 세상에서 살아야 할지 모릅니다.
HTML도 마찬가지입니다. 어떤 웹 사이트는 익스플로러에서만 구동되고 어떤 사이트는 크롬에서만 구동된다면 사람들은 자유롭게 웹 사이트를 이용할 수 없습니다. 각각의 용도에 맞는 웹 사이트를 다시 만들어야 하는 상황이 생길 수 도 있습니다. 이 때문에 나온 것이 웹 표준이고, 웹사이트를 만들 때 꼭 지켜야 하는 약속들을 정리한 것입니다. 웹 표준을 준수해서 웹 사이트를 제작하면 사용자는 브라우저에 상관없이 손쉽게 웹 사이트를 볼 수 있으며, 개발자들도 개발 시간과 노력을 줄일 수 있습니다. HTML5는 웹 문서를 만들기 위해 웹표준을 준수하는 기본입니다.
왜 HTML5와 CSS3를 알아야 할까요?
웹 디자이너와 웹 개발자가 되기 위해서는 HTML5와 CSS3라는 최신 기술을 익혀야 합니다. 그렇다면 개발자들은 왜 이런 최신 언어를 배워야 할까요?
- 웹 표준을 준수하는 웹 사이트를 제작할 수 있습니다.
이제는 거의 모든 디바이스에서 인터넷이 연결됩니다. 다양한 디바이스를 위해 각기 따로 코딩을 하는 것은 불가능합니다. 따라서 모든 웹 브라우저에서 HTML5를 통해 동일한 웹 표준에 맞는 문서를 작성할 수 있습니다. 이렇게 작성된 웹 문서는 PC를 비롯한 모바일기기, 가전제품, 자동차 등 모든 기기에서 웹 문서의 내용을 정확하게 파악할 수 있습니다. 또 HTML5와 CSS3를 함께 활용한다면 사용자의 모든 기기에 반응하여 레이아웃이 바뀌는 반응형 웹 사이트를 만들 수 있습니다.
- 모바일 앱 화면 디자인의 기초입니다.
HTML5를 활용하면 누구나 애플리케이션(Application)을 만들 수 있습니다. 안드로이드나 iOS 같은 모바일 운영체제에 맞는 앱을 개발할 수 있고 API를 활용하여 모바일 운영체제와 상관없이 실행할 수 있는 '웹앱'을 만들 수 있습니다.
- 웹 사이트와 블로그 수정이 쉽습니다.
HTML5를 몰라도 워드프레스 같은 사이트 제작 도구를 사용해 웹 사이트와 블로그를 만들 수 있고 내가 원하는 테마나 스킨 등을 이용해서 페이지의 디자인을 다양하게 바꿀 수 있습니다. 물론 이렇게 하기 위해서는 그 소스를 이해해야 하는데 특히 사이트나 블로그의 형태를 바꾸려고 한다면 반드시 CSS를 알아야 합니다.
댓글