Inserção de imagens com html

2 métodos:

imagem Introduzirconfigurações opcionais

Adicionar imagens para o seu site ou perfil em redes sociais é uma ótima maneira de melhorar sua página. O código HTML para adicionar imagens é simples e geralmente é uma das primeiras lições que eles aprendem que estão apenas começando a usá-lo.

método 1imagem Introduzir

1

Fazer upload de sua imagem. Existem vários hospedagem de imagem serviços gratuitos como o Picasa Web Albums, Imgur, Flickr ou Photobucket. Leia os termos cuidadosamente. Alguns serviços irá reduzir a qualidade da sua imagem ou suprimido se muitas pessoas vê-lo (uma vez que utiliza a largura de banda do servidor).

  • Alguns serviços de hospedagem de blogs permitem fazer upload de suas imagens usando ferramentas de administrador do blog.
  • Se você pagou por um servidor, carregar a imagem para seu próprio site usando um serviço FTP. Recomendamos a criação de um diretório imagens para manter seus arquivos organizados.
  • Se você quiser usar uma imagem de outro site, pede permissão para o criador. Se você usar permite, fazer download e upload então a uma imagem site de hospedagem de imagem.

2

Abra o arquivo HTML. Abra o documento HTML para o site onde a imagem é exibida.

  • Se você tentar inserir uma imagem em um fórum, você pode escrever diretamente para a entrada. Vários fóruns de usar um sistema personalizado em vez de HTML. Pedir a ajuda de outros membros do fórum não funciona.

3

Comece com a tag de imagem. Encontrar um ponto no corpo do seu HTML onde você quer inserir uma imagem. Digite o rótulo aqui. Esta é uma tag vazia, ou seja, que está sozinho, sem uma marca de fechamento. Tudo que você precisa para exibir sua imagem dentro de dois colchetes.

4

Encontre o URL da sua imagem. Visite a página web onde sua imagem está hospedado. Botão direito do mouse (controle - clique no Mac) e selecione Copiar localização da imagem. Você também pode clicar em Ver imagem para ver a imagem em uma página e copie o URL na barra de endereços.

  • Se você enviou a imagem para um diretório de imagens no seu próprio site, vinculá-lo com / images /elnombredetuarchivo. Se não, então o diretório da imagem é provavelmente dentro de outra pasta. Movê-lo para o diretório raiz.



5

Coloque a URL em um atributo src. Como você deve saber, atributos HTML estão dentro de uma marca para fazer modificações. o atributo src É uma abreviação de "fonte" e informa ao navegador onde procurar para encontrar a imagem. Escrever src ="" e cole o URL da imagem entre as aspas. Aqui está um exemplo:

  • # image.jpg

6

Adicionar um atributo alt. Tecnicamente, o HTML tem tudo que você precisa para exibir a imagem, mas é melhor para adicionar um atributo alt. Isso informa ao navegador o texto a ser exibido quando a imagem não carrega. Além disso, acima de tudo, ajuda os motores de busca saber o que sua imagem é de cerca e permite que os leitores de tela para descrever sua imagem visitantes com deficiência visual. Siga este exemplo, alterando o texto dentro das aspas:

  • # image.jpg
  • Se a imagem não é importante para o conteúdo da página, alt inclui nenhum texto (alt = atributo"".)

7

Salve as alterações. Salve o arquivo HTML em seu Web site. Visite você acabou de editar ou atualizar a página se você já tem aberto. Agora, olhe para a sua imagem. Se você não tem o tamanho correto ou não fazer, como outra razão, ir para a próxima seção.

método 2configurações opcionais

1

Redimensiona a imagem. Para melhores resultados, redimensiona a imagem usando um software livre de edição e, em seguida, até a nova versão. conjunto largura e ele alto HTML informa ao navegador para reduzir ou ampliar a imagem, que pode ser inconsistente entre os navegadores e causar (raramente) erros de exibição. Se você estiver procurando por um ajuste rápido e útil, use este formato:

  • # image.jpg (Número de pixels ou "pixels CSS" mais focada em telefones em HTML5)
  • ou # image.jpg (Percentagem de as dimensões do site ou percentagem do elemento HTML que contém a imagem)
  • Se introduzir apenas um atributo (largura ou altura), o navegador deve preservar a relação largura: altura.

2

Adicionar uma descrição. o atributo título Ele pode ser usado para adicionar comentários ou informações sobre a imagem adicionais. Por exemplo, você pode citar o artista aqui. Na maioria dos casos, este texto irá aparecer quando o visitante passa o cursor sobre a imagem.

  • # image.jpg

3

Torná-lo um link. Para fazer uma imagem é também um link, inserir uma tag de imagem dentro da marca de hiperlink . Aqui está um exemplo:

  • # image.jpg

dicas

  • Verifique se o URL inclui o formato de imagens (.jpg, .jpg, etc.) arquivo.
  • imagens GIF funcionar melhor para logotipos ou desenhos animados, enquanto as imagens JPEG funcionar melhor para imagens complexas, tais como fotografias.
  • Na maioria dos casos, é melhor usar apenas imagens com os formatos .jpg, .jpeg, .jpg ou .jpg. Provavelmente, outros formatos podem não ser exibidos corretamente em todos os navegadores.
  • Manter uma imagem de backup em seu computador, apenas por precaução.

avisos

  • Não faça uma "hotlink" inserir a URL do site de alguém como este usa a largura de banda do seu site, sem dar novos visitantes para a sua página. Além de ser errado, imagem "hot-linkeada" desaparecerá se o local ao qual está ligada desaparece. Se o administrador da página ver o que você faz, você pode mesmo mudar a imagem que aparece em seu site.

RELACIONADOS

Artigos Relacionados