Apostila Comunicação Visual para Web
81 pág.

Apostila Comunicação Visual para Web


DisciplinaWeb para Comunicação2 materiais12 seguidores
Pré-visualização12 páginas
notar uma pequena diferença na qualidade, porém é mínima e o arquivo diminui de 
tamanho, consideráveis (para a WEB) 35Kbytes.
 Na imagem C, o nosso amigo Stress Anty está um pouco fosco ou fora de foco, 
todavia o tamanho do arquivo é bem pequeno, apenas 7 Kbytes, tornando-o muito 
bom para a web.
 Continuando o estudo do Sr. Stress Anty veremos três tipos de resoluções que 
não são de boa utilização.
Comunicação Visual Para WEB 
SOCIESC - Sociedade Educacional de Santa Catarina 
42
Imagem com compacta-
ção 90% (D)
Tamanho : 3,9 Kb
JPG convertida em 
GIF256 (E)
Tamanho : 44,1 Kb
JPG convertida em GIF 
Uniforme (F)
Tamanho : 18,2 Kb
 Na imagem D, nota-se perfeitamente a má resolução da imagem e, conse-
qüentemente, o tamanho reduzido do arquivo, apenas 3,9 Kbytes. Em contrapartida, 
temos a mesma imagem, só que exportada como um arquivo GIF, com 256 Optimized, 
uma boa resolução e um tamanho grande, novamente ressaltando, para a WEB.
 Para terminar o nosso trabalho com o Sr. Stress Anty, vemos uma GIF com 
compactação Uniforme, indubitavelmente horrível.
 Resumindo, os diferentes programas usam diferentes números para a com-
pressão JPG, mas, geralmente, quanto maior o número, maior a qualidade da ima-
gem e seu tamanho. Você deve procurar na documentação de seu software para 
saber como ele faz esse tratamento. Para cada trabalho existe uma configuração 
adequada, seja para WEB ou para impressão. Se você precisa de uma imagem com 
excelente qualidade, não irá fugir de um arquivo de bom tamanho em Kbytes.
DICA:
Embora você deva usar GIF ou JPG como gráficos para a web, salve o seu arquivo 
original em um formato como TIF (Tagged Image File Format) ou o formato nativo de 
seu software gráfico. Por quê? Porque você preserva a resolução e a qualidade da 
imagem original, para novamente usá-la ou não na web!
Comunicação Visual Para WEB 
SOCIESC - Sociedade Educacional de Santa Catarina 
43
3.6 Resolução de Tela
 No Brasil, como temos preços elevados para artigos tecnológicos, ainda não há 
(a grande maioria) monitores e placas de vídeo que nos permitam trabalhar com uma 
resolução de tela de 1024x768px, mas grande parte dos designers está fazendo seus 
layouts fluidos. O que quer dizer isso?
 Normalmente os usuários domésticos utilizam resolução de 800 x 600px, mas 
com CSS e outras tecnologias, você consegue utilizar layouts que podem se adaptar 
para telas maiores ou menores. Esse é um tópico específico, que você deve procurar 
quando dominar os itens básicos.
IMPORTANTE
Para desenvolver um site para a resolução de 800x600, NUNCA CRIE O LAYOUT 
COM 800x600, pois a área útil desta resolução é de 770x440px aproximadamente, 
ou seja, você sempre perderá espaço para menus do seu navegador e da barra ini-
ciar do Windows, por exemplo.
 No mundo digital, os gráficos podem ser divididos em dois grupos, os vetoriais 
e os bitmaps. A diferença principal entre eles é a resolução.
 Os gráficos vetoriais são feitos por cálculos matemáticos, portanto, se fizermos 
alterações em seu tamanho, ele irá adaptar-se e não terá problemas de definição.
 Os mapas de bits, como seu nome diz, são quadradinhos de cores diversas, 
que montam uma imagem maior. Este sim, dependendo da resolução, sofre com o di-
mensionamento.
3.7 Cor em \u201cprofundidade\u201d
 Cada pixel da imagem é mostrado pelo monitor usando-se uma combinação 
de três sinais de cores: vermelho, verde e azul. A intensidade de cada um desses 
sinais determina a sua aparência. Em um monitor de TV preto e branco, os pixels 
têm apenas duas cores possíveis: preto ou braço. O que é chamado de \u201c1-bit\u201d porque
Comunicação Visual Para WEB 
SOCIESC - Sociedade Educacional de Santa Catarina 
44
o pixel está ligado ou está desligado.
Imagem com Profundidade de 
bits
Sem profundidade. Preto e 
Branco
 Em monitores coloridos, cada pixel pode exibir certo número de cores, que 
