나는 Blogger.com(blogspot)에서 두 개 이상의 블로그를 운영하고 있는데, 요즘 한창 유행인 Web2DNA에서 두 블로그를 검사해 본 결과 다음과 같은 DNA이미지를 얻을 수 있었다. 올블로그에서 DNA로 검색만 해봐도, 이미 많은 분들이 Web2DNA를 해보셨음을 알 수 있다.

▲ 이건 지금 보고있는 이 블로그(hfkais.blogspot.com)의 DNA 이미지이다.

▲ 이건 Seoul Daily photo의 DNA 이미지이다.

우선, 두 블로그는 거의 똑같은 템플릿 코드를 사용하고 있다. 때문에 몇몇 부분에선 상당히 비슷한 모습이 보이기도 한다. 다만 이를 어떻게 해석하느냐가 문제인데, 딱 부러지게 '이렇다' 할 만한 것이 없다. Web2DNA 홈페이지의 설명만 봐서는, 일단 최신 HTML 태그를 사용했을 때 DNA의 각 선들이 좀더 밝게 나오는 것으로 되어있다.

The brightness of the lines is determined by the importance of the tags in terms of structure.

• H1 is brighter than H2, which is brighter than H3.
• TABLE is brighter than TR, which is brighter than TD tags.
• Images and flash elements appear as 70% white.
• New HTML tags like STRONG and EM is brighter than older ones like B and I
• UL, OL and DL is brighter than their LI, DT, DD
• DIV layout is brighter than table layout

Basically a semantically rich site will appear brighter than one with messy old-style code.

대충 보기엔 Strong이나 Em, DIV태그 등을 썼을 때 좀 더 밝게 표시되는 것 같은데... 내가 이해되지 않는 것은 Table 부분과 UL, OL, DL 부분이다. TR이나 TD, 그리고 LI이나 DT, DD 등은 각각 상위 태그 안에서 쓰이는 하위 태그 아니었던가! (즉 얘네들을 직접적으로 비교할 순 없을텐데...? 같이 쓰이는 태그니 말이다.)

또한 몇몇 다른 분들의 글에선 CSS/HTML 태그와 함께 콘텐츠도 평가한다고 하는데, 과연 그런 것인지 잘 모르겠다. 일단 한 가지 분명한 건, 페이지의 길이에 따라 가로 폭이 결정된다는 것 정도? baekdal 홈페이지를 대상으로 한 DNA이미지와, Google 홈페이지를 대상으로 한 DNA이미지를 보면 알 수 있다. 아울러 야후! 것도 한번 보기 바란다. 이미지가 들어간 경우엔 DNA 선이 좀 더 밝아지는 모양이다.

여하튼, 이 프로젝트의 정확한 분석법에 대해 아시는 분은 리플 남겨주시면 고맙겠다.

태그 : DNA , Web2DNA , image

(쓸데없이 글이 길어졌다. 3줄 요약은 여기로)

요즘, 블로그 이름도 바꾸고(별 뜻 없다. 잘 생각해보면 아주 단순하다) 템플릿도 계속 수정을 가하고 있다. 물론 도메인은 바꾸지 않았다. 오늘은 새 템플릿에 올블로그 올블릿 코드를 삽입했다. Blogger.com에서 올블릿을 추가하는 건 이전에 올린 포스트와 하늘이님의 글을 참조하기 바란다. 원래 진작에 코드를 넣었어야 했는데, 실은 깜빡 잊고 있었다. 여러 번의 테스트와 템플릿 수정을 통해, 지금은 아주 예쁘게 잘 보인다.

사족은 이쯤에서 그만 하고, 이번에 템플릿을 수정하면서 얻은 한가지 팁에 대해 이야기하고자 한다. 다름아닌 '맨 위로 가기' 링크에 관한 것이다.

