We have been discussing for a while a unified Firefox Download page that will obsolete the following pages: http://www.mozilla.org/en-US/firefox/new/ http://www.mozilla.org/en-US/firefox/fx/ http://www.mozilla.org/en-US/firefox/update/ The 3 pages serve almost the same purpose with slightly different content. The goal of this project is to provide a single download experience for all Firefox products that handle desktop and mobile across all platforms with content that varies depending on the visitor's OS and browser. Project plan: https://www.smartsheet.com/b/publish?EQBCT=59b62b4c5009478cab08a5bdbbfdb45e

Just testing that Bugmail is working properly. Please ignore this comment.

PSD Template for /new: http://cl.ly/3l0l3I0W2C1y Use for: conditional messaging icons and style for all page states, link placement and style, mobile product image.

Nike/Mike: Bug 653876 is the bug to allow for localizing images on Bedrock. In Template example {{ img_l10n('firefoxos/screenshot.png') }} For en-US this would output: {{ MEDIA_URL }}img/l10n/en-US/firefox/screenshot.png For fr this would output: {{ MEDIA_URL }}img/l10n/fr/firefox/screenshot.png

I spoke with Lee and he is working on getting us the neutral browser images today.

Mike/Nick: The locale neutral images are here: https://bugzilla.mozilla.org/show_bug.cgi?id=888512#c18 I figured making this comment in the tracking bug is better than each specific bug. Thanks!

Mike/Nick: There are updates coming to the locale-neutral screenshots based on feedback. Also, we have a content/design review next week and there may be some other adjustments. Logic should stay the same. Stay tuned!

Holly, attached are screenshots of the page on the various browsers/platforms. The Firefox screenshots in these are not the final Firefox screenshots.

Thanks, Michael! I'll be sure to note that the product images are not final.

