<img> 태그 올 바르게 사용하기.
나쁜 코드 : <img src="./img/logo.gif">
적절 코드 : <img src="./img/logo.gif" width="52" height="12" alt="LOGO" />
위 나쁜코드나 적절코드나 둘다 적용해도 화면상에는 동일한 결과가 나오는데요,
저도 <img> 태그에 대해서 별로 무관심 이였는데 최근에 알게 된 것은
나쁜 코드 처럼 그대로 적용해도 되지만 적절 코드에서 width height 값을 미리 정의해두면
미리 공간을 확보해둔거나 마찬가지여서 로딩속도가 좀더 빨라진다고 하네요.
자세한 내용은
http://cafe.daum.net/jbkys/JuNh/109?docid=17Vwh%7CJuNh%7C109%7C20120111100042
해당 페이지에서 한번 참고해보세요.
적절 코드 : <img src="./img/logo.gif" width="52" height="12" alt="LOGO" />
위 나쁜코드나 적절코드나 둘다 적용해도 화면상에는 동일한 결과가 나오는데요,
저도 <img> 태그에 대해서 별로 무관심 이였는데 최근에 알게 된 것은
나쁜 코드 처럼 그대로 적용해도 되지만 적절 코드에서 width height 값을 미리 정의해두면
미리 공간을 확보해둔거나 마찬가지여서 로딩속도가 좀더 빨라진다고 하네요.
자세한 내용은
http://cafe.daum.net/jbkys/JuNh/109?docid=17Vwh%7CJuNh%7C109%7C20120111100042
해당 페이지에서 한번 참고해보세요.
|
댓글을 작성하시려면 로그인이 필요합니다.
프로그램
태그 필터 (최대 3개)
전체
개발자
소스
기타
mysql
팁자료실
javascript
php
linux
flash
정규표현식
jquery
node.js
mobile
웹서버
os
프로그램
강좌
썸네일
이미지관련
도로명주소
그누보드5
기획자
견적서
계약서
기획서
마케팅
제안서
seo
통계
서식
통계자료
퍼블리셔
html
css
반응형
웹접근성
퍼블리싱
표준화
반응형웹
홈페이지기초
부트스트랩
angularjs
포럼
스크린리더
센스리더
개발자톡
개발자팁
퍼블리셔톡
퍼블리셔팁
기획자톡
기획자팁
프로그램강좌
퍼블리싱강좌
댓글 8개
이미지의 크기값과 알트태그를 넣어주면 좀더 웹표준지수가 높아지고 말씀하신것과 같이
사이트속도가 좋아지며 웹접근성도 좋아지는결과가...
그렇지만 거의 실감을 못할정도인것 같아요.
한때 웹사이트최적화에대해서 책을 읽고 실전에 써봤는데
외국의 경우를 기준으로 하다보니 한국처럼 빠른인터넷상태에서는 빛을 못보는듯.
좋은정보 감사
^^
가장 좋은 방법은 <img src="링크" alt="설명"> css에서 width와 height를 정의 해두는 것이 좋습니다.
아 그리고 매너데빌님^^~~ 의견에 사견을 좀 달자면
속도부분에서의 문제보다는 국내에서는 네이버, 다음등의 검색방식에 의존화되었지만 외국에서는 아직 yahoo google 를 많이 씀으로 seo방식의 효과가 잘 나타납니다. 속도부분보다는 이 검색엔진에 따라 크게 작용하는것 같습니다.
라고 하셨는데 관련 글좀 볼 수 있을까요?
처음 듣는 얘기라서요.
이미지 하나할 때마다 html코드를 수정해줘야 하는 부담? 때문에 저도 윗분 말처럼
CSS가 더 편한 방법인 듯 합니다. alt는 표준이니까 넣어줘야할 듯 싶구요