사이트에 접속하여 원하는 이미지를 업로드한다.
각각의 경우에 보이는 모습들을 확인한 후, 추가편집이 필요하다면 편집한다.
예를들어 각 케이스에 따른 앱이름, 파비콘 색상, 뒷배경 등을 설정 후 완료.
https://realfavicongenerator.net/
Favicon Generator for perfect icons on all browsers
The ultimate favicon generator. Design your icons platform per platform and make them look great everywhere. Including in Google results pages.
realfavicongenerator.net
편집 예시

코드자동생성 - favicon package 다운


해당사이트에서 파비콘이 얼마나 최적화되었는지도 확인 할 수 있다.
https://realfavicongenerator.net/favicon_checker#.YOQYx-gzaUk
Favicon checker
Check the favicon of your site. Does it look good on Windows? iPhone/iPad? Find out!
realfavicongenerator.net
https://standout.tistory.com/309
browserconfig.xml가 뭘까?
browserconfig.xml Microsoft에서 도입한 웹 사이트 아이콘 (favicon)과 같은 웹 브라우저 구성 파일 Windows 8 이상 ~ Internet Explorer 11로 접속할 경우 클라이언트가 요청하는 browser configuration file. 이외 경우엔
standout.tistory.com
https://standout.tistory.com/310
site.webmanifest가 뭘까?
site.webmanifest 프로그레시브 웹 앱에 대해 브라우저에 알려주는 JSON 파일 사용자의 데스크톱 또는 모바일 장치에 설치할 때 어떻게 작동해야 하는지 알려줌. 앱 이름, 앱에서 사용해야 하는 아이
standout.tistory.com
'Personal > Tip' 카테고리의 다른 글
| Fontawesome 1,609개의 무료 아이콘 (0) | 2023.03.30 |
|---|---|
| 파비콘, 생성부터 점검까지 (0) | 2023.03.30 |
| site.webmanifest가 뭘까? (0) | 2023.03.30 |
| browserconfig.xml가 뭘까? (0) | 2023.03.30 |
| 파비콘, 생성 - 글자입력해 만들기 (0) | 2023.03.30 |