업무 꿀팁아임웹 썸네일 페이드 효과, 페이지 로딩 느려 보이는 이유와 해결법

최근 어느 시점부터 아임웹 쇼핑몰에서 상품 페이지를 로드할 때 상품 이미지가 강제로 페이드되며 나타나는 현상이 발생하고 있습니다.

이러한 변화는 사용자 경험(UX)에 있어 매우 부정적인 영향을 미칩니다.
이미지가 서서히 나타나기 때문에 마치 페이지 로딩이 지연되는 것처럼 느껴져 사용자 이탈을 유도할 수 있는 치명적인 단점이 되기 때문이죠

문제는 이 페이드 효과가 아임웹을 사용하는 모든 사이트에 일괄적으로 강제 적용되었으며,
사용자 측에서 이를 직접 끄거나 수정할 수 없다는 점입니다.따라서 해당 기능을 끄려면 직접 코드를 써서 수정해야하는데요 이에 따라, CSS 스타일코드를 활용해 썸네일 페이드 효과를 강제로 제거하는 방법을 공유드립니다. 

위의 코드처럼 .item-wrap 요소의 opacity 값을 1로 고정하면,
페이지 로드시 이미지가 즉시 노출되어 보다 쾌적하고 깔끔한 사용자 경험을 제공할 수 있습니다.

단 해당 코드를 적용할 경우 썸네일에 마우스 롤오버(호버)시 second이미지가 뜨는 기능이 구현되지 않으므로 이 부분 유의 해주세요

해당 스타일 코드는 하단 첨부파일에서 다운로드하실 수 있으며,아임웹 관리자 페이지의 SEO·검색엔진최적화  Footer 영역 에 붙여넣기만 하면 적용이 완료됩니다.