Skip to content

Commit

Permalink
Update apple-touch-icon-precomposed.png and docs
Browse files Browse the repository at this point in the history
 * Update the documentation regarding the Apple touch icons, by
   reflecting the recent changes brought by the release of iOS 8 and the
   new iPhone 6 and 6 Plus.

   Note: The changes do not follow all Apple's iOS Human Interface
   Guidelines¹, as in practice, the images used by the different devices
   are different² from the ones specified in the Apple documentation.

 * Update the `apple-touch-icon-precomposed.png` to be `180×180px` (this
   is now the largest image size used by any Apple device running iOS).

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

¹ https://developer.apple.com/library/ios/documentation/UserExperience/Conceptual/MobileHIG/IconMatrix.html
² #1599

Close #1599.
  • Loading branch information
alrra committed Sep 25, 2014
1 parent 712568f commit 1c4fcf3
Show file tree
Hide file tree
Showing 5 changed files with 37 additions and 14 deletions.
3 changes: 3 additions & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,8 @@
### HEAD

* Update `apple-touch-icon-precomposed.png` and the _"Apple touch
icons"_ related documentation
([#1599](https://github.com/h5bp/html5-boilerplate/pull/1599)).
* Update Apache Server Configs to v2.8.0.
* Add pseudo-elements to universal selector in print media query
([#1585](https://github.com/h5bp/html5-boilerplate/pull/1585)).
Expand Down
Binary file modified dist/apple-touch-icon-precomposed.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
24 changes: 17 additions & 7 deletions dist/doc/extend.md
Original file line number Diff line number Diff line change
Expand Up @@ -591,13 +591,23 @@ icons using `link` elements placed in the HTML `head` of your document, e.g.:

The main sizes of the icons on iOS are:

* `57×57px` – non-Retina iPhone and iPod Touch
* `72×72px` – iPad mini and the first- and second-generation iPad on iOS ≤ 6
* `76×76px` – iPad mini and the first- and second-generation iPad on iOS ≥ 7
* `114×114px` – iPhone 4+ (with Retina Display) on iOS ≤ 6
* `120×120px` – iPhone 4+ (with Retina Display) on iOS ≥ 7
* `144×144px` – iPad 3+ (with Retina Display)
* `152×152px` – iPad 3+ (with Retina Display)
* `57×57px` – iPhone with @1x display and iPod Touch
* `72×72px` – iPad and iPad mini with @1x display running iOS ≤ 6
* `76×76px` – iPad and iPad mini with @1x display running iOS 7
* `114×114px` – iPhone with @2x display running iOS ≤ 6
* `120×120px` – iPhone with @2x and @3x display running iOS ≥ 7
* `144×144px` – iPad and iPad mini with @2x display running iOS ≤ 6
* `152×152px` – iPad and iPad mini with @2x display running iOS 7
* `180×180px` – iPad and iPad mini with @2x display running iOS 8

Displays meaning:

* @1x - non-Retina
* @2x - Retina
* @3x - Retina HD

More information about the displays of iOS devices can be found
[here](http://en.wikipedia.org/wiki/List_of_iOS_devices#Display).

For non-Retina iPhone, iPod Touch, and Android 2.1+ devices you can use the
example from above or replace the `apple-touch-icon-precomposed.png` within
Expand Down
Binary file modified src/apple-touch-icon-precomposed.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
24 changes: 17 additions & 7 deletions src/doc/extend.md
Original file line number Diff line number Diff line change
Expand Up @@ -591,13 +591,23 @@ icons using `link` elements placed in the HTML `head` of your document, e.g.:

The main sizes of the icons on iOS are:

* `57×57px` – non-Retina iPhone and iPod Touch
* `72×72px` – iPad mini and the first- and second-generation iPad on iOS ≤ 6
* `76×76px` – iPad mini and the first- and second-generation iPad on iOS ≥ 7
* `114×114px` – iPhone 4+ (with Retina Display) on iOS ≤ 6
* `120×120px` – iPhone 4+ (with Retina Display) on iOS ≥ 7
* `144×144px` – iPad 3+ (with Retina Display)
* `152×152px` – iPad 3+ (with Retina Display)
* `57×57px` – iPhone with @1x display and iPod Touch
* `72×72px` – iPad and iPad mini with @1x display running iOS ≤ 6
* `76×76px` – iPad and iPad mini with @1x display running iOS 7
* `114×114px` – iPhone with @2x display running iOS ≤ 6
* `120×120px` – iPhone with @2x and @3x display running iOS ≥ 7
* `144×144px` – iPad and iPad mini with @2x display running iOS ≤ 6
* `152×152px` – iPad and iPad mini with @2x display running iOS 7
* `180×180px` – iPad and iPad mini with @2x display running iOS 8

Displays meaning:

* @1x - non-Retina
* @2x - Retina
* @3x - Retina HD

More information about the displays of iOS devices can be found
[here](http://en.wikipedia.org/wiki/List_of_iOS_devices#Display).

For non-Retina iPhone, iPod Touch, and Android 2.1+ devices you can use the
example from above or replace the `apple-touch-icon-precomposed.png` within
Expand Down

0 comments on commit 1c4fcf3

Please sign in to comment.