Recently it was asked how to create 'Touch Icons' for use within Apple & Android mobiles/tablets.
I'd never used these before so after some searching of the web here's what I've come up with:
Create a square icon using Xara
Export it as a png. (I don't think Alpha is of any use)
Import the png into icongen.com (or similar online Touch Icon generators)
Save the resultant zip folder where required and unzip it, naming the folder 'icons' or similar
Using an ftp program like Filezilla upload the folder, 'icons', one level below your website folder
Return to the icongen.com page and copy the supplied code
Edit the code to the correct path, in my example adding 'icons/' to the path
Copy this code
Open the Xara website. Web Properties / Website / HTML Code HEAD and paste in this code.
Publish
Now anyone bookmarking via 'Add to Home Screen' on a mobile or tablet will be served the touch icon.
I would also say that to bear in mind that these icons, although square, are rendered as rounded squares on mobiles / tablets, so keep the corners clear of content.
Here's a rambling video.
14 February 2016, 10:49 PM
angelize
Re: Creating & applying Touch Icons
Thanks for this Egg, I for one will find it quite useful. I have been wanting to figure out a way do do this for my little online publication and was planning on doing a search for just this info!
14 February 2016, 10:55 PM
Egg Bramhill
Re: Creating & applying Touch Icons
Cheers Frances. I'm not a lover of mobile browsing and had never worked out how to make quick bookmarks but these Touch Icons save a lot of typing on miniscule keypads!
18 February 2016, 09:38 AM
Big Frank
Re: Creating & applying Touch Icons
i like your rambling videos
18 February 2016, 01:37 PM
CQDX
Re: Creating & applying Touch Icons
Thank you very much for the effort you put into a very informative presentation!