5:03

금번 소개할 툴은, 검색엔진최적화 또는 개발자의 입장에서 웹페이지의 스파이더뷰(Spider view) 즉, 검색엔진이 바라보는 웹페이지는 어떠한 형태인가에 대한 확인이 필요한 경우 이용할 수 있는 웹분석툴로서, 스파이더 입장에서의 위지윅이 아닌, 소스뷰 형태의 결과를 제공하는 툴이라고 말씀드릴 수 있습니다.

국내의 경우, 검색엔진최적화 등에 별반 관심이 높지 않은 여건이기 때문에, 스파이더뷰를 사용할만한 유저층은 대부분 W3C의 확인과 코딩오류 등을 체크하고자 하는 블로그 스킨 디자이너 및 웹어플리케이션 개발자가 주를 차지하고 있으므로, 이에 해당하지 않는 직업군의 경우에는 사실상 스파이더뷰를 접할 이유가 많지는 않습니다.

스파이더뷰는 말 그대로, 검색엔진이 해당 HTML 소스를 잘 인식하는가 아닌가의 여부를 판단하기 위한 기초툴이긴 하나, 여기에서 소개하는 툴, Web-Sniffer 라는 것은 소스뷰와 더불어 웹페이지의 헤더값에 대한 송수신 출력을 함께 지원하므로 개발자 입장에서는 반드시 검색엔진최적화를 염두하지 않는다 하더라도, 일반공통의 경우 하에서 헤더가 올바르게 출력되고 있는지를 확인할 수 있는 판단기준을 마련해 준다는 이점이 있죠.

헤더값이 검색엔진최적화에 미치는 영향 가운데 대표적인 예는 404 에러가 302, 301 리다이렉트에 있지 않을까 생각합니다.

존재하지 않는 페이지에 404 헤더를 표기하지 않는 경우와 더해, 이 존재하지 않는 페이지들이 관리한계를 벗어날 만큼 지속적으로 쌓여가는 경우 검색엔진은 해당 웹사이트에 분명한 페널티를 적용시킵니다.

아울러, 302 리다이렉트를 지속적으로 남발하는 페이지가 다수 존재하는 경우 또한 검색엔진최적화에 있어 상당한 불리점이 아닐 수 없긴 마찬가지이고요. (단, 301리다이렉트는 검색엔진최적화에 도움이 됩니다.)

따라서, 자신이 만든 웹페이지가 올바르게 404, 302, 301 헤더를 송신하고 있는지, 검색엔진 및 브라우저들은 이들 헤더값을 올바르게 인식하고 있는지를 판단하고자 하는 경우에 본 Web-Sniffer는 매우 유용한 쓰임새를 갖게 된다고 볼 수 있습니다.




위 이미지는 웹스니퍼를 통해 http://towons.kr/blog 에 대한 스파이더뷰와 헤더출력을 요청한 예입니다.

상단의 박스 첫머리에 "본 페이지는 영구적으로 301 리다이렉트됨" 이라는 문구가 나옵니다.
웹사이트와 다르게 블로그들은 대부분 httpd.conf 에서 주소별 리다이렉팅을 실시하는 구조를 갖기 때문에 올바르게 출력되야 할 블로그라면 위와같이 블로그의 첫페이지가 반드시 301로 나와야 검색엔진최적화에 불이익이 없습니다.



위 이미지는 여타의 웹사이트들보다 분명 검색엔진최적화를 잘했을 것이라고 생각하는 http://www.seo.com 에 대한 스니퍼를 요청한 결과입니다.

앞서 이야기한 바와 같이, 블로그가 아닌 웹사이트인 경우 헤더값은 반드시 200 이 되어야만 합니다.

여기에 더하여, 위 사이트의 경우 Cache-Control 이라는 메타태그를 사용해서 no-stoe, no-cache 등의 명령들을 통해 검색엔진최적화에 보다 접근할 수 있는 힌트들을 제시하고 있다는 점도 눈여겨 볼 수 있고요. (Pragma도 포함됨)

직접 웹스니퍼를 통해, 위 사이트의 URL을 기입하여 소스뷰를 해보면 SEO.COM이 검색엔진최적화를 위해 차용한 태그들과 관련하여 더욱 자세한 정보들을 얻을 수가 있는데, 대표적으로는 아래와 같은 것들이 포함되어 있음을 확인할 수 있습니다.


