hp webdesign guideline 63740127 hp

8/12/2019 HP Webdesign Guideline 63740127 Hp

1/39


2/39

pae)e tem

HP &e# !tandard! !ite - http*++www.h

%enda

peration ne /oice( rand overview( 1oal! or the &e# rede!i%n

ntrod"ction to the new de!i%n 1ettin% !tarted

( &e# !tandard! !ite orientation( Compliance

( Development tool! 4


3/39

pae)e tem


Co"r!e o#$ective!

ter completin% thi! co"r!e, yo" !ho"ld have an"nder!tandin% o*(The #a!ic! o the new #rand !y!tem(The direction and %oal! or HP.com

(The implication! o thi! rede!i%n(The content o the &e# !tandard! !ite(5o"r compliance re!pon!i#ility


4/39

pae)e tem


peration ne /oice


5/39

page 5September, 2003 HP Web standards site - http://www.hp.com/hpweb

peration ne /oice

Cro!!-company initiative de!i%ned to ali%n and!treamline o"r marketin% comm"nication! tohelp "! achieve "niied world-cla!! inte%ratedmarketin% comm"nication! or HP.

The %oal! o thi! initiative are to*( 7n!"re all HP comm"nication! element! have onecommon #rand look and eel.

( Create con!i!tency, clarity, coherence andpredicta#ility in all comm"nication!.

( Develop common tool! and proce!!e!.( "ild on moment"m and impact rom c"rrent #rand

campai%n. Develop !ol"tion! in hi%hlycolla#orative !tyle, with no preconception! or

#ia!e!.


6/39


peration ne /oice Ti%er Team!

To help accompli!h ne /oice initiative! %oal!, an"m#er o ti%er team! have #een ormed.

Ti%er team! are compri!ed o a #lend o#"!ine!! %ro"p, re%ion and corporate

employee!.The!e team! are c"rrently oc"!ed on the

ollowin% di!cipline!* dverti!in% lliance! Channel comm"nication!

Collateral de!i%n Collateral !y!tem! 4

!"pport C"!tomer win! 4

reerence! Direct marketin%

P"#lic 8elation! )ale! 9orce

Comm"nication!

)pon!or!hip! Trade )how! 4 7vent :!er nterace /endor Con!olidation

nd"!trial de!i%n nternet + we#!ite Levera%e media

;arketin% 8e!o"rce;ana%ement

Packa%in% Photo%raphy Point o )ale


7/39page September, 2003 HP Web standards site - http://www.hp.com/hpweb

nternet Ti%er Team mem#er!

)tephanie cker-;oy HP.com remer P1?"dy 8edman 7)1 li!on &atter!on HP)Tim nder!on P Pa"l Hor!tmeier ' my Del%ado L8Ted )peroni 7;7 )ara &oodward 14C &e# ryan )tahmer 14C rand )am L"cente 14C rand

&& e"!ine!!

"!ine!!e!

8e%ion!

14C


8/39page !September, 2003 HP Web standards site - http://www.hp.com/hpweb

The model or ali%nment*3@0A #rand eBperience

)pon!or!hip!

nternet+&e#!ite!

dverti!in%

Direct;arketin%

Collateral

Packa%in%Trade )how!

4 7vent!

Pointo

)ale

P"#lic8elation!

Prod"ctDe!i%n

/ehicle!Tan%i#le eBpre!!ion o o"r po!itionin the market

pplication o o"r #rand !tyle, #y!e%ment

How well eBpre!! the c"!tomer!e%ment-!peciic attri#"te! o the HP corporate#rand in every way we to"ch thec"!tomer

pplication o o"r #rand attri#"te!,#y !e%ment"r characteri!tic! which "ni"ely!"pport the #rand po!itionin%

C"!tomer !e%ment #rand po!ition

How we "ni"ely deliver on the HP#rand promi!e a! applied to each oo"r c"!tomer !e%ment!

HP #randpromi!e

)ale! orcecomm.


9/39page "September, 2003 HP Web standards site - http://www.hp.com/hpweb

ll-HP me!!a%e

&hy !ho"ld c"!tomer!have to choo!e#etween*

nnovation and priceE

9"nctionality and

!implicityE)ta#ility and a%ilityE

