문제

예를 들어, 1x1 이미지가 2x2보다 빠르게로드됩니까? 크기는 더 작지만 브라우저는 두 배나 더 작동해야합니까?

그렇다면 배경 이미지에 이상적인 크기와 모양 (사각형 대 사각형)이 있습니까?

나는 그것이 너무 중요하지 않다는 것을 알고 있지만 알고 싶습니다.

고맙습니다

도움이 되었습니까?

해결책

나는 당신의 이미지에 '이상적인'크기가 있다고 생각하지 않습니다.

이미지의 품질은 다운로드 시간에 역할을 할 것입니다. 색상이 풍부한 이미지는 크기가 무겁습니다.

마지막으로 배경 이미지의 선택 당신의 필요에 따라 다릅니다. 2*2 이미지가 필요하면 그것을 포함시켜야합니다.

많은 배경 이미지를 사용하여 사이트의 성능을 최적화 해야하는 경우 살펴볼 수 있습니다.

CSS 스프라이트

이미지 최적화를위한 일부 도구

12 웹 디자이너를위한 정말 유용한 이미지 최적화 도구

다른 팁

나는 많은 브라우저에서 매우 작은 이미지 (예 : 1 × 1 또는 2 × 2)가 매우 느리다는 것을 알았습니다. 대부분의 압축 이미지 형식에서는 반복에 따라 더 큰 단점이 없기 때문에 최소한 타일링 이미지에 대해서는 UA의 드로잉 복잡성을 줄이기 위해 최소 50 × 50 픽셀 주위의 이미지를 선택해야합니다.

흥미로운 질문. 각 브라우저 공급 업체는 각각 이미지를 렌더링하는 방법이 다르므로 각 브라우저 공급 업체에 문의해야합니다.

그러나 실제로 다운로드 시간을 무시하면 렌더링 시간의 차이가 무시할 수 있으므로 가능한 경우 더 작은 이미지를 사용하는 것이 합리적입니다.

또한 1x1 반복 이미지를 사용하는 경우 대신 배경색을 사용해야한다는 것이 분명합니다.

이상적인 크기는 브라우저마다, 다른 시스템마다 다릅니다.

너무 작거나 너무 커지는 것을 피하십시오. 크기 1x1의 배경 이미지 일부 브라우저에서 렌더링 문제가있을 수 있습니다. 적어도 각 차원에서 몇 픽셀을 만들어야합니다.

Netscape 4는 폭이 10 픽셀보다 적다면 이미지를 반복하지 않았다는 것을 기억합니다. 오늘날 브라우저는 감각적이지 않지만 이미지를 너무 작게 만들지 않는 것이 여전히 합리적입니다.

이미지의 압축 (적어도 GIF 및 PNG 이미지의 경우)은 반복을 기반으로하므로 이미지를 반복하여 이미지를 더 크게 만들면 추가 이미지 크기가 파일 크기에 거의 추가되지 않습니다.

참고 : 다운로드 속도를 높이려고하는 경우, 1x1 이미지를 다운로드하는 오버 헤드, 예 : 10x10은 특히 클라이언트와 서버 모두에 대한 괜찮은 압축 이미지에 대해 무시할 수 있습니다.

따라서 렌더링이 10x10에서 확실히 빠르거나 더 좋으므로 더 큰 이미지 크기로 이동하십시오.

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top