Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Added section for Windows tiles #52

Open
wants to merge 2 commits into
base: master
Choose a base branch
from
Open

Added section for Windows tiles #52

wants to merge 2 commits into from

Conversation

fboes
Copy link

@fboes fboes commented Apr 8, 2015

I'd like to contribute a section concerning the custom tiles and notifications for Internet Explorer. There functionality is similiar to favicons.

@Nilpo
Copy link

Nilpo commented Apr 8, 2015

I was actually going to do this as well. Thanks for contributing.

@jp-studios
Copy link

Here's some more detail that should be added. The IE10 144x144 live tile is just the bare minimum.

Live tiles have multiple sizes. There is a tiny square, a medium square, a large square, and a horizontal box. Microsoft users can resize these as they wish on their start menu or Windows Phone home screen, so it's good to include all 4.

The meta names are deceptive, as the actual files needed should be large for high-quality Windows screens and Windows 8 start screens. They are downgraded to the smaller size on low-quality screens and Windows 7 start screens. These can be full-color.

  • tiny.png - 128x128 - Smallest square metro tile for a pinned site on Windows start menu
  • square.png - 270x270 - Medium square metro tile for a pinned site on Windows start menu
  • wide.png - 558x270 - Horizontal metro tile for a pinned site on Windows start menu
  • large.png - 558x558 - Large square metro tile for a pinned site on Windows start menu

Here is the official tool that Microsoft created for Windows Live Tiles: http://www.buildmypinnedsite.com/en
They even included a step to pull notifications from an RSS feed.

The official meta code output that should be used is:

<meta name="application-name" content="Company Name Here"/>
<meta name="msapplication-TileColor" content="#000000"/>
<meta name="msapplication-square70x70logo" content="tiny.png"/>
<meta name="msapplication-square150x150logo" content="square.png"/>
<meta name="msapplication-wide310x150logo" content="wide.png"/>
<meta name="msapplication-square310x310logo" content="large.png"/>

More official documentation: https://msdn.microsoft.com/en-us/library/bg183312(v=vs.85).aspx
More things you can do with live tiles: https://msdn.microsoft.com/en-us/library/windows/apps/Hh761491.aspx?f=255&MSPPError=-2147217396

@fboes
Copy link
Author

fboes commented Jul 3, 2015

@jp-studios Would you like me to include your information, or do you want to add your information to https://github.com/fboes/favicon-cheat-sheet?

@jp-studios
Copy link

@fboes since I'm very new to GitHub, it'd probably be best if you added it instead of me doing a pull request :) Just wanted to contribute!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants