All about {Web}

☞ Photoshop 2025 파비콘(ico) 제작방법

※ 파비콘의 정의
- 파비콘 : 파비콘(영어: favicon, 'favorites + icon') 또는 패비콘이란 인터넷 웹 브라우저의 주소창에 표시되는 웹사이트나 웹페이지를 대표하는 아이콘이다.

☞ 다운로드 사이트 : https://www.telegraphics.net/sw/

 

Telegraphics - Free plugins for Photoshop & Illustrator...and other software

Plugins Most plugins below are usable with all versions of Photoshop under Mac OS X, 9 and earlier, and Windows (if you need a version that's not here, please write to us). Should also work with Elements, AfterEffects, Premiere, PhotoDeluxe, Corel PhotoP

www.telegraphics.net

위의 사이트를 방문해 자신의 컴퓨터에 맞는 플러그인을 다운로드 한다. 요즘은 거의 대부분 64비트를 사용하므로다운로드하면 된다.
는 32bit용 (ICOFormat.8bi), 는 64bit용 (ICOFormat64.8bi) 플러그인
다운로드가 번거로우면 아래에 첨부한 파일을 받으면 된다.

- 32bit windows용

ICOFormat.8bi
0.22MB


-64bit windows용 (대부분의 윈도우는 64비트이므로 아래 파일을 받으면 된다.)

ICOFormat64.8bi
0.26MB

  파비콘 파일의 형식과 크기
일반적으로 PNG, ICO, SVG와 같은 파일 형식이 사용된다. 각 형식마다 장단점이 있으므로, 웹사이트에 가장 적합한 형식을 선택하는 것이 중요하다. 또한, 파비콘의 크기는 일반적으로 16x16px, 32x32px, 48x48px 등 여러 크기로 저장하여 다양한 디바이스에서 최적의 표시를 보장해야 한다.

  이제 파비콘을 만들어 보자

※ 플러그인 설치방법
다운로드한 파일 ICOFormat64.8bi를 아래 경로에 복사한다.
- 설치 경로
c:\Program Files\Adobe\Adobe Photoshop 2025\Plug-ins\

 플러그인을 이용한 파비콘 만들기
이제 포토샵 2025을 실행해 이미지 작업을 마친 후 아이콘 파일(ico)로 저장을 해보자! 보통 아이콘용 이미지의 크기는 16px * 16px 또는 32px * 32px로 작업이 이루어진다.

 ico 파일로 저장하기
[01] File > Save a Copy를 클릭하면 대화상자가 열리고

[2] 파일형식(T)에서 ICO Windows Icon/Favicon (*.ico)를 클릭해 저장하고자 하는 폴더에 저장한다.

파비콘 파일(ico)의 형식과 크기
일반적으로 PNG, ICO, SVG와 같은 파일 형식이 사용된다. 각 형식마다 장단점이 있으므로, 웹사이트에 가장 적합한 형식을 선택하는 것이 중요하다. 또한, 파비콘의 크기는 일반적으로 16x16px, 32x32px, 48x48px 등 여러 크기로 저장하여 다양한 디바이스에서 최적의 표시를 보장해야 한다.

 웹페이지에 파비콘(favicon) 삽입

<!-- <head>와 </head> 사이에 아래 코드 삽입 -->
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon">
<link rel="icon" href="/favicon.ico" type="image/x-icon">