Blockquote, tag img, strong, resolucao de imagens multiplos formatos

Blockquote:

A tag <blockquote> Como o próprio nome já diz, é uma “citação em bloco”. Foi criada principalmente para identificar algo que não é de sua autoria, uma frase famosa, uma entrevista, trecho de outro blog/site… Aqui vai um exemplo bacana de <blockquote>:

“Eu sou apenas um rapaz
Latino-Americano
Sem dinheiro no banco
Sem parentes importantes
E vindo do interior…”Belchior

Quando criar uma nova postagem clic na opção (Citação), e escreva entre<blockquote >   </blockquote>. Veja abaixo:

citacao

<blockquote> Escreva o seu texto </blockquote>

Blockquote ainda possui um atributo chamado cite. Cite serve para determinar a página fonte da citação, ou seja, de qual página da internet veio tal citação. Para demonstrar o uso de citações de parágrafo, abaixo está uma pequena parte do discurso de J. Kennedy sobre a corrida espacial retirada do site LetrasMusicas.

...
<BLOCKQUOTE CITE="http://letras.mus.br/macklemore/thrift-shop-feat-wanz/traducao.html">
 <P>
I’m gonna pop some tags
Only got 20 dollars in my pocket
I, I, I’m hunting, lookin’ for a come-up
This is fucking awesome.
</p></BLOCKQUOTE>
...

A tag

 IMG

O código HTML5  nos possibilita facilmente inserir imagens em páginas, assim como configurá-las.

Usamos a tag IMG para isso. Essa tag possui vários atributos que serão vistos logo abaixo.

Src

Src é o atributo mais importante da tag IMG.

O atributo src é responsável em informar onde está a imagem. Essa informação é dada por meio da uma URL, como no exemplo abaixo.

...
<IMG SRC="laranja.png" />
...

Altura e largura

(Width e Height)

Um dos principais atributos da tag IMG também são width e height. Esses atributos controlam a largura (width) e a altura (height) que a imagem será exibida na tela.

A imagem que está sendo utilizada como exemplo acima tem 350 pixels de largura por 355 pixels de altura.

...
<P ALIGN="center">Imagem Original (350x355)<BR /><IMG SRC="computador.jpg" WIDTH="300" HEIGHT="300" /></P>
<P ALIGN="center">Imagem Original (150x150)<BR /> <IMG SRC="computador.jpg" WIDTH="150" HEIGHT="150" /></P>
<P ALIGN="center">Imagem Original (300x150)<BR /> <IMG SRC="computador.jpg" WIDTH="350" HEIGHT="150" /></P>
...

Imagem Original (350×355)

Imagem Original (150×300)

Imagem Original (300×150)

Imagens Múltiplos Formatos

PNG (Portable Network Graphics,) é um formato de dados utilizado para imagens, que surgiu em 1996 como substituto para o formato GIF, devido ao facto de este último incluir algoritmos patenteados.GIF

A motivação para criar o formato PNG surgiu do início de 1995, quando veio a público que o algoritmo de compressão de dados LZW, utilizado no GIF havia sido patenteado pela Unisys. Havia também outros problemas com a GIF que tornaram a substituição desejável, como, por exemplo, a sua limitação a 256 cores num momento em que computadores com capacidade para exibir uma gama maior de cores tornavam-se comuns. Embora o  permita animações, foi decidido que o PNG deveria ser um formato estático de imagem. Um formato “companheiro” chamado MNG foi definido para animação.

Tamanho da imagem: 128 KB

Imagem PNG
Tamanho da imagem: 128 KB

JPEG (ou JPG) é um método comum usado para comprimir imagens fotográficas. O grau de redução pode ser ajustado, o que permite a você escolher o tamanho de armazenamento e seu compromisso com a qualidade da imagem. Geralmente se obtém uma compressão com pouco perceptível perda na qualidade da imagem.

Além de ser um método de compressão, é frequentemente considerado como um formato de arquivo. JPEG / Exif é o formato de imagem mais comum usado por câmeras digitais e outros dispositivos de captura de imagem, juntamente de JPEG / JFIF, que também é um outro formato para o armazenamento e transmissão de imagens na World Wide Web. JPEG / JFIF é o formato usado para armazenar fotos e transmiti-las através da Internet. Geralmente desconsideram-se os formatos e dizemos simplesmente JPEG.

Imagem JPGTamanho da imagem: 58.2 KB

Imagem JPG
Tamanho da imagem: 58.2 KB

GIF (Graphics Interchange Format,) é um formato de imagem de mapa de bits muito usado na world wide web, quer para imagens fixas, quer para animações.

Um GIF animado é o termo dado às animações formadas por várias imagens GIF compactadas numa só. É utilizado para compactar objetos em jogos eletrônicos, para usar como emoticon em mensageiros instantâneos e para enfeitar sites na Internet.

Imagem GIFTamanho da imagem: 490 KB

Imagem GIF
Tamanho da imagem: 490 KB

SVG é a abreviatura de Scalable Vector Graphics que pode ser traduzido do inglês como gráficos vetoriais escaláveis. Trata-se de uma linguagem XML para descrever de forma vetorial desenhos e gráficos bidimensionais, quer de forma estática, quer dinâmica ou animada. Umas das principais características dos gráficos vetoriais, é que não perdem qualidade ao serem ampliados. A grande diferença entre o SVG e outros formatos vetoriais, é o fato de ser um formato aberto, não sendo propriedade de nenhuma empresa. Foi criado pela World Wide Web Consortium, responsável pela definição de outros padrões, como o HTML e o XHTML.

Bibliografia:

http://www.tiexpert.net/programacao/web/html/blockquote.php
http://en.support.wordpress.com/code/posting-source-code/
http://dany-place.blogspot.com.br/2013/01/blockquote-com-efeito.html
http://www.helenfernanda.com.br/2008/11/quando-e-como-usar-blockquote.html
http://www.tiexpert.net/programacao/web/html/img.php
http://pt.wikipedia.org/wiki/JPG
http://pt.wikipedia.org/wiki/PNG
http://pt.wikipedia.org/wiki/SVG
http://pt.wikipedia.org/wiki/GIF

Deixe um comentário