Fernando Antonio Dal Piero

Recife – PE 16 de dezembro de 1997

V itória – ES

02 de setembro de 2000

Série: Guia de Estilos para Web

2ª versão 2000

Série: Guia de Estilos para Web

2ª versão 2000

4

Guia de Estilos para Web 2ª versão 2000

® D a l P i e r o A s s e s s o r i a e m E s t r a t é g i a &

Po s i c i o n a m e n t o & P r o f e s s o r D a l P i e r o , F e r n a n d o

A n t o n i o .

C o n t e ú d o t é c n i c o : Equipe de implan tação : Fe rnando A . Da l P i e ro Fe rnando A . Da l P i e ro

Fab r i z z io B . Da l P i e ro Fab r i z z io B . Da l P i e ro

C a p a : F i g u r a r e p r e s e n t a t i v a d a f a i x a d e r a i o s

i n f r a v e r m e l h o s e ul t r a v i o l e t a a l c a n ç a d a p e l a

v i s t a h u m a n a ( 7 0 0 n m p a r a i n f r a v e r m e l h o s e

4 0 0 n m p a r a u l t r a v i o l e t a ) .

F a b r i z z i o B . D a l P i e r o

5

So b r e o s a u t o r e s

F e r n a n d o A n t o n i o D a l P i e r o é p ro f e s so r d e S i s t e m a s d e I n f o r m a ç ã o , G e o p o l í t i c a e J o g o s d e E m p r e s a s e m v á r i a s U n i v e r s i d a d e s b r a s i l e i r a s . F a b r i z z i o B . D a l P i e r o é e s c r i t o r d e i n s t r u ç õ e s m i l i t a r e s c o m a r t i g o s p u b l i c a d o s e m I n t e r n e t e m todo o mundo .

E d i t o r a ç ã o :

F a b r i z z i o B . D a l P i e r o

F e r n a n d o A . D a l P i e r o

Rev isão :

A l i n a d a S i l v a B o n e l l a

C o n s u l t o r i a d e s e r v i ç o s .

®D a l P i e r o A s s e s s o r i a e m E s t r a t é g i a &

P o s i c i o n a m e n t o

T e l e f o n e : ( 2 7 ) 3 3 7 2 5 8 1

F A X : ( 2 7 ) 3 4 7 1 5 1 0

e -m a i l : f p i e r o @ z a z . c o m . b r

d p i e r o @ z a z . c o m . b r

6

Agradecimentos

O s a u t o r e s d e s e j a m , a g r a d e c e r de mane i r a e spec i a l ao s a r t i s t a s q u e i n s p i r a r a m m u i t a s d a s o b s e r v a ç õ e s e r e c o m e n d a ç õ e s q u e e s t ã o t r a n s c r i t a s n e s t a o b r a . A g r a d e c e m o s t a m b é m à i n d u s t r i a d e s o f t w a r e e h a r d w a r e q u e n o s m a n t i v e r a m a t u a l i z a d o s c o m r e l a ç ã o a p r o g r a m a s e e q u i p a m e n t o s . P o r f i m , a g r a d e c e m o s à V a n e s s a C o r r e a , d a Edi tco C o m e r c i a l L t d a . ( i E d i t o r a ) , q u e s e d i s p ô s a c o m e r c i a l i z a r e s t a o b r a .

7

Sumário Apresentação _______________________ 10

Considerações ______________________ 13

Recomendações _____________________ 16

Hierarquia de Informação _________ 22

Foco e Ênfase ______________________ 25

Estrutura e Equilíbrio _____________ 27

Relacionamento de Elementos _____ 31

Unidade e Integração ______________ 32

Observações importantes sobre hierarquia da informação __________ 34

Cor _________________________________ 37

Considerações sobre a cor __________ 40 Branco _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ 53 Preto _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ 54 Cinza _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ 55 Vermelho _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ 55 Amarelo _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ 57 Verde_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ 59 Azul _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ 60 Violáceas _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ 61 Laranja _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ 62 Marrom, ocre e terras _ _ _ _ _ _ _ _ _ _ _ _ _ 63

8

Percepção e Efeitos da Cor_________ 64 Recomendações _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ 64

Observações ________________________ 68 Recomendações _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ 69

Observações importantes ___________ 77

Fundo ______________________________ 80

Considerações ______________________ 80

Recomendações _____________________ 81

Observações ________________________ 83

Fontes ______________________________ 84

Considerações ______________________ 84

Esquema de Fontes _________________ 96

Recomendações _____________________ 96

Observações _______________________ 100

Texto ______________________________ 102

Considerações _____________________ 102

Recomendações ____________________ 103

Observações _______________________ 104

Ícones _____________________________ 107

Exemplos de Ícones _______________ 120

Considerações ___________________ 124

9

Recomendações ____________________ 125

Observações _______________________ 131

Como util izar esta obra ___________ 134

Glossário __________________________ 135

Referências bibliográficas ________ 139

1 0

Apresentação

O uso comerc ia l da In te rne t ho je é uma

a l te rnat iva rea l e economicamente v iáve l .

Cada vez ma i s a s empresas , ins t i tu ições e

pessoas apresen tam os seus p rodutos por

meio da expos ição em s i tes e pág inas WEB.

No en t an to, quando fazemos ta l opção , é

p rec i so encara r o f a to de que a té ho je não

ex i s t i a um gu ia de e s tudos sobre como

compor pág inas para a Internet . O presente

trabalho visa a atender a essa demanda, qual

se j a , pe rmi t i r aos c r i adores e ges tores dos

me ios de comunicação , espec ia lmente de

pág inas Web , tomarem conhec imento dos

pr inc íp ios que lhes permit i rão cr ia r

ambientes g rá f i cos , amigáve i s e agradáve i s

de se ve r e “navegar” . Oferece -se um

rote i ro para que cada

apresentador/expos i tor possa , s e o segu i r ,

1 1

assegurar que o usuár io/ass i s tente

in te ra t i vo t e r á o en tend imento pe r fe i to da

p ropos t a do s i t e ou pág ina , se j a comerc ia l

ou des t inado à Educação a Di s t ânc i a

(EAD) .

Por tanto , a função des te gu ia é reun i r a

in formação per t inente ao t ema de na tureza

documentá r i a que também será d i s t r ibu ído

em formato de s l ides para pa les t ra/curso

com duração de duas horas . Ao todo ,

apresentamos , em uma l inguagem c la ra e

conc isa , per to de uma centena de suges tões

e recomendações, que proporcionam a quem

pre tende in i c i a r- s e n a a r t e de compor ou

“ reengenhar i za r” s i t e s e pág inas na WEB

todas a s bases necessá r i a s pa ra começar a

t raba lhar .

1 2

A te rmino log i a cont ida nes t e documento

procura segu i r sempre a or i entação

c i en t í f i ca , no entanto reconhecemos que ,

em determinados momentos , as máx im as da

c iênc ia não são suf i c i entes para l idar com

fenômenos a s soc i ados à t r ans i ção de

pa rad igmas e , en tão , e sc revemos baseados

nos resu l t ados de vár ios anos de

observações .

Rat i f icamos o compromisso , como já v imos

fazendo, de manter o r i tmo de a tua l ização e

d i s seminação des t e conteúdo de mane i r a

suf ic ientemente i lus t rada e r i ca em

suges tões prá t icas .

Fernando Antonio Dal P ie ro

1 3

Considerações

O pro je to v i sua l de uma pág ina na Web é

uma fe r r amenta impor tan te pa ra a

comunicação humana . Esse t ipo de pro je to,

por empregar a v i são , um dos pr inc ipa i s

s en t idos humanos , como me io de

es tabe lecer a compreensão e a percepção ,

permi te contempla r , observar , r econhecer ,

v i sua l izar , examinar , l e r , admirar e mirar ,

i s so só para menc ionar a lguns dos seus

a t r ibutos .

Devemos ressa l t a r , a inda , o ca rá te r

un iversa l da informação v i sua l , po is é um

meio natura l , que não se necess i ta aprender .

Não prec isamos ser v isua lmente cu l tos para

emi t i r ou entender imagens v i sua i s . Essas

capac idades são in t r ínsecas aos se res v ivos

1 4

humanos. O o lho é t ambém capaz de

in formar a d i s t ânc i a , a d i r eção e a fo rma

dos ob je tos . Ent re tanto , a inda que o

processo de ver reque i ra pouca energ ia , a

mane i ra pe la qua l nós enxergamos e aqu i lo

que vemos inf luenc ia como sent imos e

t ambém o que en tendemos .

Nos tempos modernos, como a comunicação

é mui to r áp ida , su rge a necess idade de

recuperar a s formas pré -verbais e visuais da

comunicação , enfa t i zando o uso dos

recursos , que podem expressar funções e

operações . Também por i s so c resce a

impor tânc i a de se d i spor organizadamente a

in formação numa pág ina , e spec i a lmente na

WEB. A sua d i spos ição pode fazer a

d i f e rença en t re comunica r uma mensagem

ou de ixar o usuár io/ le i tor perp lexo e

sobreca r regado . Não bas t a s se , no caso da

1 5

In te rne t , a t é mesmo a func iona l idade da

pág ina pode se r a fe tada , se e l a não t ive r

uma apresen tação bem pro j e t ada .

De mane i ra gera l podemos d izer que um

bom l a y ou t depende do contexto em que está

inse r ido e cumpre uma propos ta ma ior do

que decora t iva , po i s todos os e l ementos

v i sua i s in f luenc iam uns aos out ros . Sendo

ass im, deve-se pr iv i leg iar o uso da es té t ica ,

dos ícones e das l e t ras , j á que a informação

v i sua l comunica de modo não-verbal e, para

i s so pode inc lu i r s ina i s emociona is que

mot ivem, d i r i j am ou d i s t ra i am.

1 6

Recomendações

Segundo mui tos au tores , a percepção e o

poder de organ iza r a in formação v i sua l

depende de mecan i smos na tura i s , das

neces s idades e p ropensões do s i s t ema

ne rvoso humano , t an to quanto de f a to res

t écn icos . No que toca aos fa tores t écn icos ,

pa ra uso em In te rne t , uma recomendação

que deve se r observada é no que d iz

r e spe i to aos f r am e s . Use f r am e s com cuidado.

O uso de f r am e s pode a judar a o r i en ta r o

usuár io a navegar no s i t e , mas cu idado com

o momento da impressão pa ra não c r i a r

fac i l idades que permi tam impr imir o f r ame

e r rado. Por outro lado, deve-se cons idera r

que os seres humanos organizam o que lêem

e o que pensam sobre uma in formação ,

a g rupando -a espac i a lmente . I s to é :

1 7

enxergamos como pensamos . O todo é

pe rceb ido de mane i r a d i s t in t a da soma das

carac te r í s t i cas de seus componentes .

Uma pessoa , quando comple ta uma f igura ,

não es tá apenas ad iv inhando por inferênc ia

de exper i ênc ia passada , mas rea lmente vê a

f igura completa . Um exemplo pode ser v is to

quando nos l embramos da f igura de pontos

em círculo.

Os o i to pon tos (não i lus t rados nes te

t raba lho) são percebidos como um c í rculo e

não como do i s quadrados en t recor tados .

Da mesma forma, podemos ver nas f iguras a

segu i r exemplos dos fenômenos de

percepção de “fechamento e agrupamento”.

1 8

P r o x i m i d a d e S i m i l a r i d a d e C o n t i n u i d ade F e c h a m e n t o Á r e a S i m e t r i a

Ass im, para f ac i l i t a r , na cons t rução de

mensagens v i sua i s , deve-se ag rupa r c ada

i t em de in formação em poucas ca tegor i a s .

No máx imo se te (Mul le t e Sano , 1995) .

Prec i sa - se a inda cons idera r que o processo

de ver é s imples . Os mecan i smos

f i s io lóg icos são au tomát i cos no s i s t ema

nervoso humano, como se pode constatar da

descr ição suc in ta apresentada por Arnhe im

para o processo v i sua l .

1 9

Segundo Arnhe im (1995) ve r é

e s senc ia lmente um meio de or i en tação

prá t i ca e pode se r r e sumido ass im: a luz é

emi t ida ou re f l e t ida pe los ob je tos do

ambiente . As l en tes dos o lhos pro je tam as

imagens desses ob je tos nas re t inas que

t r ansmi tem a mensagem ao cé rebro em

forma de imagens e cores .

F i g . 1 o l h o h u m a n o : c o r t e

l o n g i t u d i n a l

F i g . 2 e s q u e m a d a

r e t i n a o n d e s e

d e s e n c a d e i a o

p r o c e s s o d e

v i s i b i l i d a d e

c r o m á t i c a

Far ina (1990 , p .14) d iz que conhecer as

p ropr i edades da v i são é de fundamenta l

impor tânc ia aos que se va l em da imagem

2 0

para t r ansmi t i r mensagens . Todo o

conhec imento humano re l a t i vo a fo rmas e

cores é adquir ido pe la v isão . Vale , então ,

menc ionar que a v i são é sempre a t ra ída por

e lementos color idos antes dos e lementos em

pre to e b ranco e por desenhos an te s do

tex to . Por tanto , se dese j amos a t ra i r a

a tenção , devemos usar cores e í cones em

lugar de textos .

Por outro l ado , ao se usar tex tos , deve-se

sempre re spe i t a r a s convenções de layout de

l e i tura da informação .

Em países ocidentais isso s ignif ica dispor os

t ex tos da e squerda pa ra a d i r e i t a e de c ima

para ba ixo . As informações mais

impor tantes devem estar loca l izadas no

canto super ior esquerdo (OSF/Mot i f ,

1990) . Mas a tenção : quando a informação é

pos ic ionada ver t i ca lmente , os l i nks devem

2 1

es ta r a l inhados por suas ex t remidades

esquerdas , em pa í ses oc identa i s (Schr iver ,

1997) . I s so fac i l i t a a compreensão da

informação pe lo usuár io .

A lém d i s so , para todos que pre tendem

pro je t a r a o rgan ização e a compos ição de

e l ementos v i sua i s em pág inas na Web ,

r ecomenda-se respe i t a r os segu in tes

pr inc íp ios : h ierarquia de informação, foco e

ênfase , es trutura e equi l íb r io , re lação de

un idade de in tegração e e l ementos , todos

t emas que dos qua i s passamos a segu i r a

descrever os pr inc íp ios e a importânc ia .

2 2

Hierarquia de Informação

Esse pr inc íp io d iz respe i to à d i spos ição da

in formação , no caso , dent ro de uma pág ina

na Web, baseada em sua importância re lat iva

com os out ros e lementos v i sua i s . O

resu l t ado dessa d i spos i ção a fe t a todos os

out ros pr inc íp ios de organ ização e

compos i ção de um l a y ou t e de te rmina que

informação o usuár io vê e o que e le é

encora jado a fazer pr ime i ro . Para ut i l izar

esse pr inc íp io , responda a es tas perguntas :

• Qua l in formação é ma i s

impor tante para o usuár io? (Em

outras pa lavras , qua i s são as

pr ior idades de um usuár io

quando encont ra r o s i t e ? ) .

• O que o usuár io quer ou prec isa

ver em pr imei ro , segundo,

2 3

te rce i ro lugares e ass im por

d iante? (O que o usuár io vê

pr imeiro deve corresponder à sua

p r io r idade ) .

Nesse sent ido , os au tores Meyers &

Reynolds, tanto quanto Sant 'ana, re lacionam

o concei to de idé ias e imagem na memória e

a f i rmam que uma combinação de es t ímulos

pode produz i r out ras idé i a s e a s s im

sucess ivamente , de ta l mane i ra que se pode

prender a atenção de uma pessoa por longos

per íodos de tempo. Os autores c i tam quatro

le i s bás icas para a assoc iação de idé ias , que

ter iam s ido es tabe lec idas pe lo s g regos :

a) cont igüidade, quando a idé i a é

r epresentada pe l a prox imidade

ex i s tente ent re duas imagens . Por

exemplo , mar-nav io , pena-pássa ro ;

2 4

b) sucessão: quando uma idé i a segue

ou t ra . Como t rovão- t empes t ade ,

veneno-mor te ;

