I've spent a lot of time figuring this out, and judging by the Forum comments - so have many others!
It boils down to 3 main issues:

• 1 Not knowing whether to tick the Use the Skin's Favicon box. - ( yes you do. )
• 2 Not understanding where to put the Favicon files. - ( in the input res folder in jAlbum )
• 3 Not realising that several Favicons need to be used to cope with different browsers and situations - ( 10 files )

MY INSTRUCTIONS

• 1. Make a favicon using Photoshop or another photo editor - at least 260 x 260 px in size and save as favicon-master.png for example.
• 2. Run that image through this website: Real Favicon Generator
• 3. Download the Zip file produced and Extract the files to your PC. (all 10 files!)
• 4. Copy all those files into the jAlbum res folder (input directory) by drag and drop into the jAlbum interface. Here is a photo (attached) that shows you exactly what to do.
• 5. In TIGER open Settings > Tiger > Advanced > Site admin - tick the box for Use the skin's favicon
• 6. Make and upload the Album.

ONE QUESTION
I assume the favicon link code that the Real Favicon Generator produces, does not need to be copied to the HEAD section of my Albums because the album already has it in-built? It works without anyway!

SUGGESTIONS
Laca Molnar, please could you clarify your instructions, so we don't have to search the forum to find the answers?

• 1 Change the words
  • from - Use the Skin's Favicon
  • to - Use your own Favicon or Tiger Skins default.
  • Also give more explanation in the tool-tip
• 2 The ? HELP instructions for TIGER settings for Use the skin's favicon need complete rewording and expansion to something like my instructions above.
• 3 I can't quite see why anyone would want to change the lovable Dorr frog icon for a square icon provided by TIGER!!! I would think that if you are going to change the favicon, then a bespoke one that is meaningful to your website is best.

Edited by: John-Simpson on 16 Aug 2024, 22:40

Laza, why do your skins still include the various mstile icons? Those were for Win8 tiles, and Win8 is a dead dog. The page code never calls them, so they're just file clutter.

There's also a call to favicon.ico, which is needed only for legacy browsers like IE11. Long gone.

Not sure why there's a 16x16 PNG and a 32x32 PNG. For display in browser tabs, couldn't you just use a single 32x32, or even a 64x64, and let the browser downsize for what it needs?

(There is one place where you still need favicon.ico, and that's if you want to plant a favicon at the root of your domain, which gets picked up if any individual page doesn't specifically call a favicon. For example, if you look at a page of a Tiger album, it displays the Tiger favicon. But if you tell the browser to show you the page source, for example, the tab that opens up doesn't show the favicon. A very, very minor thing, of course.)

Since FTP is still a "one file per connection" protocol, I'm always looking for ways to cut down on the forest of little res files.

This reply is just about the wording of the instructions. Yes, it needs rewording.

I suggest that you use next to the tick box:

Use the Tiger Skin Favicon otherwise the default is the jAlbum frog.

The tooltip should explain:

If you wish to use your own favicon, replace those in the uploaded res folder with your own. These should be placed in the input res folder.

The Help Section could be more verbose.

The final wording may be different depending on your academic discussion with Jeff Tucker!

For browsers, one favicon, like a 32x32 PNG, covers the waterfront (I'm using 64x64 PNGs on my skin demo site - a bit of future-proofing). No need to tinker with the ICO format, which can be tough to produce on your own (I've always had to use an online format converter).

The others are needed for other things, like planting a link to a page on the home screen of your mobile, especially the larger devices like tablets. That's where the Apple and Android variants kick in. For Apple, it appears that a single 180x180 PNG will do nicely. I don't have an Android device to play with, but it looks like those need a 192x192 and a 512x512.

The tougher aspect of it is coming up with a design that remains distinguishable at small sizes. You also need to pay attention to colors - a favicon that looks OK with a "light" browser theme might disappear entirely with a "dark" theme. PNG's with transparent backgrounds are a minefield in that regard! My favicons are mostly fairly simple black designs on a solid white background, which cuts down on nasty surprises. Example:

https://jefftucker.jalbum.net/skins/neptune/

If you're using jAlbum hosting, you can't put a fallback favicon.ico at the root of your domain, because you don't own jalbum.net, which is the root. So, no sense messing with it at all. You just need to include a favicon with each album. Favicons in the directories below the root would be ignored - the browsers don't know to look there. They either look at the domain root, or where the actual page coding points to the favicon.

If you've got your own hosting, it's a good idea to plant a favicon.ico at the root, so that even if you don't include a favicon with each album, there's always something showing. I use either the mountain silhouette that I also use for my avatar here, or, for my personal domain, a capital T.

There would be a fight. Different skin developers take very different approaches to this (which reminds me, my skin user's manual entries about this are horribly out of date - need to do some rewriting).

I've never bothered with a favicon myself. I rarely take any notice of them in the Browser tabs either, the text is enough to know which tab to switch to - I usually have around nine tabs open.

Edited by: JeffTucker on 23 Aug 2024, 10:18 - tangent resolved elsewhere