Upload
others
View
6
Download
0
Embed Size (px)
Citation preview
Page 1
Introduction
WebsiteThe overall look and feel of the McAfee website is light and carefree. We want out customer to feel at ease. We take care of out customer not scare them.
Color PaletteWe use a soft color palette for our pronounced symbols, like the buy now button.
Secondary colors are neutral (gray) and are used to support the primary colors and deliver a soft human feeling.
ImageryOur imagery depicts customers and their environments in an authentic and direct manner. Portraits of calm, confident, and intensely determined people convey the empowerment.
Page 2
Caret/chevronDefinition and usage
The Caret symbol is one of the most frequently used icons across our website and application.
Page 3
Color, typography & styles
BodyR:85, G:85, B:85HEX: 555555
h1, h2, h3, h4, p, address, input, dtR:51, G:51, B:51HEX: 333333
a:linkR:0, G:153, B:255HEX: 0099FF
a:hoverR:85, G:85, B:85HEX: CC0033
a:focusR:204, G:71, B:20HEX: CC4714
GreenR:204, G:71, B:20HEX: 7BC370
body background: bg.png, repeat-x, scroll left top box-shadow: 0, 0, 15px, 4px, rgba (0, 0, 0, 0.2) font: 12px arial, helvetica, sans-serif width: 765px margin: 0, auto position: relative color: #555555
strong, b font-weight: bold
a, a:link cursor: pointer text-decoration: none color: #166494
a:hover text-decoration: none color: #CC0033
a:focus outline-width: medium outline-style: none color: #CC4714
p font-size: 0.96em margin-top: 10px font-weight: normal color: #333333
h1 font-size: 20px line-height: 1.2em margin-top: 10px color: #333333
h2 font-size: 1.32em margin-top: 0.6em font-weight: bold color: #333333
h3 font-size: 1.8em margin-top: 10px font-weight: bold color: #333333
h4 font-size: 1em margin: 0.6em 0 0 font-weight: bold color: #333333
address, input, dt color: #333333
Page 4
Home pageBlock elements
Page 5
Website backgroundBackground image and box shadow
Page 6
Header
Page 7
Home page/hero
Page 8
Product page/heroAwards and icons
Page 9
Product page/heroHover overlay
Page 10
Product page/hero Background color gradients
Page 11
Home page/carouselBackground and specifications
Page 12
Home page/testimonial Testimonial, video and download
Page 13
Home page/testimonialIcons
Page 14
Home page/footerText specifications
Page 15
Home page/footerMeasurements
Page 16
Home page/footerSign up box, subscribe button
Page 17
ButtonsBuy Now, Upgrade Now and Share
Buy Now
Share
Page 18
ButtonsChat Now, Log In
Chat Now
Page 19
IconsProduct feature, system requirements, awards and buy with confidence