BHG: Homepage

[khaled]

Build the homepage for Baby Health Guru as per design.

Back end is part of new Standard platform (Index/Index)
Front end is two tasks:
1. CSS generic for Standard platform
2. CSS specific for BHG

[khaled]

Evaluated design and approved. Cleared for implementation.

[maryann]

Front-end is completed for both standard homepage and the BHG specific homepage.

[khaled]

Dev Testing for homepage passed.

Sanity testing shows all tested expected behavior in Standard Mode work.

Tested in Firefox 3.5. Problems with testing in IE using VirtualBox? but passed testing on machine natively running Windows XP with IE7.

[brent]

Baby Health Guru--lila november 24, 2009.

FIREFOX v 3.0--mac OS 10

Homepage
-The line in the nav bar is a dark red. should be black.
-two 1pxx530 px #d9d9d9 lines should be above Baby Health Content and below the 'getting started' section
-two 1pxx530 px #d9d9d9 lines should be above Baby Health Content and below the 'you are here' section at the bottom of the page.
-'go' button on Register box is underneath 'email' field.--should be lined up to the right of the field
-newborn month 8 is not a link (ball doesn't grow and hand arrow-hand does not appear)
- The timeline background shading should follow the pointer as it does in the PHG timeline.
-'now viewing in' under the nav bar should be lined up with the text in the left navigation so it's padded from the edge of the page
-'Baby Health Content' should be changed to "Baby Health Videos"--pls unbold and center entire section in middle column.
-In the left nav top right purple of naviagation curves in towards the left of the page. this should just be a straight line making a 90 degree angle with the horizontal purple bar at the top
-more room btwn the vertically stacked categories of the 'you are here' section.
- You are Here section comes across the center and right column... in the mock-up it only spans the center column (530 pixels?) You may need to use smaloler font to make everything worky worky
-make font size on 'health conditions a-z,' and 'health guru (home)' the same size as 'you are here'
-two 1px530 px stacked #d9d9d9 lines should be above Baby Health Surveys and below Baby Health Content
-footer--please un-bold the links and place pipes between them as well.
- Featured section - related ticker should be re-worked to function as an actual ticker that loops (right now it looks sort of silly when there are not many subcats and bounced to and fro)
- Featured section - category tabs do not fit all of the the categories on BHG... perhaps we should reduce text size or allow for 3 lines of text or both.
-Survey section - The left column has "Baby Health Guru Survey" that should be removed.
-Survey section - the voice your opinion, most popular suveys and survey says title should be moved down from the title above (spacing is weird).
-Survey section - the line in the left column stating "From The Third Trimester Survey survey" should have a link for the survey title and be underlined
-Survey section - the center clumn with most poipular surveys should have greater line spacing between titles.

[brent]

- in the timeline... the week should appear above the dot in the newborn and infant section

[khaled]

Replying to brent:

Baby Health Guru--lila november 24, 2009.

FIREFOX v 3.0--mac OS 10

Homepage QA Evaluation - PHASE 1 is Sanity Level, To Do now. PHASE 2 is delayed Issues
1. The line in the nav bar is a dark red. should be black. - PHASE 1

2. two 1pxx530 px #d9d9d9 lines should be above Baby Health Content and below the 'getting started' section - PHASE 1 (Should be implemented as CSS border-bottom)

3. two 1pxx530 px #d9d9d9 lines should be above Baby Health Content and below the 'you are here' section at the bottom of the page. - PHASE 1 (As above)

4. 'go' button on Register box is underneath 'email' field.--should be lined up to the right of the field - CHECK / CANNOT DUPLICATE

5. newborn month 8 is not a link (ball doesn't grow and hand arrow-hand does not appear) - PHASE 1

6. The timeline background shading should follow the pointer as it does in the PHG timeline. - PHASE 2

7. 'now viewing in' under the nav bar should be lined up with the text in the left navigation so it's padded from the edge of the page - PHASE 1 (See design)

8. 'Baby Health Content' should be changed to "Baby Health Videos"--pls unbold and center entire section in middle column. - PHASE 1 (Add margin-left:auto, margin-right:auto to the div, they mean center the div in the td)

9. In the left nav top right purple of naviagation curves in towards the left of the page. this should just be a straight line making a 90 degree angle with the horizontal purple bar at the top
- PHASE 2

10. more room btwn the vertically stacked categories of the 'you are here' section. - PHASE 1 (Add a margin-bottom to the uls)

11. You are Here section comes across the center and right column... in the mock-up it only spans the center column (530 pixels?) You may need to use smaloler font to make everything worky worky - PHASE 2, Need to also think about managing the opening of the lists and accommodating the material

12. make font size on 'health conditions a-z,' and 'health guru (home)' the same size as 'you are here' - PHASE 1

13. two 1px530 px stacked #d9d9d9 lines should be above Baby Health Surveys and below Baby Health Content - PHASE 1 (As the above double lines)

14. footer--please un-bold the links and place pipes between them as well. - PHASE 1 (I did it already)

15. Featured section - related ticker should be re-worked to function as an actual ticker that loops (right now it looks sort of silly when there are not many subcats and bounced to and fro) - PHASE 2

16. Featured section - category tabs do not fit all of the the categories on BHG... perhaps we should reduce text size or allow for 3 lines of text or both. - PHASE 2

17. Survey section - The left column has "Baby Health Guru Survey" that should be removed. - PHASE 1

18. Survey section - the voice your opinion, most popular suveys and survey says title should be moved down from the title above (spacing is weird). - PHASE 1, Give the title a small amount of margin-bottom (like 2 or 3px).

19. Survey section - the line in the left column stating "From The Third Trimester Survey survey" should have a link for the survey title and be underlined - PHASE 1 (It is a link, just make it underlined and reverse it's behavior)

20. Survey section - the center clumn with most poipular surveys should have greater line spacing between titles. - PHASE 1 (increase margin-bottom in li of this list)

[maryann]

Replying to khaled:

Replying to brent:

Baby Health Guru--lila november 24, 2009.

FIREFOX v 3.0--mac OS 10

Homepage QA Evaluation - PHASE 1 is Sanity Level, To Do now. PHASE 2 is delayed Issues
1. The line in the nav bar is a dark red. should be black. - PHASE 1<---done

2. two 1pxx530 px #d9d9d9 lines should be above Baby Health Content and below the 'getting started' section - PHASE 1 (Should be implemented as CSS border-bottom)<---done

3. two 1pxx530 px #d9d9d9 lines should be above Baby Health Content and below the 'you are here' section at the bottom of the page. - PHASE 1 (As above)<---done

4. 'go' button on Register box is underneath 'email' field.--should be lined up to the right of the field - CHECK / CANNOT DUPLICATE

5. newborn month 8 is not a link (ball doesn't grow and hand arrow-hand does not appear) - PHASE 1<---this is not the part of the timeline set up for testing. The timeline is being QAed with the calendar pages. Each section of time has to be put into admin in a specific manner, so not every month will work.

6. The timeline background shading should follow the pointer as it does in the PHG timeline. - PHASE 2

7. 'now viewing in' under the nav bar should be lined up with the text in the left navigation so it's padded from the edge of the page - PHASE 1 (See design)<---it is not lined up in the design, and lining it up would have it over very far. I added margins so that it is not so close to the edge instead.

8. 'Baby Health Content' should be changed to "Baby Health Videos"--pls unbold and center entire section in middle column. - PHASE 1 (Add margin-left:auto, margin-right:auto to the div, they mean center the div in the td)<---done

9. In the left nav top right purple of naviagation curves in towards the left of the page. this should just be a straight line making a 90 degree angle with the horizontal purple bar at the top
- PHASE 2<---done anyway

10. more room btwn the vertically stacked categories of the 'you are here' section. - PHASE 1 (Add a margin-bottom to the uls)<---done

11. You are Here section comes across the center and right column... in the mock-up it only spans the center column (530 pixels?) You may need to use smaloler font to make everything worky worky - PHASE 2, Need to also think about managing the opening of the lists and accommodating the material

12. make font size on 'health conditions a-z,' and 'health guru (home)' the same size as 'you are here' - PHASE 1<---they are the same size, the latter just looks smaller because it is not underlined like the former. Please send screenshots to dispute

13. two 1px530 px stacked #d9d9d9 lines should be above Baby Health Surveys and below Baby Health Content - PHASE 1 (As the above double lines)<---done

14. footer--please un-bold the links and place pipes between them as well. - PHASE 1 (I did it already)<---done

15. Featured section - related ticker should be re-worked to function as an actual ticker that loops (right now it looks sort of silly when there are not many subcats and bounced to and fro) - PHASE 2

16. Featured section - category tabs do not fit all of the the categories on BHG... perhaps we should reduce text size or allow for 3 lines of text or both. - PHASE 2

17. Survey section - The left column has "Baby Health Guru Survey" that should be removed. - PHASE 1<---moved to PHASE 2, harder than it looks

18. Survey section - the voice your opinion, most popular suveys and survey says title should be moved down from the title above (spacing is weird). - PHASE 1, Give the title a small amount of margin-bottom (like 2 or 3px).<---done

19. Survey section - the line in the left column stating "From The Third Trimester Survey survey" should have a link for the survey title and be underlined - PHASE 1 (It is a link, just make it underlined and reverse it's behavior)<---done

20. Survey section - the center clumn with most popular surveys should have greater line spacing between titles. - PHASE 1 (increase margin-bottom in li of this list)<---done

[khaled]

Finished Phase 1 fixes. Please review, evaluate, and if ready confirm transition to phase 2.

[lila]

QA--LILA dec 4, 2009
phase 1
BHG-HOMEPAGE

Mac OS 10
FIREFOX 3.0

1. the You Are Here gray background cannot be wider than the double gray lines above it--it looks like this in both safari and firefox

[maryann]

Replying to lila:

QA--LILA dec 4, 2009
phase 1
BHG-HOMEPAGE

Mac OS 10
FIREFOX 3.0

1. the You Are Here gray background cannot be wider than the double gray lines above it--it looks like this in both safari and firefox<---Phase 2, will not happen because it requires rethinking and redoing, too time consuming for right now

[khaled]

1. Fixed width of you are here gray background so that it doesn't appear wider than the lines above (fixed at 670px max-width)

[lila]

BHG-HomePage?
QA--LILA dec 8, 2009
phase 01

IE 07

Page Tested: http://devbaby.healthgurumedia.com

1. timeline horizontal line is off starts to the rt of the last 'toddler' link
2. timeline links don't work
3. left nav: there should be an even amount of prple around the white boxes--please cut pixels off the bottom to even it out w the rt and left sides.
4. the Getting Started double line underneath cuts in to the text on the Getting Started Section
5. You Are Here Box: 'health conditions' & 'health guru (home)' are not aligned properly
6. You Are Here Box: gray box needs to span the width of the two lines above <sub>currently it stops short.
7. You Are Here box: when sex health arrow is pointed down showing it's subcategories</sub> it moves the CHG and NHG column over to the right

[maryann]

Khaled-- numbers 2, 6, 7

IE 07
Page Tested: http://devbaby.healthgurumedia.com

1. timeline horizontal line is off starts to the rt of the last 'toddler' link<---this bug is so two thousand and LATE

2. timeline links don't work<---Khaled? ideas? Def Javascript

3. left nav: there should be an even amount of prple around the white boxes--please cut pixels off the bottom to even it out w the rt and left sides.<---done

4. the Getting Started double line underneath cuts in to the text on the Getting Started Section<---fixed

5. You Are Here Box: 'health conditions' & 'health guru (home)' are not aligned properly<---fixed

6. You Are Here Box: gray box needs to span the width of the two lines above _{currently it stops short.<---Khaled, don't know what you did with this box but maybe that explains the problem here}

7. You Are Here box: when sex health arrow is pointed down showing it's subcategories _{it moves the CHG and NHG column over to the right<---probably has something to do with the smaller box, Khaled?}

[maryann]

Still in the Works:

2. timeline links don't work<---Khaled? ideas? Def Javascript

6. You Are Here Box: gray box needs to span the width of the two lines above currently it stops short.<---Khaled, don't know what you did with this box but maybe that explains the problem here

7. You Are Here box: when sex health arrow is pointed down showing it's subcategories it moves the CHG and NHG column over to the right<---probably has something to do with the smaller box, Khaled?

New from Josh:
*** In the nav bar when you open up a category, the subcategories have one less bullet then the number of actual sub-cateogries and the top one is indented improperly

In the Baby health videos sections – is it possible to allow more characters for the videos since we have more room – for example,  under newborn development, the titles newborn development week 1 and newborn development week 4 look the same since enough characters are not shown…

*** Under “voice your opinion” in the survey section – the words from longer answers are overlapping the edge of the box – they are also not indented evenly when they wrap to a second line. Also, under “survey says” the pie chart only has 4 colors – thus, when there are 5 sections two of the answers have the same color.  

In the grey box at the bottom of the page which lists all the HG channels – it seems that there is enough room to spread out the different channels spacing  a bit so that all the category names can fit on a single line – if we could do this it would certainly look a lot neater…

[maryann]

New from Josh (cont.)
Home page
1) In middle section, under featured, the Titles aren’t easy to distinguish from the description. They should be larger, possibly bold.

2) In the Getting Started bar, having 2 line titles mixed with 1 line titles is ugly. We should change Surveys & Quizzes to Surveys, and Health Categories to Categories.

3) The NIH and CDC should not show up in our experts box on the nav.

[maryann]

1)In middle section, under featured, the Titles aren’t easy to distinguish from the description. They should be larger, possibly bold.<---is already bold, made font-size 12

2) In the Getting Started bar, having 2 line titles mixed with 1 line titles is ugly. We should change Surveys & Quizzes to Surveys, and Health Categories to Categories.<---done

3) The NIH and CDC should not show up in our experts box on the nav.<---for Khaled

