1.서문     2.접근성     3.사용성     4.심미성

4.심미성

  심미성은 대부분의 웹디자이너들이 가장 '중요하게' 생각하는 부분이다. 사실, 보기 좋은 웹사이트가 신뢰성이 높기는 하다. 이런 심미성은 사용성 지침 중 하나일뿐 심미성이 모든 웹디자인 방법론에서 우선순위가 될 수 없다는 것을 기억하길 바란다.

  좋은 웹사이트 디자인에는 눈에 보이지 않는 규칙이 있는데 이런 규칙은 사용자와 디자이너가 서로 말로 약속한 것이 아니다. 인터넷 보급된 이후 사용자들은 무수한 웹사이트의 디자인을 접했으며 이로 인해 사람들은 자신들의 눈에 가장 익숙한 레이아웃이 무엇인지를 부지중에 알게 되었으며 그러한 집단화된 '취향'을 간파한 웹디자이너들이 부지중에 어떤 심미성 패턴을 만들기 시작하는데 이를 보통 디자이너들 간의 '묵시적인 약속'이라고 한다. 이번엔 이 묵시적인 약속이 무엇인지를 살펴보겠다.

1. 모든 디자인 요소들은 그리드를 맞춰라. 사람들의 눈은 복잡한 것을 싫어하므로 레이아웃을 난잡하게 잡아선 안된다. 텍스트든 이미지든 아주 단순하게 한줄에 넣어둘 때 사람들은 아름답게 느낀다. 보통 웹사이트는 세로 2~3단에서 끝낸다. 그 이상은 난잡해 보이고 그 이하는 없어 보인다.
2. 타이틀과 메뉴는 상단 / 왼쪽에 위치시켜야 한다. 사람들은 웹사이트를 접할 때 중간(내용)을 본다고 하지만 실제로 상단 왼쪽에서 시작해서 하단 오른쪽으로 빠른 속도로 정보를 읽어나가게 된다. 이는 어릴 때부터 습득된 책 페이지를 읽는 습관이 웹사이트의 페이지에도 동일하게 적용되기 때문이다.
3. 가능한 이미지의 배경이 웹사이트의 배경과 어울리게 하라. 이미지와 배경의 경계가 단순하고 애매하면 추하게 보인다. 제일 좋은 것은 이미지가 웹사이트의 배경과 똑같은 배경을 가졌을 경우이고 경계면을 흐리게 처리를 하는 것도 그렇게 나쁘진 않다. 최소한 명확한 라운딩 처리라도 해놔야 한다.
4. 폰트는 3가지 이상 사용하지 마라. 폰트의 종류가 많으면 웹사이트의 가독성과 심미성이 떨어지게 된다. 사람들은 새로운 폰트(새로운 환경)를 접할 때마다 약간의 스트레스가 뇌로 전해지며 이로 인해 사람들은 본능적으로 짜증을 느끼게 되어 웹사이트가 아름답지 않다고 느끼게 된다.
5. 텍스트는 많을 수록 좋고 이미지는 적을 수록 좋다. 물론 이 부분은 웹디자이너의 역량에 따라 조절이 필요한 부분이지만 대체적으로 텍스트보다 이미지가 더 많으면 웹사이트가 유치해보인다. 사용자 연령층이 높은 웹사이트일 수록 이미지 사용을 자제해야한다. 이미지는 최대한 단순하고 명확해야한다.
6. 흰 배경에 어두운 색의 폰트를 사용하라. 특수한 경우(사진/영상 사이트)가 아니라면 배경은 흰색으로 처리해야 웹사이트의 심미성이 높아진다. 이는 어두운 배경에 밝은 폰트보다... 밝은 배경에 어두운 폰트가 가독성이 높기 때문이다. 사람들은 눈에 편한 것(가독성 높은 것)을 아름답게 느낀다.
7. 텍스트 안티엘리어싱을 사용하지 마라. 텍스트 안티엘리어싱이란 텍스트가 배경의 색에 잘 어울리도록 텍스트의 경계면을 흐리게 만드는 기술이다. 이런 기술은 편집 디자인에서는 유용하지만 도트로 이루어진 웹 환경에선 사람들로 하여금 심히 불쾌하게 만든다. 도트가 선명한 폰트가 가독성이 높다.
8. 큰 글자가 아니라면 산세리프체의 명확한 폰트를 사용하라. 세리프체란 획의 끝이 삐쭉 나온 폰트를 말한다. 이런 폰트는 가독성이 좋아 편집디자인에서 많이 사용되지만 웹의 세상은 그 반대다. 이런 삐쭉 나온 부분이 도트로 구현될시에 글자가 매우 지저분해 보인다. 그래서 획의 끝이 반듯한 산세리프 계열의 폰트를 사용해야하며 폰트의 선이 올곧은 박스형의 폰트를 사용해야 가독성이 높다. (굴림, 맑은고딕, 윤고딕 등등...)
9. 폰트 크기는 9~10px이 좋다. 그 이상은 너무 추해보이므로 안티엘리어싱을 사용해야하며 그 이하는 가독성이 떨어진다.
10. 알아보기 쉬운 글과 내용으로 컨텐츠를 작성하라. 사람들은 사용자 약관처럼 길고 어려운 글은 아주 빠른 속도로 무시해버린다. 컨텐츠를 알아보기 쉽게 하이라이트, 글번호, 단락 등을 적절하게 써고 글을 명확하게 작성하지 않으면 아름답지 않다고 느끼게 된다. 글도 어렵서 써선 안된다. 초등학생도 알아볼 정도로 쉽게 써라.
11. 광고처럼 보이는 디자인을 피하라. 우리는 부지중에 배너나 팝업 광고같은 디자인을 잘 알게 되었다. 광고 같은 디자인은 웹사이트의 사용성과 신뢰성을 급격히 떨어뜨린다.
12. 생각하게 하는 디자인을 피하라. 단순하고 명확하고 빨리 이해할 수 있는 디자인이 좋다. 웹사이트를 대하는 사람들은 깊이 생각하는 것을 극도로 싫어한다. 어떤 형태의 디자인을 접하면 특별히 누군가 가르쳐주지 않아도 바로 이해할 수 있는데 이런 디자인적 요소를 '제공성'이라고 한다. 제공성이 우수한 디자인이 아름답다.
    

  내가 써 놓은 지침 외에도 상당히 많은 심미성 지침이 있지만 글로 쓰면 오해의 소지가 상당히 많아서 이정도만 쓸까한다. 왜냐하면 학습이 필요한 다른 요소와 달리 웹디자인의 심미성 부분만큼은 오랜 기간 숙달되어 생기는 내공이라서 글로 표현하기에 어려운 점이 많기 때문이다. 이런 심미성 지침은 글로 학습하는 것 보다 직접 경험하고 몸으로 배우는게 좋다.