vão de 16 (4-bit) a 16 milhões. A maioria dos computadores, hoje em dia, pode exibir 
65.000(16 bits) cores. Novos computadores exibem de 65.000. (16-bit) a 16 milhões 
de cores.
3.8 Formato de Arquivos
 Como em todos os programas de qualquer funcionalidade, desenho, texto, som 
ou vídeo há vários tipos de imagens com a mesma funcionalidade, mas com caracter-
ísticas diferentes. Para Exemplificar vamos aos conhecidos arquivos de som:
» WAV \u2013 Arquivo de som extraído de algum dispositivo de entrada (Microfone \u2013 CD 
\u2013 Teclado Musical \u2013 ETC) outro arquivo 
» MP3 \u2013 Arquivo de som extraído de algum dispositivo de entrada (Microfone \u2013 CD 
\u2013 Teclado Musical \u2013 ETC)
Comunicação Visual Para WEB 
SOCIESC - Sociedade Educacional de Santa Catarina 
45
 Mas qual a diferença? Assim analisando, NENHUMA! Porém, quem conhece 
os arquivos, sabe que o mp3 tem uma compactação melhor e a qualidade superior 
que o WAV. Mas isso é apenas um exemplo de arquivos quaisquer. 
 Vamos agora para os arquivos de Imagens.
Tipo de Arquivo Pacote de Software
Postscript EPS
Muitos aplicativos para PC e MAC pro-
duzem arquivos Posts-cript. Postscript é 
uma rica linguagem de descrição de grá-
ficos, mas, como um arquivo EPS é, na 
realidade, apenas texto com instruções 
para uma impressora Postscript indicando 
como imprimir a imagem. Nenhuma ima-
gem Postscript será mostrada na tela, salvo 
se uma imagem de mapas de bits (TIFF ou 
WMF) estiver incluída com o arquivo EPS.
CompuServe GIF
Arquivos GIF são usados para criar imagens 
comprimidas para facilitar o uploading e o 
downloading das electronic Bul-letin Board 
Systems (BBS) e da INTERNET.
BMP
Arquivos BMP: Os BMP\u2019s podem ser cria-
dos no Windows\u2019 Paintbrush e usados como 
\u201cwallpaper\u201d no background quando rodamos 
o Windows.
WMF
Os arquivos Windows Meta File geralmente 
são gerados no formato Aldus Placeable 
Metafile (que contém um cabeçalho com in-
formações org e ext). A Aldus e a Micrografx 
criaram uma versão estendida do Formato 
de Meta-arquivo do Win-dows chamada 
\u201cPlaceable Metafile Format.\u201d Nesse formato 
estendido, 22 bytes de informações foram 
adicionados ao cabeçalho padrão do meta-
arquivo.
TIF
O Formato Tagged Image File (.TIF) é usado 
por muito scanners. Nem todos os arquivos 
TIF são idênticos, obedecem a uma série de 
especificações (Revisão TIFF 5.0. Revisão 
TIFF 6.0, etc.). Tais tipos podem ser muito 
grandes e consumir mui-to espaço em disco, 
pois incluem informações de escala de cinza. 
No entanto, os formatos TIF, comprimidos, 
podem usar apenas 10% do não-comprimi-
do.
Comunicação Visual Para WEB 
SOCIESC - Sociedade Educacional de Santa Catarina 
46
Síntese da Aula
 Estudamos nesta aula os diferentes tipos de representação gráfica digital.
 Estudamos os tipos de imagens, como funcionam e quais as melhores para 
finalidades específicas. Aprofundamos o conhecimento entre as imagens vetoriais e 
raster juntamente com outras extensões de arquivos.
 Comparamos também as formas de exportação de imagens raster.
 No próximo capítulo veremos a ferramenta fireworks.
Exercícios Propostos
1) Descreva a diferença entre imagens Raster e Vetorial, justificando.
____________________________________________________________________
____________________________________________________________________
_____________________________________________________________________________________________
____________________________________________________________________________________________
2) Imagens PNG são utilizadas para fotografia? Justifique.
____________________________________________________________________
____________________________________________________________________
________________________________________________________________________