Co!t and hi%h c"!tomer!ati!actionE

Dont compromi!e.Choo!e HP.

HP deliver! more.

HP deliver! more. Fhp G everythin% i!po!!i#le.nnovation at a price o"r c"!tomer! can aord, delivered in away that !et! "! apart.

7nterpri!e. Demand more.C7+C F HP. HP deliver! more o what enterpri!e

c"!tomer! demandmore acco"nta#ility, more a%ility and a#etter ret"rn on T.

);. 1et more."!ine!! owner F HP. HP allow! #"!ine!! owner! to %etmore #y deliverin%more relia#ility, more !ervice and!"pport, more local eBperti!eall at a competitive price.

Con!"mer. 7n$oy more.5o" F HP. HP allow! yo" to en$oy more o lie #y deliverin%!imple and rewardin% technolo%y eBperience! that are"ni"ely innovative, int"itive and empowerin%.

I

2

3

6

0e!t

TC7

Low co!t

Hi%h-te

ch


10/39page #0September, 2003 HP Web standards site - http://www.hp.com/hpweb

9o"ndational HP #rand element!

Typo%raphy

HP 9"t"ra

Tone o voice h"man, optimi!tic, intelli%ent,

inormative, dynamic, and witty

Core color paletteold, rich, vi#rantJ power"l impact within anarrow paletteJ optimiKed or di%ital p"#li!hin%

Photo%raphyold, rich, !imple, optimi!tic, dynamic,#elieva#le, timele!!

rand device

1raphic! new "niyin% elementJ enhance! themeanin%o the comm"nication, not ar#itrary ordecorative

HP invent lo%ol"e and #lack, #l"e, #lack or rever!edwhite

Perva!ive thro"%ho"t o"r comm"nication!,applied thro"%h !peciic !tandard!, neverreplace! o"r lo%o

i n v e n t

pprovedphoto! and%raphic! will#e availa#le inthe Creative

8e!o"rceLi#rary


11/39page ##September, 2003 HP Web standards site - http://www.hp.com/hpweb

nternet Ti%er Team %oal!

The / nternet Ti%er Team maintained o"rprimary %oal! while cond"ctin% the de!i%na!!e!!ment*

dhere to the #rand

;aintain c"rrent inormation architect"re



HP.com c"!tomer eBperienceevol"tion

dweek 2003

Technolo%y;arketin%! C'Platin"m ward ore!t nteractive &e#)ite Cate%ory (HP.com

merican "!ine!!ward! M)tevieN ore!t Corporate &e#)ite ( HP.com

8anked OI amon%!tHi%h-technolo%ycompanie! or onlineC"!tomer 8e!pect #ythe C"!tomer 8e!pect1ro"p ( HP.com

nternet 8etailer!2003 e!t o the &e#- Hi%h-Tech line-"p (HP)hoppin%

200I



ntrod"ction to the newde!i%n


14/39page #$September, 2003 HP Web standards site - http://www.hp.com/hpweb

