brunch

You can make anything
by writing

C.S.Lewis

by episodekim Jun 05. 2019

04. SEO의 시작은 디자인!

TEXT 디자인은 TEXT로


SEO 텍스트 디자인

SEO 네번째 이야기는? 

SEO와 디자인에 대한 내용입니다. 앞서 1~3편을 읽으신 분 들 중 디자이너분이 계시다면? Script란 말도 나오고, 크롤링이라는 말도 들으면서 아~~~ SEO는 디자이너와는 별개의 일이구나! 라고 생각하실 수 있으실 텐데요...절대 그렇지 않습니다


SEO의 시작은 바로 디자인 입니다!! 


위 첨부된 이미지 보이세요?... 보이신다면? A와 B의 디자인 차이가 보이시나요? 만약 차이가 보이지 않으면 아래 핑크색 설명을 읽고 A와 B의 차이점을 확인해 보세요


이제 보이시죠? A 디자인은 가로로 긴 흰색 네모박스 이미지 안에 "브런치"란 텍스트를 입력 후 이미지로 저장된 형식 입니다. 그래서, 그림자 효과를 주게되면 이미지 박스 전체에 그림자 효과가 나타나게 된 거죠. B 디자인은 "브런치"가 텍스트로 직접 타이핑 되어있어, 마우스로 긁어 보면 글자가 하나씩 잡히는 것을 확인할 수 있습니다.


A 디자인의 특징은? 텍스트가 이미지로 만들어져 있기 때문에, 포토샵 같은 그래픽 툴에서 다양한 효과를 만들 수 있지만, B 디자인은? 폰트에서 지원해주는 기능(컬러변경 / 그림자효과 / 굵게하기 / 밑줄긋기 / 기울이기 등)이 한정적이기 때문에 TEXT로만 디자인 한다는 것은 정말 일입니다.


그렇다면 SEO를 위해 어떤 디자인이 효과적 일까요? 

안타갑게도 정답은? 그 어렵다는 B 디자인 입니다.


내 홈페이지를 네이버에 잘 노출 시키려면, 네이버 크롤러가 내 홈페이지의 정보를 잘 수집해 갈 수 있도록 만들어야 하는데. 현재 검색포털에서의 크롤러는 대부분 TEXT기반으로 수집하고 분류해서 검색결과에 노출하고 있습니다. 


즉, A디자인에서와 같이 TEXT를 이미지로 디자인할 경우, 그 이미지를 설명하는 별도의 TEXT가 없을 경우에는 크롤러가 이미지를 수집한다 해도 이미지 안에 "브런치"라는 TEXT를 파악할 수 없어 검색결과에 노출이 되지 않습니다. (최근에는 이미지 내 TEXT를 인식하는 기술들이 발전하고 있어 머지않은 미래에 이미지 안의 TEXT는 별도의 TEXT로 설명하지 않아도 되는 날이 올것 같긴 합니다.^^)


그런데, 어?! 이상하다....나는 해운대해수욕장을 검색 하니깐 이미지 검색이 잘 되던데....그 이미지를 클릭해 들어가봐도 "해운대해수욕장"이라는 TEXT설명이 전혀 없던데 이건 어떻게 검색된거지? 라고 궁금해 하실 수 있는데요


그 이유는 간단합니다. 그 이미지 안에는 위치정보 TEXT가 포함되어 있기 때문입니다. 이런 정보를 메타데이터(Metadata)라고 부르는데, 메타데이터가 있는 이미지의 경우는? 크롤러가 수집/저장할 때 이미지와 메타데이터를 잘 연결해서 정리해 놓기 때문에 기계가 위치 메타데이터를 통해 "해운대해수욕장"라는 TEXT설명 없이도 "해운대해수욕장"임을 알 수 있는거죠....


즉, 이미지에도 메타데이터라는 TEXT가 존재하기 때문에 가능한 일 입니다. 
그 만큼 검색에서는TEXT가 중요합니다.


따라서, SEO를 고려하고 홈페이지를 만든다면? 되도록이면 TEXT디자인은 이미지텍스트를 배제하고 TEXT로 디자인해 주셔야 합니다. 만약 TEXT를 디자인 컨셉상 이미지로 사용해야 할 경우가 발생한다면? 해당 이미지를 설명하는 html 태그인 alt 태그를 작성해 주셔서 크롤러가 이미지를 인식할 수 있도록 해 주셔야 합니다.


마지막으로, 홈페이지를 TEXT로 디자인 해야하는 이유가 SEO 외에도 2가지 더 있는데요., 만약 공감이 가신다면 향 후 프로젝트를 진행하실 때 한번 고려 보셔도 좋을 것 같습니다. 


첫번째, 시각장애인이 홈페이지를 이용할 때는 홈페이지 내 TEXT를 읽어주는 프로그램을 사용합니다.만약 여러분 홈페이지가 TEXT로 되어 있다면 그 분들도 불편함 없이 사용하실 수 있지만, 이미지를 설명하는 어떤 태그도 없이 이미지로만 홈페이지가 구성되어 있다면 시각장애인은 평생 여러분의 홈페이지를 이용할 수 없게 됩니다.


두번째, 여러분이 글로벌서비스를 준비하고 있다면? 영어, 중국어, 일어, 독어 등 같이 다양한 언어로 번역해서 서비스를 해야 하는데, 사람이 번역할 경우 상당한 비용이 발생합니다. 따라서, 글로벌 서비스를 진행하는 대부분의 회사가 구글에서 제공하는 번역서비스(API)를 이용하게 되는데, 만약 여러분 홈페이지가 이미지로만 되어 있다면 글로벌 서비스를 시작하기 위해 홈페이지 부터 TEXT로 다시 만들어야 하는 상황이 발생하게 될 것 입니다. 


즉, TEXT디자인은? SEO 뿐 아니라, 웹접근성, 글로벌진출을 위해서라도 중요하며

이를 해결해 주실 분들이 바로 디자이너 여러분들 이십니다.


다음시간에는 SEO에서 열일하고 있는 크롤러가 사랑에 빠졌다는데요. 그 이야기를 해 드릴께요^^

감사합니다


미니시리즈 10부작 SEO
01.돈 버는 SEO
02. 내 홈페이지를 누가 가져간다고?
03. SEO로 신규고객 30배 증가
04. SEO의 시작은 디자인!
05.사랑에 빠진 크롤러
06.삼각관계
07.첫만남
08.og는 이야기
09.내 웹페이지 포털 실시간반영
10.내 말이 아닌 남의 말
[번외편]SEO의 역습



표지 이미지출처 : blog.adobe.com


매거진의 이전글 03. SEO로 신규고객 30배 증가
브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari