I'm fairly new to html and I've noticed that the favicon that I want to display on my site is not showing up on Safari but showing up on Google Chrome. I was wondering if I could get any help on this?
I know this is a pretty basic question, but I have tried all the basic stuff like emptying my Safari's browser cache as well as the favicon cache on my mac. Here is the syntax I used to link the png. I enclosed this under the <head>
</head>
section of my code.
<link rel="shortcut icon" type="image/png" href="../MP1/images/icon.png"/> <link rel="apple-touch-icon" type="image/png" href="../MP1/images/icon.png">
I've tried both standard favicon sizes 16x16 and 32x32 px but neither show up on my Safari browser. Thank you in advanced for the help!
Safari uses "apple-touch-icon" and not just "icon". Also, you will have to specify the icon for all Apple devices if you want it to show up in all of them.
Refer this article : https://css-tricks.com/favicon-quiz/