사이트, 여기서는 블로그(Blog)를 가지고 얘기해 보자. 블로그를 운영하는 사람이라면 조금 민감하게 받아 들일 수 있는 구글 검색 최적화, 이른바 SEO 라는 것을 한 번은 생각해 봤을 듯 하다. SEO와 사이트 속도, 즉 블로그 속도와 무슨 상관이 있을까 라고 생각하는 사람도 있을 것이다.
하지만, 알다시피 사이트 속도는 그 사이트(블로그)를 이용하는 사람들의 입장에서는 무척 중요한 한 부분이기도 하다. 비단, 그런 것을 제외 하고라도 얼마나 빠르고 가볍게 블로그를 열람할 수 있느냐에 따라 SEO의 가산점이 주어지는 것을 알 수 있으며 그 비중은 생각보다 크다고 말할 수 있다.
그렇기 때문에 사이트의 속도를 빠르게 하고 가볍고 잘 열리는 블로그로 만들기 위해 우리는 여러가지 방법을 해보곤 한다. 가장 쉬우면서 중요한 2가지만 알면 된다.
소스(html, css) 영역이야 컴맹인 나나 혹은 이 글을 읽고 있는 지금 여러분들이나 전문적으로 다룰 수 없으니 약간 옆에 두고 생각해 보기로 하고 - 어쩌면 가장 중요한 부분이긴 하지만 - 우선은 아주 간단하게 블로그의 속도를 빠르게 할 수 있는 방법으로 먼저 접근해 보자.
 |
| SEO에 영향을 주는 사이트 속도 |
사이트 속도 높이는 방법
여기서 말하는 블로그의 속도를 높이는 방법은 가장 근본이 되는 뼈대, 즉 테마(스킨)의 소스를 건드리는 것이다. 그것이 어렵다면 앞서 말한 것과 같이 html이나 css등 비교적 최적화 되어 있는 스킨이나 템플릿(구글)을 사용하는 게 근본적으로 좋기는 하다. 일단 그건 나중에 다시 다뤄보기로 하고 사이트 속도를 높이는 가장 쉬운 방법은 아래 두 가지 이다.
- 간편하고 심플하게 버릴 건 버려라
- 이미지는 최적화 해서 최소한의 용량으로
바로 이 두 가지 이다. 그러면 왜 이 두 가지가 블로그 속도를 높이는 방법에 해당되는지 하나씩 이야기 해 보자. 이미 알고 있는 사람이라면 가볍게 읽어주면 좋을 것 같다.
1. 스킨 - 심플하게 제거할 것은 제거하기
두 가지 사이트가 있다고 가정해 보자. 하나는 3단 스킨(템플릿)으로 양쪽 사이드바에 여러가지 편리성을 담아 아주 예쁘게 잘 꾸몄다. 소셜이나 유튜브 영상을 올리고 여러가지 배너도 함께 게재하였다.
반면 다른 한 가지는 1단 스킨에 본문과 헤더 영역(제목)으로 심플하고 깔끔하게 만들었다.
그렇다면 이 두 가지 스킨 중에서 최초 로딩이 되고 웹 페이지가 열리기 까지 어떤 것이 더 빠를까? 사이트 속도 체크를 해보면 알겠지만 역시 심플한 후자 쪽이 좀 더 빠르게 열리는 걸 볼 수 있다. 로딩 자체가 빠르다는 것이다.
- 참고 : 사이트 속도 체크 페이지
반대로 3단의 스킨(테마)의 경우 보기에는 좋고 개인적인 만족도는 크겠지만 여러가지 플러그인과 각종 배너, 이미지, 자바스크립트와 같은 모든 것이 페이지가 로딩 되기까지 그 시간은 짧아 보여도 방문자의 입장에서는 이탈률이 생기기 시작한다는 것이다.
그렇기 때문에 가장 중요한 것은 멋 보다는 실용성, 가장 중요한 것만 남겨두는 것이 훨씬 더 좋은 방법이다. 스킨은 본문과 제목, 가장 중요한 두 가지만 있으면 되는 것이다. 사이드바도 개인적으로 사용해 보니 별 필요가 없다. 만약 굳이 사용하고자 한다면 최소한의 것만 달아두자.
2. 본문 내 사진 - 이미지 최적화
이 부분은 아마 이전에도 그 중요성을 얘기하며 글을 썼던 기억이 있다. 본문내의 이미지 최적화, 사이즈를 적당하게 줄이고 용량을 압축해 최대한 가볍게 올려야 한다는 것이다. 기본적으로 두 가지만 알아두면 된다.
- 사이즈의 최적화
- 이미지의 압축방식
많은 사람들이 모바일을 통해 글을 보기 때문에 그렇게 큰 사이즈의 이미지나 고품질의 사진들은 크게 의미가 없다. 단지 페이지의 로딩 시간을 늘리는 것 뿐이다.
이미지 최적화 방법
사진이나 그림(이미지)를 최적화 하는 방법은 아주 간단하다. 저장할때 퀄리티(품질)을 조금 낮추면 되는 것이다. 우리 눈에는 90%나 70%나 크게 차이가 없으며 제대로 구별해 내는 사람도 별로 없다. 사이즈를 적당하게 하고 퀄리티만 낮춰도 용량은 현저하게 줄어든다.
이미지 프로그램이나 사진을 압축해 주는 사이트를 이용하는 것도 좋은 방법이다. 대표적으로 아래와 같은 것들이 있다.
- 사이트 - Tiny PNG (web상에서 이미지를 압축해 줌)
- 유틸 - 포토스케이프, webpconv
이미지 압축방식 변경
사진의 압축 방식만 바꿔도 사이트(블로그) 속도를 올리는데 효과적이다.
보통 일반적으로 사용하는 방식이 적은 손실과 좋은 압축을 보여주는 JPG/JPEG 방식인데 웹표준에 따라 좀 더 나은 방식이 있다. 바로 webp 방식이다.
평균 용량차이 : GIF > BMP > PNG·JPG > WEBP
단점이라면 IE에서 지원을 하지 않는다는 것인데 어차피 IE대신 Edge를 사용하고 Chrome을 사용하는 사람들이 대다수라서 크게 문제가 되지는 않는다.
포맷 변경에는 윈도10 이상이라면 포토스케이프, 그 이외의 OS라면 webpconv(무설치 ver) 유틸을 사용하면 좋다.
이렇게 해서 사이트 속도를 높이는데 가장 쉬운 2가지 방법을 정리해 본다. 생각보다 별로 어려운 것은 없으면서 쉽게 적용해 볼 수 있는 것으로 실제 블로그를 좀 더 빠르게 하는 방법이다.
그 이외의 html이나 css에 관해서는 다시 정리해 보기로 하자.