[웹 퍼블리셔 성장기 1편] 웹 퍼블리셔, 뭐하는 직종이야?

"웹 퍼블리셔(Web Publisher)란, 디자인된 페이지를 웹 화면으로 구현하며,

HTML, CSS, JavaScript를 기본 소양으로 가지고 있어야 한다."

---

웹 퍼블리셔의 사전적 수행 직무는,

웹디자이너, 웹프로그래머, 웹기획자 등과 웹사이트의 제작 및 진행방향 등에 대해 협의하고 조언한다. 웹디자이너 또는 HTML 코딩원에 의해 코딩된 작업물을 ¹웹 표준, ²웹 접근성, ³크로스 브라우징, ⁴시멘틱 마크업 원칙에 맞추어 코딩한다. 작업 결과물을 웹프로그래머, 웹기획자 등에게 전달한다. 운영 중인 웹사이트를 점검하여 웹 표준, 웹 접근성 등에 부합하는지 검토하기도 한다.

출처: 고용노동부 한국 고용정보원 워크넷

실무에서 경험한 수행 직무는,

기획서를 보고 구현 가능 여부를 판단하고, 디자이너의 디자인을 검토하면서 디자인을 '웹에 알맞게' 변경할 수 있도록 협의한다. 개발자와는 어떤 방식으로 코딩하면 데이터를 연결하기 더 수월한지 협의하면서 기획-디자인-개발 모든 포지션을 아우르는 중요한 포지션을 맡고 있다.

1. 웹 퍼블리셔가 되려면 뭐가 필요하지?

여러 회사를 거치면서 웹 퍼블리셔로 일해 온 결과, 기획자 못지않게 전반적으로 폭넓은 지식을 갖추고 있어야 하는 직종임을 깨달았다. 기획자의 의도를 알기 위해 기획에 대한 이해도가 필요하고, 디자이너의 디자인을 보고 소통하려면 디자인의 기본적인 지식도 필요하다. 그리고 사이트에 필요한 기능이나 데이터를 추가하기 위해 개발적인 지식도 필요하다.

이는 실무를 진행하다 보면 자연스럽게 쌓이는 것들이지만, 개인적인 공부를 게을리하게 되면 협업하기가 쉽지 않고, 결국 그저 그런 작업자가 되기 쉽다. 즉, 꾸준히 발전하고자 하는 마인드가 가장 중요하다.

그다음이 기술적인 부분들인데, 가장 필요한 것들을 우선적으로 소개한다.

1) HTML (HyperText Markup Language)

HTML은 흔히 마크업이라고 많이 불린다. 웹 페이지를 구성하는 골격과 같으며, 종이에 있는 내용을 웹으로 보여주는 것과 같다. 웹 퍼블리셔가 진입 장벽이 낮은 이유가 여기에 있다. 배우기 정말 쉬운 언어이면서 화면에 바로 보여주기 때문에 무엇을 잘못했는지 알 수 있다. 

단, 어떤 요소와 어떤 속성을 사용하느냐에 따라 구조, 골격이 잡히게 되는데 구조화가 잘 되어 있을수록 웹 접근성이나 SEO를 향상해준다. 웹 퍼블리셔의 마크업은 기획서와 디자인을 보고 문서의 구성 요소들이 어떤 의미를 가지고 어떻게 쓰이는지 해석하고 판단하여 그에 맞도록 문서를 구조화하는 것이다.

2) CSS (Cascading Style Sheets)

CSS는 웹 페이지의 비주얼을 담당한다. 쉽게 이야기하면, HTML은 사람의 얼굴이고, CSS는 화장이다. 화장에 따라 다르게 보이듯, CSS를 어떻게 사용하느냐에 따라 웹 페이지의 퀄리티는 천차만별로 달라진다.