웹사이트를 만들다 보면, 가로 폭은 대부분 고정되어 있지만 세로 폭은 엄청 길어지는 경우가 생긴다. 때문에 대부분의 웹사이트들은 페이지를 스크롤해가며 봐야 한다. 사용자가 페이지의 내용을 읽어 내려가면서 맨 아래까지 도달했는데, 다른 페이지로 넘어가기 위한 링크나 네비게이션이페이지의 맨 위에 있다면? 사용자는 다시 페이지의 맨 위로 이동하기 위해 스크롤 바를 움직이거나, 마우스의 휠을 열심히 굴려야 할지도 모른다. 물론 단축키를 아는 사용자는 간단하게 키보드의 'Home'키를 눌러 맨 위로 이동을 할 것이다. 또한 이런 불편을 없애기 위해 아예 웹사이트를 만드는 과정에서 네비게이션이 항상 화면에 위치하도록 스크립트를 넣는 경우도 있다.

이런 저런 방법과 해결책들이 많지만, 아무래도 가장 고전적인 것은 '맨 위로 가기(또는 Top)' 링크를 만드는 것이다. 페이지의 맨 위에 Named Anchor(a 태그로 만든다)를 만들어 그것을 링크시키는 것이다. 대부분 Anchor의 이름은 top으로 많이들 쓴다. 이 링크를 클릭하면 순식간에 페이지의 맨 위로 이동할 수 있다.

그러나 Blogger.com에서 이것을 그대로 쓰기엔 약간의 무리가 있으니, 바로 이런 현상이 발생하기 때문이다.

위 스크린샷은, Blogger.com 템플릿에서 HTML코드의 맨 위에 Named Anchor를 만들어놓고, top링크를 만든 후 클릭한 모습이다. 별 이상이 없어 보이는가? 이상이 있다. Blogger.com에서 블로그를 만들면, 맨 위에 navibar라는 것이 붙게 된다. 지금 당장 키보드의 Home키를 누르면 볼 수 있다. 몇몇 Blogger.com 이용자 중엔 이 navibar를 없애버리기도 하는데, 개인적으론 그냥 두는 편이 더 낫다고 본다. 검색창도 있고, 다른 Blogger.com 사이트로 랜덤하게 이동할 수 있는 링크도 제공해 준다. 무엇보다, Blogger.com에서 navibar를 없애는 것은 금지되어 있다.

여하튼 이 navibar의 경우 스크립트를 통해 자동으로 삽입되는데, 때문에 사용자가 만든 템플릿의 html코드보다 항상 위쪽에 위치하게 된다. 자, 그럼 named anchor를 넣어도 항상 navibar에 밀리게 되는데, 이를 어떻게 해결할 것인가? 방법은 의외로 간단하다.(이 얘길 하기 위해 위에서 저렇게 많은 말들을 했단 말인가!)

소스를 보면 알겠지만, navibar에 위치한 검색폼에 name이 걸려있다. 이름은 b-search. 그럼 '맨 위로 가기' 링크를 만들 때, 이 이름을 지정해 주면 된다. 가령 <a href="#b-search" class="top">Top</a> 뭐 이런 식이다. 이렇게 링크를 걸면, 페이지 맨 위로 갈 때 Blogger.com의 navibar까지 모두 보이게 된다.

3줄요약 웹사이트를 만들 때, '맨 위로 가기(top)' 버튼은 있으면 좋다. 그런데 Blogger.com에서는 템플릿에 해당 링크를 넣어도 navibar에 의해 밀린다. 링크를 #b-search로 걸어주면 해결.

태그 : top , 링크 , named anchor , Blogger , 팁 , 템플릿 , 코드

얼마 전, 메가패스 ADSL을 쓰고 있는 인터넷 회선이 불안정하여 KT에 전화를 한 적이 있었다. 별 생각없이 KT의 고장신고 번호인 100번으로 신고를 했는데, 오후에 바로 기사분이 와서 회선을 수리해주었다. 구내선로가 노후되어 그렇단다. 수리를 다 마치고 가면서, 스티커 한 장을 주었다. 앞으론 고장신고를 할 때 100번 말고 이쪽으로 연락을 달라고 한다. 친절하게도, 수신자부담 080 번호다(만약 일반전화였으면 그쪽으로 안했을지도 모른다 :D). 번호는 KT 전체에서 쓰는 번호가 아닌 지역 KT지점(전화국)에서 쓰는 번호다.

