GoogleChrome · bamyou328 · Apr 27, 2015 · Apr 28, 2015 · May 18, 2015 · May 19, 2015
diff --git a/README.md b/README.md
@@ -11,8 +11,7 @@ This is the source of the official [Chrome Multi-Device documentation](https://d
 2. Open [http://localhost:8000/_preview.html](http://localhost:8000/_preview.html)
 3. You will see the boilerplate with the index.html file already included
 4. To preview another document, add a url paramater with the filename
-  * Something like: [http://localhost:8000/_preview.html?data-compression.html](http://localhost:8000/_preview.html?data-compression.html)
-  * Or: [http://localhost:8888/_preview.html?webview/gettingstarted.html](http://localhost:8888/_preview.html?webview/gettingstarted.html)
+  * Something like: [http://localhost:8000/_preview.html?webview/gettingstarted.html](http://localhost:8000/_preview.html?webview/gettingstarted.html)
   * Things mostly work but is not exactly the same as viewing through DCC.
 
 ### Deployment

diff --git a/_preview.html b/_preview.html
@@ -169,7 +169,7 @@
 
 <!-- add override for .collapsible feature (.gc-content div messes with css selector) -->
 <style>
-@media only screen and (max-width: 580px){.article-content [itemprop="articleBody"] .collapsible{height:58px;overflow:hidden}.article-content [itemprop="articleBody"] .collapsible.active{height:auto}.article-content [itemprop="articleBody"] .collapsible.active h2::before{content:'-'}.article-content [itemprop="articleBody"] .collapsible h2{position:relative;margin:0;padding:15px 15px 15px 0;border-top:1px solid #dbdbdb;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.article-content [itemprop="articleBody"] .collapsible h2::before{position:absolute;right:0;content:'+'}.article-content [itemprop="articleBody"] .related{margin:20px 0}}
+@media only screen and (max-width: 580px){.article-content [itemprop="articleBody"] .collapsible{height:58px;overflow:hidden}.article-content [itemprop="articleBody"] .collapsible.active{height:auto}.article-content [itemprop="articleBody"] .collapsible.active h2::before{content:'-'}.article-content [itemprop="articleBody"] .collapsible h2{position:relative;margin:0;padding:15px 15px 15px 0;border-top:1px solid #dbdbdb;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.article-content [itemprop="articleBody"] .collapsible h2::before{position:absolute;right:0;content:'+'}.article-content [itemprop="articleBody"] .related{margin:20px 0} }
 </style>
 
   <body>
@@ -401,7 +401,7 @@
                       </li>
                       <li class="category">
                         <a href="/multidevice/data-compression">
-                        Data Compression Proxy
+                        Data Saver
                         </a>
                         <ul>
                         </ul>
@@ -500,37 +500,6 @@
                       </li>
                   </ul>
                 </li>
-                <li class="submenu">Chrome for iOS
-                  <ul>
-                      <li class="category">
-                        <a href="/multidevice/ios/overview">
-                        Overview
-                        </a>
-                        <ul>
-                        </ul>
-                      </li>
-                      <li class="category">
-                        <a href="/multidevice/ios/links">
-                        Opening Links in Chrome
-                        </a>
-                        <ul>
-                        </ul>
-                      </li>
-                      <li class="category">
-                        <a href="/multidevice/ios/case-studies">
-                        Case Studies
-                        </a>
-                        <ul>
-                            <li><a href="/multidevice/ios/case-studies">Case Studies</a>
-                            </li>
-                            <li><a href="/multidevice/ios/pocket">Pocket</a>
-                            </li>
-                            <li><a href="/multidevice/ios/feedly">Feedly</a>
-                            </li>
-                        </ul>
-                      </li>
-                  </ul>
-                </li>
             </ul>
           </li>
           <li class="pillar">

diff --git a/android/customtabs.html b/android/customtabs.html
diff --git a/android/installtohomescreen.html b/android/installtohomescreen.html
@@ -1,252 +1,19 @@
 {{+bindTo:partials.standard_multidevice_article}}
 
-<style>
-dd { margin: 0 6px 12px 40px; }
-</style>
+<meta name="robots" content="noindex">
+<script>
+    window.location.replace('https://developers.google.com/web/fundamentals/app-install-banners/');
+</script>
 
 <h1>Add to Homescreen</h1>
 
 <div>
-<img src="/multidevice/images/home_add.png" style="width: 25%; height: 25%; float:left; margin-top:-50px"/>
 
-<div style="width:500px">
-
-<p style="margin-top:50px">Since Chrome M31,
-you can set up your web app to have an application shortcut icon added to a device's homescreen,
-and have the app launch in full-screen "app mode" using Chrome for Android’s "Add to homescreen" menu item.</p>
-
-<p>New in Chrome M39, you can define the metadata associated with your web application
-in a <a href="https://w3c.github.io/manifest/">JSON-based manifest</a>.
-The manifest provides a way to wrap metadata about a web application into a single file.
-Using this metadata in conjunction with Add to Homescreen,
-you can create launch experiences more comparable to native applications.</p>
-
-<h2 id="work">How homescreen-installed apps work</h2>
-
-<p>Homescreen-installed apps work exactly like you would expect a normal web application to work.
-They follow the same sandboxed security policies and have access to the same APIs;
-however, they integrate with the Android environment in the following ways.</p>
-</div>
-</div>
-
-<div style="clear:left"></div>
-
-<div>
-	<div>
-		<p><b>Installs directly to the homescreen</b></p>
-		<p style="width:500px">When a user clicks "Add to homescreen", they will see the app being added on the homescreen.</p>
-		<img src="/multidevice/images/home_home.png" style="width: 25%; height: 25%" />
-	</div>
-
-	<div>
-		<p><b>Integrates into the OS task-switcher</b></p>
-		<p style="width:500px">Web apps launched from the homescreen will appear in the task switcher separate from  the browser, they will, however still say "Web App" on the app title.</p>
-		<img src="/multidevice/images/home_switcher.png" style="width: 25%; height: 25%" />
-	</div>
-</div>
-<div style="clear:left"></div>
-
-<div>
-	<div>
-		<p><b>Provides a full screen experience</b></p>
-		<p style="width:500px">Web apps will launch full-screen with no vestiges of a browser.  The URL will not be present, nor will traditional browser actions such as bookmarking and navigation controls.</p>
-		<img src="/multidevice/images/home_full.png" style="width: 25%; height: 25%" />
-	</div>
-
-        <div>
-                <p><b>Supports a default device orientation</b></p>
-                <p style="width:500px">Web apps will launch and stay in the designated orientation, for example, landscape.</p>
-        </div>
-
-	<div>
-		<p><b>Navigating to external pages from a web app highlights them to the user</b></p>
-		<p style="width:500px">Users will always know if the app routes them to a location outside the application’s domain.  This is especially useful for authentication flows, the user is kept in the app experience but the URL of the authentication system is clearly visible to the user.</p>
-		<img src="/multidevice/images/home_navigate.png" style="width: 25%; height: 25%" />
-	</div>
-</div>
-<div style="clear:left"></div>
-
-<div class="collapsible">
-
-<h2 id="supporting">Supporting homescreen-installed apps</h2>
-
-<p>Developers seeking to enable "add to homescreen" should link to a manifest
-and define the manifest metadata.</p>
-
-<h3 id="manifestlink">Linking to the manifest</h3>
-
-<p>To associate the manifest with your website,
-include the link element in your web page
-(for example, <a href="https://github.com/GoogleChrome/samples/blob/gh-pages/web-application-manifest/index.html">index.html</a>):</p>
-
-<pre>&lt;link rel="manifest" href="manifest.json"&gt;</pre>
-
-<h3 id="manifestmetadata">Defining the manifest metadata</h3>
-
-<p>The manifest metadata can define a title, landing page, default orientation,
-and different icons depending on size and screen density.
-The display represents how developers would like the user agent
-to present the web application to a user (for example, in fullscreen).
-</p>
-
-<p>For example, this
-<a href="https://github.com/GoogleChrome/samples/blob/gh-pages/web-application-manifest/manifest.json">manifest</a>
-includes a title ("Web Application Manifest Sample"),
-different icons to support a range of devices,
-a start page (<code>index.html</code>),
-and the default orientation (<code>"landscape"</code>).
-</p>
-
-<p></p>
-The <code>display</code> property is <code>"standalone"</code>.
-The web app has the look and feel of a standalone native application.
-This can include the application having a different window,
-its own icon in the application launcher, etc.
-In this mode, the user agent will exclude UI elements for controlling navigation,
-but can include other UI elements such as a status bar.
-</p>
-
-<pre>
-{
-  "name": "Web Application Manifest Sample",
-  "icons": [
-    {
-      "src": "launcher-icon-0-75x.png",
-      "sizes": "36x36",
-      "type": "image/png",
-      "density": "0.75"
-    },
-    {
-      "src": "launcher-icon-1x.png",
-      "sizes": "48x48",
-      "type": "image/png",
-      "density": "1.0"
-    },
-    {
-      "src": "launcher-icon-1-5x.png",
-      "sizes": "72x72",
-      "type": "image/png",
-      "density": "1.5"
-    },
-    {
-      "src": "launcher-icon-2x.png",
-      "sizes": "96x96",
-      "type": "image/png",
-      "density": "2.0"
-    },
-    {
-      "src": "launcher-icon-3x.png",
-      "sizes": "144x144",
-      "type": "image/png",
-      "density": "3.0"
-    },
-    {
-      "src": "launcher-icon-4x.png",
-      "sizes": "192x192",
-      "type": "image/png",
-      "density": "4.0"
-    }
-  ],
-  "start_url": "index.html",
-  "display": "standalone",
-  "orientation": "landscape"
-}
-</pre>
-
-<h2 id="fallback">Supporting homescreen-installed apps prior to M39</h2>
-
-<p>Since M31,
-Chrome will look for the following meta tag in the <code>&lt;head&gt;</code> element of the web-page
-(if there's a manifest with <code>display</code> specified, this is ignored):</p>
-
-<pre>&lt;meta name="mobile-web-app-capable" content="yes"&gt;</pre>
-
-<p>The name attribute MUST be "mobile-web-app-capable" and the content attribute must be "yes" (case in-sensitive).
-If there is any other value in the content attribute the web app will be added as a regular bookmark.</p>
-
-<p>
-</p>
-
-<h3 id="icon">Icon</h3>
-
-<p>The icon that is used to install to the homescreen is determined by using the largest icon found in one of the following <code>&lt;link&gt;</code> tags:</p>
-
-<ul>
-	<li><code>&lt;link rel="icon" sizes="192x192" href="nice-highres.png"&gt;</code> (recommended)</li>
-	<li><code>&lt;link rel="icon" sizes="128x128" href="niceicon.png"&gt;</code></li>
-	<li><code>&lt;link rel="apple-touch-icon" sizes="128x128" href="niceicon.png"&gt;</code></li>
-	<li><code>&lt;link rel="apple-touch-icon-precomposed" sizes="128x128" href="niceicon.png"&gt;</code></li>
-</ul>
-
-<aside class="caution"><strong>Caution:</strong>The 192px image format is recommended.  The last two formats (<code>apple-touch-*</code>) are deprecated, and will be supported only for a short time.</aside>
-
-<h3 id="icon-label">Icon label</h3>
-
-<p>The application’s <code>&lt;title&gt;</code> element serves as the default label for the icon on the homescreen.</p>
-
-<h3 id="configuration">Configuration</h3>
-
-<p>The following example is the minimum required configuration
-to support a homescreen launch experience before Chrome 39.</p>
-
-<pre>
-&lt;!doctype html&gt;
-&lt;html&gt;
-   &lt;head&gt;
-     &lt;title&gt;Awesome app &lt;/title&gt;
-     &lt;meta name="viewport" content="width=device-width"&gt;
-     &lt;meta name="mobile-web-app-capable" content="yes"&gt;
-     &lt;link rel="icon" sizes="192x192" href="/icon.png"&gt;
-   &lt;/head&gt;
-   &lt;body&gt;&lt;/body&gt;
-&lt;/html&gt;
-</pre>
-
-</div><div class="collapsible">
-<h2 id="comparison-to-ios">Comparison to iOS Safari Add to homescreen</h2>
-
-<p>Chrome will also allow web apps to launch in "App mode" if they embed a meta tag using the "apple-mobile-web-app-capable" name.  Chrome will stop supporting this usage in an upcoming release.  Chrome currently shows a deprecation warning in the Developer Tools’ console log when it detects a page with only the "apple-mobile-web-app-capable" meta tag. The warning appears as follows:</p>
-
-<img src="/multidevice/images/home_warning.png" style="width: 75%; height: 75%" />
-
-<p>Whilst Chrome temporarily accepts the usage of "apple-mobile-web-app-capable", Chrome does not offer compatibility with the iOS Safari API’s including:</p>
-
-<ul>
-	<li>window.navigator.standalone</li>
-	<li><code>&lt;meta name="apple-mobile-web-app-status-bar-style" content="black"&gt;</code></li>
-	<li><code>&lt;link rel="apple-touch-startup-image" href="/startup.png"&gt;</code></li>
-</ul>
-
-</div><div class="collapsible">
-<h2 id="faq">Frequently asked questions</h2>
-
-<dl>
-	<dt>How do I open links in the user’s browser?</dt>
-	<dd>As you would on the web, adding <code>target="_blank"</code> to an anchor forces the user out of the 
-    web app and into the browser that the user added the icon from.</dd>
-
-	<dt>Does Add to homescreen work on Chrome for iOS?</dt>
-	<dd>No.</dd>
-
-	<dt>If I visit a page that I have already added to the homescreen, will it be full screen?</dt>
-	<dd>No, while you are browsing you remain in the browser even if you visit a page that's
-    added to your homescreen. The page only launches full screen when launched from the homescreen.</dd>
-
-	<dt>How can I detect if the app is running as an installed app?</dt>
-	<dd>You can’t, directly.</dd>
-</dl>
-
-</div><div class="collapsible">
-<h2 id="best-practices">Best practices</h2>
-
-<ul>
-	<li>Do not prompt the user to add your app to the homescreen. There is no way to detect if the app is running installed or not.</li>
-	<li>Use the large 192px icon format, as in <code>&lt;link rel="icon" sizes="192x192" href="nice-highres.png"&gt;</code> for the highest quality homescreen icons.</li>
-	<li>Use a noun in your document’s title. Make sure the title doesn't contain any information that may change.
-     For example, for a Calendar app, don't include the current date or time in the app title.</li>
-	<li>Use <a href="http://docs.webplatform.org/wiki/apis/appcache/ApplicationCache">AppCache</a> to ensure that your app works or presents the user with an experience when they are offline.</li>
-	<li>Create a clear icon for use on the homescreen following the guidance of <a href="http://developer.android.com/design/style/iconography.html#launcher">Android Iconography</a>.</li>
-</ul>
+  <aside class="caution">
+    <strong>Note:</strong> This documention is out of date and has been moved to the
+    <a href="https://developers.google.com/web/fundamentals/app-install-banners/">
+    Add to Home Screen</a> documentation on <b>Web</b>Fundamentals.
+  </aside>
 
 </div>
 {{/partials.standard_multidevice_article}}
diff --git a/android/redirects.json b/android/redirects.json
@@ -0,0 +1,4 @@
+{
+  "customtabs": "https://developers.google.com/web/android/custom-tabs/",
+  "installtohomescreen": "https://developers.google.com/web/fundamentals/app-install-banners/"
+}