[html] url 앞에 아이콘 이미지 삽입하기

Computer/WEB Skills

인생이글케쉬우냐 2014. 5. 15. 00:09

예전에 프로젝트 진행하면서 카피페이스트를 이용해서 이미지 삽입해 본적이 있는데,

그러다보니 한줄이면 되는 소스를 자꾸 까먹는다..;;

(직접 타이핑해야 외우는데;;)

그래서 자꾸 까먹으니 여기다 적어둬야겠다..

(1) favicon.ico 파일을 만든다. (아이콘 이미지파일)

png등의 이미지를 포토샵등을 이용해 아이콘 이미지를 만든 이후에 패비콘을 만들어주는 사이트를 통해서 패비콘을 만들면 된다.

(2) <head> ... </head> 사이에
<link rel="SHORTCUT ICON" href="http://www.example.com/myicon.ico"/>

또는

이라고 넣어주면 됨.

만약 애니메이션 효과가 있는 favicon 이면

와 같이 넣어주면 됨

[브라우저별 호환여부]

브라우저	ICO	PNG	GIF	애니메이션 GIF	JPEG	APNG	SVG
구글 크롬	예	4.0	4.0	No	4.0	?	아니오
인터넷 익스플로러	4	아니오	아니오	?	아니오	?	아니오
모질라 파이어폭스	예	예	예	예	예	3.0	아니오^[1]
오페라	예	예	예	예	예	예	9.6
사파리	예	4.0	4.0	?	4.0	?	아니오

[참고]