c ) contras te : quando as idé i a s s ão

an t agôn icas . Por exemplo : amor-ód io ;

d) semelhança: quando duas ou ma i s

imagens se superpõem: gado- tigre-leão.

Essas l e i s para a s soc iação de idé i a s podem

se r ap l i cadas t an to na c r i ação de peças

publ ic i t á r i as t rad ic iona i s (car tazes , peças

para t e l ev i são ou rád io ) como pa ra a

cons t rução de pág inas WEB.

2 5

Foco e Ênfase

O pr inc íp io do foco e ênfase aux i l i a o

usuár io na co locação de i tens pr ior i t á r ios .

Determinar o foco envolve ident i f icar a

idéia centra l , ou o ponto focal do objeto

(campo v isua l ) , no caso uma página na

WEB. Para de te rminar a ênfase , e sco lhem-

se os e l ementos que devem ser

proeminentes , i so lando-os de out ros ou

fazendo com que e les se sobressa iam. Para

fac i l i tar a lcançar esse resu l tado,

cons ideramos que onde o usuár io navega

pr imeiro , procurando por informação, é uma

importante s ina l i zação de qua l se rá o foco

da sua navegação . Ent re tan to , a s dec i sões

do p ro j e to de uma pág ina na Web podem

governar esse pr inc íp io . Por exemplo :

ac red i t amos que as pessoas de cu l turas

oc identa i s procuram, no canto super ior

2 6

esquerdo da te la de um monitor de v ídeo, as

informações mais importantes . Al iás , todos

os se res humanos inc l inam-se para t e rem

como referênc ia pr imár ia a re lação ver t ica l-

hor izonta l , po i s d iz respe i to ao seu bem-

es ta r e equi l íbr io . Nesse sent ido,

cons ide ramos ex t r emamente impor t an te o

e s tudo dos in te re s se s e dos a spec tos

cu l tura i s do públ ico a lvo para somente

então idea l izar uma pág ina ou s i te na WEB.

2 7

Estrutura e Equilíbrio

O equi l íbr io em uma composição v isua l é

uma combinação ce r t a de potenc i a i s

e lementos d e todas as direções. O equil íbrio

impõe a estabi l idade pela anulação mútua de

forças opostas . Quando existe equi l íbr io , há

ênfase à harmonia , caso contrár io , sobressa i

uma sensação de desagrado . O pr inc íp io de

es t rutura e equ i l íbr io é um dos mais

impor t an tes de um projeto visual , perdendo

apenas para o contras te . Sem uma es t rutura

que s i rva de base e sem equi l íbr io desses

e l ementos , há fa l t a de ordem e de

s i gn i f i cado , e i s to a fe ta todas a s out ras

partes do projeto v isua l . O mais importante

é que a fa l t a de es t rutura e equi l íbr io torna

uma pág ina na Web mais d i f íc i l de ser

entendida pe lo usuár io .

2 8

O equ i l íbr io pode ser obt ido em uma

compos ição de duas mane i ras : s imét r i ca ou

ass imétr i ca .

O equi l íbr io s imétr ico ocorre quando os

e l ementos es tão s imet r i camente distribuídos

em ambos os l ados de um e ixo imag inár io

f ixado pe la v i s ta . É per fe i t amente lóg ico e

s imples de se cr ia r , mas , pode resu l tar

e s t á t i co e a té aborrec ido . A ma ior i a das

vezes carece de ação, e não sendo dinâmico,

l eva ao des in te resse severo e repousado.

Já o equi l íbr io ass imétr ico , cons iderado

pe los gregos como um mau equi l íbr io , é

ob t ido va r i ando-se elementos e posições, de

mane i ra que se equ i l ibrem os pesos . Ainda

que as múl t ip las tensões provocadas pe la

inex i s t ênc i a de um cent ro def in ido

2 9

requei ram cons ideráve i s hab i l idades do

des igner , o resu l tado é mais che io de graça ,

t em mais ação e resu l t a in te ressante e r i co

em var iedades , sendo , por tanto , um a lvo a

ser persegu ido .

Contraste O cont ras te é a ju s t apos i ção de e l ementos

des igua i s que permite a t ra i r e re te r a

a t enção imed ia t amente . Ap l i ca r com bons

resu l tados os pr inc íp ios bás icos do

cont ras te requer t empo e prá t i ca . Podemos

d izer que os pr inc ipa i s recursos que o

cont ra s t e o fe rece s ão de “peso” , de

tamanho, de pos ição .

3 0

$9 , 9 9

N e s t e e x e m p l o , v e m o s a m a n e i r a p e l a q u a l s e p o d e f a z e r u m t í t u l o c o m u m f i c a r b e m e s p e c i a l , a p e n a s v a r i a n d o a d i m e n s ã o d e u m a l e t r a . É u m a u t i l i z a ç ã o d a t é c n i c a d e c o n t r a s t e d e t amanho .

O u s o m a i s c o m u m d o c o n t r a s t e é s i m p l e s m e n t e a q u e l e q u e e s t a b e l e c e d i f e r e n ç a s d e t a m a n h o e t on a l i d a d e s . E n t r e t a n t o , e x p a n d i n d o - se o l e q u e d e g r a d a ç õ e s , i n t r o d u z i n d o - s e s o m b r a s r e a i s d e c i n z a n u m documen to p r e to e b r anco , po r exemp lo , consegue - s e a “ m á g i c a ” d e c r i a r c o r e s . C o n t r a s t e d e p o s i ç ã o s e o b t é m q u a n d o s e d i s p õ e u m t e x t o o u f i g u r a e m â n g u l o s d i f e r e n t e s a o p r e d o m i n a n t e e u s u a l .

Ac ima de tudo devemos cons idera r que

qualquer t ipo de contraste deve ser apl icado

quando ex i s te uma boa razão para i s so .

3 1

Relacionamento de

Elementos

O princípio do relacionamento de elementos

reforça o anter ior . Para que uma

compos ição se j a e f i c i en te , prec i sa

apresenta r o predomín io de um ou ma i s

e l ementos sobre o con junto . Se todo o

con junto t ive r o mesmo va lor , a a t enção

será l eve e d i spersa . O des taque pode ser

determinado pelo peso, tamanho, posição ou

cor de um determinado e lemento em re lação

aos demais . Por i s so a co locação de um

e lemento v i sua l pode a judar a comunicar

uma re l ação/conexão espec í f i ca de uma

pág ina com o s i t e da qua l e la faz par te .

3 2

Unidade e Integração

A un idade é ver i f i cada na compos i ção

quando não existem elementos discordantes,

a s segurando subord inação a um mot ivo

pr inc ipa l . A unidade e a integração ref le tem

como ava l i a r uma dada pág ina na Web em

re lação ao s i t e ao qual e la pertence. Quando

uma pág ina na Web é v i sua lmente uni f i c ada

com o s i t e ( endereço) , o usuár io acha ma i s

fác i l navegar porque e la oferece um

ambiente cons is tente , previs íve l e permite a

sensação de tudo ser um obje to ún ico . Para

implementar esse pr inc íp io , cons idere o

segu in te :

• Como as d i f e ren tes pág ina s do

s i t e func ionam v i sua lmente?

3 3

• Como o pro je to v i sua l da pág ina

se re l ac iona com as out ras

pág ina s do s i t e ou de out ros s i t e s

em que é usado?

3 4

Observações

importantes sobre

hierarquia da

informação

Quando se dese j a pr ior i za r ou mesmo

hierarquizar uma informação a lguns i t ens

devem se r obse rvados :

1 . uma pág ina na Web prec i sa func ionar

in tu i t i vamente – e l a deve parecer do

modo como func iona e func ionar do

modo como pa rece ;

2 . a e s t ru tura v i sua l é impor tante para

comunica r a p ropos ta dos e l ementos

ex ib idos em uma pág ina na Web;

3 5

3 . cu idado com o t amanho , o

e spaçamento e a co locação da

in formação para que o ambien te se j a

v i sua lmente cons is tente e prev is íve l ;

4 . va l e usar cores para agrupar assuntos

corre la tos ;

5 . cons idere sempre que o in íc io ou a

base da te l a são os me lhores loca is

pa ra mos t ra r in formação sobre

or i entações , a s qua i s devem es ta r

sempre v is íve is ;

6 . por tan to , “ ins ta l e” a s á reas para

en t r ada de t ex to e r e spos t a pe r to da

base da te l a . Pense que a ma ior i a dos

usuár ios não são ex ímios da t i lógrafos

e prec i sam olhar para o tec l ado ;

7 . da mesma forma , pa ra min imiza r o

movimento dos o lhos , o usuár io deve

sempre ser inqu i r ido a responder em

3 6

uma á rea d i r e t amente ad j acen te à

ques tão ;

8 . out ras or i entações para o usuár io

podem ser colocadas em áreas f ixas ou

móve i s , ou apresentando-a s em menus

p o p -up s disponíveis sobre requisição do

usuár io ou do própr io er ro ;

9 . en t re tanto , use sempre o a l inhamento

ad j acen te pa ra l i nks que formam um

g rupo de opções de a s sun tos

exc lus ivos ;

10 . cons idere que o uso de t ex to deve se r

o mín imo, suf ic iente apenas pa ra

comunicar a in formação .

3 7

Cor

A cor é ao mesmo tempo s imples e

complexa , en t re t an to sempre é uma

impor tan te p ropr i edade e s t é t i ca em uma

pág ina na Web . Nenhuma cor é v i s t a do

mesmo modo por duas pessoas . S ign i f i ca

“co i sas d i f e ren tes” para pessoas d i f e rentes

em d i ferentes cu l turas . A cor é pessoa l e

un iversa l , t r ansmi te mensagens rep le tas de

inf ini tas var iações . Cada cor tem numerosos

s ign i f icados assoc ia t ivos e s imból icos . “A

cor não só t em um s ign i f i cado

un iversa lmente compar t ido a t ravés da

exper iênc ia , como também, um va lor

in format ivo independente , a t r avés dos

s ignif icados que descrevem simbolicamente”

(Dondis , 1988 ; p . 69) .

3 8

Além do s ign i f i cado c romát ico

t ransmiss íve l , o autor c i t a a inda a

ex is tência , de preferências de cor pessoais e

subje t ivas . Far ina (1990) ac rescenta que os

cos tumes soc ia i s , a cu l tura , são fa tores que

in te rvêm na e sco lha das cores (ves t ido de

no iva branco , enxova l de men ina rosa . . . ) .

Por outro lado , a lgumas exper iênc ias

ps icológicas têm provado que há uma reação

f í s ica do ind iv íduo à cor . O vermelho será

exc i tante ; o azu l , re f rescante .

A luz co lor ida ser ia capaz de es t imular a

c i rcu lação sangu ínea e ag i r sobre a

muscu la tura aumentando a sua força numa

seqüênc ia que va i do azu l , passando pe lo

amare lo e l a ran ja , cu lminando no ver melho.

Impor tante res sa l t a r que o s i s t ema de

le i tura ocu lar humano é es t imulado

3 9

sub l iminarmente . Por exemplo : nos

pr ime i ros t r in ta segundos de expos i ção à

cor , a s pessoas sof rem a ação da cor em s i ;

depois , as cé lu las ocu lares env iam nova

mensagem ao cé rebro , que passa a sofrer a

inf luênc ia da cor complementar . Ass im, no

caso dos hosp i t a i s que p in tam paredes e

t e tos dos quar tos em tons de azu l , o e fe i to

pre tend ido , após um tempo, passa a se

inver ter , jus tamente pe la inf luênc ia do

l a ran ja , que possu i vermelho em sua

compos ição e é ace le rador da f reqüênc ia

card íaca .

Sabemos que a cor não é necessá r i a pa ra a

c r i ação de mensagens v i sua i s , mas é o

e l emento que t em ma i s a f in idade com as

emoções e por i s so deve se r sempre usada

na comunicação . Nes te ponto , devemos

enfa t izar que o d e s i g n em pre to e b ranco

4 0

t ambém permi te “cores” , sendo a té mesmo

mais r i co e desaf i ador , a l ém de econômico .

Considerações sobre a

cor

Os es t ímulos que causam as sensações

c romát icas es tão d iv id idos em do is g rupos :

o das cores - luz e o das cores -p igmento .

Cor- luz , ou luz color ida , é a rad iação

luminosa v is íve l que tem como s íntese

ad i t iva a luz branca . Cor-p i gmento é a

subs tânc ia mater i a l que , conforme sua

na tureza , absorve , re f ra ta e re f l e te os ra ios

luminosos componentes da luz que inc ide

sobre e la . É o t ipo de luz ref le t ida que

de te rmina a sua denominação .

4 1

Um ob je to é d i to verde , en tão , quando

absorve quase todos os ra ios da luz branca ,

só ref le t indo nos nossos o lhos os verdes . A

mis tura das cores -p igmento produz um

c inza escuro e é denominada s ín te se

subt ra t iva .

Expl ica- se a v i são c romát i ca dos se res

humanos da segu in te mane i r a : o e spec t ro

e l e t romagnét i co é um campo vas t í s s imo de

ondas , das qua is apenas a lgumas percebidas

pe lo o lho humano.

Se um ob je to re f l e t i r todas as rad iações

luminosas que o a t ingem, essas rad iações

chegarão s imul t aneamente ao o lho e o

veremos como to ta lmente branco .

4 2

Quadro 1 – F iguras demons t ra t i vas da

es t imulação e propr iedades da luz e das

cores

D e m o n s t r a ç ã o d o g r a u d e e s t i m u l a ç ã o d o s

d i f e r e n t e s c o n e s s e n s í v e i s á l u z m o n o c r o m á t i c a .

A s c o r e s d i a m e t r a l m e n t e o p o s t a s s ã o

c o m p l e m e n t a r e s e n t r e s i . O t r i a n g u l o a s s i n a l a d o

r e p r e s e n t a a s c o r e s p r i m á r i a s d a l u z .

4 3

S í n t e s e a d i t i v a m o s t r a n d o a s d o z e c o r e s - l u z

p r i m á r i a s e s e c u n d á r i a s

T r i â n g u l o d a s c o r e s d e a c o r d o c o m o s i s t e m a M u n s e l l d e c o r e s .

4 4

As cores fundamenta i s ou pr imi t ivas são

aque las que compõem o espect ro so lar .

Conforme a nomenc la tura são e las : v io le ta ,

roxo, azul , verde , amare lo , laranja e

vermelho . Cor gera t r iz ou pr imár ia é cada

uma da s t rês cores indecomponíve i s que ,

mis turadas em proporções var i áve i s ,

p roduzem todas as luzes do espec t ro .

A inda que a cor não t enha ex i s t ênc i a

mater i a l , podemos usá - la para identif icar os

e l ementos que devem a t ra i r a a t enção das

pessoas . Entre tanto , quando usada

ind i sc r iminadamente , a cor pode t e r um

efe i to nega t ivo ou de d i s t r ação .

I s so pode a f e t a r não somente a r e ação do

usuár io em re l ação à pág ina , mas t ambém a

produt iv idade, pois se torna dif íc i l focal izar

na t a re fa (Windows , 1995 ) .

4 5

Para ex t ra i r todo o potenc ia l das cores e

apresen tá - l a s em um moni tor de

computador , é necessár io segu i r a lgumas

recomendações . A inda que es tabe lecer

regras gera i s ou espec í f i cas para o uso da

cor se ja d i f í c i l , dev ido à d ivers idade de

fa tores que a inf luenc iam, aqu i , vamos

t en ta r r e sponder à s ques tões ma i s

f reqüentes dos pro je t i s t as e usuár ios de

mon i tores g rá f i cos de computadores

co lor idos , como: que cores eu devo usar?

Quantas cores eu devo usar? Essas cores são

apropr iadas? Como eu posso me lhorá - las?

Como j á v imos , cada cor t em numerosos

s ignif icados associat ivos e s imból icos . Até a

c lasse soc ia l a que o ind iv íduo per tence

pode de te rminar sua pre fe rênc i a . Há uma

tendência para as cores v ibrantes , como

4 6

o vermelho , nas c lasses menos

favorec idas ; enquanto a camada socia l

mais e levada inc l ina-se para os tons