사실, 이 지역 KT의 일선 직원들이 100번으로 고장신고 하는 것을 싫어한다는 건 전부터 알고 있었다. 전에도 회선을 수리하면서 이야기했었는데, 100번으로 고장신고를 하면 그 지역 전화국이 아닌 지역 중앙 센터로 신고가 접수된단다. 그럼 중앙 센터에서 지역 전화국으로 지시를 내려 고객의 고장내역을 해결하게 되는데, 이 과정에서 단순히 지시만 가는게 아니라 해당 지역 전화국에 대한 평가에도 신고내용이 반영되는 모양이다. 즉 100번으로 고장신고가 많이 들어온 지역 전화국에 대해선 낮은 평가를 한다나? 그러다보니 100번 대신 자기네 지역 전화국으로 직접 고장신고를 하도록 한 것이다.

예전에는 전화번호도 그냥 일반 전화였는데, 요즘엔 번듯한 080 수신자 부담 번호도 있고, 전화를 받는 텔레마케터 사원도 따로 전문적인 사람을 뽑은 모양이다. 고객의 입장에선 100번(중앙 센터)으로 전화할 때와 큰 차이가 없다. 오히려 이 지역에 대해 더 잘 알고 있기 때문에, 이것저것 물어보거나 할 땐 지역 전화국으로 바로 연락하는게 오히려 낫다. 중앙 센터로 전화해 봤자 '저희는 중앙 센터라서 자세한 건 모르겠고요, 그쪽 지역 전화국으로 지시를 내릴게요' 라는 말만 들을 뿐이다.

그동안 벼르고 벼르던 중, 드디어 일을 냈다. 이 블로그 템플릿을 싹 바꿔버렸다. 얼마 전 새로 템플릿을 변경한 Seoul Daily photo의 템플릿을 기반으로, 약간의 수정을 거쳐 새로 템플릿 코드를 갈아치웠다.

그런데 Seoul Daily photo의 경우 영문 블로그(영어실력은 형편없지만)이고, 이 블로그의 경우 한글 블로그여서 꽤 많은 부분을 수정해야 했다. 특히 텍스트와 관련된 CSS를 수정하는게 가장 큰 일이었다. 적절한 기본 폰트도 별로 없고, 사이즈 조절도 난감했다. 맑은 고딕을 써볼까 했으나 그다지 내키지 않았고, 요즘 유행하는 태터툴즈 스킨처럼 바탕 28px를 써볼까도 했으나 영 모양새가 어울리지 않았다. 결국 굴림으로 타협점을 찾았다. (물론 그다지 마음에 들진 않는다.)

위에서 '그동안 벼르고 별렸다'고 했는데, 사실 이번 템플릿 변경의 가장 큰 이유는 스팸 코멘트 때문이었다. 기존에 쓰던 K2 스킨의 경우 코멘트를 남기기는 쉬웠으나 스팸 코멘트를 막을 방도가 없다는 것이 가장 큰 문제였다. Blogger.com에서 제공하는 코멘트 남기기의 경우 스팸 방지 기능을 쓸 수 있는데, 이것을 쓸 수 없었다. 그래서 K2 스킨으로 바꾼 이후 몇몇 포스트에 스팸 코멘트가 달리기 시작했고, 이를 삭제하는 것도 매우 힘든 일이었다. 물론 템플릿 코드에서 코멘트에 관련된 부분을 삭제하고 다른 것으로 대체했으면 되는 일이었으나, 영 내키지도 않고 귀찮기도 했었다(그러면서 아예 템플릿 코드 전체를 만들어버렸다.). 여하튼 새 템플릿을 만들게 되었고, 어느정도 큰 무리 없이 잘 보여지는 것 같다. 하지만, IE6에서 내용이 사라졌다 나타났다 하는 문제는 여전하다. 렌더링에 문제가 있는 것일까? 빨리 IE7이 나오기만을 기다린다.

링크 : S2kCtl 홈페이지

이제 장마도 끝나고, 무더위에 열대야에 정신이 없다. 여기에 컴퓨터까지 켜놓고 있으면 더운 방 공기에 컴퓨터의 발열까지 더해져 한층 더위를 느끼게 된다. 또한 나처럼 CRT모니터를 쓰는 사람은, 모니터에서 올라오는 열기로 인해 눈앞에 아지랑이가 보일지도 모른다. 게다가 집에 에어컨이라도 있는 집은 높은 전기세에 민감해지기 마련인데, 여기에 컴퓨터의 전력소모까지 생각하면 더더욱 민감해질 수 밖에 없다.

만약 당신의 컴퓨터가 구형 AMD CPU를 사용한다면(요즘은 모두 최신 CPU를 쓰지만...혹시나 해서), 그리고 아직 이 프로그램에 대해 모른다면, 당신의 컴퓨터에서 발열과 전력소모를 어느정도 줄여줄 수 있는 방법을 소개하고자 한다.

S2k Control이란 프로그램은 구형 AMD CPU에서의 발열과 전력소모를 줄여준다. 보다 정확히 말하자면, '바톤과 바톤 이전의 구형 AMD CPU에서의 Idle 시 발열과 전력소모를 줄여준다' 고 할 수 있다. 여기에는 한가지 재미있는 기술이 쓰인다. 프로그램의 설명 부분을 그대로 옮기자면, 다음과 같다.

Significant power savings of the AMD Athlon processor only occur if the processor is disconnected from the system bus by the Northbridge while in the Halt or Stop Grant state. The Northbridge can optionally initiate a bus disconnect upon the receipt of a Halt or Stop Grant special cycle. The option of disconnecting is controlled by an enable bits in the Northbridge.

복잡한 건 패스하고 몇몇 단어들로 유추해 보자면, 'AMD Athlon 프로세서와 노스브릿지 간의 시스템 버스 통신을 막아 전력 소모를 줄인다' 정도로 보면 될까? 즉 프로세서가 놀고 있을 때(Idle), 노스브릿지와의 통신을 막아 전력 소모를 줄이고 동시에 발열도 줄인다는 것이다. 쓸데없이 밥을 똑같이 주지 않고, 적은 일을 할 땐 적은 밥만 주겠다는 건가?

설치와 설정은 무척 간단하다. 따로 인스톨을 할 필요도 없다. 그냥 압축파일을 다운로드 받아 압축을 풀고 적당한 폴더에 옮긴 뒤 실행시켜주면 끝. 다운로드는 제작사 홈페이지에서 받을 수 있다. 용량도 매우 작다. 프로그램을 실행시키면 나타나는 6개의 탭 중 Information, CPU Info, CPU Flags 탭은 시스템 정보와 CPU 정보를 표시해주는 탭이다. 따라서 한번 구경이나 해보면 되겠다. 스크린샷에서 보다시피 주 설정은 S2k Settings라는 탭에서 이루어지는데, 별거 없다. Enable Bus Disconnect에 체크하고, 밑의 슬라이더를 움직여주면 된다. 숫자가 파란색으로 나타나는 부분까지 이동시켜주면 된다. 그 다음 Apply를 눌러주면 끝.