The new de!i%n ( HP home pa%e



The new de!i%n ( !e%ment landin%pa%e



The new de!i%n ( directory pa%e


17/39page #September, 2003 HP Web standards site - http://www.hp.com/hpweb

The new de!i%n ( prod"ct + content levelpa%e


18/39page #!September, 2003 HP Web standards site - http://www.hp.com/hpweb

The new de!i%n ( prod"ct + contentlevel pa%e


19/39page #"September, 2003 HP Web standards site - http://www.hp.com/hpweb

&hat! chan%in%

>ey de!i%n chan%e!( CapitaliKation( Color( TeBt color "!a%e

( "tton!( Ta#!( ma%ery( Promotion!

( De!i%n !y!temhierarchy

>ey technical chan%e!( 'ew template!( )tyle!heet

modiication!

( 'ew meta data( Theme color

implementation( HT;L #"tton!( Co"ntry + Lan%"a%e

code!( Header mark"p( ;etric! %atherin%


20/39page 20September, 2003 HP Web standards site - http://www.hp.com/hpweb

Color palette

The availa#le theme color! are*

The !"pportin% %ray! are*

S or "!e on

corporate pa%e!only


21/39

page 2#September, 2003 HP Web standards site - http://www.hp.com/hpweb

&hat! !tayin% the !ame

normation architect"re C-rame !tr"ct"re Col"mn !tr"ct"re

'avi%ation readcr"m#! 9ont! Link indicator


22/39


1ettin% !tarted


23/39


1ettin% !tarted

To %et ready to mi%rate to the new !tandard!*( ttend the de!i%n and technical trainin% a!

appropriate ntrod"ction to HP.com de!i%n element!

mplementin% the HP.com technical %"ideline!( cce!! the &e# !tandard! !ite

9amiliariKe yo"r!el with the %"ideline! #y readin%thro"%h the !tyle%"ide

Link to, and review the Privacy and cce!!i#ility%"ideline!

Learn yo"r compliance re!pon!i#ilitie!

#tain new ver!ion! o develolpment tool!

Download the new template! and other key a!!et!


24/39

page 2$September, 2003 HP Web standards site - http://www.hp.com/hpweb

HP &e# !tandard! !ite

7verythin% yo" need to develop compliantpa%e! i! availa#le at the &e# !tandard! !ite*http*++www.hp.com+hpwe#( Complete !tyle%"ide in #oth HT;L and PD9

ormat!(Template! and other a!!et!( Compliance %"ideline!(Trainin%

( mportant link!
http://www.hp.com/hpwebhttp://www.hp.com/hpweb


25/39


HP &e# !tandard! home

*


26/39


HP &e# !tandard! home contin"ed


27/39


HP &e# !tandard! home contin"ed


28/39

page 2!September, 2003 HP Web standards site - http://www.hp.com/hpweb

Privacy and cce!!i#ility

n addition tocomplyin% withthe de!i%n%"ideline!, yo"m"!t al!o comply

with HP! privacyand acce!!i#ility%"ideline!

Link to detailedinormation on

#oth privacy andacce!!i#ility%"ideline! romthe &e#!tandard! home

pa%e


29/39

page 2"September, 2003 HP Web standards site - http://www.hp.com/hpweb

;i%ration and compliance !ched"le

Timerame* ;arch 3I, 2006 )cope* ll &e# !ection!

recommended ir!t priority tier i! c"rrently#ein% eval"ated(Timerame* ?an"ary 3I, 2006( )cope* 22U && and ' &e# !ection!

7Bten!ion! o the deadline! will #e %ranted ona ca!e-#y-ca!e #a!i! thro"%h the eBi!tin%eBception proce!!, !ee*

http*++www.hp.com+hpwe#+compliance+eBception.html
http://www.hp.com/hpweb/compliance/exception.htmlhttp://www.hp.com/hpweb/compliance/exception.html


30/39


Compliance

7ach &e# !ection owner m"!t complete the Q-!tepCompliance proce!! while mi%ratin% to the new /I.2!tandard!

&e#-!ection can #e p"#li!hed only ater receipt o the )iteLa"nch approval me!!a%e

ll eBception!, eBten!ion! or eBemption! %ranted or theprevio"! /I.I!tandard! are not valid or the new /I.2

Detail! and important Compliance and P"#li!hin% proce!!

link! are availa#le rom the &e# !tandard! !ite (http*++www.hp.com+hpwe#+compliance

( Late!t inormation on the Compliance proce!!

( ;i%ration )ched"le and recommended ir!t-tier li!t

( P"#li!hin% proce!!

( 7Bception proce!!

( Compliance Team contact!
http://www.hp.com/hpweb/compliancehttp://www.hp.com/hpweb/compliancehttp://www.hp.com/hpweb/compliancehttp://www.hp.com/hpweb/compliance


31/39

page 3#September, 2003 HP Web standards site - http://www.hp.com/hpweb

Compliance and P"#li!hin% proce!!

9rom the &e# !tandard!home pa%e, #e%in #ylinkin% to the Complianceand P"#li!hin% proce!!

pa%e


32/39


Compliance and P"#li!hin% proce!!contin"ed

)croll down thepa%e to ind thelink to theP"#li!hin%Proce!!


33/39


Q-)tep Compliance proce!!

8eview andcomplete the Q-!tep ComplianceProce!!

mportant note -

8) ha! #eenreplaced #ythe newP"#li!hin%nterace


34/39

page 3$September, 2003 HP Web standards site - http://www.hp.com/hpweb

Q-)tep Compliance proce!! contin"ed

Step 1( yo"r we# !ection ha! #een approved, proceed directly to )tep2

Step 2 - ll we# !ection! m"!t #e re%i!tered

( yo"r we# !ection i! already re%i!tered, proceed to )tep 3( 'ote!*

&e# !ection and "!er data ha! #een tran!erred to the new !y!tem

Compliance proce!! data relatin% to 'ew HP &e# )tandard! ver!ion I.I Prototype7val"ation!, )el-!!e!!ment!, and Po!t-)el-!!e!!ment 8eview! ha! #een archivedand i! availa#le "pon re"e!t

Step 3( )"#mit a one-pa%e prototype that wa! developed "!in% HP &e#)tandard! ver!ion I.2 or eval"ation #y the Compliance team

Step 4( 9ill o"t two !el-a!!e!!ment &e# orm! ( De!i%n and cce!!i#ility

http*++www.hp.com+%o+p"#li!hin%interace

Step 5( The Compliance team cond"ct! a po!t-!el-a!!e!!ment

review to veriy that )el-!!e!!ment! have #een !"#mitted. allcondition! are met, )ite La"nch pproval will #e %ranted
http://www.hp.com/go/publishinginterfacehttp://www.hp.com/go/publishinginterface


35/39

pae)e tem HP &e# !tandard! !ite - http*++www.h

Development tool!

cce!! !ection 3.I.Vo the "ild %"ide ora li!t o therecommended tool!or*( HT;L development

( 1raphic! prod"ction( HT;L validation( cce!!i#ility te!tin%

Dia%no!tic tool!

)creen reader!

TeBt #a!ed#row!er!

Thi! !ection al!o ha!link! to downloadHP.com !tandard

development tool!like )'9F and &P


36/39


Template! and other a!!et!

Link to theDownload a!!et!pa%e rom the &e#!tandard! homepa%e to o#tain new

template! andother item! yo" willneed to #e%indevelopin% pa%e!


37/39


Download a!!et! pa%e


38/39


Concl"!ion

The peration ne /oice initiative ali%n! all HPcomm"nication! to provide a 3@0W #rand eBperience tothe HP c"!tomer

( 9or additional inormation on peration ne /oice vi!it the#rand !ite* http*++www.hp.com+%o+#rand

The HP.com de!i%n ha! chan%ed to ali%n with the new#rand and improve c"!tomer !ati!action

( ll we# !ection! m"!t mi%rate to the new de!i%n #y ;arch3I, 2006

cce!! the HP &e# !tandard! !ite or everythin% yo" willneed to mi%rate* http*++www.hp.com+hpwe#

Learn and ollow the de!i%n, acce!!i#ility, and privacy%"ideline!

Do not la"nch yo"r !ite "ntil yo" have completed thecompliance proce!! and received !ite la"nch approval
http://www.hp.com/go/brandhttp://www.hp.com/hpwebhttp://www.hp.com/hpwebhttp://www.hp.com/go/brand


39/39

HP & # t d d it htt ++ h

HP lo%o

hp webdesign guideline 63740127 hp

Documents