suaves .

Também as épocas do ano e a s e s t ações

geográ f i cas s ão f a tores a se r cons iderados

para o es tabe lec imento de re lações entre os

se res humanos e as cores .

Devemos c i t a r , a inda , os exper imentos

ps íquicos rea l izados por Hermann

Rorschach . Esses exper imentos l evam à

conc lusão de que ind iv íduos a legres

r e spondem in tu i t i vamente à cor ; enquanto

a reação de pessoas depr imidas é

gera lmente vo l tada à forma .

A pr e f e r ê n c i a p e l a c o r g e r a lmen t e d e nun c i a i n d i v í d u o s c om ma i s ab e r t u r a a e s t ímu l o s ex t e r i o r e s ; é p r i v i l é g i o da s p e s s oa s s en s í v e i s ,

4 7

qu e s e d e ixam i n f l u e n c i a r , e qu e e s t ã o p r o p e n s a s à d e s o r g an i z a ç ã o e o s c i l a ç õ e s emo c i o na i s . As r e a ç õ e s à forma indicam, ao c o n t r á r i o , o t emp e r amen t o f r i o , c o n t r o l a d o , i n t r o sp e c t i v o (Far ina , 1990 , p . 104) .

Um out ro ps i có logo chamado Ernes t

Schachte l comple ta conc lu indo que , ao

reag i r à cor , o ind iv íduo sof re a ação do

ob je to – é uma a t i tude pass iva . Quando

“percebe” a forma, ao contrár io , e le tem de

examinar o ob je to , def in i r sua es t ru tura ,

e l aborar uma respos ta – é uma atitude ativa.

Pesquisas semelhantes c i tadas por Arnhe im

(1995 ,p . 325-326) conc lu í ram que cores e

ob je tos podem produz i r conf l i tos no

cérebro . Por exemplo , ao serem

apresentados a cr ianças um quadrado azu l e

um c í rcu lo vermelho, quando fo i

pe rguntado se um quadrado verme lho e ra

ma i s pa rec ido com o quadrado ou com o

4 8

c í rcu lo , a maior ia de las faz ia a sua escolha

com base na fo rma .

E essa tendência aumentava com a idade. As

c r i anças pré -esco lares eram d i r ig idas pe la

fo r te a t r ação percept iva das cores .

Mas , à medida que a cu l tura começa a

t re inar as c r i anças nas hab i l idades prá t icas ,

a s qua i s dependem mui to ma i s da forma do

que da cor , e l a s se vo l tam cada vez ma is

pa ra a fo rma como um me io dec i s i vo de

ident i f i cação .

4 9

Quadro 2 . Conf l i tos ent re fo rma e cor

Merece se r expos ta , a inda , a pesqu i sa

rea l i zada pe lo ps icó logo Bamz (c i t ado por

Far ina , 1990 , p . 105) , que a l i a a preferênc ia

dos indiv íduos por determinada cor ao fator

idade .

Conflito no cérebroConflito no cérebroO lado direito do seu cérebro tenta dizer a cor, O lado direito do seu cérebro tenta dizer a cor, mas o lado esquerdo insiste em ler a palavra.mas o lado esquerdo insiste em ler a palavra.

5 0

Segundo esse es tudo , o verme lho

corresponder i a ao per íodo de 1 a 10 anos

( e fe rvescênc i a , e spontane idade ) ; o l a ran j a ,

de 10 a 20 anos ( imag inação , exc i t ação ,

aventura) ; o amarelo, de 20 a 30 anos (força,

po tênc i a , a r rogânc i a ) ; o ve rde , de 30 a 40

anos (d iminu ição do fogo juven i l ) ; o azu l ,

de 4 0 a 50 anos (pensamento , in te l igênc ia ) ;

o l i l ás , de 50 a 60 anos ( ju ízo , mist ic i smo,

l e i ) ; o roxo , a l ém dos 60 anos ( sabedor ia ,

exper iênc ia e benevo lênc ia ) .

Diante de tantas var iações , conc lu ímos que

não é poss íve l es tabe lecer cr i tér ios r íg idos

para o uso da cor . Portanto, o estudo da cor

e da sua inf luênc ia é de fundamenta l

impor tânc i a quando da c r i ação de uma

compos ição , se j a para um s i t e , um logot ipo

ou uma peça publ ic i t á r i a , porque as cores

t êm uma ação es t imu lante sobre os

5 1

ind iv íduos e são e f i c ientes em re te r a sua

a tenção , evocam sent imentos e sensações ,

p rovocam d i fe ren tes a s soc i ações de idé i a s

ou es t ados de e sp í r i to (Sant ' anna , 1989) .

Segundo Far ina (1990 ; p . 101) , a l ém de

a tua rem sobre a emot iv idade humana , a s

cores p roduzem sensação de mov imento,

uma d inâmica envo lvente e compuls iva .

“Vemos o amare lo t ransbordar de seus

l imi tes espac ia i s com uma ta l força

expans iva que parece invad i r os e spaços

circundantes; o vermelho, embora agressivo,

equi l ibra - se sobre s i mesmo; o azu l c r i a a

s ensação do vaz io , de d i s t ânc ia , de

profundidade .”

Há, também, sensações re lac ionadas com as

cores quentes e f r i as . As cores quentes

p roporc ionam uma sensação de

5 2

prox imidade , ca lor , dens idade , opac idade ,

secura , a lém de serem es t imulantes . Já as

cores f r i as , parecem d is tantes , leves ,

t r ansparentes , úmidas , aé reas e são

ca lmantes .

As cores , enf im, “const i tuem es t ímulos

ps ico lóg icos para a sens ib i l idade humana ,

inf lu indo no ind iv íduo , para gos tar ou não

de a lgo , para negar ou a f i rmar , para se

abs te r ou ag i r” (Far ina , 1990 ; p . 112) .

Desde a Ant i gü idade , o homem tem dado

um s ignif icado ps icológico às cores , e desde

en tão não ocor re ram d i fe renças de

interpretação s ign i f ica t ivas (Dondis , 1988) .

Passa remos , por tanto , ao es tudo dos

s ign i f i cados ps ico lóg icos das pr inc ipa i s

cores e t ambém das s ensações ac romát i ca s

5 3

brancas , p re tas e c inza , segundo Far ina

(1990 ) e Pedrosa (1982 ) .

Branco

Do ponto de v i s ta f í s ico , o branco é a soma

das cores . Ps ico log icamente , é a ausênc ia

de las . S imbol iza a luz . Para os oc identa is ,

s imbol iza a v ida e o bem; para os or ienta i s ,

é a mor te , o f im , o nada . Assoc i ação

mater ia l : bat i smo, casamento, c i sne , l í r io ,

pr imeira comunhão, neve, nuvens em tempo

claro, areia c lara. Associação afet iva: ordem,

s impl ic idade , l impeza , bem, pensamento ,

o t imismo, paz , pureza, inocência , modést ia ,

in fânc ia , a lma , harmonia , e s tab i l idade ,

d iv indade .

5 4

Preto

Ind ica a pr ivação ou ausênc ia de luz . O

pre to abso lu to não ex i s t e na na tureza . O

preto encontra sua maior força em oposição

ao branco . Nas ar tes gráf icas , t em emprego

ind i spensáve l como e l emento de cont ras te

para ressa l ta r os mat izes . As cores puras ,

con tornadas com pre to , ganham em

luminos idade e v ibração .

Quando é mis turado às cores c l a ras , c r i a

tona l idades desagradáve i s , su jas , de

in te rpre tação ps i co lóg ica nega t iva .

Assoc iação mater ia l : su je i ra , sombra ,

enter ro , no i te , carvão , fumaça , morto , f im,

co i sas escond idas . Assoc iação a fe t iva : ma l ,

misér ia , pess imismo, tr is teza , desgraça , dor ,

t emor , negação , me lanco l i a , angús t i a ,

5 5

in t r iga , mis té r io , suspense , se r i edade ,

nobreza .

Cinza

É cor neutra por exce lênc ia . S imbol iza a

pos ição in te rmed iá r i a ent re a luz e a

sombra . Não in te r fe re nas cores em gera l .

Assoc iação mater i a l : pó , chuva , neb l ina ,

máqu inas , mar sob tempes tade . Assoc iação

afe t iva : téd io , t r i s teza , decadênc ia , ve lh ice ,

desân imo, se r i edade , sabedor i a , passado ,

f inura , pena , aborrec imento .

Vermelho

É cor pr imár ia t anto em luz quanto em

p igmento . É a ma i s sa turada das cores ,

sendo , por tan to , a que ma i s se des taca

v i sua lmente e a ma i s r ap idamente

5 6

dis t ingu ida pe los o lhos . Ao l ado do verde ,

forma a dup la de complementa res ma i s

v ib ran te , a t ing indo a té a b ru ta l idade . Seu

escurecimento com preto dá or igem a vár ios

tons de mar rom. O escurec imento sem

perda de luminosidade é obt ido pela mistura

da púrpura , v io le ta ou azu l . É a única cor

que não pode se r c l a reada sem perder suas

carac ter í s t i cas essenc ia i s . C lareado em

mis tura com o amare lo , produz o l a ran ja e ,

dessa turado pe la mis tura com o branco ,

produz o rosa . Sua aparênc ia ma i s be la e

enérg ica é consegu ida quando ap l i cado

sobre fundo pre to , func ionando como á rea

luminosa .

Sobre o branco , torna-se escuro e ter roso .

Assoc iação mater ia l : rub i , cere ja , s ina l de

parada , per igo , v ida , so l , fogo , sangue ,

láb ios , mulher , fer idas , conquis ta ,

5 7

mascu l in idade . Assoc iação a fe t iva :

d inamismo, força , energ ia , revo l ta ,

mov imento , coragem, esp lendor ,

in tens idade , pa ixão , vu lgar idade , v igor ,

g lór ia , ca lor , v io lênc ia , exc i tação, i ra ,

in te rd ição , emoção , ação , agress iv idade ,

ex t roversão .

Amarelo

Em cor-p igmento , é uma das cores

pr imár i a s , t endo por complementar o

v io le ta . Em cor- luz , é secundár ia (mis tura

do ve rme lho com o ve rde ) , s endo a

complementar do azu l . É a mais c l a ra das

cores e a que ma i s se aprox ima do branco

numa esca la de tons . É a cor quente por

excelência . Misturado ao vermelho, exalta-se

produz indo o l a ran ja . Mis turado ao azu l ,

esfr ia - se e produz o verde . Escurec ido com

5 8

pre to , adqu i re co loração esverdeada pouco

agradáve l , p róx ima do verde-oliva sombrio.

C la reado com branco , não perde suas

qual idades intr ínsecas . Sobre fundo branco,

é pouco v i s íve l ; j á sobre o pre to , ganha

força e v ibração. Em contraste com o c inza ,

se enr iquece em qua l idade cromát ica e

be leza . Amplo e ofuscante , é a ma is

desconcer t an te das cores , t r ansbordando

dos l imites , parecendo sempre maior do que

é , dev ido à sua carac te r í s t i ca expans iva .

Assoc iação mater ia l : ouro , f ru to maduro ,

so l , f lores grandes , terra arg i losa , pa lha ,

luz , topáz io , verão, l imão chinês , ca lor de

luz so lar . Assoc iação afet iva : i luminação,

conforto , a ler ta , gozo, c iúme, orgulho,

esperança , idea l i smo, egoísmo, inveja , ódio,

adolescência , espontaneidade, var iabi l idade,

eufor ia , or ig ina l idade , expecta t iva .

5 9

Verde

É cor pr imár ia em luz , complementar do

magenta . Em pigmento, é secundár ia , sendo

a complementar do verme lho . É o ponto

idea l de equi l íbr io da mis tura do amare lo

com o azu l – duas cores opos tas , uma

quente outra f r i a , uma c la ra outra escura ,

uma expande -se out ra se cont ra i . Surge ,

en tão um repouso fe i to de t ensões . É a cor

ma i s ca lma . A pass iv idade é o ca rá te r

dominante do verde abso lu to .

O verde escurec ido com pre to torna -se

ac inzentado . C lareado com o amare lo ,

to rna -se ma i s a t i vo e pene t ra na va r i ada

gama de ve rde - l imão . Dessa turado com

branco, ganha em luminosidade. Associação

mater ia l : umidade , f rescor , pr imavera ,

bosque, águas c laras , fo lh agem, mar , verão ,

6 0

plan íc ie , na tureza . Assoc iação a fe t iva :

e sperança , saúde , t ranqü i l idade , segurança ,

natureza , equi l íbr io , l iberdade, c iúme,

suav idade , f i rmeza , juventude .

Azul

É pr imár i a t an to em cor- luz quanto em cor-

p igmento . Nas luzes , sua complementar é o

amare lo ; em pigmento, é o laranja . Por ser a

mais escura das cores pr imár ias , o azu l tem

analogia com o preto . Todas as cores que se

mis turam com o azu l es f r i am-se, por ser ele

a ma is f r i a das cores . Assoc iação mater i a l :

f r io , mar , céu , ge lo , feminil idade , águas

t ranqüi las , montanhas longínquas .

Assoc iação a fe t iva : in f in i to , nobreza ,

pureza , espaço , verdade , sent ido , a fe to ,

inte lectua l idade , paz , medi tação, conf iança ,

f ide l idade , sent imento profundo .

6 1

Violáceas

É o nome genér i co de todas a s cores

resu l t an tes da mis tura do verme lho com o

azu l . Chama-se v io leta , ou roxo, o ponto de

equ i l íbr io ópt ico da mesc la dessas duas

cores . Em p igmento , é cor secundár ia e

complementa o amare lo . Em luz co lor ida , a

mesc la equi l ibrada de azu l e vermelho é

denominada magenta , complementa r do

verde, tonal idade que se aproxima do violeta

purpur ino . É a cor que possu i a mais a l ta

freqüência e o menor comprimento de onda.

Quando reba ixado com pre to , to rna -se

desagradáve l e su jo . Escurec ido com azu l ,

esfr ia - se , o fe recendo poss ib i l idades tona i s

de ex t rema r iqueza c romát ica . Dessa turado

com branco , fo rma a ex t ensa gama dos

l i lases , tonal idades de extrema luminosidade

e beleza . A mais importante cor v iolácea é o

6 2

púrpura , a mis tura ópt i ca de 2/3 de

vermelho com 1/3 de azu l . Assoc ia ção

mater ia l : no i te , ig re ja , aurora , sonho,

v idênc ia , agressão , fur to , misér ia .

Assoc iação a fe t iva : t emperança , luc idez ,

saudade , c iúme, me lanco l i a , fé , d ign idade ,

poder, r iqueza, engano, calma, autocontrole,

v io lênc ia , mis tér io , de l icadeza .

Laranja

Quando produz ido por luzes co lor idas , é

t e rc i á r i a (2/3 de vermelho e 1/3 de verde ) .

Em p igmento , é cor secundár ia , resu l tante

da mis tura equ i l ib rada do vermelho com o

amare lo , e complementar do azu l . É cor

quente e , por tanto , d i spers iva .

As á reas co lor idas pe lo la ran ja parecem

maiores do que são . Quando reba ixado com

6 3

pre to , torna-se sujo. Misturado ao vermelho,

consegue-se um escurec imento tona l

re la t ivo , surge um vermelho a laran jado.

Clareado com amare lo , i lumina-se, ganha em

v ibração , mas perde a cons i s tênc ia .

Dessa tu rado com o branco , ganha em

luminos idade . Assoc iação mater ia l : outono,

l a ran ja , fogo , pôr-d o -sol , luz , chama, ca lor ,

fes ta , per igo , aurora , ra ios so lares .

Assoc iação a fe t iva : força , luminos idade ,

dureza , eufor ia , energ ia , a legr ia ,

adver tênc i a , t en tação , prazer , senso de

humor.

Marrom, ocre e terras

Não ex i s tem como luzes co lor idas . Em

p igmento , são resu l t an tes da mis tura de

amare lo e pre to ou amare lo , vermelho e

pre to . Assoc iação mater ia l : t e r ra , l ama ,

6 4

outono, doença , sensua l idade , desconforto .

Assoc iação a fe t iva : pesar , me lanco l i a ,

res i s tênc ia , pen i tênc ia , t ra ição , humi ldade .

Percepção e Efeitos da

Cor

Recomendações

Por tudo o que es tudamos , recomenda-se

que a s cores de uma pág ina na Web n ão

se j am se l ec ionadas separadamente e s im,

den t ro de um contexto gera l que pr iv i l eg ie

t ambém a v i s ib i l idade . (Rober t son , 1993) .

Far ina (1990) c i ta a lguns contrastes

interessantes para uma fácil visibil idade:

o pre to sobre amare lo o verde ou azul ; o

ve rmelho sobre amare lo ou branco ; o

6 5

branco sobre azu l ou pre to ; e o amare lo

sobre o pre to .

Vale lembrar que o estudo desses contrastes

é a inda ma i s impor tan te pa ra a cor re t a

u t i l i zação de carac teres . As combinações

mais v is íve is são c i tadas por Ribeiro (1993) :

l e t ras pre tas sobre fundo branco ; l e t ras

verme lhas sobre fundo branco ; l e t ras

amare las sobre fundo pre to ; letras brancas

sobre fundo azu l ; l e t ras vermelhas sobre

fundo pre to ; l e t ras brancas sobre fundo

ve rme lho ; l e t ras azuis sobre fundo branco.

Segundo o autor , o grau de l eg ib i l idade das

l e t r a s co lor idas sobre fundos de cor se rá

ma i s ou menos acen tuado dependendo do

t ipo de le t ra . “Em gera l , uma le t ra escura

sobre um fundo c laro é leg íve l de mais

longe do que o inverso e se ut i l izarmos uma

cor c la ra em fundo escuro , a l e t ra tem de

6 6

ser ma is for te , porque a cor escura do fundo

absorve a cor c lara da le t ra” (Ribe i ro , 1993;

p . 192) .

A inda sobre combinações de cores , Far ina

(1990) cons idera de pouca v i s ib i l idade as

duplas azul-verde e verde-vermelho, que ,

a l ém de inef i cazes podem a té i r r i t a r a

s ens ib i l i dade óp t i ca . O branco-pre to t em

v i s ib i l idade méd ia , comparado com o

amarelo -preto .

O autor t ambém c i t a a impor tânc i a de se

cons ide ra r o t amanho do t ipo pa ra a

ap l i cação de uma cor ma is l eve ou mais

pesada . Dessa forma , a s cores e scuras em

t ipos sobre fundos t ambém escuros , mas

d i ferentes , resu l tam prat icamente i l eg íve i s

qua lquer que se ja o tamanho do t ipo . “As

cores c l a ras devem co locar- se em t ipos não

mui to pequenos , espec ia lmente se o fundo

6 7

for vermelho , verde ou roxo. O c inza

ge ra lmente não apresenta mui t a

vis ibi l id ade” (Far ina , 1990 ; p . 37 ) .

É fa to que a lgumas l imi tações podem ser

contornadas . Por exemplo , no caso de

pág inas na WEB, a aparênc ia de uma j ane la

pode ser a l te rada quando outras j ane las são

aber ta s na mesma te l a . Ent re tanto ,

re comenda -se sempre que se j am respeitadas

as d i ferenças cu l tura i s e f i s io lóg icas entre

os ind iv íduos (Rober t son , 1993) .

Cons idere - se , a inda , que as pessoas idosas

têm uma sens ib i l idade reduz ida para cores ,

o que , por sua vez , pode requerer o uso de

cores mais br i lhantes .

Por outro lado, ev i te usar azul para

pequenas á reas (Rober t son , 1993) . Uma

pequena área em azu l va i parecer ma is

6 8

desbotada do que uma g rande á r ea da

mesma cor . Ev i te o uso do azu l e do

verme lho , s imul taneamente (Rober t son ,

1993) .

Cons idere a inda que o azu l e o vermelho

t êm d i fe ren tes p rofund idades de foco e ,

para o o lho humano , o processo para

encont ra r o foco cor re to é f a t i gan te .

Observações

1 . Quando cores do espectro amplamente

separadas , como o vermelho e o azu l ,

s ão apresentadas na t e l a , e l a s

apa ren ta rão e s t a rem em d i fe rentes

p l anos de profund idade (Rober t son ,

1993 ) .

2 . Recomenda -se que as cores se j am

se lec ionadas em d i fe rentes

i luminações , ou se ja , com a presença

6 9

de luz f luorescente , incandescente e à

luz do d i a (Rober t son , 1993) .

Recomendações

a ) As cores que você usar devem sa t i s fazer