여기에 시스템 온도 또는 전압을 트레이 아이콘으로 표시할 수 있는 기능도 제공되는데, Monitoring 탭에서 설정하면 된다. CPU온도, 메인보드 칩셋 온도, 전압 등을 확인할 수 있다. 나의 경우 보드 온도엔 크게 신경쓰지 않기 때문에 CPU온도만 표시하도록 해 놓았다. Show in Tray 항목에 체크해 두면, 트레이에 네모난 모양의 아이콘과 함께 온도가 표시된다. 또한 이 아이콘을 통해 Bus Disconnect가 실행되고 있는지도 확인할 수 있는데, 실행되고 있으면 아이콘 테두리와 글자 색이 초록색으로, 실행되고 있지 않으면 빨간색으로 표시된다. 물론 이 색은 보다시피 사용자가 임의로 설정해줄 수도 있다. 또한 몇 초 간격으로 업데이트하게 할 것인지도 설정할 수 있다. 설정을 다 하고 나면 Save를 눌러준다.

이런 프로그램들은 주로 사용자가 직접 건드릴 일 없이(설정때만 빼고) 백그라운드에서 실행되는데, 매번 실행시켜주고 apply 눌러주고 하자니 귀찮을 것이다. 따라서 물론 Autorun 기능을 지원한다. Advanced 탭에서 Miscellaneous 하위 탭을 누르면, Autorun 기능을 설정할 수 있다. 물론 이렇게 하지 않아도, 윈도의 '시작프로그램'에 등록시켜 두면 자동으로 알아서 뜨기 때문에 매우 편리하다.

이 프로그램에서 지원하는 AMD CPU 목록과 메인보드 칩셋 목록은 다음과 같다. 바톤까지는 무난히 지원하며, 샘프론 이후의 모델은 지원하지 않는다.

Supported processors: AMD Duron, Athlon Processors Model 2,3,4 (w/ limitations) AMD Duron, Athlon, Athlon XP/MP Processors Model 6 & upper

Supported chipsets: VIA KT133, KT133A, KLE133, KX133, KM133, KM133A, KL133, KL133A, KN133, KN133A , KM266, KL266, KN266, KT266, KT266A, KT333, KM333, KT333 CF, KT400, KT400A, KM400, KM400A, KN400, KN400A,KT600, KT880 nVidia nForce series, nForce2 series (nForce2, nForce2 Ultra400, nForce2 400) SIS 730, 733, 735, 740, 741, 741GX, 745, 755, 746, 746FX, 748, 748FX AMD 751, 760, 761, 762

또한 시스템 온도 센서는 다음을 지원한다.

Supported SuperI/O Chips: Winbond W83627HF/F, W83697HF, W83637HF, W83627THF, W83782D, W83781D, ITE IT8705F, IT8712F

지금 쓰고 있는 바톤 2500+의 경우 S2k를 쓰지 않으면 거의 계속 50도 이상을 유지한다. 풀로드 시에도 온도는 비슷하다. 그러나 이 프로그램을 쓰면, 적게는 5도에서 많게는 10도 이상도 내려간다. 여기에 전력 소모도 한층 적어진다. 개인적으론 이 프로그램을 쓴 뒤 전기요금이 약 3~4만원 정도 적게 나온 경험이 있다. 물론 온도와 전력소모에 관한 것은 시스템과 개인마다 차이가 있을 것이다. 또한 이 프로그램은 Idle 시의 전력소모에 관여하는 만큼, 풀로드로 계속 돌린다면 프로그램을 쓰기 전과 후의 전력소모에 큰 차이가 없을 것이다(3D 게임이나 렌더링 등). 여하튼 간단히 웹서핑을 한다거나 CPU에 부하가 적게 걸리는 작업을 할 땐 확실히 효과가 있으니, 위에 나열된 CPU를 쓴다면 꼭 써보길 바란다.

태그 : S2k , S2kCtl , AMD , CPU , Barton , 전력 , 발열 , 여름철 , 온도

※ CPU 전력소모와 관련해서 검색엔진을 통해 이 페이지를 보시는 분들이 간혹 있습니다. 이 글의 내용은 전적으로 '구형 AMD CPU'에만 적용되는 내용입니다. 거의 4~5년 전 CPU들이죠. 최신 AMD CPU를 사용하신다면, '쿨 앤 콰이어트'나 C1E 등의 전력관리 기술에 대해 찾아보시길 추천합니다.