웹페이지를 만들어 보면 알겠지만, 페이지를 새로 만들 때마다 늘 똑같은 HTML 태그를 입력하게 됩니다.
<!DOCTYPE html>, <html>, <body> 같은 태그는 웹페이지의 뼈대를 구성하는 요소로, 화면에 직접 표시되는 내용은 아니지만 보통 페이지마다 입력하게 되죠.
다음과 같은 코드를 페이지를 만들 때마다 매번 입력하게 됩니다.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
...
</body>
</html>
하지만 Essepage에서는 이런 코드를 입력하지 않아도 괜찮습니다.
<h1>Hello, world!</h1>
<p>Welcome to my website.</p>
이렇게 본문에 해당하는 내용만 입력하면 나머지는 알아서 처리해 준답니다.
개인적으로는 웹페이지를 처음 만들어 보려는 분들이 HTML 문서 전체를 보고 어렵다...고 느끼거나, 웹페이지는 전문가의 영역이야... 하고 생각하는 경우도 적지 않을 것 같아요.
입력하지 않으면 어떻게 되냐고요?
사실 큰 문제는 없습니다. 요즘 브라우저들은 똑똑해서 <html>, <head>, <body> 태그를 생략해도 HTML을 해석하면서 필요한 요소들을 알아서 만들어 줍니다.
게다가 Emmet을 사용하면 ! 하나 입력하고 Tab 키만 눌러도 HTML 문서의 기본 골격이 순식간에 만들어집니다. (Essepage 에디터에도 Emmet이 내장되어 있답니다.)
그러니까 사실 이 태그들을 입력하는 게 그렇게 어려운 일도 아니죠. :)
하지만 수없이 반복해서 입력하다 보니 어느 순간 이런 생각이 들었습니다.
페이지를 만들 때마다 이걸 입력해야 하나?
페이지를 만들 때는 내용을 생각하고 만들지, HTML의 골격을 생각하진 않습니다.
작업하고 싶은 건 내용인데, 굳이 골격을 매번 입력해야 할까요?
같은 작업을 매번 하는 거라면, 자동으로 추가하면 되겠다고 생각했습니다.
그래서 Essepage에서는 골격을 구성하는 태그를 입력하지 않아도 자동으로 구성해 주도록 했습니다. 엄청난 기능은 아닌데 사용하면 할수록 편리해요. 에디터를 열고 내용만 입력하는 게 생각보다 많이 편리했습니다.
Essepage에서는 골격을 포함한 HTML 문서 전체를 입력하는 대신, 실제 페이지에 필요한 내용만 입력하면 됩니다. 나머지 문서 구조는 알아서 처리하죠.
<!DOCTYPE html>, <html>, <body>를 직접 입력할 필요가 없답니다.
물론 필요에 따라 직접 입력할 수 있습니다.
예를 들어 <head>에 무언가 추가하고 싶을 때도 있습니다. 그럴 때는 다음과 같이 페이지에 <head>를 바로 입력하면 됩니다.
<head>
<title>My Website</title>
<meta name="description" content="A little corner of the web.">
</head>
<h1>Hello, world!</h1>
<p>Welcome to my website.</p>
Essepage는 <head> 안의 내용을 실제 HTML 문서의 <head>에, 그 밖의 내용은 <body>에 알아서 넣어 줍니다.
여기에 작은 편의 기능이 하나 더 있습니다.
<title>을 따로 입력하지 않았다면, 본문에 있는 <h1>의 내용을 페이지 제목으로 자동 설정합니다.
<h1>My First Website</h1>
<p>Hello, world!</p>
이렇게만 입력해도 브라우저의 페이지 제목은 My First Website가 됩니다.
같은 제목을 두 번 입력할 필요는 없으니까요. :)
여러 페이지에서 공통으로 사용하는 설정이 있다면 +head.essepage 파일에 한 번만 입력해 둘 수도 있습니다. (Essepage의 특별한 Head Layout 기능이랍니다. 나중에 블로그를 통해 자세히 다루겠습니다.)
사실 별것 아닌 기능처럼 보일 수도 있습니다. HTML 코드 몇 줄 줄인다고 개발 환경이 달라지는 건 아니니까요.
하지만 저는 이런 작은 차이들이 쌓이면 큰 차이를 만든다고 생각합니다.
웹페이지를 만들고 싶을 때, 기본 구조를 매번 입력하지 않고 지금 만들고 싶은 것에 바로 집중할 수 있다는 것. 이게 생각보다 편리해요. 뭐랄까, 조금 과장하자면 마음의 짐이 조금 덜어진 듯한 느낌...?
Essepage를 개발하면서 중요하게 생각하는 것 중 하나도 바로 이것입니다.
반복해야 하는 작업이라면 가능한 한 자동으로 처리하고, 그게 어렵다면 적어도 한 번만 하면 되도록 만들자.
이 생각이 Essepage 개발에 담겨 있는 철학입니다.
그런데 HTML 태그를 입력하는 것뿐 아니라, 웹사이트를 처음부터 만드는 것 자체가 귀찮다고요?
그렇다면 Essepage의 복제(Duplicate) 기능을 사용해 보세요. 이미 만들어진 프로젝트를 복제해서 시작할 수도 있습니다.
매번 같은 방식으로 웹페이지를 만든다면, 템플릿으로 사용할 프로젝트를 만들어 놓고 복제하여 시작할 수 있습니다.
이제 정말 귀찮은 게 또 남아 있을까요? ㅎㅎ
혹시 페이지를 만들다가 같은 작업을 여러 번 반복하고 있다고 느끼시나요?
그렇다면 저에게 알려주세요. Essepage에 반영해 나가겠습니다.
이런 거 없애는 걸 꽤 좋아하거든요. :)