(In reply to Michael Gauthier [:gauthierm] from comment #9) > Created attachment 778654 [details] > firefox-slash-new-screenshots.zip Michael. What is up with the grey circle in the middle of the android-tablet-firefox-latest|android-tablet-firefox-old screenshots? Is that an artifact from the screenshot?

Chris, those are shots from an actual device. Firefox on Android has low color depth (16-bit vs 24-bit) for images causing banding. See bug 694828.

(In reply to Michael Gauthier [:gauthierm] from comment #12) > Chris, those are shots from an actual device. Firefox on Android has low > color depth (16-bit vs 24-bit) for images causing banding. See bug 694828. Ah! I thought it was just a resized desktop screenshot. That explains it. Thanks!

Updates: 1. SUMO link and second sentence for 'not up-to-date' desktop user is not in banner: http://cl.ly/image/1x3f0G0N1f0k. See c#6 https://bugzilla.mozilla.org/show_bug.cgi?id=883800#c6 2. For all mobile views, can we allow download buttons and links (at least top link) to show in the viewport? Suggestion would be to reduce vertical spacing between elements on the page and/or minimize banner font size so that all fit in viewport. button initially out of view: http://cl.ly/image/2z1i0y2g0O2q button in view after scrolling past tabzilla: http://cl.ly/image/3U043Z0O0z3c 3. For all mobile views, left align links that take over the download button area. They are showing up center aligned: http://cl.ly/image/0W1f3l0R2n1c

Mike/Nick: demo2 basic auth is removed: https://www-demo2.allizom.org/en-US/ Pmac: Can you get demo2 chief set up with: https://github.com/mozilla/bedrock/tree/bug-868199-unified-download

Mega PR: https://github.com/mozilla/bedrock/pull/1115

This is up on demo2 ready for review: https://www-demo2.allizom.org/en-US/firefox/new/

Hi Steven, What is the best way for me to demo each state of this page?

You could always use a website like: http://browsershots.org/https://www-demo2.allizom.org/en-US/firefox/new/ To test what the site look like in different browsers.

A few comments: - I would like to verify that the links in each state are correct. Visually, for desktop states seen through the browsershots tool, everything looks good. - One pending update: the banner for the 'desktop not up-to-date' user is awaiting a copy update from Matej as well as a possible URL change from SUMO. - Do you notice that Camino shows up as a 'not up-to-date Fx' user? http://browsershots.org/screenshots/c56f99d134dd3a15bae6a79860c944fc - I've been using browserstack.com to look at mobile page states, but am not able to tell it what version of the browser I am using, so I'm only able to test the looks of the non-Fx user. When looking at Android (galaxy S2) I first received a security warning which we probably won't see when it's live (http://cl.ly/image/3n1G0W1N3k0W) and the download button is not centered with it's supporting links. (http://cl.ly/image/342f3S3C0d29) The alignment issue happens across the Android emulators that I tried. I can try it on my actual Android phone when I get home. - for iOS users can we tighten up the spacing between the 3 copy points and the links? http://cl.ly/image/2b0Y2A0m0p35 - An overall comment for mobile would be to make sure download button is centered and space between links and 3 copy points are tightened up.

Is there a list of html class names that I could drop into the inspector for each of the states we need to test? Then I will be able to check out the links on each as well. For instance, when switching from OSX to oldmac, I change the class here: http://cl.ly/image/262v1z223X0v osx (http://cl.ly/image/3S1s0a1G0X0S) > oldmac (http://cl.ly/image/3s1b190i1A0l)

(In reply to Holly Habstritt [:Habber] from comment #20) > A few comments: > > - I would like to verify that the links in each state are correct. Visually, > for desktop states seen through the browsershots tool, everything looks good. Here are the various links on the page: - Top banner message for desktop old: "Updating is quick and easy." https://support.mozilla.org/kb/update-firefox-latest-version?esab=a&s=silent+download&r=0&as=s - Desktop latest: - "Learn more about Firefox for desktop" url('firefox.customize') - "Need help?" https://support.mozilla.org/products/firefox - "Looking for mobile?" url('firefox.fx') - "Download a fresh copy" url('firefox.all') - Android latest: - "Learn more about Firefox for Mobile" url('firefox.mobile.features') - FxOS latest: - "Learn more about Firefox OS?" url('firefox.os.index') - "Discover all the ways to take Firefox on the go" url('firefox.fx') - iOS: - "Looking for mobile?" url('firefox.fx') - "Why don’t we offer an iOS version?" https://support.mozilla.org/kb/is-firefox-available-iphone-or-ipad > > - One pending update: the banner for the 'desktop not up-to-date' user is > awaiting a copy update from Matej as well as a possible URL change from SUMO. > > - Do you notice that Camino shows up as a 'not up-to-date Fx' user? > http://browsershots.org/screenshots/c56f99d134dd3a15bae6a79860c944fc Camino shows up as Fx because the user-agent for Camino is "Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10.8; en; rv:1.9.2.28) Gecko/20120308 Camino/2.1.2 (MultiLang) (like Firefox/3.6.28)". the "like Firefox" is caught by the isFirefox() function in media/js/base/global.js - this is code that's been in bedrock for a while. I've talked with pmac on #www and a bug has been filed (bug #906700) to fix this. It's probably not a blocker to getting this live though. > > - I've been using browserstack.com to look at mobile page states, but am not > able to tell it what version of the browser I am using, so I'm only able to > test the looks of the non-Fx user. When looking at Android (galaxy S2) I > first received a security warning which we probably won't see when it's live Yeah, this error shouldn't appear on live. I think it's just a side-effect of the SSL URL and the stage domain. > (http://cl.ly/image/3n1G0W1N3k0W) and the download button is not centered > with it's supporting links. (http://cl.ly/image/342f3S3C0d29) The alignment > issue happens across the Android emulators that I tried. I can try it on my > actual Android phone when I get home. Fixed. It was misaligned for all of Android. > > - for iOS users can we tighten up the spacing between the 3 copy points and > the links? > http://cl.ly/image/2b0Y2A0m0p35 Fixed. > > - An overall comment for mobile would be to make sure download button is > centered and space between links and 3 copy points are tightened up. Fixed.

(In reply to Holly Habstritt [:Habber] from comment #21) > Is there a list of html class names that I could drop into the inspector for > each of the states we need to test? Then I will be able to check out the > links on each as well. > > For instance, when switching from OSX to oldmac, I change the class here: > http://cl.ly/image/262v1z223X0v > > osx (http://cl.ly/image/3S1s0a1G0X0S) > oldmac > (http://cl.ly/image/3s1b190i1A0l) There are two sets of classes on the <html> tag that can be used to test: - platform class: "android", "fxos", "mac", "windows", "linux" - firefox version class: none, "firefox-latest", "firefox-old" So <html class="android firefox-latest"> will work for testing Android with Fx up-to-date. Note that this won't work for testing screenshot images as those are handled using javascript that executes when the page loads and doesn't re-execute when the class names are changed.

Great. Thanks, Nick! Did you see the copy update in bug #883800?

Yes Holly - Mike will have a commit for that later today.

Bug 883800 is updated.

Go live date of the updated /new page and conditional content: September 19th, 2013.

All: Please make sure there are no references to firefox.fx in this new unified download codebase. I checked the PR and there were a few references to it. That page is going away soon and we shouldn't be linking to it. Those links should be firefox.mobile or firefox.mobile.features

Chris, this is fixed. The links now point to https://www.mozilla.org/mobile/

Latest PR: https://github.com/mozilla/bedrock/pull/1191

Commits pushed to master at https://github.com/mozilla/bedrock https://github.com/mozilla/bedrock/commit/f46cbd2a48544f357c0b8c94ebb1c82748316843 Bug 868199: Update /new page. Adds better user-agent custom messages, cleaned up images and Google Analytics tracking. See https://bugzilla.mozilla.org/show_bug.cgi?id=868199 - custom messaging support for Desktop - non-Firefox - Firefox old - Firefox up-to-date - custom messaging support for Android - non-Firefox - Firefox old - Firefox up-to-date - custom messaging support for Firefox OS, informative links - custom messaging support for iOS, friendly unsupported message - improved screenshots - less locale-dependent - more platform-specific - added Google Analytics custom tracking - off-site links - custom var for platform reporting - fix media-query css for l10n-specific CSS https://github.com/mozilla/bedrock/commit/250d82b3bded7b130a80181935346eb3b877aca5 Bug 868199: Switch mobile links to use url helper.

:retornam: can you help me test stage tomorrow? https://www.allizom.org/en-US/firefox/new/ https://www.allizom.org/pt-BR/firefox/new/ https://www.allizom.org/es-ES/firefox/new/ Go live: 2013-09-19

fixed on stage see https://webprod.etherpad.mozilla.org/unified-firefox-download-launch-steps for all steps tested.

We have shipped and verified the steps in https://webprod.etherpad.mozilla.org/unified-firefox-download-launch-steps on production. I'm leaving this open until bugs 883806, 891562 and 908297 are resolved.

We are live on production! http://www.mozilla.org/en-US/firefox/new/ Next steps: * verify data * Redirect /firefox/fx/ to /firefox/new/ * verify data * Redirect /firefox/update/ to /firefox/new/ * verify data

Raymond: can you install Firefox 24 on a Windows 7, XP, and 8 and then visit https://www.mozilla.org/en-US/firefox/new/ and see if you get the download button or if you get the "congrats! you are up to date". We are getting downloads from those OS' to the download button and it should be hidden for them.

(In reply to Chris More [:cmore] from comment #36) > Raymond: can you install Firefox 24 on a Windows 7, XP, and 8 and then visit > https://www.mozilla.org/en-US/firefox/new/ and see if you get the download > button or if you get the "congrats! you are up to date". We are getting > downloads from those OS' to the download button and it should be hidden for > them. Hi Chris, The download button is hidden on the /firefox/new page on Windows.