비주얼적인 부분에서 약하다고 걱정된다면 걱정 마시라. 우리에겐 디자이너가 있다! (물론, 디자이너를 겸하는 퍼블리셔도 있다. 그런 분들에겐 존중을 표한다.) 디자이너가 디자인을 넘겨주었을 때 CSS 숙련도에 따라 코딩 난이도가 달라진다.

3) JavaScript (자바스크립트)

웹 퍼블리셔로 일한다면 떼려야 뗄 수 없는, 자바스크립트는 '동적 표현'을 하기 위해 필요한 언어다. 모바일에서 메뉴를 보기 위해 햄버거 모양(三)의 아이콘을 눌러본 적이 있을 것이다. 메뉴를 눌렀을 때 혹은 터치했을 때 메뉴가 나타날 수 있게 해주는 것이 자바스크립트의 역할이라고 보면 된다.

타 프로그래밍 언어에 비해 진입 장벽이 낮은 편이지만 깊이 들어갈수록 어렵다. 특히 이전과 달리 웹이라는 한계를 벗어나 하나의 프로그래밍 언어로 자리를 잡기 시작하고 있어 공부가 많이 필요하다.

4) jQuery (제이쿼리)

자바스크립트를 활용하기 어려운 사람들을 위해 나온 라이브러리다. 자바스크립트 기반으로 이루어져 있으며, 길고 긴 자바스크립트 언어를 축약해 사용할 수 있도록 해두어서 굉장히 편리하다. 다만 제이쿼리보다 자바스크립트를 먼저 선행할 것을 권한다.

그리고 시대의 흐름에 따라 제이쿼리 사용률은 급감하고 있고, 자바스크립트 기반으로 만들어진 Angular, React, Vue라는 프레임워크들이 웹의 생태계를 지배하고 있다. 하지만 여전히 우리나라에서는 제이쿼리를 사용하는 기업도 많기 때문에 알아두는 것도 나쁘지 않다.

2. 웹 퍼블리셔와 프론트엔드 개발자

웹 퍼블리셔라는 직종은 우리나라에만 존재한다. 신현석이라는 사람이 만든 직종인데, 웹을 출판하는 사람이라는 의미에서 웹 퍼블리셔라는 명칭을 만들어냈다고 한다. HTML, CSS를 주로 다루고, 자바스크립트를 이용해 화면 동작 제어는 웹 퍼블리셔가, 데이터를 연결하고 유효성 검증을 하는 것은 프론트엔드 개발자가 하는 일이라고 역할을 구분하고 있다.

개인적으로 프론트엔드 개발자는 웹 퍼블리셔까지 포함한다고 생각한다. 프론트엔드는 결국 클라이언트단, 즉 유저가 보는 페이지를 모두 만드는 영역인 만큼 웹 퍼블리셔의 역할도 포함한다. 그렇다면 웹 퍼블리셔는 프론트엔드 개발을 할 수 없는가 하면, 그것은 '아니오'다. 오히려 웹 퍼블리셔라서 프론트엔드 개발에 관심을 가져야 한다. 이와 마찬가지로 프론트엔드 개발자들도 웹 퍼블리싱에 관심을 가져야 한다!

명칭의 차이일 뿐, 웹 퍼블리셔나 프론트엔드 개발자나 똑같이 클라이언트 단을 개발하는 직종이다. 다만 프론트엔드 개발자에게 요구되는 요소들이 있는데, 그것은 다음에 다루어보도록 하겠다.

---

1) 웹 표준: 국제 표준화 단체인 W3C가 지정한 표준안에 따라 목적과 방법에 맞게 웹 페이지를 만드는 것

2) 웹 접근성: 장애인뿐만 아니라 모든 사람이 인터넷 공간에서 손쉽게 정보를 얻을 수 있도록 웹사이트를 제작하는 것

3) 크로스 브라우징: 어떤 웹 브라우저를 써도 화면이 똑같이 나오고, 브라우저에 따라 입력과 사용에 문제가 생기지 않음

4) 시멘틱 마크업: 어떤 사용자 환경에서도 브라우징에 제약이 없도록 하는 코딩