Re: Favicons, providing more than one size

Discussion in 'HTML' started by Neredbojias, Dec 8, 2008.

  1. Neredbojias

    Neredbojias Guest

    On 07 Dec 2008, Guy Macon <http://www.GuyMacon.com/> wrote:

    >
    >
    >
    > Does anyone have any evidence of any browser or operating system
    > ever using anything other than the 16x16 image in multiple image
    > favicon.ico files? Manually Re-using the same files as a desktop
    > or file explorer icon doesn't count; it only counts if the icon
    > was generated by a browser from the favicon.ico file on a website,
    > possibly with a "save URL to desktop/disk" command.
    >
    > -------------------------------------------------------------
    >
    > Here is a "overkill" solution that I am currently experimenting
    > with for my next website redesign:
    >
    > In the webpage root, create these files:
    >
    > 16x16 favicon.gif
    > 16x16 favicon.ico
    > 16x16 favicon.icon
    > 16x16 favicon.jpeg
    > 16x16 favicon.jpg
    > 16x16 favicon.png
    >
    > NOTE: I have seen no evidence that any browser uses the larger
    > sizes in a multi-size .ico file, so I skip the 32x32, etc.
    >
    > In .HTACCESS:
    >
    > AddType image/gif .gif
    > AddType image/x-icon .ico
    > AddType image/vnd.microsoft.icon .icon
    > AddType image/jpeg .jpeg
    > AddType image/jpeg .jpg
    > AddType image/png .png
    >
    > In HTML:
    >
    > <head profile="http://www.w3.org/2005/10/profile">
    > <link rel="shortcut icon"
    > href="href="http://www.example.com/favicon.icon"
    > type="image/vnd.microsoft.icon"> <link rel="icon"
    > href="href="http://www.example.com/favicon.png" type="image/png">
    >
    > What this accomplishes:
    >
    > [A] Old user-agents that look for favicon.ico in the root find it.
    >
    > User-agents that follow the Microsoft standard
    > [ http://msdn.microsoft.com/en-us/library/ms537656.aspx ]
    > will find favicon.icon with the correct IANA Mime-Type
    > [ http://www.iana.org/assignments/media-types/image/vnd.microsoft.icon
    > ].
    >
    > [C] User-agents that follow the W3C standards
    > [ http://www.w3.org/2005/10/howto-favicon ]
    > will see favicon.png with the correct IANA Mime-Type.
    > [ http://www.fileformat.info/info/mimetype/image/png/index.htm ]
    >
    > [D] any user-agent looking for favicon.gif/jpeg/jpg in the root will
    > find it.
    >
    > [E] The full URL in link rel tags makes it so this works wherever the
    > webpage is.
    >
    > Note: when testing this, be sure to test the following
    > Icon displayed in the favorites/bookmarks page.
    > Icon displayed in the location window of the browser.
    > Icon displayed on the desktop after saving a URL to the desktop
    > Icon displayed in the file manager after saving a URL to disk.


    No matter what I've tried, I have _never_ gotten favicons to work in
    ie6 or ie7 (-the latter of which I now have.)

    Pursuant to your example, I did the following:

    1. Added 'AddType image/vnd.microsoft.icon .icon' to my .htaccess file.
    2. Added '<link rel="shortcut icon"
    href="href="http://www.example.com/favicon.icon"
    type="image/vnd.microsoft.icon">' (with the correct url in place of
    'example.com') to the head section (The normal '<link rel="icon"
    href="my.ico" type="image/x-icon">' was already in place.)
    3. Uploaded the file named "favicon.icon", an ico file which works fine
    in any decent browser.

    No dice. Are you _sure_ it works?

    --
    Neredbojias
    http://www.neredbojias.org/
    http://www.neredbojias.net/
     
    Neredbojias, Dec 8, 2008
    #1
    1. Advertising

  2. Neredbojias

    Bergamot Guest

    Neredbojias wrote:
    >
    > No matter what I've tried, I have _never_ gotten favicons to work in
    > ie6 or ie7 (-the latter of which I now have.)


    If you are expecting IE to show the icon in the location bar the same as
    Firefox does, you'll be disappointed. It only shows the icon after the
    page has been bookmarked.

    > 3. Uploaded the file named "favicon.icon", an ico file which works fine
    > in any decent browser.


    AFAICT, IE only recognizes "favicon.ico" (not .icon) and it must be in
    the root directory.

    --
    Berg
     
    Bergamot, Dec 8, 2008
    #2
    1. Advertising

  3. Neredbojias

    Neredbojias Guest

    On 08 Dec 2008, Guy Macon <http://www.GuyMacon.com/> wrote:

    > Neredbojias wrote:
    >
    >>Pursuant to your example, I did the following:
    >>
    >>1. Added 'AddType image/vnd.microsoft.icon .icon' to my .htaccess
    >>file. 2. Added '<link rel="shortcut icon"
    >>href="href="http://www.example.com/favicon.icon"
    >>type="image/vnd.microsoft.icon">' (with the correct url in place of
    >>'example.com') to the head section (The normal '<link rel="icon"
    >>href="my.ico" type="image/x-icon">' was already in place.)
    >>3. Uploaded the file named "favicon.icon", an ico file which works
    >>fine in any decent browser.
    >>
    >>No dice. Are you _sure_ it works?

    >
    > I will test it tomorrow -- I *think* that I tested each method in
    > isolation before combining them, but perhaps I made a mistake.
    > Until I get back to you, you might try reversing the order of the
    > link rel="shortcut icon" and link rel="icon" lines.
    >
    > Looking back at the Microsoft Docs, this is what MS says:
    > http://msdn.microsoft.com/en-us/library/ms537656.aspx
    >
    >|
    >| Associating the Shortcut Icon with Your Web Page|
    >|
    >| After creating the icon, you must associate it with
    >| your Web page. There are two methods for doing this.
    >|
    >| The first method is to save the icon with the default
    >| file name of favicon.ico to the root directory of your
    >| domain—for example, www.microsoft.com/favicon.ico.
    >| The first time a user visits your Web page, Internet
    >| Explorer automatically searches for this file and
    >| places the icon in the address bar, next to all
    >| favorites linking to your site, and on page tabs.
    >| In Internet Explorer 5 and Internet Explorer 6,
    >| the icon will appears only after a user adds the
    >| site to the Favorites menu.
    >|
    >| The second method for associating a shortcut icon
    >| with your Web page is to add a line of HTML code
    >| to the page's head element. The line of code
    >| includes a link tag that specifies the location
    >| and name of the icon file. You can include this
    >| link tag on a per-page basis. First, save the
    >| icon with a file name other than favicon.ico,
    >| and then add the following code to the head
    >| element of your page.
    >|
    >| <head>
    >| <link rel="SHORTCUT ICON"
    >| href="http://www.mydomain.com/myicon.ico"/> <title>My
    >| Title</title>
    >| </head>
    >|
    >| You can use either method, or both. However, if you use the
    >| second method, whichever icon you point to in the link tag
    >| on each page will be displayed instead of the default
    >| favicon.ico file at the root of your domain.
    >|
    >
    > The obvious difference is the use of .ico instead of .ico, and it
    > wouldn't be the first time that Microsoft hard-coded in a file
    > extension...
    >
    > If so, I may have to abandon the idea of having link rel="icon"
    > point to a file that is served up as image/x-icon and having
    > link rel="shortcut icon" point to a file that is served up as
    > image/vnd.microsoft.icon. I am going to try making the link
    > rel="icon" / image/x-icon use .icon instead of the link rel=
    > "shortcut icon" / image/vnd.microsoft.icon, but I doubt that
    > will work.
    >
    > More later after I do some further experimenting.


    Okay, I _finally_ (-after innumerable years) got it, and without the
    "vnd.microsoft.icon" thing. To:

    <link rel="icon" href="myfolder/myicon.ico" type="image/x-icon">

    ....I added:

    <link rel="shortcut icon" href="http://www.example.com/favicon.ico"
    type="image/x-icon">

    ....and added a copy of myicon.ico as favicon.ico in the root directory.
    All this I tried before, however, so the real trick was deleting
    Temporary Internet Files, the history, cookies, and everything else in
    that Tools Menu section then restarting the browser.

    Jeez, what a piece of crap.


    --
    Neredbojias
    http://www.neredbojias.org/
    http://www.neredbojias.net/
     
    Neredbojias, Dec 8, 2008
    #3
  4. Neredbojias

    Neredbojias Guest

    On 08 Dec 2008, Bergamot <> wrote:

    > Neredbojias wrote:
    >>
    >> No matter what I've tried, I have _never_ gotten favicons to work in
    >> ie6 or ie7 (-the latter of which I now have.)

    >
    > If you are expecting IE to show the icon in the location bar the same
    > as Firefox does, you'll be disappointed. It only shows the icon after
    > the page has been bookmarked.


    According to Microsoft, ie7 doesn't have that restriction. However, I
    haven't specifically tried it, so...

    >> 3. Uploaded the file named "favicon.icon", an ico file which works
    >> fine in any decent browser.

    >
    > AFAICT, IE only recognizes "favicon.ico" (not .icon) and it must be
    > in the root directory.


    Yes, I knew that but I think the stumper was the requirement to delete
    stored history and files before it would work. Anyway, I'm a happy
    camper again.


    --
    Neredbojias
    http://www.neredbojias.org/
    http://www.neredbojias.net/
     
    Neredbojias, Dec 8, 2008
    #4
  5. Neredbojias

    Neredbojias Guest

    On 09 Dec 2008, Guy Macon <http://www.GuyMacon.com/> wrote:

    > Neredbojias wrote:
    >
    >>Okay, I _finally_ (-after innumerable years) got it, and without the
    >>"vnd.microsoft.icon" thing. To:
    >>
    >><link rel="icon" href="myfolder/myicon.ico" type="image/x-icon">
    >>
    >>...I added:
    >>
    >><link rel="shortcut icon" href="http://www.example.com/favicon.ico"
    >>type="image/x-icon">
    >>
    >>...and added a copy of myicon.ico as favicon.ico in the root
    >>directory. All this I tried before, however, so the real trick was
    >>deleting Temporary Internet Files, the history, cookies, and
    >>everything else in that Tools Menu section then restarting the
    >>browser.
    >>
    >>Jeez, what a piece of crap.

    >
    > Indeed. :(
    >
    > Alas, image/x-icon does not conform to the IANA Mime-Type standards.
    > The "x-" Mime-Types are for files that have no assigned Mime-Type,
    > and .ico has been assigned image/vnd.microsoft.icon.


    Yes, as I discovered in my researching. Most Google references still
    proffer the "image/x-icon" though. Interestingly too,
    "text/javascript" should really be "application/javascript" as in:

    <script type="application/javascript">

    ....which I didn't know, either.

    > I always add the type in the link rel out of habit, but having the
    > server serve it up as the correct Mime-Type should suffice.



    --
    Neredbojias
    http://www.neredbojias.org/
    http://www.neredbojias.net/
     
    Neredbojias, Dec 9, 2008
    #5
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. August Karlstrom

    Favicons, providing more than one size

    August Karlstrom, Oct 25, 2008, in forum: HTML
    Replies:
    12
    Views:
    937
    Allodoxaphobia
    Dec 8, 2008
  2. Jonathan N. Little

    Re: Favicons, providing more than one size

    Jonathan N. Little, Dec 8, 2008, in forum: HTML
    Replies:
    3
    Views:
    401
    Jonathan N. Little
    Dec 8, 2008
  3. Tom Anderson
    Replies:
    12
    Views:
    700
    Daniel Pitts
    Jan 21, 2010
  4. Steven D'Aprano
    Replies:
    0
    Views:
    117
    Steven D'Aprano
    Dec 23, 2013
  5. Replies:
    3
    Views:
    98
    Gary Herron
    Dec 23, 2013
Loading...

Share This Page