css에서... 정보
css에서...본문
이런식으로 이미지를 한파일로 만들어서 background-position 값을 설정해서
적용을 하곤하던데 요즘엔 이렇게 하는게 대세 인가요??
한그림파일에서 그 파일이 좌표만 가져와서 보여주는거라서 더
빨리 보여진다고해야하나 여튼 하나하나씩 잘라서 하는것보다 효과적이겠죠???
추천
0
0
댓글 3개
스티브 사우더스가 쓴 웹 사이트 최적화 기법을 보시면 잘 설명되어 있습니다.
HTTP 요청수를 줄일 수 있다는 점, 속도면에서 향상된다는 점 등 외에도 개인적으로 디자인 유지/보수, 확장에 있어서 큰 장점이 있는 것 같습니다.
단 CSS가 제거되었을 경우 background-image 만으로 버튼을 구성할 경우 버튼 자체가 보이지 않을 수 있기 때문에 (사용자가 인지할 수 없을 수 있기 때문에) 대체 텍스트를 제공하는 것이 좋을 것 같습니다.
CSS 교체만으로 디자인(레이아웃)을 바꿀 수 있다면, CSS Sprite 를 사용하면 이미지 파일 교체만으로 색이나 질감 등의 분위기를 바꿀 수 있습니다. ^^
HTTP 요청수를 줄일 수 있다는 점, 속도면에서 향상된다는 점 등 외에도 개인적으로 디자인 유지/보수, 확장에 있어서 큰 장점이 있는 것 같습니다.
단 CSS가 제거되었을 경우 background-image 만으로 버튼을 구성할 경우 버튼 자체가 보이지 않을 수 있기 때문에 (사용자가 인지할 수 없을 수 있기 때문에) 대체 텍스트를 제공하는 것이 좋을 것 같습니다.
CSS 교체만으로 디자인(레이아웃)을 바꿀 수 있다면, CSS Sprite 를 사용하면 이미지 파일 교체만으로 색이나 질감 등의 분위기를 바꿀 수 있습니다. ^^
css가 쓰이지 않던 초창기에 저런방식(하나의 그림에 좌표를 이용해서 부분들을 클릭하게 하는) 쓰는 웹싸이트가 많았던거 같은데, 요즘에 또 저런방식이 새로운 이유로 각광받나보군요?
imagemap 을 말씀하시는 거 같네요. imagemap 은 원하는 위치에 원하는 영역만큼만 표현하기가 어렵지요. (불가능할지도)
imagemap 과 CSS Sprite 는 속도 자체는 크게 차이가 나지는 않지만 사용성에 있어서 더 유연합니다.
그리고 합쳐진 이미지는 여러개의 분리된 이미지보다 용량이 오히려 더 작을 수 있는데 컬러테이블이나 포맷정보와 같은 여러 정보가 하나로 합쳐질 수 있기 때문이라고 하네요.
imagemap 과 CSS Sprite 는 속도 자체는 크게 차이가 나지는 않지만 사용성에 있어서 더 유연합니다.
그리고 합쳐진 이미지는 여러개의 분리된 이미지보다 용량이 오히려 더 작을 수 있는데 컬러테이블이나 포맷정보와 같은 여러 정보가 하나로 합쳐질 수 있기 때문이라고 하네요.
