0
웹에이전시 전문 프리랜서 개발자 프리터코더입니다.
이번 챕터에서는 웹사이트 개발 과정 중 헤드(head) 파일 따로 만들기를 작업합니다.
<헤드(head) 파일 따로 만들기> 글은 웹에이전시의 의뢰를 받아서 프리터코더가 웹사이트를 개발하는 과정을 가상으로 보여주는 웹에이전시의 개발자들은 어떻게 일하나 시리즈 중 하나입니다.
1
웹사이트를 만들 때 개별 페이지보다 선행되어야 하는 일들이 있습니다. 대표적인 것이 퍼블리싱 분해하기입니다.
2
html 은 head와 body로 구성됩니다. head 는 html 문서의 메타 정보 (인코딩, 제목, 사용할 css 와 js) 를 담는 공간이고, body 는 사용자에게 보여지는 부분을 담당하죠.
3
대부분의 경우 head 는 사이트 내 거의 모든 웹페이지에서 비슷하게 구성됩니다. 바뀌는 건 문서 제목 정도일 꺼에요. 그래서 헤드 영역을 재사용하기 위해 퍼블리싱 파일에서 head 부분을 분리합니다.
<!DOCTYPE html>
<html lang="ko">
<head>
... 내용 생략 ...
</head>이런 식으로 잘라낸 다음 /inc/head.php 파일에 붙여넣습니다.
퍼블리셔 팁
css 파일은 대부분의 페이지에서 쓸 수 있게 같은 내용을 구성 부탁드립니다. 어느 페이지에서든 같은 css 파일들만 불러오면 css 가 깨지지 않게요.
만약 매 페이지마다 css 가 다르다면 헤드를 분리해서 넣기가 어렵습니다.
어쩔 수 없이 변경되는 부분이 있다면, 개발자에게 알려주세요.
퍼블리셔 팁
퍼블리싱하신 리소스 파일은 zip 으로 묶어서 전달 부탁드립니다. 일일이 웹에서 직접 들어가서 이미지, css, js, font 다운로드하는거 힘들어요 ㅠㅠ
그리고 css 안에 import 로 선언되어 있거나 한 리소스들을 놓치기도 합니다.
기획자 팁
헤드에 넣을 메타 정보를 알려주세요.
헤드에는 메타 정보가 들어갑니다. 제목, 설명, 키워드, sns 메타정보, 모바일에서 보일 때 정보 등이죠.
이런 것을 미리 정의해 주세요. 그러면 더 검색엔진 친화적인 웹 사이트가 되고, 클라이언트의 만족도가 높아질 겁니다.
