페이지 콘텐츠를 최적화하여 웹사이트 성능 향상시키기
관련성이 높고 깔끔한 콘텐츠가 포함된 웹사이트는 일반적으로 개선된 로딩 시간과 더 나은 경험을 사이트 방문자에게 제공합니다.
아래의 디자인 팁에 따라 페이지 성능을 향상시키세요.
도움말 :
일반적으로 방문자가 접하게 되는 첫 번째 페이지가 홈페이지인 만큼, 특별한 주의를 기울일 것을 권장합니다.
요소 로딩 순서
일반적으로 웹사이트 내의 요소는 특정 순서로 로딩됩니다. 정적 또는 저해상도 요소는 무거운 요소나 상호작용 요소보다 더 빠르게 로딩됩니다.
웹사이트에서 요소가 로딩되는 순서는 다음과 같습니다.
- 정적 : 텍스트, 모양 등과 같이 저해상도이며 일반적으로 애니메이션이 적용되지 않는 요소
- 유동성 : 이미지, 동영상 등과 같이 콘텐츠가 많고 해상도가 더 높을 수 있는 요소
- 상호작용 : iFrame, 타사 앱 등과 같이 상호 작용하며 외부 코드를 포함할 수 있는 요소
웹사이트를 구성하고 콘텐츠를 추가할 때 로딩 순서를 염두해 두세요. 방문자가 웹사이트 접속했을 때 가장 먼저 표시되는 스크롤없이 볼 수 있는 부분에는 가장 빠르게 로딩되는 요소를 추가하는 것이 좋습니다.
스크롤없이 볼 수 있는 부분
웹사이트에서 스크롤없이 볼 수 있는 부분은 방문자가 스크롤하지 않고도 볼 수 있는 부분이며, 일반적으로 웹사이트에서 로딩 될 첫 번째 부분입니다.
가능한 필요한 정적 요소만을 추가하고 섹션의 디자인을 심플하고 관련성있게 유지할 것을 권장합니다.
스크롤없이 볼 수 있는 부분에 추가할 것을 권장하는 요소는 다음과 같습니다.
- 텍스트 : 텍스트는 방문자에게 웹사이트 페이지 또는 브랜드에 대한 명확한 아이디어를 제공합니다. 또한, 검색 엔진에 의해 색인이 생성되어 사이트의 SEO를 향상시킬 수 있습니다. 가능한 적은 종류의 글꼴을 사용하고, 가중치를 과도하게 사용하지 않는 것이 좋습니다.
- 클릭 유도 문안 : 클릭 유도 문안은 방문자가 사이트에서 제품을 구매하거나 회사에 연락하는 등 원하는 작업을 수행하도록 유도하는 데 도움이 되는 버튼 및 링크를 제공합니다. 클릭 유도 문안은 명확하게 정의되어야 하며, 사이트 방문자의 주의를 분산시킬 수 있는 요소를 근처에 추가하지 않는 것이 좋습니다.
동영상, 애니메이션
유동적이며 고해상도인 요소는 웹사이트에 움직임과 생명을 더 할 수 있습니다. 하지만, 이러한 요소들은 웹사이트 로딩 시간을 늘려 성능에 영향을 미칠 수 있습니다.
이러한 사항을 염두에 두는 것이 좋습니다. 필요한 경우에 한해서만 사용하고 사이트의 스크롤없이 볼 수 있는 부분에는 추가하지 않는 것을 권장합니다.
버튼
버튼은 웹사이트 성능 저하없이 콘텐츠를 미리볼 수 있는 좋은 방법입니다.
방문자에게 웹사이트 콘텐츠 샘플을 제공하는 정적 요소(예: 텍스트 등)를 홈페이지에 추가한 후, 해당 페이지로 연결되는 버튼을 추가합니다. 예를 들어, "블로그 보기", "더보기", "쇼핑 시작하기" 등이 있습니다.
도움말을 통해 문제를 해결하지 못하셨나요?
1:1 문의를 남겨주시면 빠르고 정확하게 도와드릴게요.