Website/Mozilla.org/Archive/HomepageRedesign/Coding Notes
From MozillaWiki
Open Issues
Pending Issues
These issues still need to be resolved but we won't block relaunching on it.
- "Download Firefox" and "Download Thunderbird" buttons should be hooked up to actual downloads instead of pointing to those sites
- StevenGarrity This is trickier than is sounds. The download buttons on mozilla.com have the infrastructure to detect platform/lang. Perhaps to start, these could be "Get Firefox" / "Get Thunderbird" buttons that point to the respective download pages?
- David: OK. My suggestion is to file a bug to add the downloads in later and for now remove the 'Learn more' links above the TB and FX download buttons and have the buttons point to the sites.
- StevenGarrity: Buttons and learn-more links updated accordingly. Filed Bug 607394 to do it right.
- Text style adjusts as page loads (Bug 613546)
- Are we able to pull in author photos for the blog posts in the 'in the news' feed like in the design?
- StevenGarrity: It looks like the blog uses Gravatar (probably via direct WordPress integration. We could use gravatar relatively easily too, but it requires the email addresses of the authors, which the feed doesn't contain.
- David: Bug 607398 filed for this. Can revisit later after this new design goes live.
- Convert all promos to HTML for localization and have whole promo are clickable.
- In Firefox 4 the 'Your Email Address' form field in the newsletter sign-up box is has a red border around it. Minor and can be bumped, be wanted to mention. Bug 609317 filed for this.
- In footer, let's take the patch for replacing the 'Page History' link with last modified date. Bug 521706 (Done in r76032)
- David: There was an issue with the patch so let's leave that out of this and check it in another time.
- "mozilla" text in header seems to vary depending on browser. Firefox (looks extra bold), Chrome (looks closest to PSD) and Safari (different font?) on Mac all look different -- a WOFF issue I guess?
- Steven: These differences all depend on how the particular browser renders the font. I've prepared a rendering comparison of IE, Chrome, Firefox, and Safari on on Win/Mac/Linux. The variations are quite small and acceptable, I think. Safari doesn't have support for WOFF or EOT fonts (yet?) and there isn't a web-friendly license available for the TrueType/OpenType version.
- David: It's fine to have things vary slightly across browsers, but ideally the way the font looks in Firefox should match as close as possible to the design. Right now the letters look too bold (for instance, the second 'l' and the 'a' are almost touching in the coded page but not in the design).
- Steven: David - can you post a screenshot off the issue? The only sub-optimal rendering I'm seeing is the "i" and first "l" are too far apart in Firefox 3.6 on Mac (and only on Mac). This is fixed in the 4.0 betas.
- Seems fine enough for now. Can revisit later if needed.
- The page requires horizontal scrolling. It should adapt to varying screen resolutions and monitor sizes.
- David: I'm not sure what page this comment is referring to. There are pages on the site that require scrolling due to use of pre tags, for example, but the home page only brings up a scrollbar at a pretty narrow width.
- Gordon: It may be referring to the fact that there is a lot of wasted space on the right side of the homepage on very wide screens. Or, at least, that's something that I would make a note of. The fixed width is may not be the best use of space. Perhaps make the news items in the right column flow to the right instead of just down? That would allow more to be shown above the fold while also taking advantage of all the space available.
- David: The page isn't really fixed width but it doesn't expand all that much. I think this is something we can look at more closely when we code the sub-pages as well as talking about the suitability of a liquid layout as part of a longer term discussion about direction for the site.
Resolved Issues
- Were we going to be able to rotate the intro blurb for A/B testing? Second blurb would be: We're Building a Better Internet. Details about hooking it into WebTrends the right way to track click through rates are at bug 568492.
- The highlighting in the global nav doesn't work on the Community Map page, although I do see it on another page in the community section, such as the Directory. Fine to put in pending, but wanted to track it. Bug 609319 filed for this.
- Confirm newsletter sign-up is hooked into database correctly (bug 605983)
- Featured area seems to have been broken recently -- not rotating, not clickable, no caret. (fixed)
- On slow connections the 3 featured areas stack in the page -- is there a way to more gracefully handle a slow connection by hiding those extra featured items before everything fully loads? (Fixed in r76295)
- Add Drumbeat to featured area between Thunderbird and More. (done in r76104)
- David: I'd suggest making some small tweaks to have this look more like the Firefox and Thunderbird featured areas -- increase the font size of the Drumbeat header to the same as the Firefox and Thunderbird word marks and move the logo over to the right and do the same cropping of the image on the top, right and bottom (if you need a bigger version of the image, let me know).
- StevenGarrity: Update the image/styles a bit. If we go much bigger than that, it's a bit tough to tell that it's a drum.
- Graphic used for 'More projects' is out of date and has been replaced with another graphic (we can send over as needed if it's not in the PSDs you have).
- StevenGarrity: Done in r76287.
- At narrow widths the search box floats under the nav items. Ideally the two words in each nav item would stack to make more room for the search box. See example - Addressed with media queries in r76286.
- Note that we made some changes to the header in the sub-page design process. These can be incorporated now or we can update later when those pages are coded. Specifically, nav links capitalized and spacer graphic removed. See example - updated in r76286.
- Is it possible to stop the rotation of the feature items when hovering? Don't want people to try to click on a moving target.
- Gordon: Also, manually clicking on a featured item tab should reset the rotation timer. It's rather frustrating to click one tab, only to have it immediately transition to the next one.
- Steven: Both issues are fixed - this was the intended behaviour, but there was a JS bug blocking it.
- The RSS icon in the 'in the news' section should point to: http://blog.mozilla.com/feed/ and the Facebook icon should point to: http://www.facebook.com/Firefox?v=wall (fixed in r76278)
- Paint swatches missing in footer (fixed in r76033)
- David: This seems to have dropped out again.
- StevenGarrity: Ooops - thanks. Re-fixed in r76277.
- The caret is missing when the Drumbeat featured area is showing. (fixed in r76276)
- Open issue for reviewing In the News section that is not on staging site yet
- StevenGarrity: Bug 605811 filed for this. (and done!)
- Content should be for Firefox 3.6 instead of Firefox 4 beta (done in r76036)
- "Get In Touch" text in sidebar on Get Involved page is aligned out of the sidebar area. (fixed in r76034)
- At narrow widths the height of the featured box changes as it scrolls through the tabs -- can we have a common height set?
- Steven: It's tricky to set a common height, as it has to be tall enough for the text even when wrapped for narrow screens. I've made a slight adjustment in r76030 that keeps the first two pages more commonly in line. The third is harder, as it is a different layout.
- David: Sounds good. We can revisit the design of the third one if we get a lot of bugs about the height changes.
- It looks like the Thunderbird featured item is larger than the other two, so the box height changes when it comes and goes - may be connected to the item above, but seeing that on a 1400px wide screen as well (SeaMonkey trunk / Gecko 2.0b7pre).
- See above.
- A vertical scrollbar appears at the right edge of the featured area when clicking on Firefox, Thunderbird or More Projects tabs in Firefox 3.6 on Mac and Firefox 4 beta on Linux but not Firefox 4 beta on Mac, Safari or Chrome (didn't test IE). (fixed in r76024)
- In "More Projects" graphic we should replace the Miro icon since they seemed to have moved off of XULRunner. Can you swap with the Kompozer icon or should we ask Lee to update the psd? (done in r76023)
- Form boxes overlapping with text on Open Web Fund page. (fixed in r76019)
- Overflow problem seems to be fixed. Thank you!
- For "And we’re dedicated to keeping it free, open and accessible to all. Learn more" the link should point to mozilla.org/about/mission.html.
- "Donate now" in main promo should link to Open Web Fund page.
- Update side bar blurbs with real copy.
- Privacy Policy link in newsletter sign-up should point to Privacy Policy on mozilla.org.
- Add WebTrends tags for main promo, Firefox and Thunderbird download buttons and newsletter sign-up button.
- Change ordering of global nav items to: About Us, Community Map, Our Projects, Get Involved.
- "Learn more" link in Thunderbird featured area not styled same as "Learn more" link in Firefox area.
- There is no option to switch the display language. Preferably this would be a drop-down list on the top left or at the very bottom.
- David: We don't have this now because there's no localized content on the site to switch to. When we do get localized content, we'll be adding a drop-down menu in the footer in the top right hand space.
- Blue text against a black background is very, very bad even if you are not color-blind. Grey text against a black background is almost as bad.
- David: moving this out of open issues since this is not an issue for this home page coding project. The footer has been like that for over a year and the current project isn't touching it. We can look into changing this separately though if it's a concern.