à s p ropos ta s da pág ina na Web (Windows,

1995 ) .

As cores não devem se r usadas

ind i sc r iminadamente , somente como

e lemento decorat ivo . Recomenda -se o uso

de um grupo l imi t ado de cores , dando ao

usuár io a opção de mudá- las (Windows,

1995 ) . Desse modo as páginas de um mesmo

s i t e e s t a rão ma i s p ropensas a t e rem um

“padrão” cons i s t en te .

Atenção : quando se for permi t i r que o

usuár io mude as cores de uma pág ina na

Web, é preciso considerar a complexidade da

7 0

t a re fa e a hab i l idade média do “públ i co”

usuár io (Windows, 1995) . Portanto, permita

sempre que o con junto de cores -padrão

possa ser recuperáve l e res tabe lec ido para

que o usuár io não se perca na rea l i zação da

t a re fa dev ido ao uso ind i sc r iminado da cor

( ISO 9241-8 ) .

b ) Use a cor como uma forma de

in formação ad ic iona l ou aumentada .

(Windows , 1995) . Ev i te conf i a r na cor

como o ún ico me io de expressa r um

va lor ou uma função par t icu lar .

c ) Use cor para rea lçar ao invés de usar

subl inhado (e use subl inhado ao invés de

i t ens p i scando) (Nie l sen , 1996). Restrinja

o uso do sub l inhado para l inks ev i t ando

ass im confundir o usuár io .

7 1

d ) Evi te usar cores mui to quentes , t a i s

como, o rosa e o magenta . (Rober t son ,

1993) .

As cores mui to quentes parecem pu lsar na

te la e f icam dif íce is de foca l izar . Se for

usado um fundo colorido, se lecione as cores

do t ex to de modo a ob te r o con t r a s t e ma i s

for te ent re o tex to e o fundo . Isso aumenta

a v i s ib i l idade e a l eg ib i l idade do texto .

e ) Não use vár i a s cores em uma ún ica

pág ina . I sso d i s t ra i a a tenção do usuár io

e causa a pe rda de foco na a t i v idade

pr inc ipa l .

f ) Sobre um fundo escuro , recomenda-se o

uso da cor ve rde pa ra o t ex to

(Robertson, 1993) . O verde es tá no meio

do espec t ro so l a r e o compr imento de

onda que produz a sensação do verde é o

7 2

ponto ma i s a l to de sens ib i lidade do olho

humano (Pedrosa 1982 ) .

g ) Cons idere que a forma, a loca l i zação e

os ró tu los de t ex to são out ras mane i ra s

de d i s t ingu i r a in formação (Windows ,

1995) A cor não deve se r o pr inc ipa l

e l emento para esse f im.

h ) Recomenda -se o uso mnemôn ico da cor

(Rober t son , 1993 ) que é empregado

respe i t ando os e s te reót ipos para c r i a r

for tes a s soc iações que a judam no

reconhec imento , na l embrança e no

t empo de busca .

i ) Use cores br i lhantes e contrastantes com

caute la . Esses e lementos a t raem a

a tenção do usuár io e o seu emprego deve

se r r e se rvado para á reas impor tan tes ;

caso cont rá r io , o usuár io pode achar

7 3

mais d i f íc i l saber para onde o lhar e f icar

confuso .

j ) Use cores monocromát i cas para o t ex to ,

s empre . As cores monocromát i cas s ão

ma i s n í t idas aumentando a l eg ibi l idade e

a v i s ib i l idade do tex to .

k ) Recomenda -se o uso de uma cor neut ra

para fundos . As cores neut ras (por

exemplo , c inza-c l a ro ) aumentam a

v i s ib i l idade das outras cores .

l) Ev i te á reas p i scando . Quando i s so for

rea lmente necessár io , l embre-se de não

usar ma i s que uma á rea p i scando ao

mesmo tempo .

m ) No que d iz respe i to à cor é melhor ser

conse rvador . Recomenda-se usar o

máx imo de c inco cores . Para usuár ios

novatos o uso de quatro cores d is t intas é

7 4

mais apropr i ado . Es ta quant idade

pe rmi t e e spaço ex t r a na memór i a de

cur ta duração .

n ) Não use s imul taneamente a l to c roma e

cores que es te j am mui to d i s t an tes no

espectro so lar . Para re lações f igura -

f igura e mui tas f igura - fundo, for tes

cont ra s te s de ve rme lho/verde ,

azul/amare lo , verde/azul e

vermelho/azul cr iam v ibrações , i lusões

de sombras e imagens pos te r iores .

o ) Use um cód igo de cores cons i s t en te e

famil iar , com referências apropriadas . As

denotações comuns no oc iden te s ão a s

segu in tes :

V e r m e l h o : p a r e ,

p e r i g o , q u e n t e , f o g o ;

A m a r e l o : c u i d a d o ,

d e v a g a r , t e s t e ;

V e r d e : a n d e , O K , l i v r e ,

v e g e t a ç ã o , s e g u r a n ç a ;

A z u l : f r i o , á g u a ,

c a l m o , c é u ;

7 5

Cores quentes : ação , resposta requer ida ,

proximidade; cores fr ias : s tatus , informação

de fundo, d is tânc ia ; c inzas , brancas e azuis :

neutra l idade .

Recomenda -se o uso da mesma cor pa ra

agrupar e lementos re lac ionados . (Marcus ,

1992) . É impor tan te se r cons i s t en te no

agrupamento de cores . Não use uma cor

par t i cu la r para um e lemento que não es te ja

re lac ionado com outro e lemento .

p ) Use o mesmo cód igo de cores pa ra

t re inamento , t e s te , ap l i cação e

publ icação.

Uma vez es tabe lec ido o cód igo de cores , as

mesmas cores devem se r usadas por todo o

c i c lo de v ida de d i s seminação e ge ração de

conhec imento .

7 6

Por outro lado, lembre-se de que o moni tor

do computador usa mis tu ras ad i t i vas de

cores , e que a soma das cores gera o branco.

Por i sso , deve-se sempre usar um cód igo

redundante de forma e cor . Essa abordagem

aux i l i a os usuár ios com def ic iênc ia em

v isua l izar cores , po is a forma é a var iáve l

v i sua l mais fác i l de ser reconhec ida .

q) Use a cor pa ra aumenta r a in formação

mos t rada em pre to e b ranco .

No que concerne ao aprend izado e

compreensão , a cor é super ior ao pre to e

b r anco em t e rmos do t empo de

processamento e de reações emoc iona i s ,

mas não há d i f e rença na hab i l idade em

in te rpre ta r a in formação . A cor é ma i s

aprec i áve l e a memór ia para in formação

color ida também parece ser super ior do que

aque la em pre to e branco . Entre tanto ,

7 7

r ecomenda-se pro je ta r pr ime i ramente em

pre to e branco e , en tão , ad ic ionar a cor . A

cor aumenta o p roces samento cogn i t i vo e

v isua l de uma informação que funciona bem

em preto e branco , po is a juda a loca l izar ,

c lass i f i car e assoc iar imagens .

Observações

importantes

Ao mesmo tempo em que você pode usa r

cor para most ra r re l ação ou agrupamento ,

assoc ia r uma cor a um s ignificado particular

não é sempre óbv io ou fác i l de aprender .

1 . Cores monocromát i cas parecem se r

ma i s n í t idas do que as cores

po l i c romát icas . (Rober t son , 1993) .

2 . As pes soas gos t am de d i s p l a y s

co lor idos (Guimarães , 1997) .

7 8

3 . Cor é uma propriedade muito subjet iva

e o que é agradável para você pode ser

desagradáve l para out ro (Windows ,

1995 ) .

4 . A in te rpre tação da cor pode va r i a r

cu l tura lmente , e , a té mesmo em uma

ún ica cu l tura , as assoc iações

ind iv idua i s podem d i fe r i r (Windows ,

1995 ) .

5 . Aprox imadamente 8% dos homens e

0 ,5% das mulheres têm def ic iênc ia em

v isua l izar cores . A mais f reqüente é a

fa l t a de hab i l idade para d i s t ingu i r o

vermelho , o amare lo e o verde ( ISO

9241-8 )

6 . Cores mui to quentes podem parecer

pu l sa r na t e l a (Rober t son , 1993) .

7 . Cores complementares , como

ver me lho e ve rde , podem tornar- se

d i f íce is para o olho foca l izar .

7 9

8 . Cores e scuras t endem a re t roceder o

espaço v i sua l , enquanto que cores

c la ras fazem o espaço v i sua l v i r para

f rente .

9 . Para ev i ta r problemas com usuár ios

com v i são def i c i ente em cores , a s

cores como verme lho e ve rde devem

ter luminânc ias suf ic ientemente

d i ferentes .

10 . Cores de fundo ou adjacentes afetam a

sombra ou a luminânc ia perceb ida de

uma cor part icular .

8 0

Fundo

O fundo de uma pág ina na Web é composto

por padrões de t ex turas e/ou cores . A

t ex tura pode se r pe rceb ida t an to pe lo t a to

quanto pe la v i são , mas é poss íve l que uma

tex tura não tenha nenhuma qua l idade t á t i l ,

somente ót ica , como é o caso dos desenhos,

por exemplo. Já quando há uma textura real ,

coex i s t em ambas a s sensações . A ma ior

pa r t e da nossa exper iência com as texturas é

visual .

Considerações

A maior i a dessas t ex turas que vemos não

es tá rea lmente a l i . “Se tocamos a fotograf ia

de um sedoso ve ludo não t emos a

conv incente exper iênc ia t á t i l que nos fo i

promet ida pe la v i são . O s ign i f i cado se

8 1

base ia no que vemos” (Dondis , 1988 , p .

71) . Por i s so , a esco lha do fundo

desempenha um pape l mui to importante no

resu l tado f ina l de uma compos ição . Ele

pode aumentar o in te resse pe lo pro je to

v i sua l . No caso de pág inas em WEB, para

que e s se fundo se j a harmonioso , e l e deve

segu i r a s r ecomendações e obse rvações

sobre cores .

Recomendações

Recomenda -se usar cores neut ras para o

fundo de uma pág ina na Web . ( ISO 9241-8).

Cores neut ras , usadas para fundos ,

aumentam a l eg ib i l idade do tex to .

1 . Não use fundo mui to “ca r r egado”

(Kr i s to f e Sa t r an , 1995 ) . I s so f az com

que sua pág ina f ique demorada para

carregar .

8 2

2 . Não use cores mui to escuras para

fundo de toda a pág ina (Kr i s to f e

Sa t ran , 1995) . Em pequenas á reas , e l as

a judam a d i r ec ionar a a t enção do

usuár io , mas em toda a pág ina e l a s

aumentam o cansaço v i sua l .

3 . Não ut i l i ze e lementos a lea tór ios como

fundo de uma pág ina na Web (Kristof e

Sa t ran , 1995) . O e lemento de fundo da

pág ina deve aumenta r o en tend imento

do seu conteúdo . Se for usado um

fundo co lor ido , se lec ione as cores do

texto de modo a obter o contraste mais

fo r t e en t re o t ex to e o fundo

(Rober t son , 1993 ) . I s so aumenta a

v i s ib i l idade e a leg ib i l idade do texto .

8 3

Observações

1 . Ut i l i ze fundo s imples para não

comprometer a compreensão da página ,

a l eg ib i l idade do tex to e o t empo pa ra

se r ca r regada .

2 . O fundo não deve chamar mais a tenção

do que a informação .

3 . Use f igura ( tex to , í cones e f iguras )

c romát ica (azu l , verde , vermelho , e

ou t ra s ) sobre fundo ac romát i co

(branco , pre to e c inza ) e v i ce - versa

( ISO 9241-8 ) .

