본문으로 바로가기

CCZ-CROSS 스킨 블로그 속도 향상시키기

category Gift/Blog 2017. 9. 13. 16:53


지금 제가 쓰고있는 블로그 스킨은 반응형 CCZ-CROSS 스킨인데요,

요즘 블로그 애드센스도 달고 이것저것 수정하면서 블로그 속도가 좀 느려진거같아서 속도 향상시킬 방법을 찾아보았습니다.

(스킨 다운로드는 : "http://ccz-cross.tistory.com/notice/11" 여기서 받으실수있습니다.)


1. 썸네일 URL 변경

Tistory 관리자 페이지 -> HTML/CSS 편집으로 가셔서 아래와 같이 변경해주세요.

<!-- 변경전 -->
<s_article_rep_thumbnail>
      <a class="has-object t-photo" href="/entry/CCZCROSS-%EC%8A%A4%ED%82%A8-%EB%B8%94%EB%A1%9C%EA%B7%B8-%EC%86%8D%EB%8F%84-%ED%96%A5%EC%83%81%EC%8B%9C%ED%82%A4%EA%B8%B0">
            <div class="thumbnail">
                <div class="cropzone">
	            <img src="">
                </div>
            </div>
      </a>
</s_article_rep_thumbnail>

<!-- 변경후 -->
<s_article_rep_thumbnail>
      <a class="has-object t-photo" href="/entry/CCZCROSS-%EC%8A%A4%ED%82%A8-%EB%B8%94%EB%A1%9C%EA%B7%B8-%EC%86%8D%EB%8F%84-%ED%96%A5%EC%83%81%EC%8B%9C%ED%82%A4%EA%B8%B0">
            <div class="thumbnail">
                <div class="cropzone">
	            <img src="//i1.daumcdn.net/thumb/C240x180/?fname=">
                </div>
            </div>
      </a>
</s_article_rep_thumbnail>

2. fouc 속성 제거

아래와같이 변경전 div class 검색하셔서 fouc 부분만 지워주시면됩니다.
<!-- 변경전 -->
<div class="list-row pos-right ratio-fixed ratio-4by3 crop-center lts-narrow fouc clearfix">
<div class="e-content post-content fouc">





            



            


지금 제가 쓰고있는 블로그 스킨은 반응형 CCZ-CROSS 스킨인데요,

요즘 블로그 애드센스도 달고 이것저것 수정하면서 블로그 속도가 좀 느려진거같아서 속도 향상시킬 방법을 찾아보았습니다.

(스킨 다운로드는 : "http://ccz-cross.tistory.com/notice/11" 여기서 받으실수있습니다.)


1. 썸네일 URL 변경

Tistory 관리자 페이지 -> HTML/CSS 편집으로 가셔서 아래와 같이 변경해주세요.

<!-- 변경전 -->
<s_article_rep_thumbnail>
      <a class="has-object t-photo" href="">
            <div class="thumbnail">
                <div class="cropzone">
	            <img src="">
                </div>
            </div>
      </a>
</s_article_rep_thumbnail>

<!-- 변경후 -->
<s_article_rep_thumbnail>
      <a class="has-object t-photo" href="">
            <div class="thumbnail">
                <div class="cropzone">
	            <img src="//i1.daumcdn.net/thumb/C240x180/?fname=">
                </div>
            </div>
      </a>
</s_article_rep_thumbnail>

2. fouc 속성 제거

아래와같이 변경전 div class 검색하셔서 fouc 부분만 지워주시면됩니다.
<!-- 변경전 -->
<div class="list-row pos-right ratio-fixed ratio-4by3 crop-center lts-narrow fouc clearfix">
<div class="e-content post-content fouc"></div>

<!-- 변경후 -->
<div class="list-row pos-right ratio-fixed ratio-4by3 crop-center lts-narrow clearfix">
<div class="e-content post-content"></div>


위 두가지 작업 하시고 난 후에는 엄청 빨라진 블로그 로딩속도를 확인하실수 있습니다.


블로그 속도 측정은 구글에서 제공하는 사이트에서 측정이 가능합니다.

(링크 : https://developers.google.com/speed/pagespeed/insights/)

</div> <!-- 변경후 --> <div class="list-row pos-right ratio-fixed ratio-4by3 crop-center lts-narrow clearfix"> <div class="e-content post-content">


지금 제가 쓰고있는 블로그 스킨은 반응형 CCZ-CROSS 스킨인데요,

요즘 블로그 애드센스도 달고 이것저것 수정하면서 블로그 속도가 좀 느려진거같아서 속도 향상시킬 방법을 찾아보았습니다.

(스킨 다운로드는 : "http://ccz-cross.tistory.com/notice/11" 여기서 받으실수있습니다.)


1. 썸네일 URL 변경

Tistory 관리자 페이지 -> HTML/CSS 편집으로 가셔서 아래와 같이 변경해주세요.

<!-- 변경전 -->
<s_article_rep_thumbnail>
      <a class="has-object t-photo" href="">
            <div class="thumbnail">
                <div class="cropzone">
	            <img src="">
                </div>
            </div>
      </a>
</s_article_rep_thumbnail>

<!-- 변경후 -->
<s_article_rep_thumbnail>
      <a class="has-object t-photo" href="">
            <div class="thumbnail">
                <div class="cropzone">
	            <img src="//i1.daumcdn.net/thumb/C240x180/?fname=">
                </div>
            </div>
      </a>
</s_article_rep_thumbnail>

2. fouc 속성 제거

아래와같이 변경전 div class 검색하셔서 fouc 부분만 지워주시면됩니다.
<!-- 변경전 -->
<div class="list-row pos-right ratio-fixed ratio-4by3 crop-center lts-narrow fouc clearfix">
<div class="e-content post-content fouc"></div>

<!-- 변경후 -->
<div class="list-row pos-right ratio-fixed ratio-4by3 crop-center lts-narrow clearfix">
<div class="e-content post-content"></div>


위 두가지 작업 하시고 난 후에는 엄청 빨라진 블로그 로딩속도를 확인하실수 있습니다.


블로그 속도 측정은 구글에서 제공하는 사이트에서 측정이 가능합니다.

(링크 : https://developers.google.com/speed/pagespeed/insights/)

</div>


위 두가지 작업 하시고 난 후에는 엄청 빨라진 블로그 로딩속도를 확인하실수 있습니다.


블로그 속도 측정은 구글에서 제공하는 사이트에서 측정이 가능합니다.

(링크 : https://developers.google.com/speed/pagespeed/insights/)