Imagens no Blog

Uma das coisas mais básicas quando o assunto é blog ou site é como colocar imagem neles, é um assunto fácil, mas tem alguns detalhes interessantes, veja o código:

<img style="border: none;margin:10px; float: right;" src="URL
DA IMAGEM" width="250" height="150">


A parte principal do código é <img src="URL DA IMAGEM"> , se você hospedar ou pegar a url de uma imagem da internet e colocar aqui ela aparecerá no seu blog, você pode hospedar suas imagens no http://photobucket.com ou http://www.imageshack.us mas se somente essa parte do código já faz aparecer à imagem, para que todo o resto? As demais partes são opcionais, mas devem ser colocadas, vamos ver uma parte por vez:

alt="texto" Quando o mouse está sobre a imagem surgira palavra texto, claro que você pode escrever o que quiser o importante é não esquecer de colocar entre aspas.

width="250" height="150" Isto controla a largura e altura da imagem, é opcional a diferença entre colocar ou não essa parte é quando o site está carregando, você já notou que alguns sites enquanto não apareceu a imagem o espaço dela está com um quadradinho e quando ela aparece as coisas ao seu redor mudam um pouco de lugar para se adaptarem ao tamanho dela, e em outros sites já tem um lugar vazio onde aparecerá a imagem, pois é essa a diferença entre colocar ou não essa parte do código, ela faz que já tenha um espaço reservado para imagem enquanto ela não é carregada, tenha cuidado ao preencher esses valores, pois se não forem os mesmo da imagem ela ficará distorcida.

border: none; Quando queremos remover a borda somente de uma imagem colocamos esse código.

style="margin:10px; float: right;" Para deixar o texto ao lado da imagem como neste texto usamos float:right (à direita) e float:left (à esquerda) dependendo de qual lado quisermos, a parte margin: 10px é um espaço vazio ao redor da imagem para o texto não ficar encostado nela.
Mas quando falamos de imagens ainda temos uma outra questão muito importante é o formato que salvamos a imagem que pode ser .jpg, .gif, .png e outros, mas qual a diferença entre eles? Principalmente o tempo que ela levará para aparecer.
É recomendável salvar a imagem nos formatos .jpg e .gif e ver qual tem tamanho menor (ex: 12k), a qualidade varia também um pouco dependendo do formato, mas vale a pena olhar esses dois.

Existem vários programas que são ótimos para imagens como Photoshop, Fireworks, mas se você for fazer download de um deles veja antes quais os requisitos do sistema, ou seja, quando de memória RAM, HD, memória de vídeo são necessários para cada uma desses programas, pois se seu computador não atender esses requisitos mínimos e mesmo assim você fizer o download e instalar seu computador ficará muito lento ou irá travar quando usar esses programas.

Sempre ficamos com vontade de colocar tudo que vemos em outros sites no nosso, mas evite deixar seu blog muito pesado (demorando para carregar), pois muita gente usa internet discada e perde a paciência esperando e fecha a janela antes de ver seu blog.

6 comentários :

  1. olá!sou muito curiosa e apressada...,fui colocar uma figura que estava no http://photobuchet.com e ela disparou e eu postei assim!
    aconteceu que encheu meu blog de borboletas e agora não consigo excluir!
    Não conheço linguagem dos blogs ,fui na cara e corajem!
    Será que vou ter que excluir meu blog?
    Você pode me ajudar, por favor?
    Meu endereço é: mascarenhas.mari6Gmail.com
    Desde já lhe agradeço!

    MARI

    ResponderExcluir
  2. Olá,

    Eu sempre venho aqui pra pegar dicas são todas muitas boas e úteis. Mas eu tenho um duvida quanto a colocar imagens no fundo do blog. Onde eu coloco esses códigos?EU tenho que editar o html?Onde eu tenho que ir?

    Desde já muito obrigado!

    Atenciosamente

    Jorge!
    Convido também a visitar meu blog e ver se tem algum erro.

    Abraço!

    ResponderExcluir
  3. quando entrar no blog, clique na palavra layout, depois nas guias acima tem a opção editar html clique nela, é nessa pagina que você coloca os códigos de imagens de fundo.
    nos marcadores do nosso blog http://dicasparablogs.blogspot.com você encontra uma seção sobre imagem de fundo, tem varias coisas lá.

    ResponderExcluir
  4. FABIANO-URGENTE...tdo bem? fui mudar o template do meu blog e depois nao gostei e fui mudar novamente...agora não consigo mais voltar ao que era antes... nem aparece a pág inicial do meu blog...o q será q aconteceu??? por favor me ajudeeee...

    ResponderExcluir
  5. visitei seu blog agora e acho que chegou a mesma coisa que eu ia falar ou seja, escolher um novo modelo e começar novamente a editar.

    quando for mexer no modelo salve um cópia antes de começar, nem sempre lembro de fazer isso, mas vale a pena

    ResponderExcluir
  6. Muito bom!!!!
    Adorei, so que eu gostaria que nao copiassem minha imagem, porem nao consigo colocar o codigo, e gostaria de saber se posso enviar para voce o códito total do HTML e voce bloqueia a imagem para mim, pq nao consegui.
    Além do que, tem duas colunas, e as fotos ficam na menor, e estao saindo fora do quadrado.

    Beijao

    ResponderExcluir