8 4

Fontes

Fontes ves tem pa lavras . E pa lavras ves tem

idé ias . As fontes podem fazer pe las idé ias o

que as roupas fazem pe las pessoas . Não é

somente o chapéu, gravata , terno ou vest ido

que você ves te . É o j e i to como você ves te .

É a adequação a você e à ocas ião que fazem

a d i fe rença . E ass im é com as fontes .

Considerações

“Uma bib l ioteca de fontes é uma espéc ie de

guarda - roupa com al ternat ivas para diversas

ocas iões “ (Shushan e Wr ight , 1994 , p . 28 ) .

As fon tes t êm mui t a s funções de modo a

prop ic i a r formas de l e t ras para a le i tura .

Ass im como outros e lementos v i sua i s , a s

fontes o rgan izam a in formação ou c r i am

uma d ispos ição par t icu lar .

8 5

É verdade que a grande maior ia dos le i tores

não é conhecedora , nem fo i in fo rmada a

re spe i to do uso de fontes . Mas é e r rado

supor que e les não i r ão re sponder ao uso

adequado de las (Shushan e Wr ight , 1994) .

Há d iversos s i s temas de c l a ss i f i cação dos

t ipos . E e les são baseados gera lmente nas

suas or igens c rono lóg icas e geográ f i cas ao

invés do seu cará te r v i sua l . Como é esse

ca rá te r das fontes que rea lmente a fe ta o

le i tor , e não a sua histór ia , c i taremos apenas

um desses s i s temas de c l ass i f i cação , a

c l ass i f i cação gera l proposta pe lo gráf ico

f rancês Franc i s Th ibaudeau e descr i t a por

Ribe iro (1993) . Essa c lass i f icação é baseada

na presença , ou não , e nas carac ter í s t i cas

das ser ifas , l inhas ou curvas que se projetam

das ex t remidades de um t ipo .

8 6

Thibaudeau agrupou as fontes , en tão , em

quat ro grandes famí l i a s , denominando-as :

Bas tão , Eg ipc iana , E lzev i r e Didot . Dentro

de cada famí l i a , há d iversas var iações .

D i fe ren te t e rmino log i a é apresentada por

Col l a ro (1987) para a mesma c lass i f i cação

de Thibaudeau. O autor descreve as famíl ias

como Lap idár i a , Eg ípc i a , Romana Ant iga e

Romana Moderna , respect ivamente . Fontes

do t ipo Bas tão não possuem ser i fas e são as

mais s imples e leg íve is . Mas , em grandes

volumes de textos , a fa l ta de contraste entre

a s has te s a s to rna cansa t ivas .

A famíl ia Egipciana tem uma base

notadamente retangular que lhe empresta

equil íbrio e estabi l idade. Destaca-se pela

un i fo rmidade dos t raços , e a

8 7

predominância do pre to sobre o branco

em sua cons t rução .

As fontes Elzev i r possuem a base

t r iangular e d is t r ibuição per fe i ta de

t raços f inos e grossos , o que os

caracteres muito legíve l e e legante . A

famí l ia Didot é caracter izada pelo

exagero de t raços f inos e grossos em sua

cons t rução , que proporc ionam be leza e

d is t inção. A esse contras te junta-se uma

ser i fa de t raço f ino . Embora de le i tura

agradável , tem aspecto f rági l .

Os t ipos que pr imam pe lo novo, pe lo

d i ferente e que fogem a essa c la ss i f icação ,

mis turando e l ementos de ma i s de uma

famí l i a ou mesmo não possu indo re lação

com nenhuma , podem se r chamados de

Fanta s i a .

8 8

Var iando o tamanho e o peso de uma fonte ,

vemos um texto como sendo mais ou menos

importante e , também, percebemos a ordem

em que e le deve ser l ido.

Segundo Brady (1988) , ao esco lher uma

fonte , deve -se cons iderar a l eg ib i l idade e o

cará ter . Leg ib i l idade es tá re lac ionada com a

ve loc idade com que cada l e t ra ou uma

combinação de l a s pode se r r econhec ida .

Uma fon te pode se r ex t remamente leg íve l

quando i so lada , mas sua ap l i cação er rada

com re l ação a t amanho , e spaçamento de

ent re l inhas , cont ras te com o fundo , ent re

out ras ações , pode torná - la de difícil leitura.

San t ' anna (1989) c i t a c inco fa tores que

inf luenc iam na leg ib i l idade :

8 9

s impl ic idade: quanto mais s imples (menos

decora t ivo) um carac ter , ma is l eg íve l será ;

dimensões : l e t ras pequenas demais são

cansa t i va s e g r andes dema i s causam ma l-

es t a r . Ex i s t e um tamanho adequado para

cada ap l icação . Em um t í tu lo de car taz

publ ic i tár io, por exemplo , os carac teres

devem se r su f i c i en temente g randes para

chamar a a tenção , e pequenos para que

se jam l idos sem esforço ;

força : para que haja legibi l idade, deve haver

uma re l ação harmônica ent re a a l tu ra da

l e t ra e sua l a rgura . Let ras grossas e ba ixas

t onam-se e scuras dev ido ao pouco fundo

que aparece entre suas hastes , dif icultando a

l e i tura . Os carac teres mui to a l tos e f inos

também são pre jud icados , só que pe lo

excesso de fundo ;

9 0

or ientação: quanto mais obl íquos os

carac teres , menor a sua l eg ib il idade , o que

ta lvez se ja devido à nossa maior exper iência

com os caracteres or ientados vert ica lmente ;

harmonia : uma compos ição deve pr imar

por um es t i lo ún ico . Não é aconse lháve l

mis turar mui tos es t i los de fontes .

Brady (1988 ; p . 6 ) c i t a out ros f a tores

re l ac ionados com a l eg ib i l idade dos

ca rac te res . “Nós e s t amos cond ic ionados a

ler mais fac i lmente le t ras minúsculas com

t r aços moderadamente g rossos e f inos e

com ser i fas” . [ . . . ] Pa lavras em le t ras

maiúsculas , t ipos gót icos, t ipos sem ser ifa , e

t ex tos em it á l i co t endem a se r menos

l eg íve i s” . Os es tudos a t r ibuem às ser i fas a

capac idade de gu ia r o o lho de uma l e t ra à

9 1

segu inte . Mas , por out ro l ado , t ambém

concluem que as le t ras sem ser i fas são mais

f áce i s de l e r t an to em tamanhos mui to

g randes quanto mui to pequenos”. É dif íc i l

e laborar qualquer regra r íg ida e ina l teráve l ,

porque a leg ib i l idade é afetada não somente

pe lo es t i lo da fonte , mas por inúmeros

fa tores , inc lus ive , a qua l idade do pape l e a

resolução do monitor . Brady (1988) ressa l ta

que , quando combinados , t ipos d iversos

devem rea lmente parecer d i fe rentes . “Se

duas fontes são tão s imi la res que o l e i tor

não pode d i s t ingu i - las , por que usar duas

fontes?” (Brady , 1988) . Para s impl i f i car

procure combinar fontes se r i f adas com

fontes sem ser i fas . Até por que , quando se

dese j a uma fonte que chame à a tenção , o

me lhor não é esco lher fontes mui to

e laboradas .

9 2

As fontes t ipo fantas ia , s egundo o au tor ,

são de d i f íc i l l e i tura e gera lmente as

pa l avras não podem se r e sc r i t a s todas em

maiúscu las . Para dar ênfase à deter minada

fonte , o método ma i s comum é o seu uso

em tamanho grande . Mas o tamanho não é o

ún ico modo de cr i a r ênfase e nem sempre o

ma is corre to . Deve-se cons idera r o uso da

cor , das formas i t á l i co e negr i to , de

minúscu las ou maiúscu las , do espaçamento

en t re l e t ras , da pos ição na compos ição e ,

inc lus ive , do espaço em branco à sua vo l ta .

O cont ra s t e , en f im , é o f a to r-chave para que

de te rminado e l emento t ipográ f i co t enha

ênfase . Em uma pág ina , uma l inha que es tá

em minúscu las , sa l ta rá aos o lhos se as

dema i s e s t iverem em maiúsculas . Uma fonte

comum des t aca -se entre outras em i tá l i co .

Até mesmo um azu l ac inzentado ofusca um

9 3

vermelho br i lhante se for ún ico . Quanto ao

cará te r das fontes , Brady (1988) a f i rma que

e le é def in ido pe lo desenho das l e t ras e

refere- se à p ersonal idade ou humor que e las

pro je tam. Por i s so , é fundamenta l , em

te rmos de pub l i c idade , saber que imagem o

c l i ente quer pro je ta r de seu produto ou

serv iço e quem é o públ ico que deve ser

a t ing ido (ve lhos , jovens , execut ivos , donas-

de -casa . . . ) .

Cer tos ca rac te res dão a impressão de

pos i t ivos , ponderados , rac iona is . Outros ,

pe lo cont rá r io , dão uma impressão de

r ig idez , peso . Ex is tem a inda aque les de

natureza maleável , f lu ida , f lex ível , leve ,

persuas iva , podem i r a té o ponto de evocar

a a legr ia e fr ivol id ade . Qualquer que se ja a

opção é necessár io que a famí l i a de

ca rac te res e sco lh ida para compor um tex to

9 4

não só cor re sponda à na tu reza do t ex to ,

mas a inda f avoreça a expres são do

sent imento evocado .

Segundo Brady (1988) , em algumas fontes , o

ca rac te re é f ac i lmente reconhec ido ,

ent re tanto , pode ser mui to sut i l em outras .

I s so depende mui to da sua u t i l i zação na

compos i ção e , t ambém de in te rpre t ações

ind iv idua i s . A adequação do es t i lo à

mensagem, porém, não prec isa ser levada ao

ex t remo. Qua l idades como ant igü idade e

t r ad i ção não são neces sa r i amente bem

represen tadas por um tex to em romano

ant igo . Nem é essenc ia l usar fontes sem

ser i fas em negr i to porque o texto se refere à

maqu inar i a . Ass im como não há regra que

d iga que devam ser usadas fontes f lo r idas

pa ra pe rfumes. “Um exemplo clássico de um

bem-suced ido uso t ipográ f i co do que

9 5

parecer ia um t ipo não apropr iado é o rótu lo

do Chane l nº5 : com sua fonte sem ser i f a

t em s ido a marca da e l egânc ia há c inqüenta

anos” (Hur lbur t , 1986 ; p .107) .

Ma i s impor tan te é , por t an to , um conce i to

g loba l de d e s i g n que desper te o in te resse e

sug i r a o va lor do produto de um modo

cr ia t ivo e or ig ina l . Deve-se ob je t iva r a

p ro j eção de uma “ imagem cons i s t en te” da

companh ia ou do p roduto a t r avés de cada

e lemento gráf ico que a t inge o públ ico .

Ass im , todo d e s i g n deve se r gu iado pe la

mesma f i losof i a , en tão cada novo i t em

re força as mensagens anter iores .

Pela própr ia natureza e d iponib i l idade

t ecno lóg ica dos moni tores ex i s t en tes , a s

fontes são gera lmente menos leg íve is nesses

ve ículos do que quando impressas . Por i sso

9 6

va le segu i r ou cr i a r recomendações

espec í f i cas para uso em pág inas WEB que

se rão ex ib idas nas t e l a s de TV e

computador .

Esquema de Fontes

Recomendações

1 . Recomenda -se o uso de fon tes com

ser i f a . Es tudos most ram um pequeno

aumento de l eg ib i l idade quando são

ut i l i zados fontes com ser i fa .

2 . L imi te o número de fontes e es t i los

em uma mesma pág ina . (Rober t son ,

1993 ) .

Use o máx imo de duas fon tes (por

exemplo, Aria l e Time s New Roman ) ,

duas inc l inações ( romano e i t á l i co) ,

9 7

dois pesos ( regula r e negrito), e quatro

tamanhos ( t í tu lo pr inc ipa l , subt í tu lo ,

tex to e nota de rodapé) (Marcus , 1992

Mul le t e Sano, 1995) .

3 . Não é r ecomendado o uso de fon te s

mui to g randes (Nie l sen , 1996) . O uso

de fontes mui to grandes dá ao usuár io

a impressão de que o t ex to e s t á

“gr i t ando” com e le . Para ev i t a r e sse

e fe i to r ecomenda-se usa r fontes com

ca ixas a l t a e ba ixa .

Fontes com ca ixas a l t a e ba ixa usadas

juntas são mais l eg íve i s e

compreens íve i s . (Guimarães , 1997) .

4 . Recomenda -se que a se l eção da fonte

se j a f e i t a de acordo com o t ipo de

documento a se r executado (Marcus ,

1992 ) .

9 8

Tipos com ser i fa são mais

apropr iados para documentos

formais . Para l i tera tura em gera l ,

podem ser u t i l i zados os t ipos sem

ser i fa , He l v é t i c a ou Aria l .

5 . Use , sempre , o s i s tema-padrão de

fon te s pa ra e l ementos comuns do

s i t e (Windows , 1995 ) .

O uso de um s i s t ema padrão to rna a

in te r f ace ma i s cons i s t en te , ge rando

uma padronização .

6 . De pre fe rênc ia , use o con junto de

fon te s -padrão do seu b r ow s e r e ajuste a

fonte da sua página de acordo com ele .

I s so ev i t a que sua pág ina na Web

apresente prob lemas cada vez que o

usuár io a l terar o b r ow s e r .

9 9

7 . Em te rmina i s de v ídeo de ba ixa

reso lução , recomenda-se o uso de

fontes sem ser i fa e com est i lo regular .

Nesse caso , o uso da se r i f a deve se r

ev i t ado , po i s e l a pode não se r

v isua l izada .

8 . Recomenda -se de ixar um espaço antes

e depo i s da pa l avra para aumenta r a

v i s ib i l idade do v ídeo reverso .

(Rober t son , 1993) . Ta l p roced imento

aumenta a v i s ib i l idade da pa lavra .

9 . Recomenda -se o uso do i t á l i co para

a t ra i r a a tenção do usuár io . O uso do

i tá l ico desperta a a tenção do usuár io e

não causa quebras s ign i f i ca t ivas no

r i tmo de l e i tura , mas deve se r usado

somente para t ex tos cur tos .

10 . Ev i te o uso de carac te res br i lhando e

p i scando . E les d i s t raem e competem

pe la a tenção do usuár io . O usuár io

1 0 0

prec i sa de paz para a l e r as

in formações .

Observações

a) As fontes podem se r usadas pa ra

rea lça r uma pág ina na Web d a mesma

mane i r a que a cor (Rober t son , 1993) .

b) Os le i tores preferem a fonte a qua l

e l e s es tão ma is acos tumados a l e r

(Marcus , 1992) .

c ) As fon tes com ser i f a são ma i s

apropr i adas para documentos forma i s

(Marcus , 1992) .

d) Uma organ ização c la ra e regu lar de

t ipogra f i a na pág ina aumenta a

leg ib i l idade e a le i turabi l idade

(Marcus , 1992) .

1 0 1

e ) De preferênc ia , use ca ixa ba ixa ou

ca ixa mis t a ( ca ixa a l t a e ba ixa ) do que

ca ixa a l t a (Marcus , 1992) .

f) Usar mui t a s fontes norma lmente

resu l ta em polu ição v isua l (Marcus ,

1992 ) .

g) Fontes de d i fe rentes famí l i a s (por

exemplo , T imes New Roman e Ar ia l )

de um mesmo es t i lo ( com ou sem

se r i f a ) não devem se r mis turadas em

nenhuma c i rcunstância (Mullet e Sano,

1995 ) .

1 0 2

Texto

O tex to é o r e su l t ado do ag rupamento de

l e t ras de modo a formar pa lavras . Esse

agrupamento pode ser fe i to por meio de um

arran jo s imétr ico ou ass imétr ico .

Considerações

O uso de t amanhos e t ipos de fon te s

coerentes n o texto a judam na compreensão

e aprec i ação de uma pág ina na Web pe lo

le i tor , ou se ja , na leg ib i l idade e na

l e i turab i l idade dessa pág ina .

1 0 3

Recomendações