[maryann]

Khaled-- number 6, 7 being carried over
number 3 from the second set of new comments
from below, number 1 and 3

New from Josh:
1. *** In the nav bar when you open up a category, the subcategories have one less bullet then the number of actual sub-cateogries and the top one is indented improperly<---cannot replicate, Khaled?

2. In the Baby health videos sections – is it possible to allow more characters for the videos since we have more room – for example,  under newborn development, the titles newborn development week 1 and newborn development week 4 look the same since enough characters are not shown…<--- done, 28 characters

3. *** Under “voice your opinion” in the survey section – the words from longer answers are overlapping the edge of the box – they are also not indented evenly when they wrap to a second line. Also, under “survey says” the pie chart only has 4 colors – thus, when there are 5 sections two of the answers have the same color.  <---did the first part, Khaled graphs

4. In the grey box at the bottom of the page which lists all the HG channels – it seems that there is enough room to spread out the different channels spacing  a bit so that all the category names can fit on a single line – if we could do this it would certainly look a lot neater…<---phase 2

[khaled]

Replying to maryann:

Khaled-- number 6, 7 being carried over
number 3 from the second set of new comments
from below, number 1 and 3

New from Josh:
1. *** In the nav bar when you open up a category, the subcategories have one less bullet then the number of actual sub-cateogries and the top one is indented improperly<---cannot replicate, Khaled?

• Can't replicate this one either. Must be a browser setting, but I dunno which one or how to set it.

3. *** Under “voice your opinion” in the survey section – the words from longer answers are overlapping the edge of the box – they are also not indented evenly when they wrap to a second line. Also, under “survey says” the pie chart only has 4 colors – thus, when there are 5 sections two of the answers have the same color.  <---did the first part, Khaled graphs

• Added colors so that there are now 10 unique one (yes, Lila picked them not me, so your heart can return to it's normal sinusoidal rhythm).