검색엔진최적화를 위한 가장 좋은 길은 사실상 특정 키워드와 관련하여 높은 순위를 먹고 있는 남의 사이트를 하나하나 까보는게 최적의 답입니다. 물론 INNER SEO 만 그런거고, OUTER SEO는 또 다르지만요 (OUTER SEO는 대개 인바운드링크가 주 골자)

무튼, 검색엔진최적화를 생각한다면 일단은 내 사이트의 오류처리(헤더)가 제대로 수행되고 있는지, 검색봇이 잘못 파악하고 있는 HTML코드는 없는지를 확인하는 차원의 일환에서라도 웹스니퍼는 가끔씩이나마 반드시 사용해 보실 것을 권유드립니다.

------

결론인즉, 스파이더뷰는 검색엔진최적화에 있어 빼놓은 수 없는 툴가운데 하나라는 사실?

로그분석기를 필요로 하는 경우는 대체적으로, 웹사이트를 운영하고 있거나 웹서비스를 제공하고 있는 분들에 한정될 확률이 높을 것으로 생각하고 있지만, 개인도메인에 기반한 블로그를 운영하는 사용자 입장에서도 단순 "방문카운트" 가 아닌, 보다 다양한 정보에 기반할 수 있는 로그분석기를 선호할 것은 의심할 여지가 없을 것입니다.

다만, 시중에 널리 퍼져 있는 대다수의 상용 로그분석기는 매월 일정액의 "사용료" 를 지불해야 하는 부담이 존재함과 더불어, 무료로 사용할 수 있는 로그분석기의 대표주자인 구글 웹마스터 도구(링크) 와 다음 웹인사이드(링크)는 개략적이면서도 합축적인 정보는 파악할 수 있을 지언정, 개별 트래픽의 분석이 불가능하다는 불편함을 갖고 있는 한편, 오래전부터 일부의 사용자들이 사용해왔던 N@LOG(링크)는 지원하는 분석툴이 다소 부족한 탓으로 인해, 실상 대부분의 사용자(특히 기업)는 상용 로그분석기를 이용하게 마련이었습니다.

그러나 해외에서는 오래전부터 로그분석기와 관련한 오픈소스 프로젝트가 진행되어 왔으며, GNU 개발자들의 노력을 통해 누구나 쉽게 무료로 사용할 수 있는 설치형 로그분석기를 내놓은지가 한참이나 오래전이었지만, 국내에서는 그 인지도가 매우 부족하여 오늘 이 자리에 소개하고자 하니.. 이 것이 바로 Open source web analytics인 Piwik 입니다.