Recomenda -se que os tex tos se jam escr i tos

em uma fonte proporc iona l . Le t ras com

larguras var iáve i s consomem menos espaço

e c r i am um tex to ma i s f ac i lmente l ido do

que um tex to e sc r i to em uma fonte com

largura f ixa . (Marcus , 1992) .

Recomenda -se , a inda , o uso de ca ixa -a l ta e

ba ixa . Um tex to em ca ixas a l t a e ba ixa é

mais leg íve l do que um texto todo em ca ixa-

a lt a porque poss ib i l i t a a ident i f i cação da

forma, especia lmente da metade super ior da

pa lavra .

Não se deve usar o sub l inhado para rea lçar

o tex to . O uso do sub l inhado em um b loco

cont ínuo de tex to pode d i f i cu l ta r a l e i tura

1 0 4

da l inha super ior , a lém de confun di r o

usuár io.

Recomenda -se ev i t a r o uso do sub l inhado

para enfa t izar t í tu los . Reserve o uso do

sub l inhado para l i nks , que é o padrão

ado t ado na Web .

Ev i te o a l inhamento à d i re i t a . O

a l inhamento do texto à d i re i t a é pre jud ic ia l

à compreensão pe los l e i tores inexperientes .

Ev i te o uso de h í fen . O uso de h í fen reduz

a ve loc idade de l e i tura tanto para l e i tores

exper ientes quanto para l e i tores

inexper ientes .

Observações

1 . I t á l i co é ú t i l para a t ra i r a a tenção do

usuár io sem causar quebras severas no

r i tmo de l e i tu ra (Rober t son , 1993) .

1 0 5

2 . L inhas cur tas fac i l i t am a le i tura , po is

e l a s reduzem o movimento excess ivo

dos o lhos (Rober t son , 1993 ) .

3 . Letras leg íve is têm normalmente 10 ou

12 pontos de tamanho para moni tores

com reso lução de 800 por 600 pontos

por po legada (dp i ) .

4 . O compr imento ó t imo de uma l inha

para tex tos l eg íve i s é de 10 a 12

pa lavras ou de 40 a 60 carac te res por

l inha .

5 . Uma organ ização c la ra e regu lar de

fon te s na pág ina aumenta a

l eg ib i l idade e l e i turab i l idade do texto

(Marcus , 1992) .

6 . É poss íve l fazer tex tos com a r ran jos

s imét r i cos e ass imét r i cos , mas não se

devem misturar ta is arranjos dentro de

uma pág ina na Web .

1 0 6

7 . Cons idere sempre as l imi tações de

sof twares . Por exemplo , a versão

HTML 3 .2 não permi te o a l inhamento

à d i re i t a .

1 0 7

Ícones

Ícones , índ ices e s ímbolos são

f reqüentemente u t i l i zados em in ter faces

com o usuár io . Esses e lementos

proporc ionam um gu ia func iona l e es té t i co

para in ter faces gráf icas , por exemplo , uma

homepa g e que ut i l i za centenas de ícones

d i ferentes . Esses e lementos p ic tográf icos e

i deográf icos funcionam como um sistema de

s ignos . Est r i t amente fa lando, o que

chamamos í cones são uma mis tura de

ícones , índices e s ímbolos .

A noção de s i gno , s egundo Rabaça e

Barbosa (1987) , é bás i ca e e s senc ia l em

qua lquer c iênc ia re lac ionada com a

comunicação, em que se inc lu i a

comun icação não-verbal , e por i sso está em

1 0 8

cons t an te ap ro fundamento e

ques t ionamento .

De acordo com Eco (1990) , o s igno é usado

para t r ansmi t i r uma in formação .

Ele insere- se num processo de comunicação

do t ipo fon te -emis sor-c ana l-mensagem-

des t ina tá r io .

Uma mensagem pode ser (e quase sempre é)

a organ ização complexa de mui tos s ignos .

Mas o s igno não está inser ido apenas em um

processo de comunicação ; e l e en t ra num

processo de s ign i f i cação .

Saussure , antecipando e determinando t odas

as def in ições pos ter iores , def in iu s igno

como uma ent idade de dup la f ace , uma

re lação entre s ign i f icante e s ign i f icado com

base em um s i s tema de regras .

1 0 9

Sau s su r e j ama i s d e f i n i u c l a r amen t e o s i g n i f i c ado , d e ixando - o a me io caminho en t r e uma imag em men t a l , um c on c e i t o e uma r e a l i dad e p s i c o l ó g i c a não c i r c un s c r i t a d i v e r s amen t e ; em c omp en s a ç ã o , s ub l i nh ou e n e r g i c amen t e o f a t o d e o s i g n i f i c a d o ser a lgo r e la c i onado à a t i v idade menta l do s ind iv íduos no s e i o da s o c i e dad e (Ec o , 1976 , p .0 ) .

Nesse ponto , é ma i s compreens íve l a

def in ição dada por P ie rce segundo a qua l

s igno é “ tudo aqu i lo que , sob cer tos

a spec tos e em a lguma med ida , subs t i tu i

a lguma out ra co i sa , r epresentando-a pa ra

a lguém” Para e le , a re lação de s ign i f icação

envolve t rês su je i tos : um s igno, o seu objeto

e o seu interpretante ; jamais uma ação entre

duplas .

Outro d i fe renc ia l quanto à teor ia

saussur iana é que não requer , como

cond ição necessá r i a pa ra a de f in i ção do

s igno , que es te se j a emi t ido

1 1 0

in tenc iona lmente e produz ido

a r t i f i c i a lmente , como propunha Saussure

(Eco, 1976) .

O mesmo conce i to é ass im apresentado por

Coe lho Net to (1990 , p . 56 ) :

Um s i g n o ( ou r e p r e s e n t amen ) , p a r a P i e r c e , é aqu i l o qu e , s o b c e r t o a s p e c t o , r e p r e s e n t a a l guma c o i s a pa ra a l gu ém . Di r i g i ndo - s e a e s s a p e s s o a , e s s e p r im e i r o s i g n o c r i a r á na m en t e ( o u s em i o s e ) d e s s a p e s s o a um s i g n o equ i va l en t e a s i me smo ou , e v en tua lmen t e , um s i g n o ma i s d e s e n v o l v i d o . Es t e s e g undo s i g n o c r i a d o na men t e d o r e c e p t o r r e c e b e a d e s i g n a ç ã o d e i n t e r p r e t a n t e ( qu e n ã o é o i n t é r p r e t e ) , e a c o i s a r e p r e s e n t a d a é c o nh e c i d a p e l a d e s i g na ç ã o d e o b j e t o .

É fa to que fa tores pessoa i s l imi tam o

número de ob je tos que podem se r

pe rceb idos em de te rminado momento .

Sens ib i l i zam os mecan i smos de percepção

do ind iv íduo , f azendo com que es te dê

maior ou menor importânc ia a um o bjeto ou

1 1 1

a aspectos deste . Podem, então, deformar as

cogn ições desses ob je tos . É a chamada

deformação se l e t iva – ou , como propõe

Meyrs e Reyno lds (1972) , d i sc r iminação

percept iva em que emoções e dese jos fazem

com que o ind iv íduo se lec ione apenas

a lguns aspec tos do ob j e to -est ímulo,

desenvo lvendo , é impor tante que se d iga ,

inconscientemente, uma cognição distorc ida

da verdade i r a .

Gombrich (c i tado por Arnheim, 1995; p . 43)

d iz : “Quanto ma ior for a impor tânc i a

b io lóg ica que um objeto tem para nós , mais

e s t a remos ap tos a r econhecê - lo – e ma i s

to l e ran te se rá , por t an to nosso padrão de

correspondência formal” . Poster iormente , o

própr io autor exempl i f i ca : “um homem que

espera sua namorada numa esqu ina vê - la -á

em quase todas as mulheres que se

1 1 2

aprox imam, e es ta t i r a n i a do t r aço da

memór i a to rna r- se -á ma i s fo r t e à med ida

que os minutos passam” (Arnheim, 1995; p .

43 ) .

A c iênc ia que es tuda as re l ações dos s ignos

– cód igos e mensagens – e en t re s i gno e

d i scurso , é a Semiót ica , que se const i tu i

uma par te da Ps ico log ia soc ia l . Semiolog ia

fo i o te rmo cr i ado pe lo su íço Ferd inand

Saussure para ind icar a c iênc ia gera l dos

s ignos .

Pos te r io rmente , o f r ancês Ro land Bar thes

inverte essa def in ição , entendendo todos os

s i s temas de s ignos como repor táve i s às l e i s

da l inguagem. Af i rmava , en tão , que a

L ingü í s t i ca não e ra uma par te , mesmo que

pr iv i l eg iada , da c iênc ia gera l dos s ignos . A

Semiologia é que era parte da Lingüíst ica . A

1 1 3

gramát ica pura de te rminar i a o que deve se r

ve rdade i ro quanto ao s igno para que es te

possa ve icu lar um s ig n i f i cado ; o r amo da

lóg ica que es tudar ia o que é verdade i ro em

re l ação ao s igno para que possa ap l i ca r- se a

um obje to . E a re tór ica pura te r i a por

objet ivo estudar as le is pelas quais um s igno

dá origem a outro e um pensamento provoca

out ro (Coe lho Net to , 1990) .

Outra div isão da Semiót ica foi proposta por

Morr is e foi acolhida no domínio c ient í f ico.

Também é uma c l ass i f i cação segundo t rês

aspectos : s in tá t i co , que procura as re lações

dos s i gnos en t re s i , i ndependentemente do

que des ignam ou ident i f i cam; semânt ico ,

que l eva em cons ideração os s ignos em

re l ação com os ob je tos des ignados ; e

pragmát ico, os s ignos em re lação com quem

os ut i l iza .

1 1 4

A este t rabalho interessa a compreensão

da Semiót ica como um todo e por i sso

vamos avançar es tudando os t rês n íve is

pr inc ipa i s de c lass i f i cação para os s ignos ,

chamados t r i co tomias : em re l ação a s i

mesmos , em re lação ao ob je to e em re lação

ao in te rpre tan te .

A segunda t r i co tomia é a ma i s conhec ida e

importante . É a que mais se u t i l i za no

es tudo da comunicação , pr inc ipa lmente

comunicação visual . As demais serão c i tadas

v i sando , apenas , uma compreensão do

con junto da t eor i a p i e rc i ana expos ta .

Embora a s t r i co tomias t enham uma ordem

de te rminada , de ixa remos para ana l i s a r por

ú l t imo essa segunda t r i co tomia que

cons ide ramos vá l ida .

1 1 5

A pr imei ra t r i cotomia d iz respe i to ao s igno

cons iderado em s i mesmo. São espéc ies de

s ignos segundo es ta c l a s s i f i cação :

a) qua l i ss igno: uma qua l idade que é um

s igno. Por exemplo , uma cor ;

b) s ins igno : uma co i sa ex i s t en te , um

acontec imento rea l . Por exemplo, um

ca t a -ven to . Como só pode se

man i fes ta r por me io de suas

qua l idades , envolve um ou vár ios

qua l i ss ignos ;

c ) l eg i s s igno : não é uma co i sa ou evento

s ingu la r , de te rminada , mas uma

convenção ou le i es tabe lec ida pe los

homens . Por exemplo, as pa lavras .

Todo leg iss igno requer s ins ignos .

1 1 6

A te rce i r a t r i co tomia cons idera o s i gno em

re lação ao in terpre tante , ou se ja , re l ações

p ragmát i ca s de s i gno :

a) r ema : para o seu in te rpre tante ,

func iona como um s igno de uma

poss ib i l idade que pode ou não se

ver i f icar . Por exemplo, uma pa lavra

i so l ada , como “verme lho” .

b) d i c i s s i gno ou d icente : é um s igno de

uma exis tência rea l . Corresponde a um

enunc iado e envolve remas . Por

exemplo , “es te verme lho es tá

manchado” .

c ) a rgumento : é um s igno de razão , um

s igno de le i . Envolve a essência de um

ju ízo. Por exemplo, um s i log ismo do

t ipo “A é B , B é C , por tanto , A é C”

1 1 7

(Coe lho Net to , 1990 ; Rabaça e

Ba rbosa , 1987 ) .

A segunda t r i co tomia d iz r e spe i to à s

re l ações ent re o s igno e o seu ob je to e

d iv ide os s ignos em ícones , índ ices e

s ímbolos.

a) í cone : quando possu i a lguma

semelhança ou ana log ia com o seu

referente (o obje to representado) . Um

s igno é i côn ico na med ida em que

possui a propr iedade do seu denotado.

Por exemplo , uma fotograf ia , uma

estátua, um desenho e , sobretudo, uma

imagem menta l;

b) índ ice , índex ou ind icador : quando se

re fe re ao ob je to em v i r tude de se r

d i re tamente a fe tado por e l e . É um

1 1 8

s igno que tem uma conexão f í s ica com

o obje to que ind ica . Por exemplo , um

dedo apontado para um objeto, fumaça

que é ind íc io de fogo , um campo

mo lhado é ind icação de que choveu .

Ass im como também são índ ices os

pronomes demons t ra t ivos , a s

impressões dig i ta is , os nomes próprios

e comuns na med ida em que são

usados para ind ica r um ob je to ;

c ) s ímbolo : quando a re l ação com o

referente é arb i t rár ia , um a a s soc i ação

de idé i a s produz ida por uma

convenção . É marcado pe la

arb i t rar iedade . Por exemplo, qua lquer

das pa lavras de uma l íngua , a c ruz , a

suás t i ca , a s bande i ras , os s ina i s de

trânsi to (Coelho Netto, 1990; Rabaça e

Ba rbosa , 1987 ) .

1 1 9

Para ser entendido , o símbolo não exige que

seu receptor conheça o ob je to a que se

re fere (o que ocorre com o índ ice – s e não

conheço o fogo não podere i s aber o que a

fumaça ind ica ) . É , por tanto , um meio de

conhecer co i sas novas .

Também, ao cont rá r io do í cone , o

conhec imento do s ímbolo não impl ica o

conhec imento da co i s a r epresen tada como

e la é . I sso porque e le não tem l igações com

a co i sa s i gn i f i cada , independe des ta , o que

faz com que não se ja e fêmero .

Na rea l idade, d i f ic i lmente se pode constatar

a ocor rênc i a de um desses t r ê s t ipos de

s i gno em es tado puro . Freqüentemente um

ícone é t ambém um índ ice , a s s im como um

índice pode ser s imból ico. “Cada s igno pode

1 2 0

se r a s sumido como um índ ice e como um

ícone ou como um s ímbolo , segundo as

c i rcuns tânc ias em que aparece e o uso

s ign i f i ca t ivo a que se des t ina” (Eco , 1990) .

EXEMPLOS DE ÍCONES

Podemos ver nas f iguras a segu i r a lguns

exemplos de índices , ícones e s ímbolos . A

t í tu lo de exerc íc io , procure re lac ionar cada

imagem com a sua ca t egor i a “ t r i co tômica”

desc r i t a no i t em se te des t a obra .

F ig . 1 Ícones exce lentes de ap l i cações

comuns

1 2 1

F ig . 2 Ícones mui to bons de ap l i cações

comuns

F ig . 3 His tograma dos í cones ma i s usados

no Windows

Vale lembrar que as t rês t r icotomias , que

podem ser combinadas em inúmeras c lasses

de s i gnos ( leg i ss igno indic ia l remát ico ,

1 2 2

s ins igno d icente . . . ) , foram reun idas por

P ie rce em t rês ca tegor i a s cor respondentes ,

chamadas pr ime i r idade , s ecund idade e

te rce i r idade .

A pr imeir idade refere- se ao n íve l do

sens íve l , do qua l i ta t ivo . Abrange o ícone , o

qual iss i gno e o rema .

A secundidade diz respe i to ao n íve l da

experiência , da coisa ou do evento. Incluem-

se a í o índ ice , o s ins igno e o d ic i s s igno .

E , por f im, a te rce i r idade refere- se à

mente , ao pensamento, à razão. É o caso do

s ímbolo , do leg i ss igno e do argumento .

Depo i s de compreend idas todas e s sa s

