I need to put favicon.ico outside the root of the web site.
Can i place it in another path or it may penalize some old browser?
If you put favicon.ico in another directory and declare it in the HTML (eg. <link rel="shortcut icon" href="/icon/favicon.ico">), the favicon will work, including on IE5, the first browser to support favicons. However, you will encounter the following (minor) drawbacks:
IE (and maybe some others) will look for /favicon.ico no matter what. Expect some 404 errors in your HTTP server logs.
Some browsers, like Chrome, will use favicon.ico even if you also declare high resolution PNG favicon pictures. Of course, if you only use favicon.ico as the favicon picture, this is not a concern.
In general, this is a good practice to put all favicon-related file in the root directory of the web site. See http://realfavicongenerator.net/faq#why_icons_in_root for more information (full disclosure: I am the author of this page).
Some browsers will always check for favicon.ico in the root folder. Won't break anything if absent, though.
Related
I put favicon.ico in my app's root. I do not have any <link> tags in my html regarding favicon. My understanding is that by default, browsers (I'm using Chrome) will load and show favicon.ico if it is in the default folder. No luck.
I have also tried <link> tags in my html. I tried generating several files for multiple browser/device support, with <link> tags, as instructed here: https://realfavicongenerator.net/ (I put the <link> tags in my layout view.) No luck.
What am I missing?
Things you might want to check:
Browse your site with Chrome or Firefox and check the dev console: do you see 404 errors? (eg. your images are not in the right directory).
Browse your site with a browser you normally don't use. Favicon caching issue is a classic: your regular browser might not reload your new favicon immediately.
Run the checker. It might give you additional information (note : I'm the author of RealFaviconGenerator).
I'm working on a web application that will run on a device that uses Midori browser in "app mode". The application runs just fine, but I notice that the favicon (a PNG file) does not display -- just a white box as if the favicon was missing completely.
I can find no documentation about what I should expect here. The application (and the favicon) display just fine when I run it in Chrome.
I did see a few older forum posts:
When in app or private mode, the Midori window uses the page favicon as the window icon. source
the website's favicon is set as the window icon source
Other than that, I've seen the list of bugs that include "favicon" -- but nothing seems to shed any light on this for me. Help?
When Midori is started from the command line with --app http://test01-v0-16-attempt-1.test.realfavicongenerator.net/, it uses a 32x32 PNG icon declared with:
<link rel="icon" type="image/png" href="/favicon-32x32.png" sizes="32x32">
This page is the test page of RealFaviconGenerator, which means that, when the page contains the package generated by RFG, its 32x32 icon is used (which is a sensible choice for a desktop browser by the way).
So you can:
Generate your favicon with RFG
Create a single 32x32 PNG icon manually and declare it.
If this fails, it might be interesting to check your server logs to see if Midori at least try to load your icon.
Full disclosure: I'm the author of RFG.
i am using favicon this code.
<link rel="icon" href="images/favicon.ico" type="image/x-icon" />
But favicon is automatically downloading in browser.
Please help us how can we resolve this issue..
My advice:
In the HTML declaration, use an absolute path (ie. /images/favicon.ico), to avoid any relative path issue.
Download the file manually (eg. download http://yourwebsite.com/images/favicon.ico) and open it with an image editor. This is to make sure that your web server really returns your favicon.ico file and not something else. When a file does not exist, some web servers are configured to return some content, such as a "Oops!" web page, instead of a plain 404 error. This can trick the browser.
When opening your page, enable your favorite web debuging tool (Firefox+Firebug, Chrome console...), select the Network tab to look at the HTTP exchanges and spot the access to favicon.ico. Check the Mime type: it should be image/x-icon (or maybe something similar). If you see something really suspicious, such as application/octet-stream, there must be something wrong on the server side.
The root of the site http://example.com correctly identifies index.html and renders it. In a similar manner, I want, http://example.com/foo to fetch foo.html present in the root of the directory. The site that uses this functionality is www.zachholman.com. I've seen his code in Github. But still I'm not able to find how it is done. Please help.
This feature is actually available in Jekyll. Just add the following line to your _config.yml:
permalink: pretty
This will enable links to posts and pages without .html extension, e.g.
/about/ instead of /about.html
/YYYY/MM/DD/my-first-post/ instead of YYYY-MM-DD-my-first-post.html
However, you lose the ability to customize permalinks... and the trailing slash is pretty ugly.
Edit: The trailing slash seems to be there by design
It's actually the server that needs adjusting, not jekyll. Be default, jekyll is going to produces files with .html extensions. There may be a way around that, but it's unlikely that you really want to do go that route. Instead, you need to let your web server know that you want those files served when a URL is called with the file's basename (and no extension).
If your site is served via an Apache web server you can enable the "MultiViews" option. In most cases, you can do that be creating an .htaccess file at your site root with the following line:
Options +MultiViews
With this option enabled, when Apache receives a request for:
http://example.com/foo
It will serve the file:
/foo.html
Note that the Apache server must be setup to allow the option to be set in the htaccess file. If not, you would need to do it in the Apache config file itself. If your site is hosted on another web server, you'll need to look for an equivalent setting.
I keep seeing favicon warnings in my apache log. How do I get rid of those? Do I have to have a favicon for my site?
/favicon.ico is one of the artifacts of the Browser Dark Ages (cca 2000). While there is no way to prevent the browser requests, creating a 0-byte file named favicon.ico ends the flow of 404 errors (as the file exists), but no favicon will be shown by the browsers for your site.
Johan Petersson provides a good answer to preventing file not found errors without using a favicon at http://www.trilithium.com/johan/2005/02/no-favicon/
Placing the following code in the Virtual Host section of httpd.conf (or wherever you define your site environment), should stop the errors appearing in the Apache error log:
# Don't bother looking for favicon.ico
Redirect 404 /favicon.ico
# Don't bother sending the custom error page for favicon.ico
<Location /favicon.ico>
ErrorDocument 404 "No favicon
</Location>
Alternatively, you can create a blank file and name it favicon.ico, placing it in the root directory of the site.
You don't need to, no, but some browsers will request /favicon.ico automatically, so the errors are pretty much unavoidable.
You don't really need it, but as others have said, some browsers will ask for it even if it's not specified in <link rel="shortcut icon" />.
I'm not an expert, but I played with mod_rewrite a bit, and here's what you can do:
# turn on the mod_rewrite module
RewriteEngine On
# if requested file is not an existing file
RewriteCond %{DOCUMENT_ROOT}/%{REQUEST_FILENAME} !-f
# and it's name is favicon.ico, send an empty 410 GONE response to the browser
RewriteRule .*favicon\.ico$ - [G]
I only tried this on my localhost: first request resulted in 410, but for all following ones, browser does not ask for that file, because it remembers it's gone.
I'm not sure this is how you're supposed to use 410 GONE status, nor that it will work 100%.
Webbrowsers use this to display the image you see in your favorites as well as the icon of your tab. e.g. when you go to stackoverflow the cool icon you see in the tab as shown : is automatically fetched by my browser (chrome) using the url : https://stackoverflow.com/favicon.ico . Its pretty standard so in case you don't want it in your log you should put some icon and rename it as favicon.ico in the httpdocs.
Looking at your logs, you will probably see such 404 errors:
favicon.ico: Internet Explorer, Chrome...
apple-touch-icon.png: iOS devices, Android, maybe some other devices
apple-touch-icon-precomposed.png: iOS devices, Android, maybe some other devices
apple-touch-icon-76x76.png: iOS, maybe some other devices
apple-touch-icon-120x120.png: iOS, maybe some other devices
apple-touch-icon-152x152.png: iOS, maybe some other devices
If you absolutely don't want to add a favicon to your site, you can apply one the the solution described in the other answers:
mod_rewrite
Force 404
Empty picture
However, favicon are so common nowadays that you probably want to add one to your site. This favicon generator creates all these files at once. Full disclosure: I am the creator of this site.
Not really need it.
However it is used on your site (the warnings).
Check the source of your website to see if it contains:
<link rel="shortcut icon" href="favicon.ico">
In the head section of the page.
Remove that line or add the favicon to prevent erros in your log.