요번 참에 제 블로그에 파비콘을 달았습니다 .
제가 좀 게으른지 블로그를 시작하고 2년 반 만에 다음과 네이버에 사이트 등록을 했었는데요 .
( 사이트 등록은 검색 요청과는 다른 것입니다 . )
이제 블로그 시작하고 거의 삼 년 만에야 파비콘을 달았습니다 .
파비콘을 단 김에 블로그에 파비콘을 달고자 하나 그 방법을 몰라 못하시는 분들을 위해
파비콘 달기를 이 글에 메모해 놓습니다 .
글은
1 . 파비콘 만들기
2 . 파비콘 달기
위 순서로 진행을 할 것인데 , 티스토리에 파비콘을 다는 방법을 그대로 따라 했음에도
파비콘이 안 나타나는 분들을 위한 안내도 2 . 파비콘 달기에 포함을 합니다 .
본문에 앞서
한마디만 언급을 하면
요즈음 제 드라마 관련 리뷰들이 거의 안 올라오는 관계로
글벌레의 드라마 리뷰를 기다리시는 분들은 실망하실 수도 있는데요 .
관련하여는 월요일이나 화요일 아침에 글 하나를 올리겠습니다 .
올릴 글은 거의 보름이나 만지작거리다가 못 올린 글이라서 좀 어색하게 느껴질지 몰라도
만지작거리던 시간이 아깝고 또 글을 통하여 하고 싶은 이야기도 있기에 올리기로 한 글입니다 .
...드라마 리뷰는 보통 드라마 방영 후 아무리 늦어도 일주일 이내에는 올리는 것이 어색하지 않기에 ...
| 파비콘 만들기 |
파비콘을 만드는 방법은 포토샵으로 예쁘게 만들기를 비롯하여
여러 방법이 있겠지만 , 역시 가장 쉬운 방법은 파비콘 만들기 사이트를 이용하는 방법입니다 .
파비콘 만들기 사이트는 수도 없이 많이 존재하는데
저는 그중에 두 곳만을 안내합니다 .
소개하는 사이트들은 모두 wepawet과 바이러스토탈을 통하여 안전성을 확인한 사이트들입니다 .
관련 글 보기 - 2010/05/31 - [Lecture/Computer] - Wepawet (alpha)
2010/10/09 - [유용한 팁들] - virustotal (바이러스토탈)
| ㄱ . http://favicon-generator.org |
wepawet 검사 결과 -
http://wepawet.iseclab.org/view.php?hash=cf8afc613c5be86a7ef9c72520ef0aeb&t=1319922550&type=js
바이러스토탈 검사 결과 -
http://www.virustotal.com/url-scan/report.html?id=5f78ac61e8abb5ceca5e84254ad173d2-1319920973
사이트 접속시 메인 화면
① 찾아보기로 적당한 그림 파일을 찾아서 업로드 후에 파비콘으로 바꾸는 버튼입니다 .
이때 빨간 박스를 친 부분에 체크를 하면 그림의 원본 크기를 유지하는 것인데
가급적 체크를 풀어서 16X16 pixel로 만드는 것이 좋습니다 .
파비콘이 너무 커도 페이지 로딩이 느려지는 원인이 되니까요 ...
② 여기에 체크를 하면 ③에 노출이 되어도 좋다는 동의를 하는 것입니다 .
이제 Editor 탭을 살펴보면 아래와 같은데요 .
↘
여기서 만들고 싶은 모양을 만들고 나면 아래에 보이는 Create Favicon 버튼이 활성화가 되는데
그걸 클릭하면 아래와 같은 창이 뜹니다 .
여기서 빨간 박스친 부분을 클릭하면 파비콘을 다운로드하는 것이 가능합니다 .
참고로 녹색 박스 부분은
다운로드 받은 파비콘을 다는 코드로 HTML의 헤드 부분에 저렇게 써넣으라는 것인데
이에 대하여는 본문 아래 2 . 파비콘 달기에서 다루기로 합니다 .
| ㄴ . http://www.rw-designer.com/online_icon_maker.php |
wepawet 검사 결과 -
http://wepawet.iseclab.org/view.php?hash=8caacb003ea64dacd1d0d306308088e1&t=1319926256&type=js
바이러스토탈 검사 결과 -
http://www.virustotal.com/url-scan/report.html?id=8caacb003ea64dacd1d0d306308088e1-1319921060
http://www.virustotal.com/file-scan/report.html?id=851c21d8e14e59d7e44ca677268df2ced4bcaca144e76982a711a7390f7b9903-1319928570
이 사이트에서는 파비콘이나 마우스 커셔 또는 아이콘과 관련된 이런저런 프로그램들을 다운로드 받을 수가
있는데요 . 그런 프로그램들을 설치하고 검증을 하는 것은 시간 낭비로 보여서
(다운로드를 시켜 주는 것이 유료 프로그램인지 무료 프로그램인지도 한눈에 파악도 안 되고요 .)
딱 파비콘 웹 에디터 부분만 링크를 했습니다 .
위의 링크에 접속을 하면
위와 같은 창이 뜨는데
빨간 박스를 친 부분은 그림을 올려서 변환하기이고
녹색 박스를 친 버튼은 캔버스에 직접 그리고 나서 다운로드를 받는 버튼입니다 .
파비콘을 그리고 나서 버튼을 누르면 다운로드가 가능합니다 .
| 파비콘 달기 |
파비콘을 달려면 일단 위 과정에서 만든 파비콘.ico 파일을 자신의 사이트 루트 디렉토리에 올려야 합니다 .
티스토리의 경우 루트 디렉토리에 올린다는 뜻은
티스토리 관리 페이지에서
환경설정 > 기본 정보에서 파비콘 파일을 올리는 것입니다 .
이제 루트 디렉토리에 파비콘 파일을 올렸으면
<head>와 </head> 사이에 녹색 박스를 친 부분처럼
<link rel="shortcut icon" href="자기 사이트 주소/favicon.ico" />라고 써넣으라는 것인데요 .
티스토리의 경우에는 윗 그림에서 보이는 보라색 박스를 친 부분 http://를 포함할 경우
파비콘이 표시가 안 됩니다 .
그러므로 http://는 빼고 자기 블로그의 주소를 적어야 하는데요 .
그런데 말이죠 !!!!!!!!!
티스토리의 경우에는 HTML/CSS 편집을 보면 스킨에
그러므로 여기서 blog_link 부분을 지우고 아래 그림에서 보이는 것처럼
자기의 블로그 주소를 써넣으면 됩니다 .
혹시나 해서 언급을 한다면 자신의 블로그에 파비콘을 다는 것인데
설마 제 블로그 주소 , 글벌레의 블로그 주소를 옮겨 적는 분들은 없으시겠죠 ?
없으리라 믿어도 되죠 ?
그런데
이러한 방법으로 파비콘이 표시가 안 된다는 경우들을 본 기억이 있는데요 .
그런 경우에는
HTML/CSS 편집에서 파일 올리기에 파비콘 파일을 업로드합니다 .
하셨으면 HTML/CSS에서
위 그림에서 빨간 박스를 친 부분으로 녹색 박스를 친 부분을 대치하여서
아래처럼 만들면 됩니다 .
이 글이 유익했다면 아래 손꾸락 모양의 추천 버튼을 꾹꾹 눌러주시기 바랍니다 .
추천에는 다음 로그인은 필요 없습니다 .
그러나 이왕에 추천해 주실려면 다음에 로그인 후에 추천을 해주시면 더 좋은데요 .....
다음에 로그인 추천은 다음에 로그인 하고 이 글에서 추천을 한다고 되는게 아니고요 .
아래 손꾸락 모양 버튼 오른쪽으로 구독이라고 보이실 터인데 그 구독을 눌러서 다음에 로그인 후에
글벌레를 구독하시면 이 글의 제목이 My View란 탭에서 보일겁니다 .
그 글 제목을 클릭해 뜨는 창에서 추천해 주시기 바랍니다 ^ ^*
추천은 제 글이 유익했었다고 보내 주시는 메시지이고
그런 메시지는 글벌레가 글을 계속 발행할 수 있는 힘의 근원이 되어 줄겁니다 ^ ^*
'유용한 팁들' 카테고리의 다른 글
| 인터넷 (네트워크 / 랜(Lan) ) 연결 손쉽게 끊고 잇기 (로컬 영역 연결) (161) | 2013.06.14 |
|---|---|
| 모니터가 안 켜질 때 ( ATI 라데온 (AMD) 그래픽 사용자라면 꼭 살펴볼 사항 - Alt + F5 단축키 문제 ) (331) | 2012.08.04 |
| 온라인 게임 안 되는 컴퓨터 만들기 ( 인터넷 옵션 > 내용 > 콘텐츠 관리자 ) (181) | 2012.07.14 |
| 인터넷 결제창에서 결제가 안 될 때 (481) | 2012.04.20 |
| Process Explorer (프로세스 익스플로러) - 아직도 못다 한 이야기 (0) | 2011.02.22 |
| Sandboxie 충돌을 해결하는 법 (486) | 2011.02.03 |
| Windows installer가 괴롭힐 때 (0) | 2011.01.29 |
| 모니터가 안 켜질 때 꼭 살펴봐야 할 사항 (2) | 2011.01.28 |
댓글