홈페이지 운영팁

혹시, 홈페이지 제작이 고민이신가요? A/S와 서비스 품질이 다릅니다.
인천을 대표하는 IT 기업으로써 고객만족과 기업가치의 극대화를 실현합니다.

홈페이지 상담 문의하기
1566-8667

홈페이지 속도 빠르게 하기 위한 이미지 사용방법

2021-10-06

홈페이지 속도 빠르게 하기 위한 이미지 사용방법

 

 

[홈페이지 속도 빠르게 하기 위한 이미지 사용방법]


홈페이지 속도란 웹 페이지가 로드 되는데 걸리는 시간을 의미하는데요.
홈페이지의 속도는 서버, 파일 크기, 이미지 등 다양한 요인으로 인해 발생할 수 있습니다.
홈페이지를 완전히 로딩하는데 5초 이상의 시간이 소요된다면 적극적으로 속도 개선 향상에 힘써야 합니다.


오늘은 '홈페이지 속도 빠르게 하기 위한 이미지 사용방법'에 대해 이야기해 보겠습니다.


- 이미지 사이즈 지정
이미지의 WIDTH와 HEIGHT를 입력하여 주면 로딩 속도가 빨라집니다.
이미지를 삽입 시 가령 샘플.gif (width=200, height=60 크기)라는 이미지를 올린다면
[img scr="샘플.gif" width=200 height=60 alt="샘플">
이와 같이 이미지의 폭과 높이를 모두 넣어 주는 것이 로딩에 도움을 줍니다.


또한 alt 태그를 이용하여 이미지에 대한 설명을 주면 방문객들에게 친절한 서비스를 제공하는 것이며 익스플로러 이외에 다른 텍스트 브라우저를 쓰는 사람들에게 많은 도움이 됩니다.


- 배경 이미지 고정
대부분 같은 배경 이미지가 홈페이지 전체에 이어지는 경우가 많습니다.
그렇게 하는 게 통일성도 있고 혼란을 줄이는 방법이 되기도 하기 때문입니다.
이럴 땐 고정 태그를 삽입해 보세요.
배경 이미지가 로딩되는 시간을 절약합니다.
다음 페이지에서부터는 배경 이미지가 스크롤 되지 않습니다.


- 이미지 테이블 사용
이미지를 가능하면 줄이고 테이블을 이용함으로써 깔끔하고 산뜻한 효과를 볼 수 있습니다.
표나 셀의 테두리선 속성, 바탕색 속성 등을 이용하여 html 문서만으로도 충분히 깔끔한 페이지를 작성할 수 있습니다.


단 테이블은 이미지 파일에 비해서는 훨씬 빠르지만 로딩을 느리게 하는 원인이 되기도 하는데 지나치게 복잡한 테이블은 자제하는 것이 좋겠습니다.
또 세로로 길게 이어지는 테이블보다는 가로로 긴 테이블이 훨씬 로딩이 빠릅니다.
태그가 훨씬 절약되고 브라우저가 읽기 쉬워집니다.


- 불필요한 태그 삭제
에디터를 쓸 경우 불필요한 태그가 자동으로 생성되거나 본의 아니게 제작 중 생성됩니다.
홈페이지 제작 후 확인하여 불필요한 태그를 삭제시키는 것이 용량을 줄여 로딩 속도를 빠르게 하는 방법입니다.


이미지의 품질을 손상시키지 않는 범위에서 jpg 보다는 gif를 쓰며 색의 종류도 불필요하게 많이 넣지 마세요.
또 이미지의 색상을 줄이면 이미지 용량이 줄어듭니다.
따라서 불필요한 색을 없애고 투명 이미지를 적극 활용해 보세요.


감사합니다.

주소
인천 남동구 선수촌공원로 5, C동 912호
(구월동, 구월테크노밸리)
대표번호
1566-8667
운영시간
평일 오전 9:30 ~ 오후 6:30

사이트 하단 정보

카카오톡 카카오스토리 블로그 인스타그램 페이스북
  • 상호 : 에이디커뮤니케이션
  • 대표 : 우세진
  • 사업자등록번호 : 130-39-21061
  • 고객센터번호 : 1566-8667
  • 팩스 : 02--6924-8414

  • 소프트웨어 사업자 : B11-43345
  • 이메일 : master@ad-com.kr
  • 주소 : 인천 남동구 선수촌공원로 5, C동 912호(구월동, 구월테크노밸리)