D4912 – Website Rebranding, Day 1 Impact clarification

advertisement
D4912 – Website Rebranding, Day 1
Impact clarification
June 2006
V4.0
Document change log
Version Date Change Made
Pages impacted
3.0
6/24
Logo replaced with updated logo that includes “Together with Nextel” tagline
3, 4, 5, 6, 7
4.0
7/8
Revised verbiage in footer to match new Brand-approved names.
7
4.0
7/8
Added information on the minimum size & clearance required for new Sprint logo
9
4.0
7/10
Added UE webserver URL (link to helpful page that includes CSS information, coded
example of compliant page, logos, etc.)
10
Topics for Discussion
• Global Navigation
– Sites that use the correct current global nav (shown below) will need to:
• Add “Contact Us” (new URL shown below in green); change “About Sprint” to “About Us”
• Note that text changes and URL changes are not made by the CSS update. They must be made by
development and/or content management systems.
– Online typography, online color system detailed in Sprint Online Visual System Guidelines
– Clicking on the global nav fully transitions the user to the new URL (does not open it in a new
window)
Current
Sprint.com sprint.com/personal sprint.com/business Sprint.com/about
Day 1
Sprint.com
sprint.com/personal/
sprint.com/business/
Page 3
sprint.com/about/
sprint.com/contact/
Topics for Discussion
• Global Navigation for non CSS-compliant sites
–
–
–
–
Header is always 100% of window width. Header (global nav, logo & tabs or tab area) is 108 px high
Global Nav text is Trebuchet MS, 11px, #000000
11 px space between navigational name (i.e. “Personal”) and vertical pipe (“|”)
Logo size = 258px x 79px
• Do not put references to width, height and border attributes in the image element
• alt="Sprint"
– Clicking on the global nav fully transitions the user to the new URL
(does not open it in a new window)
Sprint.com
sprint.com/personal/
sprint.com/business/
Page 4
sprint.com/about/
sprint.com/contact/
Topics for Discussion
• Primary Navigation (tabs) – Sprintpcs.com
– Sprintpcs.com tabs will change as indicated below
– Other sites must change tabs to reflect new look & feel ONLY
• No other sites but Sprintpcs.com are required to change their primary tabs
Current
Current
Sprintpcs.com sprintpcs.com/mypcs*
www1.sprintpcs.com/explore/ExploreHome.jsp
sprint.com/business Sprintpcs.com/support
(*manage1.sprintpcs.com
if user times out on Manage)
Day 1
Sprint.com/personal/wireless/ Sprint.com/personal/wireless/support/
Page 5
Sprint.com/personal/wireless/manage/
EXCEPT within Manage application. Within Manage,
URL remains the same as today (manage1.sprintpcs.com)
Topics for Discussion
• Primary Navigation (tabs) – tab construction & behavior
– If CSS-compliant, new CSS will change tab look & feel for pcs sites
– For other sites such as business, new tabs will have to be created
• Background images will need to be created by applications. If no design resources are available,
requests can be made to UXD
- Request needs to state application name and tab names
- Requests should be sent to Prashanth via email
– Behavior/colors:
• Tabs (active): Font: TheSans Plain, 14px, #000000, white background.
• Tabs (inactive): Font: TheSans Plain, 14px, #999999, gradient background.
• Tabs (hover): Font: TheSans Plain, 14px, #666666, gradient background.
– Spacing between each tabs' text and tab wall is 23px for all NON-PCS websites.
– Tab height = 29 px. If application does not have tabs, tab area must still be part of header
29 px
23 px
23 px
Page 6
Universal footer
• Footer
– Links shown below
– Footer is always 100% of window width
– Link color/behavior same as overall body link color/behavior
•
•
•
•
•
Trebuchet MS 11px
Link visited: #5C609E
Link hover: #333333
Link: #148AB2
Must show as hyperlink (underlined)
– Background = gradient image
– Area below the footer includes the copyright
•
•
•
•
Color of text (non-link): #666666
Background color: #F1F1F1
Text is Trebuchet MS 11px
Text is aligned to the left V 4.1 clarification: copyright footer text is aligned right
– Clicking on the links fully transitions the user to the new URL (does not open it in a new window)
V 4.0: Link verbiage &
order of links changed
per final Brand
decision.
sprint.com/legal/privacy.html
sprint.com/legal/copyright.html
sprint.com/legal/terms.html
sprint.com/contact/
sprintstorelocator.com
Page 7
Other colors
• Containers
–
–
–
–
Text: 11 px Trebuchet MS, white (#FFFFFF)
Background: #59639C
Exterior Border color: #999999
Interior Border color: #CCCCCC
Page 8
Additional Information
• Logo – Clear space and Minimum Size
Source: June 22 Sprint Visual Identity Interim Guidelines
Page 9
Additional Information
• Helpful information stored on the UXD web page
– http://uewebserv.intranet.sprintspectrum.com:12983
– Provides CSS info and instructions, links to documentation, instructions on how to build the header
if your application does not call the common.css files, provides alternative logos
Page 10
Download