c lass i f i cações , chega-se a um outro conceito

de s i gno desenvo lv ido pos te r io rmente por

P ierce . Um conce i to mais complexo, porém

1 2 3

mais amplo . Ne le , o s igno é apresentado

como um Primeiro (nível do sensível ) que se

co loca numa re l ação t r i ád ica com um

Segundo , seu ob je to (n íve l do evento) , de

modo a se r capaz de de te rminar que um

Terce i ro , seu interpretante (n íve l da razão) ,

a s suma a mesma re l ação t r i ád ica com seu

ob je to na qua l e le própr io es tá em re lação

com o mesmo ob je to . Essa propos ta de

P ie rce surge como res tabe lecedora do

t r i ângulo semiót ico em sua tota l idade , indo

ao encont ro de a lguns pensadores que

cons ide ravam impor tan te apenas o l ado

esquerdo do t r iângulo , exc lu índo o n íve l do

ob je to . Outra conc lusão que se pode t i r a r

dessa segunda pos ição de P ie rce é que um

s igno é uma re l ação t r i ád ica comple ta e

o rdenada , por t an to , nem tudo pode se r

s igno . “O s igno não é um dos e lementos do

t r i ângu lo , uma de suas pontas , um dos

1 2 4

membros da re l ação . O s igno é a reun ião

da s três pontas , a re lação toda e completa , a

to ta l i zação dos t rês vér t i ces do t r i ângu lo”

(Coe lho Net to , 1990 ; P . 66) .

Todos esses concei tos levam-nos a

concluir que é grande a importância dos

s ímbolos , ícones e índices para a

comunicação v isual , especia lmente na

WEB.

Considerações

Nenhum grupo de r eg ra s ou normas pode

garant i r que um ícone se j a per fe i t amente

pro je t ado , mas a s obse rvações e

r ecomendações c i t adas aqu i podem a judar

nes t a t a r e f a . Í cones s ão usados por toda a

Web para representar obje tos ou tarefas. Em

função de os í cones representa rem os

1 2 5

ob je tos de uma pág ina na Web , é importante

va lor izar aque les que efe t ivamente

comuniquem as suas propostas .

Recomendações

1 . Recomenda -se pro je ta r os í cones

c r i ando esboços ráp idos . Uma vez que

o con teúdo s emânt i co t enha s ido

organ izado , c r i e vár ios esboços que

va r i em da abs t ração lóg i ca à imagem

concre ta . Ind ique todos os e l ementos

v i sua i s , seu tamanho e sua loca l ização

aprox imada .

É impor tante não se r mui to prec i so ou

de ta lh i s t a no in íc io do pro je to ; o ma i s

im por tan te é exp lora r todas a s va r i ações

poss íve is . Ava l ie se os ícones vão ao

encont ro das neces s idades do emis sor , do

receptor e do meio em que e le será usado.

1 2 6

2 . Comece iden t i f i c ando a p ropos ta do

ícone e o seu uso . (Windows , 1995) .

Uma boa suges t ão é f azer um b ra i n s t o rm in g

sobre poss íve i s idé ias . Reconhecemos que

freqüentemente é d i f íc i l projetar ícones que

def inam operações ou processos , ou se j a ,

a t i v idades que dependam dos ve rbos ; por

i s so , recomenda-se o uso de subs tant ivos .

3 . Recomenda -se o uso de metá foras do

mundo rea l . I sso fac i l i t a o

reconhec imento , ident i f i cação e

a s soc i ação do í cone por pa r te do

usuár io que pode usar a exper iênc ia e

aprend izado prév io para in te rpre ta r o

ícone.

4 . Class i f ique os ícones por est i los . Os

es t i los devem ser es tabe lec idos de

modo que todos os í cones se j am

1 2 7

ag rupados por uma abordagem

cons i s tente ou pe la sua aparênc ia .

5 . Recomenda -se que se j a pro je tado um

gr id para organizar todos os e lementos

que compõem o í cone . O uso do grid é

impor tan te para e s t abe lece r padrões

de l inhas hor izonta i s , ver t ica i s e

obl íquas a lém de um número l imi tado

de t amanhos pa ra os ob je tos que

compõem o í cone .

6 . Use ob je tos grandes , l inhas grossas e

áreas s imples para d is t inguir os ícones

(Marcus, 1992). Uma vez selecionado o

es t i lo da apresentação , cont in ue a usar

a mesma abordagem den t ro de todo o

conjunto de ícones . Evi te que os

e lementos mais s ignif icat ivos do ícone

se jam muito pequenos em comparação

com o seu t amanho to ta l (Marcus ,

1992 )

1 2 8

7 . Recomenda -se que o í cone tenha uma

aparênc ia s impl i f icada . Um íc one

compos to de mu i t a s pa r t e s pode

confundi r o usuár io . As d i ferenças

v i sua i s devem ser s ign i f i ca t ivas sob o

ponto de v i s t a da comun icação . Não

devemos ad ic ionar e l ementos

decorat ivos sem necess idade, pois i sso

aumenta o t empo de p roces samento

pa ra a mente humana e c r i a a

poss ib i l idade de e r ros de

in terpretação .

8 . Ava l ie os pro je tos de ícones

mos t r ando-os para usuários potenciais.

Quando os p ro tó t ipos e s t i ve rem

disponíveis , e les devem ser revisados e

tes tados por usuár ios t íp icos . As

ava l i ações que podem afe t a r todos os

a spec tos do pro j e to do í cone devem

ser repet idas .

1 2 9

9 . Recomenda -se t e r p recaução com o

uso do an t i- a l i a s i n g . A técnica chamada

an t i- a l i a s i n g envolve a adição de pontos

co lor idos para suav izar as

ex t r emidades pont i agudas de uma

f igura gráf ica . Entre tanto , não use

an t i- a l i a s i n g sobre o l ado de fora da

ex t remidade de um ícone , po i s os

pontos con t r a s t an te s podem pa rece r

irregulares ou dentados quando houver

uma var i ação do fundo.

10 . Use um es t i lo comum para todos os

í cones . Repi ta as carac ter í s t i cas

comuns como o uso da mesma fon te

de luz (canto super ior esquerdo) e

ev i t e os contornos em pre to ; e l e s

aumentam a polu ição v isua l .

11 . Recomenda -se que se comece a

pro je ta r os í cones em pre to e branco .

Cons idere a cor como uma

1 3 0

propr iedade ad ic iona l . Também tes te

as imagens em d i ferentes fundos , po is

o usuár io pode mudar o padrão de

fundo do seu b r ow s e r .

12 . Recomenda -se o uso de cor com

discr ição. Para a cr iação de um ícone é

suf i c i en te o uso de c inco cores ou a té

menos , inc lu indo o pre to , o branco

e/ou o c inza . Mui t a va r i ação de cores

d i s t ra i a a tenção do usuár io .

13 . Recomenda -se o uso da pa l e t a de 256

cores . I s to permi te í cones com

aparênc ia mui to rea l í s t i ca e faz com

que eles possam ser corretamente l idos

em monitores conf igurados para exibir

256 cores ou mais .

14 . F ina lmente , l embre de cons iderar o

potencia l cu l tura l do impacto dos seus

í cones . O que pode ter um cer to

s ign i f icado em uma pa í s ou cu l tura

1 3 1

pode te r s i gn i f i cados imprev i s tos em

outro . É melhor ev i tar le t ras ou

palavras , se possível , pois podem fazer

com que o s desenhos se jam dif íce is de

apl icar em outras cul turas .

Observações

1 . Os ícones e s ímbolos podem subst i tuir a

l inguagem escr i t a e contr ibu i r para que

a s pág inas na Web tenham compreensão

in ternac iona l .

2 . Os espaços poupados em menus , mapas

e d i ag ramas com a ut i l i zação de ícones

podem ser s i gn i f i can te .

3 . Com uma boa se leção de í cones e

s ímbolos ma i s in formações podem ser

co locadas den t ro de uma de te rminada

j ane la ou de um espaço na te l a .

1 3 2

4 . Um ícone ocupa menos espaço do que o

seu equiva lente em pa lavras .

5 . Í cones bem conceb idos ,

s i s t emat i camente p ro j e t ados e

e fe t ivamente organ izados , devem ser

f áce i s e r áp idos de reconhecer em um

contexto v i sua l compl icado .

6 . Faça do í cone um documento

reconhec íve l e representa t ivo do

conteúdo da sua pág ina .

7 . Quando pro je ta r í cones , f aça como um

con junto , cons iderando o

re l ac ionamento de uns com os out ros e

com as t a re fas dos usuár ios .

8 . Cert i f ique-se de que as esca las

( t amanho) de seus í cones se j am

consis tentes com os outros objetos com

os quais e les estão re lac ionados e que se

enca i xam bem den t ro do s i t e .

1 3 3

9 . Procure usar perspec t iva e d imensão

( luz e sombra) para melhor comunicar a

representação do mundo rea l .

10 . Recomenda -se a pro jeção de imagens ,

a s sumindo que a fonte de luz venha do

canto super ior esquerdo .

11 . Um est i lo i lus t ra t ivo tende a comunicar

conceitos metafóricos mais efet ivamente

que s ímbolos abst ra tos .

12 . A g rande vantagem que os í cones t êm

sobre as pa lavras é que e les podem ser

a legres , inte l igentes e ter ape lo v isua l .

13 . O reconhec imento e a memór i a do

usuár io são do i s f a tores impor tan tes

pa ra se r cons ide rado no pro je to de

ícones.

1 3 4

como utilizar esta obra

Acred i t amos que são poucos os

mandamentos em d e s i g n e , a ss im, quase

todas a s r eg ra s podem e devem se r

quebradas . Recomendamos que a obra se j a

l ida in tegra lmente , caso apareçam dúv idas

e l a s podem se r encaminhadas aos au tores

por me io de mensagem env i ada aos e -mails:

fp ie ro@zaz .com.br, dp iero@zaz .com.br, ou

a inda por me io de ca r t a endereçada à Rua

Jú l ia Lacourt Penna, 325, Jardim Camburí ,

V i tór i a – ES, CEP 29090 210.

Por ú l t imo, faça exper iênc ias . Use os

exemplos apresentados , a ss i s ta às pa les t ras

do au tor e ace i t e a premissa de que gên io é

um por cen to insp i r ação e 99 por cen to

t ranspi ração .

1 3 5

Glossário

A r r a n j o s i m é t r i c o : c o m p o s i ç ã o q u e a p r e s e n t a

e l e m e n t o s s e m e l h a n t e s e m a m b a s a s m e t a d e s .

C a i x a a l t a : l e t r a s m a i ú s c u l a s .

C a i x a b a i x a : l e t r a s m i n ú s c u l a s .

Con teúdo s emânt i co : é compreend ido como sendo

o s i g n i f i c a d o d o t e r m o “ s i g n i f i c a d o ” ( M a r c u s ,

1 9 9 2 )

C o r e s c o m p l e m e n t a r e s : s ã o a s c o r e s q u e s e

e n c o n t r a m e m p o s i ç õ e s o p o s t a s n o c í r c u l o

c r o m á t i c o , p o r e x e m p l o , o v e r m e l h o e o v e r d e

( M a r c u s , 1 9 9 2 )

C o r e s m o n o c r o m á t i c a s : c o r e s p r o d u z i d a s p o r u m

ú n i c o c a n h ã o d e e l é t r o n s ( d i s p o s i t i v o e m i s s o r d e

l u z u s a d o n o s m o n i t o r e s d e v í d e o ) . A s c o r e s

po l i c romát i c a s s ão p roduz ida s por t r ê s c anhões de

e l é t r o n s d i f e r e n t e s ( R e d , G r e e n e B l u e ) .

C o r e s n e u t r a s : s ã o a s c o r e s q u e a u m e n t a m a

v i s i b i l i d a d e d a s o u t r a s c o r e s , c o m o o s v á r i o s t o n s

d e c i n z a .

C r o m a : s a t u r a ç ã o : p u r e z a d a c o r d e n t r o d a e s c a l a

d o c i n z a , a v a r i a n t e m a i s v i v a d a c o r p e r c e b i d a .

1 3 6

E s p e c t r o s o l a r : s ã o a s c h a m a d a s “ c o r e s d o a r c o -

í r i s ” e s e g u e m a o r d e m : V e r m e l h o - A l a r a n j a d o -

A m a r e l o - Ve rde - A z u l - A n i l - V i o l e t a

Fad i g a v i sua l : c an s aço v i sua l c au s ado pe lo número

e x c e s s i v o d e e l e m e n t o s v i s u a i s o u c o r e s e m u m a

ú n i c a p á g i n a .

F o n t e c o m l a r g u r a v a r i á v e l : f o n t e s q u e p o s s u e m

l a r g u r a s d i f e r e n t e s p a r a l e t r a s q u e a p r e s e n t a m

l a r g u r a s d i f e r e n t e s , p o r e x e m p l o o “ e ” e o “ i ” .

Fon t e : con jun to da s l e t r a s do a l f abe to , números e

s i n a i s d e s e n h a d a s d e u m m o d o c a r a c t e r í s t i c o .

F ó v e a : á r e a c e n t r a l d e f o c o d o o l h o h u m a n o

( M a r c u s , 1 9 9 2 )

G r i d : u m a g r a d e c o m p o s t a d e l i n h a s v e r t i c a i s e

h o r i z o n t a i s .

Í c o n e : a l g u m a c o i s a q u e s e p a r e c e c o m o s e u

s i g n i f i c a d o . E l e é r e p r e s e n t a t i v o e d e f á c i l

compreen s ão . Ex . : Um t r a ço de t i n t a s i gn i f i c ando

u m a l i n h a g e o m é t r i c a e m u m a i l u s t r a ç ã o n o l i v r o

t e x to .

Í n d i c e : u m s i n a l q u e f o i “ c a u s a d o ” p o r a l g o o u

p o r u m p r o c e s s o a o q u a l e l e s e r e f e r e . E x . : U m

r a s t r o d e l a m a n o s d e g r a u s é u m í n d i c e d e q u e

a l g u é m e n t r o u h á p o u c o ( M a r c u s , 1 9 9 2 )

1 3 7

L a y o u t O r g a n i z a ç ã o e s p a c i a l : d i a g r a m a ç ã o d e

e l e m e n t o s v i s u a i s q u e c o m p õ e m u m a p á g i n a n a

Web .

Leg ib i l i d ade : d i z r e spe i to à hab i l i d ade do l e i to r de

e n c o n t r a r , i d e n t i f i c a r , d i s c r i m i n a r e a b s o r v e r o

t e x t o c o m s u c e s s o .

L e i t u r a b i l i d a d e : d i z r e s p e i t o à f a c i l i d a d e d e

i n t e r p r e t a ç ã o e a p e l o d o t e x t o .

L u m i n â n c i a = b r i l h o = v a l o r : q u a n t i d a d e r e l a t i v a

d e c l a r o o u e s c u r o e m u m a e s c a l a d o p r e t o a o

b r a n c o ( t a m b é m c h a m a d o d e i n t e n s i d a d e ) .

M a t i z = t o m ( C o r ) : c o m p o s i ç ã o d o c o m p r i m e n t o

d e o n d a e s p e c t r a l d a c o r q u e p r o d u z a p e r c e p ç ã o

de s e r a zu l , l a r an j a , ma r rom e ou t r a s . É a v a r i a ç ão

q u a l i t a t i v a d a c o r .

M e m ó r i a d e c u r t a d u r a ç ã o : t a m b é m c h a m a d a d e

m e m ó r i a d e t r a b a l h o , d u r a c e r c a d e 2 0 s e g u n d o s ,

e é c a p a z d e a r m a z e n a r c i n c o p a l a v r a s o u f o r m a s ,

s e i s l e t r a s , s e t e c o r e s e o i t o d í g i t o s .

P e s o : q u a n t i d a d e d e m a s s a d e u m a f o n t e , p o r

e x e m p l o , u m a f o n t e c o m e s t i l o b o l d é p e s a d a .

P o l u i ç ã o v i s u a l : e f e i t o c a u s a d o p e l o u s o d e u m

n ú m e r o e x c e s s i v o d e e l e m e n t o s v i s u a i s e m u m a

