Skip to content

Commit

Permalink
Add /browserconfig.xml and tile images
Browse files Browse the repository at this point in the history
By default, starting with IE11 on Windows 8.1, IE will request the
`/browserconfig.xml` file when a user clicks/touches the `pin site`
button (same as Safari for iOS does with the `apple-touch-icons` when
the user touches the `share` button).

Adding the `/browserconfig.xml` file and the tile images:

* reduces the number of 404s, especially as IE11 on Windows 8.1 gets
  more market share
* provides a starting point for dealing with Windows tiles
* reminds users about the tile images, so that their website doesn't
  end up having as a tile the default IE11 logo, or (if the favicon
  is 32×32px or bigger and not `.ico`) the website's favicon
* unlike using `<meta>` tags, offers a way that doesn't increase the
  page size

Only two images are provided since:

* `tile.png` (558×558px) - can be used for the `Small`, `Medium`,
  and `Large` tiles, being automatically resized where necessary
* `tile-wide.png` (558×270px) - can be used for the `Wide` tile
  as, in this case, resizing the 558×558px image would just end up
  looking weird

The two images are 558×558px and 558×270px because those are the
recommended image sizes in order for the tiles to look good on a wide
range of devices.

For more in depth information, please refer to the MSDN documentation:

 * http://msdn.microsoft.com/en-us/library/ie/dn455106.aspx
 * http://msdn.microsoft.com/en-us/library/ie/dn255024.aspx

Close #1481.
  • Loading branch information
alrra committed Feb 18, 2014
1 parent f73bb1f commit 80530d6
Show file tree
Hide file tree
Showing 3 changed files with 12 additions and 0 deletions.
12 changes: 12 additions & 0 deletions browserconfig.xml
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Please read: http://msdn.microsoft.com/en-us/library/ie/dn455106.aspx -->
<browserconfig>
<msapplication>
<tile>
<square70x70logo src="tile.png"/>
<square150x150logo src="tile.png"/>
<wide310x150logo src="tile-wide.png"/>
<square310x310logo src="tile.png"/>
</tile>
</msapplication>
</browserconfig>
Binary file added tile-wide.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added tile.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.

0 comments on commit 80530d6

Please sign in to comment.