본문 바로가기

블로그 팁65

하위 브라우저에서 HTML5 표현되게 하기 웹표준에 대한 관심이 높아지면서 많은 사이트들이 HTML5를 이용하고 있습니다. 티스토리 블로그의 경우에도 예외는 아니라서, 대부분의 스킨들이 HTML5로 코딩되어 웹표준을 지키고 있음을 확인할 수 있습니다. 티스토리에서 공식적으로 지원해주는 스킨들의 경우에는 하위 브라우저와의 호환성 문제를 걱정할 필요가 거의 없습니다만, 개인적으로 배포된 블로그 스킨들의 경우에는 HTML5를 지원하지 않는 브라우저에서 해당 화면을 봤을때와 그렇지 않을 경우가 많이 발생합니다. 본인의 블로그가 하위 버전의 브라우저와 지금의 브라우저에서 어떤 차이가 나는지를 확인하기 위해서는 이전에 소개해드린 툴(IEtester, MS SuperPreview, Adobe BrowserLab)을 이용하면 되지만 수정하는 방법에 대해서는 알.. 2013. 1. 15.
블로그에 웹폰트 적용하기 / 폰트 변경하기 대부분의 블로그에서는 폰트를 변경하지 않은 채 기본폰트만을 이용하거나 내지는 블로그 에디터에서 기본적으로 제공해주는 폰트를 사용하고는 합니다. 네이버 블로그의 경우에는 다양한 웹폰트를 제공하고 있으니 그나마 선택의 폭이 다양하지만 티스토리의 경우에는 한글폰트로 지원해주는 것은 네 가지의 기본폰트밖에 없습니다. 그마저도 거의 사용하지 않는 것들을 제외하면 돋움과 굴림체로 두 가지 밖에 되지 않습니다. 그러나 요즈음에 블로그를 둘러보면 여럿 블로그들이 맑은 고딕이나 나눔 고딕으로 포스트를 작성하고 있음을 확인할 수 있습니다. 맑은 고딕이야 상당수의 유저들이 윈도우 XP 이상의 운영체제를 사용하고 있기에 굳이 사용자에게 설치를 권유하지 않더라도 다수의 방문객의 화면에서 비슷한 화면을 출력시켜줄 수 있지만 이를.. 2013. 1. 11.
구형 웹 브라우저에서의 블로그 확인하기(3) Adobe BrowserLab 마지막으로 소개드릴 웹 호환성을 점검할 수 있는 툴은 어도비사에서 제공하는 BrowserLab입니다. 이전에 설명드렸던 IETester과 MS SuperPreview는 사용자의 컴퓨터에 설치하여 이용하는 프로그램이였다면 오늘 소개드릴 BrowserLab는 웹을 기반으로 설치없이 이용할 수 있다는 장점이 있습니다. IETester과 같이 다양한 버전의 익스플로러 버전을 제공하지는 않지만 일반적으로 이용되는 7,8,9를 지원하며, MS SuperPreview처럼 전혀 다른 운영체제인 윈도우와 맥에서 출력되는 화면이 어떻게 다른지도 확인해볼 수 있습니다. 단 하나의 단점이 있다면 설치하여 이용하는 프로그램에 비하여 속도가 느리다는 정도입니다. 사실 인터넷 익스플로러만 테스트하고자 한다면 IETester로도 충.. 2013. 1. 9.
블로그의 현재 접속자 수 확인하기 블로그 통계와 관련한 툴인 마이랭크이즈와 구글 애널리틱스에 대하여 이전에 소개해드린바 있습니다. 두 툴 모두 다양한 자료를 제공해 블로그 운영에 큰 도움이 되지만 현재 블로그에 접속해 있는 이용자가 몇 명인지와 관련한 데이터는 보여주지 않고 있습니다. 사실 티스토리나 다음, 네이버등을 통해 블로그를 운영하는 경우라면 몇 명이 동시에 접속해 있는지는 그리 중요한 자료는 아닙니다. 다만 개인적으로 호스팅을 받아 블로그를 운영하거나 또는 개인적으로 서버를 운영한다면, 서버에서 받아들일 수 있는 동시접속자수에는 한계가 있기때문에 현재 접속자 수가 몇인지는 굉장히 중요한 자료로써 사용될 수 있습니다. 그렇지만 자료로써의 중요성과 유용성을 떠나서라도 사실 지금 블로그에 몇 명이 접속해 있는지는 블로그를 운영하는 입.. 2013. 1. 8.
구형 웹 브라우저에서의 블로그 확인하기 (2) MS SuperPreview 블로그의 접근성을 높이기 위해 구형 브라우저에서 출력되는 모습을 확인하는 방법(구형 웹 브라우저에서의 블로그 확인하기 (1) IETester)을 지난번 글에서 다룬바 있습니다. IETester은 직관적인 인터페이스로 사용법을 전혀 몰라도 사용하는데에 큰 지장이 없고 설치 방법도 간편해 쉽게 이용할 수 있다는 장점이 있었으나 인터넷 익스플로러의 경우에만 확인해볼 수 있다는 점이 단점이라고 할 수 있습니다. 이 경우에는 MS에서 제공하는 SuperPreview를 이용해볼 수 있습니다. SuperPreview에서는 원격브라우저라는 기능을 이용하여 인터넷 익스플로러 외의 다양한 브라우저와, 맥에서만 이용 가능한 브라우저인 사파리에서 출력되는 화면도 같이 볼 수 있다는 장점이 있습니다. 이번 글에서는 보다 다양한.. 2013. 1. 7.
구형 웹 브라우저에서의 블로그 확인하기 (1) IETester 인터넷 익스플로러와 넷스케이프가 주류였던 시절에는 이렇다할 웹표준이라는 개념이 없었습니다. 그로 인해 브라우저간에 서로 보이는 화면의 모습이 다른 경우가 많았기에 웹표준의 필요성이 대두되었고, 그 후 웹표준이 제정되었지만 두 브라우저간에 벌어진 차이는 쉽게 좁혀지지는 않았습니다. 두 브라우저 모드 웹표준에 맞춰 브라우저를 만들어 갔지만, 익스플로러의 경우에는 다소 더디게 움직여서 익스플로러 6까지 웹표준을 잘 지원하지 못했습니다. 인터넷 익스플로러6은 2006년 PC월드에서 '전대 미문의 최악의 기술' 25위중 8위에 랭크될 만큼 좋지 않았던 브라우저이지만 그 당시 90%를 상회하는 브라우저 점유율을 보였기에 지금까지도 익스플로러6이 사용되고 있는 경우가 많이 있습니다. 이를 알았는지 마이크로소프트에서도.. 2013. 1. 5.
블로그 로딩 속도 측정, 그리고 단축하기 다른 블로그는 어떠한지 잘 모르겠지만 제 블로그 같은 경우 로그기록을 살펴보면 방문객의 평균 방문시간이 길었을때는 2분~3분정도인 날도 조금씩 있었지만 대개의 경우에는 약 1분정도의 시간을 갖는것으로 나타나고 있습니다. 더 자세히 살펴봤을 때, 30초 미만의 시간동안 블로그에 체류하는 경우는 전체 유입량의 약 70~80%를 차지하고 있었습니다. 30초 미만의 시간동안에 체류하는 경우의 상당수는 또 대개의 경우 10초 미만 체류하는 경우가 많았습니다. 원하는 정보를 얻고자 접속한것이라는 가정을 내렸을 때, 10초 미만 체류하는 경우는 페이지 로딩이 되기도 전에 블로그에서 접속을 종료했다는 이야기로 이해할 수 있습니다. 긴 글에서 10초만에 원하는 정보를 얻는다는 것은 사실 힘든 일이기 때문입니다. 결국 블.. 2013. 1. 3.
블로그의 대표 아이콘, 파비콘 달기 컴퓨터상에서 사용하고자 하는 프로그램을 설치하면, 바탕화면에 바로가기가 생기며 그 바로가기는 하나의 '아이콘'이라고 불려집니다. 그 아이콘은 해당 프로그램을 가장 잘 나타내고 한번에 인식할 수 있는 모양이기 마련입니다. 웹상의 홈페이지를 나타내는 아이콘 역시도 마찬가지입니다. 이 아이콘은 주소창의 왼쪽에 나타남으로써 확인할 수 있습니다. 네이버의 경우에는 네이버만의 색인 초록색의 검색창을 형상화한 아이콘을 사용하고 있으며 다음의 경우에는 Daum의 D를 아이콘으로 사용하고 있습니다. 구글이나 네이트 역시도 마찬가지입니다. 하나의 어플리케이션을 대표하는 이미지를 '아이콘'이라 부르는 것 처럼 앞서 살펴본 웹사이트를 대표하는 이미지 역시도 부르는 명칭이 따로 있습니다. 이는 '파비콘'이라고 부릅니다. 파비콘.. 2013. 1. 1.
포스트 발행전 꼭 한번쯤 확인해야 할 것들 네이버에서 새롭게 도입된 검색 알고리즘인 '리브라'에서는 글의 잦은 수정은 곧 블로그의 신뢰도가 떨어지는 것으로(네이버의 새로운 검색 알고리즘 리브라) 인식합니다. 실제로 해당 검색 키워드에서 상위에 노출되던 글도 한두번의 수정을 거친 후에는 뒤로 밀려나는 경우를 쉽게 찾아볼 수 있습니다. '작가의 손을 떠난 작품은 더이상 작가의 것이 아니다'라는 말도 있는것처럼 블로거의 손을 떠난 포스트는 수정을 하려면 그만큼의 위험부담을 감수해야만 합니다. 때문에 미리보기를 습관화하여 발행 전 글을 한번 확인하는 습관을 들여놓으시면 좋습니다. 하지만 마냥 본다고 해서 어느부분을 봐야 할지는 막막하고, 나름대로 글 발행전에 확인한다고 확인했지만 다시금 보면 '아!'하고 빼먹는 것들이 몇가지씩 보일때가 있습니다. 오늘은.. 2012. 12. 30.
반응형