ú n i c a p á g i n a n a Web .

1 3 8

P o n t o : u n i d a de d e m e d i d a d a l e t r a . U m p o n t o

e q u i v a l e a 0 , 3 2 5 m m .

P ro j e to V i sua l : o r gan i z ação e spac i a l , d i a g r amação

d e e l e m e n t o s v i s u a i s q u e f a z e m p a r t e d e u m s i t e

comp l e to .

S e r i f a : t r a ç o s q u e f a z e m o a c a b a m e n t o d e u m a

l e t r a ( S c h r i v e r , 1 9 9 7 )

S í m b o l o : u m s i n a l q u e p o d e s e r c o m p l e t a m e n t e

a r b i t r á r i o n a s u a a p a r ê n c i a . E x . : U m a b a n d e i r a

p a r a r e p r e s e n t a r u m p a í s .

1 3 9

Referências

bibliográficas

ARNHEIM, Rudol f . Ar te e Percepção

Visua l : Uma Ps ico log ia da

VisãoCr iadora . 9a ed . São Pau lo :

P ione i ra , 1995

BRADY, Phi l ip . Using TypeRight .

C inc inna t i : Nor th L ight Books , 1988 .

COELHO NETTO, J . Teixe ira . Semiót ica ,

In formação e Comunicação . 3a ed . São

Paulo : Perspect iva , 1990 . (Sér ie

Deba t e s )

COLLARO, Antonio Celso . Projeto Gráfico:

Teor ia e Prát ica da Diagramação. 2a ed .

São Paulo: Sum mus, 1987.

1 4 0

DONDIS, Donis A . La S in tax i s de l a

Imagen : In t roducc ión a l A l fabe to

Visual . 7a ed . Barce lona : Gustavo Gi l i ,

1988 .

ECO, Humberto . Tratado Gera l de

Semiót ica . São Paulo: Perspect iva , 1976.

FARINA, Modesto. Psicodinâmica das Cores

em Comunicação. 4a ed . São Paulo :

Edgar Blücher , 1990 .

GUIMARÃES, Lia Buarque Macedo.

Ergonomia cognit iva , Conferênc ia

profer ida no 8 o Congresso Bras i le i ro de

Ergonomia , F lor ianópol i s , 1997 .

HURLBURT, Al len . Layout : O Des ign da

Pág ina Impressa . 2a ed . São Pau lo :

Nobel , 1986 .

1 4 1

INTERNATIONAL ORGANIZATION FOR

STANDARDIZATION, Pro je to de

norma in te rnac iona l , R equ i r emen t s f o r

d i s p l a y e d c o l o u r s - ISO 9241 parte 8, final

draf t . , Genebra , Su íça ,1997 .

KRISTOF, Ray; SATRAN, Amy.

Interact iv i ty by des ign - Crea t i n g &

commun i ca t i n g w i th n ew med ia , Ind i ana ,

USA, 1995, Macmi l lan , ISBN 1 - 56830-

221-5 .

MARCUS, Aaron. Graphic des ign for

e lec t ronic documents and user

in ter faces , New York , 1992, ACM

Press , ISBN 0-201-54364-8 .

MEYRS, James H. e REYNOLDS, Wil l iam

H. Gerênc ia de Marke t ing e

Comportamento do Consumidor . Rio de

Janeiro: Vozes , 1972.

1 4 2

MULLET, Kevin e SANO, Darre l l .

Designing v isual inter faces ,

Commun i c a t i on o r i e n t e d t e c hn iqu e s , New

Jersey , 1995, SunSoft Press , ISBN 013-

303389-9 .

OSF/Mot i f SYTLE GUIDE. Guia de

es t i los para in ter face com padrão

OSF/Moti f , Cambr idge , USA, 1990 ,

Open Sof tware Foundat ion .

RABAÇA, Car los A. e BARBOSA, Gustavo

G. Dic ionár io de Comunicação . São

Paulo : Át ica , 1987.

ROBERTSON, Douglas . ( Ju ly 16 , 1993)

HCI Repor t .

SANT'ANNA, Armando . Propaganda :

Teor i a , Técn ica e Prá t i ca . 4a ed . São

Paulo : P ione i ra , 1989.

SCHRIVER, Karen A. Dynamics in

document des ign , USA, 1997, Jonh

Wi ley & Sons , ISBN 0-471-30636-3 .

1 4 3

SHUSHAN, Ronnie e WRIGHT, Don.

Desktop Pub l i sh ing by Des ign —

Everyone ' s Guide to Pagemaker 5 .

Wash ington : Microsof t Press , 1994 .

WINDOWS STYLE GUIDE, The Windows

inter face guide l ines - A gu i d e f o r

d e s i g n i n g s o f twa r e , USA, 1995 , Microsof t

Corpora t ion .

1 4 4

BIBLIOGRAFIA

ABIPEME. Fundação Getú l io Vargas .

Cent ro de Es tudos da Cu l tura e do

Consumo. São Paulo : FGV, 1991.

ALCÂNTARA, Eurípides. Emoção pra valer !

Veja , São Paulo, p . 64-67 , 1o se t .1993 .

AMANHÃ. Var ig na cabeça . Por to Alegre ,

Amanhã, v . 10 , n . 106 , p . 1 -20, abr.1996.

Espec ia l : As Marcas Campeãs .

ASSOCIAÇÃO BRASILEIRA DE NORMAS

TÉCNICAS, Rio de j ane i ro . Normas

ABNT sobre documentação . R io de

Janeiro, 1978.

AZEVEDO, Wi l ton . Os S ignos do Des ign .

São Paulo : Global , 1994. (Coleção

Conta to Imed i a to ) .

1 4 5

BERLO, Dav id K. O Processo da

Comunicação : In t rodução à Teor i a e

à Prá t ica . São Pau lo : Mart ins Fontes ,

1991 .

BLECHER, Nelson. Era da Globa l ização

conver te marca em

pat r imônio b i l ionár io . Folha de São

Paulo, São Paulo, 27 out .1994. Especia l

Top o f Mind , p .A-2 .

___ . Omo ba t e Coca -Cola no 'Top of Mind'

95 . Folha de São Paulo, São Paulo, 13

nov.1995. Espec ia l Top of Mind , p .2 .

BORDENAVE, Juan D. e CARVALHO,

Horác io M. Comunicação e

Planejamento. 2a ed. Rio de Janeiro: Paz

e Terra , 1987 .

BRANDÃO, Vladimir . O Poder das Marcas .

Expressão, São Paulo , a .5 , n.56, p.14-20,

1995 .

1 4 6

CYBIS, Wal ter de Abreu. Ergonomia de

inter faces homem-computador ,

F lor ianópol i s , 1997 , Apost i l a para o

curso de Pós -Graduação em Engenharia

de Produção - Univers idade Federa l de

San ta Ca ta r ina .

COBRA, Marcos . Admin i s t ração de

Market ing . 2a ed ição . São Paulo : Atlas ,

1992 . COELHO NETTO, J. Teixeira.

Semiót i ca , In formação e Comunicação .

3a ed . São Pau lo : Perspect iva , 1990 .

(Sé r i e Deba tes )

COELHO, Teixe i ra . O que é Industr ia

Cul tura l? 8a ed. São Paulo : Bras i l iense ,

1986 . (Coleção Pr ime i ros Passos )

COSTA, Joan. Imagen Global : Evoluc ió n

de l Di seño de Ident idad . 2a ed .

Barce lona : CEAC, 1989.

1 4 7

EMERICH, Helc io . Valor secundár io da

embalagem. Folha de São Paulo , São

Paulo , 12 set .1994. Dinheiro , p . 2-5 .

___ . No re ino das f raudes . Fo lha de São

Paulo, São Paulo, 1o abr.

1996 . Negóc ios , p . 5-7 .

EXAME. Mais br i lho na maquiagem.

Exame, São Paulo , p .67-68, 20 abr.1988.

___. Perf i l Novo. Exame, São Paulo , p .111,

8 ju l .1992.

FARAH, Raphic J . Des igners põe a boca no

mundo. Publ i sh , R io de Janeiro, a .6 ,

n .22 , p .64-68 , j an ./fev .1996.

FERLAUTO, Clá ud io . Uma v i são da

logot ip ia bras i le i ra : 91/92. Abigraf , São

Paulo , a .17 , n .141, p .52-54 ,

ju l ./ago.1992.

1 4 8

FERNANDES, Fá t ima . Com 50% de

mercado , Consu l j á se tornou s inônimo

de ge lade i ra . Folha de São Paulo , São

Paulo , 27 out .1994. Espec ia l Top of

Mind , p.A-9 .

FRANÇA, Jún ia Lessa . Manua l para

Normal ização de Pub l i cações Técn ico-

c ient í f icas . 3a ed . Be lo Hor izonte :

UFMG, 1996.

FRANCO, Cél ia de Gouvêa . O mi l ionár io

segredo das marcas . Folha de São Paulo,

São Paulo , 31 mar .1996. Mais ! , p . 5-10 .

GEISSBUHLER, Stef f . 'Des ign g loba l é

ted ioso ' d iz Geissbuhler . Folha de São

Paulo, São Paulo, 27 fev.1996. I lustrada,

p. 5-4 .

GUILLAUME, Paul . Ps ico log ia da Forma.

2a ed . São Pau lo : Nac iona l , 1966 .

HOCHBERG, Jul ian E. Percepção. 3a ed.

Rio de Jane i ro : Zahar , 1982 .

1 4 9

HORTON, Wil l iam. The icon book - Visual

s ymbo l s f o r c ompu t e r s y s t em s and

d o cumen t a t i on , USA, 1994, Jonh Wiley &

Sons , ISBN 0471599018 .

INSTITUTO BRASILEIRO DE

GEOGRAFIA E ESTATÍSTICA -

IBGE. Rio de Jane i ro . Censo

Demográf ico de 1991 . R io de Jane i ro ,

1991 .

JANSSEN, Hugo. Una breve h is tor ia de l

logot ipo . Orgyn , PMSI Bulgamor, Países

Ba ixos , a .5 , n .4 , p .33-35 , 1994 .

JORNAL DA ACOMACSUL. Ps ico log ia da

Cor . Pe lotas , a .1 , n .5 , se t .1995.

LAZZAROTTO, Gis ley e ROSSI , Janete .

Comunicação , Ges ta l t e Behav ior i smo.

IN: GUARESCHI, P .A. Comunicação e

Controle Soc ia l . Rio de Jane iro :

Vozes , 1991.

1 5 0

LESSA, Washington Dias . Dois Es tudos de

Comunicação Visua l . R io de Jane i ro :

UFRJ, 1995. p . 61-111 : A Marca

F igura t iva .

LUCCHESI , Cr i s t i ane . A moda do "Põe na

Consul" es tá de vo l ta . Fo lha de São

Paulo, São Paulo, 13 nov.1995. Especia l

Top of Mind , p .17 .

MARTINS, José S . O Poder da Imagem: o

uso estratégico da imagem cr iando valor

sub je t ivo para a marca . 4a ed . São

Paulo : Makron Books , 1995 .

MAYER, Mart in . Af ina l , o que aconteceu a

Madison Avenue? A publ i c idade nos

anos 90 . Por to Alegre : Ort iz , 1991 .

MUCCHIELLI , Roger . A Ps ico log ia da

Pub l i c idade e Propaganda :

Conhec imento do Prob lema . R io de

Janeiro , Livros Técnicos e Cient í f icos ,

1978 .

1 5 1

MULLET, Kevin e SANO, Darre l l .

Designing v isual inter faces ,

Commun i c a t i on o r i e n t e d t e c hn iqu e s , New

Jersey , 1995, SunSoft Press , ISBN 013-

303389-9 .

MURPHY, John e ROWE, Michael . Como

Diseñar Marcas y Logot ipos . 3a ed .

Barcelona: Editor ia l Gustavo Gil i , 1992.

OSF/Mot i f SYTLE GUIDE. Guia de

es t i los para inter face com padrão

PEDROSA, Is rae l . Da Cor à Cor

Inex is tente . Bras i l i a : UNB, 1982 .

PERISCINOTO, Alex . Et iqueta ou não, e i s

a questão. Folha de São Paulo, São

Paulo, 14 nov.1994. Dinheiro, p .2-5 .

PINTO, Ivan S . e TROIANO, Ja ime C. Na

esquina de Madison Av. e Wal l Street .

Mercado Global , São Paulo , n .89 , p .42-

46 , 1o t r im.1993 .

1 5 2

POLESI , Cass i ano . At i tude . Rev i s ta da

Cr iação, São Paulo , a . 2 , n .13 , p .12-15 ,

mar .1996.

RIBEIRO, Mi l ton. P lane jamento Visua l

Gráf ico . 3a ed . Bras í l i a : L inha , 1993 .

RICHARDSON, Roberto J . Pesquisa Socia l :

Métodos e Técn icas . 2a ed . São Paulo:

At las , 1990.

RICHERS, Ra imar . Oi to chaves de uma

marca . Folha de São Paulo, São Paulo,

13 nov.1995. Especial Top of Mind, p.2.

RIES, Al . As Le is Imutáve i s do Market ing .

Ex ame, São Paulo , a . 28 , n . 596 , p .71-

72 , 8 nov.1995.

ROSENBAUM, Alvin (ed. ) . U.S.A.

Trademarks - Logos: Stat ionery Systems

& Corpora te Iden t i t y - A Visual

Encyc loped ia . Tokyo : Graphic -Sha

Publ i sh ing , 1994 .

1 5 3

SALGADO, Eduardo . Resga te de marcas

cus ta t empo e d inhe i ro . Amanhã , Porto

Alegre , a .9 , n .90 , p .24-27 , nov.1994.

SAMPSON, Peter . Novas tendênc ias em

imagem e pesqu i sa de marcas . Mercado

Global , São Paulo , a .22 , n .97 , p .33-43 ,

1o t r im.1995 .

SANT'ANNA, Armando . Propaganda :

Teor ia , Técn ica e Prá t i ca . 4a ed . São

Paulo : P ione i ra , 1989.

SCALZO, Fernanda. MASP recebe acervo de

des ign gráf ico. Folha de São, São Paulo,

15 abr .1994 . I lus t rada . p .5-7 .

SCHRIVER, Karen A. Dynamics in

document des ign , USA, 1997, Jonh

Wi ley & Sons , ISBN 0-471-30636-3 .

- - - - , Tipos Gr á f i c o s - Le g i b i l i dad e , Rev i s ta

Ideogra f i a , São Pau lo , (02/04/1986) .

1 5 4

SHUSHAN, Ronnie e WRIGHT, Don.

Desktop Pub l i sh ing by Des ign -

Everyone ' s Guide to Pagemaker 5 .

Wash ington : Microsof t Press , 1994 .

SIMÕES, Edda Q . e TIEDEMANN, Klaus

B. Ps ico log ia da Percepção . IN:

RAPPAPORT, C .R . Temas Bás icos de

Ps icologia . v . 10-II . São Paulo: EPU,

1985 .

SOUZA, Marcos Gouvêa e NEMER, Artur .

Marca e Dis t r ibu ição : desenvo lvendo

dominação e s t r a t ég i c a e van tagem

compet i t iva no mercado g loba l . São

Paulo : Makron Books , 1993 .

VEJA. O Apelo Visual . Veja , São Paulo,

p .100-101 , 5 out .1994 .

____ . Ané is ba tem a c ruz . Ve ja , São Pau lo ,

a .29 , n .20 , p .103 , 15 mai . 1996 .

1 5 5

WHELAN, Br ide . Color Harmony 2 - A

Guide to Crea t ive Color Combina t ion .

Massachuse t t s : Rockpor t Publ i shers ,

1994 .

WINDOWS STYLE GUIDE, The Windows

inter face guide l ines – A gu id e f o r

d e s i g n i n g s o f twa r e , USA, 1995 , Microsof t

Corpora t ion .

NIELSEN, Jakob. ( s i t e )h t tp ://www.sun .com

/co lumns/a le r tbox/9605 .h tml

h t tp ://www.use i t . com (1996) .

1 5 6

Série: Guia de Estilos para Web 2ª versão 2000