SlideShare uma empresa Scribd logo
1 de 17
Baixar para ler offline
W eb Design
                       ivo...
E os f ormatos de arqu
W eb Design

Existem diversos formatos de arquivos.
 
Estes formatos são identificados a partir de
suas extensões.
W eb Design

Existem diversos formatos de arquivos.
 
Estes formatos são identificados a partir de
suas extensões.

      nome-do-arquivo.JPG
W eb Design

Existem diversos formatos de arquivos.
 
Estes formatos são identificados a partir de
suas extensões.

      nome-do-arquivo.JPG



                                  {
                                  extensão
W eb Design

De maneira geral as extensões nada mais são
que as abreviaturas dos formatos.
W eb Design

JPG (Joint Pictures Expert Group)
 
É um tipo de arquivo para armazenamento de imagens que
pode trabalhar com esquema de cores em 24 bits. Isso
significa que este formato aceita 16,8 milhões de cores.
 
É um dos formatos de imagens mais populares devido à
capacidade de formar imagens fiéis à original, e
costumam não serem grandes.
 
W eb Design

JPG (Joint Pictures Expert Group)
 
Utiliza um algoritmo de compactação que se baseia na
capacidade do olho humano.
 
Os arquivos podem ter diferentes níveis de compressão.
 
Uma desvantagem do JPEG é que a imagem normalmente
perde qualidade a cada vez que o arquivo é salvo.
 
W eb Design

JPG (Joint Pictures Expert Group)
 
W eb Design

GIF (Graphics Interchange Format)
 
é um tipo de arquivo para imagens que trabalha com uma
paleta de 256 cores, criado pela empresa CompuServe, em
1987.
 
Por causa de sua limitação de quantidade de cores não é
recomendável sua utilização para imagens que precisam
ser fiéis à realidade.
W eb Design

GIF (Graphics Interchange Format)
 
É normalmente utilizado em ilustrações, ícones ou
imagens que não precisam de muitas cores.
 
Apesar de parecer limitado, o GIF possui alguns bons
recursos como a possibilidade de utilizar fundos
transparentes, e a capacidade de salvar uma sequência de
imagens em um único arquivo (GIF Animado).
W eb Design

GIF (Graphics Interchange Format)
 
O formato de compressão não altera a qualidade de
imagem a cada salvamento, como acontece com o JPG.
W eb Design

GIF (Graphics Interchange Format)
W eb Design

PNG (Portable Networks Graphics)
 
O formato GIF utiliza uma forma de compressão conhecida
como LZW, que foi criado pela empresa Sperry
Corporation, tempos depois foi comprada pela empresa
Unisys. Esta, em 1994, anunciou que cobraria royalties dos
desenvolvedores de softwares para trabalhos gráficos que
suportam o formato GIF. Devido a isso, em 1996 foi
lançado um formato criado para concorrer com o GIF e
que era melhor que esse: o PNG
W eb Design

PNG (Portable Networks Graphics)
 
Uma vantagem da sua utilização é porque se consegue
trabalhar com esquema de 24 bits de cores, ou seja, 16,8
milhões de cores. No entanto, em comparação com o
JPEG, a compressão obtida é mais eficiente e não
proporciona perda de qualidade a cada salvamento, o que
permite maior fidelidade à imagem original.
W eb Design

PNG (Portable Networks Graphics)
 
Outra vantagem do PNG é a possibilidade de utilizar
fundos transparentes nas imagens.
W eb Design

Além dos formatos apresentados ainda existem
muitos outros, entre eles o BMP (Bitmap),
TIFF...
 
Uma curiosidade sobre o formato BMP é que
trata-se da imagem sem nenhuma compressão,
seria o estado mais "puro" da imagem. Por
isso, as imagens BMP são mais pesadas (muitos
Kb).
W eb Design




É isso aí p-p-pessoal.

Mais conteúdo relacionado

Mais procurados

Tipo de vídeo e seus formatos
Tipo de vídeo e seus formatosTipo de vídeo e seus formatos
Tipo de vídeo e seus formatosbarthursilva
 
Fotografia digital
Fotografia digitalFotografia digital
Fotografia digitalochatope
 
Fotografia digital
Fotografia digitalFotografia digital
Fotografia digitalZulmarpe
 
Arquivos de vídeo e seus formatos
Arquivos de vídeo e seus formatosArquivos de vídeo e seus formatos
Arquivos de vídeo e seus formatoskelwymferraz01
 
Tipos de Áudios e Vídeos
Tipos de Áudios e VídeosTipos de Áudios e Vídeos
Tipos de Áudios e VídeosAmendoin4k
 
Formatos de áudio e vídeo
Formatos de áudio e vídeoFormatos de áudio e vídeo
Formatos de áudio e vídeokamylaoliveira15
 
Imagem grupo
Imagem grupoImagem grupo
Imagem grupomdfeitosa
 
Formatos de Áudio e Vídeo
Formatos de Áudio e Vídeo Formatos de Áudio e Vídeo
Formatos de Áudio e Vídeo macsuell
 
Arquivos e extensão de vídeo
Arquivos e extensão de vídeoArquivos e extensão de vídeo
Arquivos e extensão de vídeoCarlos Henrique
 
Arquivos de video e formatos
Arquivos de video e formatosArquivos de video e formatos
Arquivos de video e formatosJeffinhoCarlos
 

Mais procurados (12)

Tipo de vídeo e seus formatos
Tipo de vídeo e seus formatosTipo de vídeo e seus formatos
Tipo de vídeo e seus formatos
 
ExtensõEs De Arquivos
ExtensõEs De ArquivosExtensõEs De Arquivos
ExtensõEs De Arquivos
 
Fotografia digital
Fotografia digitalFotografia digital
Fotografia digital
 
Fotografia digital
Fotografia digitalFotografia digital
Fotografia digital
 
Fotografia digital
Fotografia digitalFotografia digital
Fotografia digital
 
Arquivos de vídeo e seus formatos
Arquivos de vídeo e seus formatosArquivos de vídeo e seus formatos
Arquivos de vídeo e seus formatos
 
Tipos de Áudios e Vídeos
Tipos de Áudios e VídeosTipos de Áudios e Vídeos
Tipos de Áudios e Vídeos
 
Formatos de áudio e vídeo
Formatos de áudio e vídeoFormatos de áudio e vídeo
Formatos de áudio e vídeo
 
Imagem grupo
Imagem grupoImagem grupo
Imagem grupo
 
Formatos de Áudio e Vídeo
Formatos de Áudio e Vídeo Formatos de Áudio e Vídeo
Formatos de Áudio e Vídeo
 
Arquivos e extensão de vídeo
Arquivos e extensão de vídeoArquivos e extensão de vídeo
Arquivos e extensão de vídeo
 
Arquivos de video e formatos
Arquivos de video e formatosArquivos de video e formatos
Arquivos de video e formatos
 

Semelhante a Web Design > Formatos de arquivos para web

Representação de imagens em formato digital
Representação de imagens em formato digitalRepresentação de imagens em formato digital
Representação de imagens em formato digitalHelinton Bruce
 
Multimídia - Imagens
Multimídia - ImagensMultimídia - Imagens
Multimídia - ImagensJean Pimentel
 
Tipos de imagens digitais
Tipos de imagens digitaisTipos de imagens digitais
Tipos de imagens digitaisAline Okumura
 
ExercíCio Web Design
ExercíCio Web DesignExercíCio Web Design
ExercíCio Web DesignFranco Salles
 
Aula 2 formato de imagens
Aula 2 formato de imagensAula 2 formato de imagens
Aula 2 formato de imagensRafael Serra
 
Imagem Digital - VETOR E BITMAP
Imagem Digital - VETOR E BITMAPImagem Digital - VETOR E BITMAP
Imagem Digital - VETOR E BITMAPDaniel Soto
 
Brotero - Imagem Apresentação 2
Brotero - Imagem Apresentação 2Brotero - Imagem Apresentação 2
Brotero - Imagem Apresentação 2João Leal
 
Principais formatos de vídeo, imagem e áudio
Principais formatos de vídeo, imagem e áudioPrincipais formatos de vídeo, imagem e áudio
Principais formatos de vídeo, imagem e áudioTiago Silvestre
 
Computação Gráfica - Introdução
Computação Gráfica - IntroduçãoComputação Gráfica - Introdução
Computação Gráfica - IntroduçãoDaniel Soto
 
Imagem Digital
Imagem DigitalImagem Digital
Imagem Digitalschool
 
Wix.com sem photoshop
Wix.com sem photoshopWix.com sem photoshop
Wix.com sem photoshopIsabel Silva
 
Imagens matriciais vs Imagens vectoriais
Imagens matriciais vs Imagens vectoriaisImagens matriciais vs Imagens vectoriais
Imagens matriciais vs Imagens vectoriaisRuiCorgan
 
Unidades de medida do sistema binário dos computadores
Unidades de medida do sistema binário dos computadoresUnidades de medida do sistema binário dos computadores
Unidades de medida do sistema binário dos computadoresmariliacherry
 

Semelhante a Web Design > Formatos de arquivos para web (20)

Formato Imagens
Formato ImagensFormato Imagens
Formato Imagens
 
Representação de imagens em formato digital
Representação de imagens em formato digitalRepresentação de imagens em formato digital
Representação de imagens em formato digital
 
Multimídia - Imagens
Multimídia - ImagensMultimídia - Imagens
Multimídia - Imagens
 
Aula resolução
Aula resoluçãoAula resolução
Aula resolução
 
Tipos de imagens digitais
Tipos de imagens digitaisTipos de imagens digitais
Tipos de imagens digitais
 
Imagem
ImagemImagem
Imagem
 
Imagem
ImagemImagem
Imagem
 
ExercíCio Web Design
ExercíCio Web DesignExercíCio Web Design
ExercíCio Web Design
 
Aula 2 formato de imagens
Aula 2 formato de imagensAula 2 formato de imagens
Aula 2 formato de imagens
 
Mult
MultMult
Mult
 
Multimyhy
MultimyhyMultimyhy
Multimyhy
 
Imagem Digital - VETOR E BITMAP
Imagem Digital - VETOR E BITMAPImagem Digital - VETOR E BITMAP
Imagem Digital - VETOR E BITMAP
 
Informatica
Informatica Informatica
Informatica
 
Brotero - Imagem Apresentação 2
Brotero - Imagem Apresentação 2Brotero - Imagem Apresentação 2
Brotero - Imagem Apresentação 2
 
Principais formatos de vídeo, imagem e áudio
Principais formatos de vídeo, imagem e áudioPrincipais formatos de vídeo, imagem e áudio
Principais formatos de vídeo, imagem e áudio
 
Computação Gráfica - Introdução
Computação Gráfica - IntroduçãoComputação Gráfica - Introdução
Computação Gráfica - Introdução
 
Imagem Digital
Imagem DigitalImagem Digital
Imagem Digital
 
Wix.com sem photoshop
Wix.com sem photoshopWix.com sem photoshop
Wix.com sem photoshop
 
Imagens matriciais vs Imagens vectoriais
Imagens matriciais vs Imagens vectoriaisImagens matriciais vs Imagens vectoriais
Imagens matriciais vs Imagens vectoriais
 
Unidades de medida do sistema binário dos computadores
Unidades de medida do sistema binário dos computadoresUnidades de medida do sistema binário dos computadores
Unidades de medida do sistema binário dos computadores
 

Mais de Felipe Fernandes

Code Club Brasil na Campus Party Brasil 8 #cpbr8
Code Club Brasil na Campus Party Brasil 8 #cpbr8 Code Club Brasil na Campus Party Brasil 8 #cpbr8
Code Club Brasil na Campus Party Brasil 8 #cpbr8 Felipe Fernandes
 
Code Club Apresentação 2014
Code Club Apresentação 2014Code Club Apresentação 2014
Code Club Apresentação 2014Felipe Fernandes
 
Code Club - Aprender a programar pode ser divertido?
Code Club - Aprender a programar pode ser divertido?Code Club - Aprender a programar pode ser divertido?
Code Club - Aprender a programar pode ser divertido?Felipe Fernandes
 
Web Design > Movimentos artisticos
Web Design > Movimentos artisticosWeb Design > Movimentos artisticos
Web Design > Movimentos artisticosFelipe Fernandes
 
Web Design > html (aula 2)
Web Design > html (aula 2)Web Design > html (aula 2)
Web Design > html (aula 2)Felipe Fernandes
 
Web Design > HTML (aula 1)
Web Design > HTML (aula 1)Web Design > HTML (aula 1)
Web Design > HTML (aula 1)Felipe Fernandes
 
Web Design > Gestalt e suas leis
Web Design > Gestalt e suas leisWeb Design > Gestalt e suas leis
Web Design > Gestalt e suas leisFelipe Fernandes
 
Web Design > Princípios do Design e intro à Gestalt
Web Design > Princípios do Design e intro à GestaltWeb Design > Princípios do Design e intro à Gestalt
Web Design > Princípios do Design e intro à GestaltFelipe Fernandes
 
Web Design > História e a evolução do www
Web Design > História e a evolução do wwwWeb Design > História e a evolução do www
Web Design > História e a evolução do wwwFelipe Fernandes
 
Web Design > Visão geral do Web Design
Web Design > Visão geral do Web DesignWeb Design > Visão geral do Web Design
Web Design > Visão geral do Web DesignFelipe Fernandes
 

Mais de Felipe Fernandes (16)

Code Club Brasil #2015
Code Club Brasil #2015Code Club Brasil #2015
Code Club Brasil #2015
 
Code Club Brasil na Campus Party Brasil 8 #cpbr8
Code Club Brasil na Campus Party Brasil 8 #cpbr8 Code Club Brasil na Campus Party Brasil 8 #cpbr8
Code Club Brasil na Campus Party Brasil 8 #cpbr8
 
Code Club Apresentação 2014
Code Club Apresentação 2014Code Club Apresentação 2014
Code Club Apresentação 2014
 
Code Club - Aprender a programar pode ser divertido?
Code Club - Aprender a programar pode ser divertido?Code Club - Aprender a programar pode ser divertido?
Code Club - Aprender a programar pode ser divertido?
 
CodeClub
CodeClubCodeClub
CodeClub
 
Web Design > Movimentos artisticos
Web Design > Movimentos artisticosWeb Design > Movimentos artisticos
Web Design > Movimentos artisticos
 
Web Design > html (aula 2)
Web Design > html (aula 2)Web Design > html (aula 2)
Web Design > html (aula 2)
 
Web Design > HTML (aula 1)
Web Design > HTML (aula 1)Web Design > HTML (aula 1)
Web Design > HTML (aula 1)
 
Web Design > Tipografia
Web Design > TipografiaWeb Design > Tipografia
Web Design > Tipografia
 
Web Design > Cores
Web Design > CoresWeb Design > Cores
Web Design > Cores
 
Web Design > Usabilidade
Web Design > UsabilidadeWeb Design > Usabilidade
Web Design > Usabilidade
 
Web Design > Gestalt e suas leis
Web Design > Gestalt e suas leisWeb Design > Gestalt e suas leis
Web Design > Gestalt e suas leis
 
Web Design > Princípios do Design e intro à Gestalt
Web Design > Princípios do Design e intro à GestaltWeb Design > Princípios do Design e intro à Gestalt
Web Design > Princípios do Design e intro à Gestalt
 
Web Design > História e a evolução do www
Web Design > História e a evolução do wwwWeb Design > História e a evolução do www
Web Design > História e a evolução do www
 
Web Design > Visão geral do Web Design
Web Design > Visão geral do Web DesignWeb Design > Visão geral do Web Design
Web Design > Visão geral do Web Design
 
Web Design > Aula 00
Web Design > Aula 00Web Design > Aula 00
Web Design > Aula 00
 

Web Design > Formatos de arquivos para web

  • 1. W eb Design ivo... E os f ormatos de arqu
  • 2. W eb Design Existem diversos formatos de arquivos.   Estes formatos são identificados a partir de suas extensões.
  • 3. W eb Design Existem diversos formatos de arquivos.   Estes formatos são identificados a partir de suas extensões. nome-do-arquivo.JPG
  • 4. W eb Design Existem diversos formatos de arquivos.   Estes formatos são identificados a partir de suas extensões. nome-do-arquivo.JPG { extensão
  • 5. W eb Design De maneira geral as extensões nada mais são que as abreviaturas dos formatos.
  • 6. W eb Design JPG (Joint Pictures Expert Group)   É um tipo de arquivo para armazenamento de imagens que pode trabalhar com esquema de cores em 24 bits. Isso significa que este formato aceita 16,8 milhões de cores.   É um dos formatos de imagens mais populares devido à capacidade de formar imagens fiéis à original, e costumam não serem grandes.  
  • 7. W eb Design JPG (Joint Pictures Expert Group)   Utiliza um algoritmo de compactação que se baseia na capacidade do olho humano.   Os arquivos podem ter diferentes níveis de compressão.   Uma desvantagem do JPEG é que a imagem normalmente perde qualidade a cada vez que o arquivo é salvo.  
  • 8. W eb Design JPG (Joint Pictures Expert Group)  
  • 9. W eb Design GIF (Graphics Interchange Format)   é um tipo de arquivo para imagens que trabalha com uma paleta de 256 cores, criado pela empresa CompuServe, em 1987.   Por causa de sua limitação de quantidade de cores não é recomendável sua utilização para imagens que precisam ser fiéis à realidade.
  • 10. W eb Design GIF (Graphics Interchange Format)   É normalmente utilizado em ilustrações, ícones ou imagens que não precisam de muitas cores.   Apesar de parecer limitado, o GIF possui alguns bons recursos como a possibilidade de utilizar fundos transparentes, e a capacidade de salvar uma sequência de imagens em um único arquivo (GIF Animado).
  • 11. W eb Design GIF (Graphics Interchange Format)   O formato de compressão não altera a qualidade de imagem a cada salvamento, como acontece com o JPG.
  • 12. W eb Design GIF (Graphics Interchange Format)
  • 13. W eb Design PNG (Portable Networks Graphics)   O formato GIF utiliza uma forma de compressão conhecida como LZW, que foi criado pela empresa Sperry Corporation, tempos depois foi comprada pela empresa Unisys. Esta, em 1994, anunciou que cobraria royalties dos desenvolvedores de softwares para trabalhos gráficos que suportam o formato GIF. Devido a isso, em 1996 foi lançado um formato criado para concorrer com o GIF e que era melhor que esse: o PNG
  • 14. W eb Design PNG (Portable Networks Graphics)   Uma vantagem da sua utilização é porque se consegue trabalhar com esquema de 24 bits de cores, ou seja, 16,8 milhões de cores. No entanto, em comparação com o JPEG, a compressão obtida é mais eficiente e não proporciona perda de qualidade a cada salvamento, o que permite maior fidelidade à imagem original.
  • 15. W eb Design PNG (Portable Networks Graphics)   Outra vantagem do PNG é a possibilidade de utilizar fundos transparentes nas imagens.
  • 16. W eb Design Além dos formatos apresentados ainda existem muitos outros, entre eles o BMP (Bitmap), TIFF...   Uma curiosidade sobre o formato BMP é que trata-se da imagem sem nenhuma compressão, seria o estado mais "puro" da imagem. Por isso, as imagens BMP são mais pesadas (muitos Kb).
  • 17. W eb Design É isso aí p-p-pessoal.