Home > Article > Web Front-end > favicon is more than just an icon
The Chinese translation of favicon is the favorite icon. It is not only the avatar of the website, but also allows the browser's favorites to not only display the corresponding title, but also distinguish different icons. website.
FF browser also supports dynamic favicon, making your website more personalized
favicon can be used in certain situations To reduce the server's traffic bandwidth usage to a certain extent, generally in order to improve the usability of the website, we will create a customized 404 error file for our website. In this case, if the website does not have a corresponding favicon.ico file, whenever there is When a user favorites a website/webpage, the web server will call this customized 404 file and record it in the website's error log. This should obviously be avoided.
First check whether the format is correct:
<link rel="shortcut icon" type="image/x-icon" href="/favicon.ico">
Now the format is not so strict. No, it’s okay without type
If the format is correct, ctrl + F5 forcefully clear the cache, and you can see the icon of the tab page.
If you use html-webpack-plugins to process html, this plug-in already provides favicon. You only need to write the path where favicon is located, such as:
const htmlPlugin = new HtmlWebpackPlugin({ favicon: path.resolve(publicDir, './imgs/favicon.ico') }); pluginsConfig.push(htmlPlugin);
The plug-in is It will automatically package it into the head of html for you;
If not, you need to process the icon yourself, and then quote
For more favicon, it is not just an icon. For related articles, please pay attention to the PHP Chinese website!