새로운 것은 언제나 신나게!!! : 웹사이트 오픈시 체크리스트

2009년 04월 08일

웹사이트 오픈시 체크리스트

smashingmagazine.com 의 최근 자료에 웹사이트 오픈 체크리스트 를 소개하고 있다.
외국의 사례이기는 하지만.. 한국에도 거의 필수적으로 적용할 항목이고, 최근에 웹사이트를 오픈한 경험으로 보면. 이런 체크리스트가 오픈전 꼭 필요했던 자료였다.
15가지 정도로 구분해서 체크를 해놓았다.
이 외에 필요한 체크리스트는 아래의 자료를 활용해볼 수 있다. 체크리스트는 많으면 많을 수록 좋다.(잘 정리된 체크리스트라는 가정하에..)

website_launch_checklist_v1.pdf

1. Favicon
favicon은 아주 단순하고 설치방법도 어렵지 않지만, 브랜드를 알리는데 좋은 도움이 되는 경우이다. 메인 html에 다음의 코드를 한줄 추가하면 된다. Favicon 만드는 사이트는 웹사이트에 많이 나와있으니 생략

<link rel="apple-touch-icon" type="image/x-icon" href="/favicon.ico" />

2. Titles And Meta Data
대대적인 광고를 하지 않는다면.. 타이틀과 메타데이타의 활용은 검색엔진을 통한 사이트 홍보에 최우선이다. 필요하면 메인페이지와는 별도록 페이지별 메타데이타를 활용하는 것이 좋다. 1분만 투자하면 사이트의 가치를 몇백배 높여줄 수있다.

<title>10 Things To Consider When Choosing The Perfect CMS | How-To | Smashing Magazine</title>
<meta name="description" content="By Paul Boag Choosing a content management system can be tricky. Without a clearly defined set of requirements, you will be seduced by fancy functionality that you will never use. What then should you look" />

3. Cross-Browser Checks
다양한 웹브라우저를 통하여 화면이 제대로 보이는지를 확인해 볼 필요가 있다. 이런 체크는 오픈 바로 전이 아니라. 습관화가 필요하다. 꼭 웹표준이라는 단어를 쓰지 않더라도.. 여러가지 브라우져에서 깨지지 않는지를 확인해 볼 필요가 있다.
아래의 두 사이트를 이용하면 쉽게 확인할 수 있다.

Cross-Browser Checks: Services and Test Suites

7 fresh and simple ways to test cross-browser compatibility

4. Proofread
더 설명이 필요없는 말이다. 지속적으로 웹페이지를 살펴보아라.. 한번 보고 끝나지 말고.. 지속적으로 읽고 링크된 것을 끝까지 따라가면서 살펴라.

5. Links
실제 가장많이 나는 오류는 메인 텍스트가 아니라 링크된 페이지이다. 툴중에는 이런 페이지를 잡아내주는 것들이 있는데. 꼭 활용하라..
간단히 웹을 통해서 확인하는 방법도 있다.

W3C Link Checker

6. Functionality Check
기능별로 세부적으로 테스트하라. 필요하면 스트레스테스트나 유저 테스트를 하라. 특히 프론트 화면 보다는 백엔드의 에러를 찾는데는 꼭 프로세스를 쫒아가면서 체크할 필요가 있다.
Silverback - guerrilla usability testing

7. Graceful Degradation
사실 국내 사이트의 어려운 부분이다. 엑티브X가 남발되고 자바스크립트 중심으로 이루어져 있지만.. 사용자들의 브라우저에 따라 자바스크립트를 사용하지 않는 경우도 있으니.. 미리 테스트를 해볼 필요는 있다. 필요해 따라 AJAX로 구현이 가능하다면.. 적용해볼 필요도 있다.

8. Validation
모든 페이지를 Validation 화 하는 것은 사실 쉽지는 않다. 그러나.. 그렇게 하기 위해서 노력할 필요는 있다. 사실. 이 작업도 하다보면. 아주 무심코 사용하는 tags에서 에러가 나는 경우가 대부분이다. 60%이상은 'alt" tags 오류이다.

10 reasons your code won’t validate (and how to fix it)

W3C validator

9. RSS Link
모든 웹사이트에 해당되지 않지만, 사이트안에 블로그가 있을 경우에는 체크할 필요가 있다. RSS리더기 별로 정리해주면 좋을 것이다.

<link rel="alternate" type="application/rss+xml" title="Site or RSS title" href="link-to-feed" />

10. Analytics
통계나 분석에 필요한 웹분석툴은 오픈전에 챙겨야 한다. 이러한 분석데이타는 웹사이트 리뉴얼이나 추가 개발시 아주 중요한 요소가 되어 준다.
구글 등에서 무료로 제공해주고 있으니.. 간단하게 사용할 수있다.

11. Sitemap
새로운 사이트는 항상 복잡하게 여긴다.
무엇보다도 네비게이션, 메뉴가 어떻게 되어있는지 정도는 Sitemap을 통해서 알 수있어야 한다.
서브페이지의 주소변동을 염두에 두고 XML형태로 작성하는 것이 좋다.

12. Defensive Design
에러가 없는 사이트는 없다. 다만 그 에러를 고객에게 어떻게 커뮤니케이션하는 냐도 중요한 요소이다.
특히 404페이지 에러를 단순하게 시스템에러로 처리하기 보다는 흥미를 가져다주는 것도 꼭 필요하다.
에러페이지가 사이트의 홍보페이지로 바뀔 수 있고, 에러를 기다릴 수도 있다.
404 error pages reloaded

13. Optimize
야후의 서비스가 이 부분에서는 좋은 정보를 제공해주고 있다. 사이트가 오픈되면 이미지 크기를 줄이거나, 화면을 최적화하여 고객에게 최적의 환경을 제공해주는 것이 필요하다.
꼭 필요하다.~~