>  기사  >  웹 프론트엔드  >  파비콘은 단순한 아이콘 그 이상입니다

파비콘은 단순한 아이콘 그 이상입니다

高洛峰
高洛峰원래의
2017-02-15 14:00:411542검색

파비콘의 개념

파비콘의 중국어 번역은 웹사이트의 아바타일 뿐만 아니라 브라우저의 즐겨찾기에 해당 제목을 표시할 뿐만 아니라 구별도 가능하게 합니다. 다른 아이콘.

브라우저 지원

FF 브라우저는 동적 파비콘도 지원하므로 웹 사이트를 더욱 개인화할 수 있습니다.

약간의 상식

파비콘은 서버의 트래픽 대역폭을 줄이려면 필수입니다. 일반적으로 웹사이트의 유용성을 개선하기 위해 웹사이트에 해당 favicon.ico 파일이 없으면 웹사이트에 대한 사용자 정의 404 오류 파일을 생성합니다. 사용자가 웹사이트/웹페이지를 즐겨찾기에 추가하면 웹 서버는 이 사용자 정의 404 파일을 호출하여 웹사이트의 오류 로그에 기록합니다. 이는 분명히 피해야 합니다.

가끔 파비콘을 설정했는데 표시되지 않는 걸 발견했어요

  • 먼저 형식이 올바른지 확인하세요:

<link rel="shortcut icon" type="image/x-icon" href="/favicon.ico">

형식은 이제 그리 엄격하지 않습니다 네, 타이핑하지 않아도 괜찮습니다

  • 형식이 맞다면 ctrl + F5 강제로 캐시를 지워보면 알 수 있습니다 탭 아이콘입니다.

웹팩은 파비콘을 어떻게 패키징하나요?

html-webpack-plugins를 사용하여 html을 처리하는 경우 이 플러그인은 이미 파비콘을 제공합니다.

const htmlPlugin = new HtmlWebpackPlugin({
    favicon: path.resolve(publicDir, './imgs/favicon.ico')
});
pluginsConfig.push(htmlPlugin);

와 같이 파비콘이 있는 경로만 작성하면 됩니다. 플러그인은 HTML 헤드에 자동으로 패키징됩니다.
그렇지 않은 경우 아이콘을 직접 처리한 다음 인용해야 합니다.

더 많은 파비콘을 보려면 단순한 아이콘이 아닙니다. .관련 글은 PHP 중국어 홈페이지를 참고해주세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.