Piwik(http://piwik.org/)은 PHP와 Mysql 에 기반하여 작동되는 오픈소스로서, Joomla, Drupal 까지 지원하는 다양한 플러그인(링크) 들을 바탕으로 전세계에서 가장 많이 쓰여지고 있는 로그분석기임은 물론, 웹서비스와의 연동 가능성을 한층 높이기 위한 오픈API 툴을 동시에 제공하는 꽤나 매력적인 무료 도구라고 할 수 있습니다.

사실상, Piwik은 구글 웹마스터 도구의 "기본엔진" 이기도 하기 때문에, 구글 웹마스터 도구의 대쉬보드에서 확인할 수 있는 다양한 경로의 "트래픽분석" 을 동일하게 사용할 수 있음은 물론, 구글에서 제공하지 않는 "개별 트래픽에 대한 정보" 들까지 하나하나 다룰 수 있음과 더불어, cpc광고에 대한 효과라던가, 특정 파일의 다운로드 횟수 및 경로 등을 파악한다던가, 각각의 유입경로에 따른 성과전환 확률을 개별적으로 판단할 수 있는 "목표전환설정" 캠페인을 설정할 수도 있기 때문에, 여타의 상용 로그분석기와 비교해도 손색이 없는 물건인 셈입니다.

Piwik의 로그분석기 데모페이지 확인링크

위 데모페이지를 통해 Piwik이 제공하는 로그분석기로서의 기능들을 확인하실 수 있는데, 안타까운 것은 "한국어" 에 대한 언어팩을 따로 제공하고 있지 않기 때문에 키워드 분석에 대한 부분은 다소 예상치 못한 오류가 발생할 수도 있다는 점입니다.

이 점은, 특히 UTF-8 기반의 웹사이트, 웹서버에서는 발견할 가능성이 적은 문제이나, EUC-KR 기반의 웹사이트, 웹서버에서는 한글깨짐현상을 비롯, 다양한 문제가 야기될 수 있으므로, Piwik을 전용 로그분석기로 사용하고자 하시는 경우에는 반드시 서버의 언어셋을 UTF-8 로 맞추어 놓으실 것은 권장하는 바입니다.



※ Piwik을 돌리기 위한 최소 필요사항은 아래와 같습니다.
- php 5.1.3 이상, mysql 4.1 이상
- php PDO 모듈 활성화, 독립된 서버(호스팅서버 포함)

※ Piwik의 인스톨 절차는 아래와 같습니다.
1. Piwik을 다운받은 후, FTP등을 통해 서버에 업로드합니다 (Piwik 0.4.3 버전의 다운로드)
2. 웹브라우저로 업로드한 디렉토리의 index.php 를 연결합니다.
3. 화면에서 지시하는 절차를 따릅니다. (mysql 설정 등)
4. 주어진 자바스크립트를 본인의 웹사이트 html 페이지 내에 집어 넣습니다. (끝)

※ Piwik의 오픈API는 XML형태와 JSON형태로 제공됩니다.
- 자세한 정보는 http://dev.piwik.org/trac/wiki/API/Reference 참조


Piwik은 기본적으로 GPL에 준한 오픈소스이기 때문에, 만약 한국의 사용자가 본 오픈소스를 통해 한글 로컬라이징을 실시, 재배포를 한다해도 전혀 문제의 여지가 없습니다. (라이센스는 명시해야 겟지만, Piwik 이라는 로고를 사용하지 않아도 됩니다.)

아무튼, 모쪼록 보다 자세한 로그정보들을 무료로 분석할 수 있는 최고의 툴을 찾는다면, Piwik 을 선택하는 것 하나만으로도 많은 짐을 덜게 되리라 생각합니다.

간혹 jQuery를 이용해서 단순 텍스트박스가 아닌, 웹에디터를 연동하여 멋드러진 게시판을 구현하면 좋을듯한 경우가 발생할 수도 있게 마련입니다.

국내에서는 특히 Form양식에서 필요성이 대두되는 jQuery이다보니, 대개 Validation 이나 Selectbox Changer 등을 주로 접하고는 하지만, 회사 사이트의 "공지게시판" 또는 "방명록" 등을 구현하고자 하는 경우, 무거운 덩치의 제로보드나 그누보드같은 게시판모듈을 통째로 설치하기 보다는, List 페이지, View 페이지, Write 페이지의 3개를각각 제작함으로서 부피를 줄여야 하는 경우가 생길 수도 있는데요,

이때 위 3개의 페이지 가운데, Write 페이지에 손쉽게 적용할 수 있는 웹에디터 툴이 바로 이번에 소개드리는 jQuery FCKEdiotr 라고 할 수 있습니다.

jQuery Lasted 버전이 선언되었다는 가정하의 기본적인 사용법은 아래와 같습니다.


본 플러그인의 기본골격은 웹에디터의 대중화를 선도한 모듈가운데 하나인 FCKEditor를 특정 텍스트박스로 불러들여와서, Submit이 완료되었을 경우 Content 에 해당하는 내용들을 html 코드로 일괄변환하는 역할을 담당합니다. 위 예에서는 test 라는 Textarea 에 웹에디터를 적용하고자 하며, FCKEditor의 설정경로는 /inc/fck 이다 라고 지정했고요.

이때 지정할 수 있는 옵션으로는 대표적으로 toolbar 옵션이 있는데, 이를 Default로 하는 경우와 Basic으로 하는 경우에 따른 각각 다른 형태의 웹에디터를 출력해 줍니다.


출력결과는 각각 아래와 같습니다.





toolbar=Default를 사용한 towon1 박스의 경우 모든 종류의 웹에디터 기능이 활성화되는 반면, toolbar=Basic을 사용한 towons2 의 경우는 최소한의 필요한 기능들 <b> <i> <li> <ol> <a> 가 활성화되는 것을 확인하실 수 있죠.

물론, 개인취향에 따라 위 toolbar 아이콘들의 재배치 및 설정 또한 가능합니다. 이 때는 직접 jQuery FCKEditor를 커스터마이징한 뒤, toolbar=mysetting 정도로 불러주시면 별다른 문제없이 진행이 가능합니다.

본 웹에디터 플러그인의 설치모듈 및 데모페이지를 포함한 패키지 파일의 다운로드는
http://jquery-fckeditor-plugin.googlecode.com/svn/trunk/FCKEditor.zip 에서 받으실 수 있으며,
http://code.google.com/p/jquery-fckeditor-plugin/ 을 방문하시면 기타 알려진 문제점 및 업데이트 내역등을 확인하실 수 있으므로 참고하시기를 바랍니다.

 

본 플러그인은 jQuery를 이용하여, 인풋 타입의 대표적인 사용법 가운데 두가지인 TYPE="CHECKBOX" / TYPE="RADIO" 를 위와 같은 이미지 형태로 꾸밀 수 있도록 돕는 플러그인입니다.

기본적인 용법은


의 형태로 구성되고요,

찬찬히 보시면 아시겠지만, 공통원리는 사실상..
$(input:radio) 의 value값이 0이나 1이냐에 따라 라디오버튼을 대체하는 이미지를 넣어라 <- 하는 것과
$(input:checkbox) 의 value값이 null이냐 아니냐에 따라 체크박스의 대체이미지를 넣는 정도의 작업입니다.

다만, 일일이 소스코딩을 하기가 다소 귀찮은 부분이 있는 것 또한 무시할 수 없으므로
본 플러그인을 사용함으로서 보다 간편하게 작업을 진행할 수 있다는 이점이 있죠..

사용을 위해서는 jQuery 라이브러리 1.2 버전 이상 (1.3 호환)을 사용하셔야 하며
이벤트 명령으로는 현재까지 "check", "uncheck", "disable", "enable" 이 지원됩니다.

아래 소스코드 압축파일내에는, 본 플러그인을 구동하기 위한 모든 파일들이 포함되어 있으므로  필요하신 분들은 다운받아 사용해 보시기 바랍니다. (데모페이지도 포함되어 있습니다)



소스코드 다운로드
http://jquery-checkbox.googlecode.com/files/jquery-checkbox.1.3.0b1.zip

 
--------------- 웹서버의 자동 실행할 스크립트 작성 -------------
/root아래에 backup.sh 이라는 파일을 만들어 놓고 백업 명령어를 다음과 같이 주었다.

#!/bin/bash
/usr/local/mysql/bin/mysqldump -uroot -p***** mysql > mysql_db_bak_$(date +%Y%m%d).sql
/usr/local/mysql/bin/mysqldump -uyanemone -p***** yanemone > yanemone_db_bak_$(date +%Y%m%d).sql
mv *.sql /backup
tar cvfpz /backup/html_bak.tar.gz /var/www/html
tar cvfpz /backup/yanemone_html_bak.tar.gz /home/yanemone/public_html
tar cvfpz /backup/dichang_html_bak.tar.gz /home/dichang/public_html

find /backup -ctime +3 -exec rm -f {} \;



---------------- 백업 서버의 자동실행 스크립트 작성 -------------------

백업 서버에서는 웹서버가 생성한 자료를 가져 오기만 하면 된다.

#! /bin/bash

rsync -avz 211.57.173.129::SU1/ /backup

/usr/local/mysql/bin/mysqldump -uroot -pxxxx mysql> king_mysql_db_backup_$(date +%Y%m%d).sql
/usr/local/mysql/bin/mysqldump -uyanemone -pxxxx yanemone> king_yanemone_db_backup_$(date +%Y%m%d).sql

find /backup -ctime +3 -exec rm -f {} \;

tar xvfpz /backup/htm*.gz /backup
tar xvfpz /backup/yanemone_html*.gz /backup

cp -r /backup/var/www/html/* /var/www/html
cp -r /backup/home/yanemone/public_html/* /home/yanemone/public_html

원문참조 : http://phpschool.com/gnuboard4/bbs/board.php?bo_table=tipntech&wr_id=14007&sca=&sfl=wr_subject%7C%7Cwr_content&stx=db+%C0%DA%B5%BF+%B9%E9%BE%F7&sop=and