끝으로..

  내가 일전에 아르바이트천국 프로젝트에 참여했을 때 알게된 메인 웹디자이너 이야기다. 항상 적자이던 파인드잡 웹사이트를 리뉴얼하는 작업이었는데 그 디자이너가 리뉴얼한 이후 웹사이트는 흑자로 돌아섰다. 화려하지는 않았지만 사용성이 매우 우수한 웹디자인이었다. 이러한 심미성, 사용성이 적절하게 시너지 효과를 일으키면서 웹사이트를 성공시킬 수 있었다. (리뉴얼이니 기획은 변한게 없음)

  그 웹디자이너의 연봉이 현재 4,500쯤 된다고 한다. 파인드잡은 접근성 부분이 취약한 웹사이트였지만 이후 아르바이트천국, 간호잡, 강사닷컴(08.06.11 현재 개발중) 등의 프로젝트에선 심미성, 접근성, 사용성을 만족시키는 웹디자인을 성공시켰는데 현재는 이 연봉도 부족하다고 생각될 정도다. 웹사이트를 이쁘게 만든다고 고액 연봉이 되는 것이 아니다. 웹사이트를 통해 사업을 성공시키고 회사에 돈을 벌어다 줘야 고액 연봉 웹디자이너가 될 수 있다. 돈을 벌어다 준만큼 돈을 받는 것이다. 이것은 당연한 이치다.

  이 말을 부정적으로 생각하는 사람이 있을 수도 있겠지만 우리가 회사에 돈을 받고 일하는 입장이라면 당연히 회사에 수익을 올려주고 그 정당한 댓가를 받는 것이 마땅할 것이다. 정말 '내 마음에 드는 디자인'을 하고 싶다면 회사를 나와서 혼자 취미로 만들던지 낮은 수준의 연봉에 만족해야하며 살던지 해야할 것이다.

  다시 한번 말하지만 내가 4페이지에 걸쳐 쓴 이글을 곧이 곧대로 받아들이지 말고 본인들의 환경과 능력, 기질에 맞춰 이해하길 바란다.
 

<<이전글(3.사용성)