Op je iPhone of iPad kan het zo zijn dat je de favicon van je website niet ziet. Logisch, want je bent vergeten dat Apple haar eigen standaarden hanteert. Zelfs met dit soort dingen. Zij ondersteunen .ico bestanden niet, waardoor je een .png image moet toevoegen en de volgende HTML in je header moet gooien:
< link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" /> < link rel="apple-touch-icon" href="/apple-touch-icon.png" /> < link rel="apple-touch-icon" sizes="57x57" href="/apple-touch-icon-57x57.png" /> < link rel="apple-touch-icon" sizes="72x72" href="/apple-touch-icon-72x72.png" /> < link rel="apple-touch-icon" sizes="76x76" href="/apple-touch-icon-76x76.png" /> < link rel="apple-touch-icon" sizes="114x114" href="/apple-touch-icon-114x114.png" /> < link rel="apple-touch-icon" sizes="120x120" href="/apple-touch-icon-120x120.png" />
favicon toevoegen voor iOS apparaten
Op je iPhone of iPad kan het zo zijn dat je de favicon van je website niet ziet. Logisch, want je bent vergeten dat Apple haar eigen standaarden hanteert. Zelfs met dit soort dingen. Zij ondersteunen .ico bestanden niet, waardoor je een .png image moet toevoegen en de volgende HTML in je header moet gooien:
< link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
< link rel="apple-touch-icon" href="/apple-touch-icon.png" />
< link rel="apple-touch-icon" sizes="57x57" href="/apple-touch-icon-57x57.png" />
< link rel="apple-touch-icon" sizes="72x72" href="/apple-touch-icon-72x72.png" />
< link rel="apple-touch-icon" sizes="76x76" href="/apple-touch-icon-76x76.png" />
< link rel="apple-touch-icon" sizes="114x114" href="/apple-touch-icon-114x114.png" />
< link rel="apple-touch-icon" sizes="120x120" href="/apple-touch-icon-120x120.png" />