Contenido

• Al paso
• Método 1 de 1: Insertar imágenes con HTML
• Consejos
• Advertencias

Agregar imágenes a su sitio web o perfil de red social es una excelente manera de vestir su página web. HTML (HyperText Markup Language) tiene muchas funciones para crear páginas web, pero afortunadamente el código que necesita para agregar imágenes no es demasiado difícil.

Al paso

Método 1 de 1: Insertar imágenes con HTML

1. Sube tu imagen a un sitio web de alojamiento gratuito, como Photobucket o TinyPic, que permita enlaces activos. El enlace activo permite un enlace directo de una imagen al servidor del sitio web; algunos proveedores han prohibido esto porque la vinculación en caliente usa su ancho de banda y ocupa espacio en sus servidores.
   • Si tiene una cuenta de alojamiento de pago, cargue las imágenes directamente en el servidor donde se encuentra su sitio web. Esto siempre es más confiable que un sitio gratuito y no tiene por qué ser caro en absoluto.
2. Abra un nuevo documento en un editor de texto (p. Ej., Bloc de notas / Bloc de notas) o abra la página en su sitio web / perfil donde puede cambiar el código HTML directamente.
3. Empiece con el img etiqueta. La img la etiqueta está vacía, lo que significa que no se necesita etiqueta de cierre. Sin embargo, para la validación de XHTML, aún puede poner un espacio y una barra al frente. mas grande que firmar.
   • img />
4. Hay muchos atributos disponibles, pero solo uno es necesario:src. Esa es la ubicación / dirección, o también la URL, de su imagen.
   • img src = "URL de la imagen" />
5. A continuación tienes que alt agregar atributo. Esto muestra un texto alternativo, en caso de que la imagen no se cargue. Este también es un servicio para personas con discapacidad visual que utiliza lectores de pantalla.
   • Si pasa el cursor sobre una imagen, este texto también se muestra como información sobre herramientas, pero este es solo el caso en Internet Explorer. La solución que funciona con todos los navegadores (Firefox et al.) es para eso título atributo para usar además de alt. (Puede omitir este último si no desea que la imagen tenga información sobre herramientas).

Como ejemplo:img src = "URL de la imagen" alt = "Por si acaso" title = "Tooltip" />

1. Ahora podría indicar el tamaño de la imagen con el altura y ancho atributo, y especificando los píxeles o un porcentaje. Tenga en cuenta que cambiar el tamaño de esta manera solo cambia el tamaño de la vista, no el tamaño de la imagen en sí. Para acortar el tiempo de carga de una imagen, es mejor, especialmente con imágenes grandes, cambiar su tamaño de antemano con un software de edición de fotografías o con un servicio en línea como PicResize.com.
   • img src = "URL de la imagen" alt = "Por si acaso" title = "Tooltip" height = "50%" width = "50%" />
   • img src = "URL de la imagen" alt = "Por si acaso" title = "Tooltip" height = "25px" width = "50px" />

Consejos

• El valor de estos atributos se da en píxeles o como porcentaje, del 1 al 100%.
• La imagen se puede colocar en cualquier lugar de la página web, utilizando los diversos atributos de formato, como superior, inferior, medio, derecha, izquierda, etc.
• El atributo hspace se usa para insertar espacio horizontal a la izquierda y derecha de una imagen, mientras que el atributo vspace se usa para hacer espacio en la parte superior e inferior de las imágenes y otros objetos.
• No te dejes llevar demasiado por las imágenes. Eso parece desordenado y poco profesional.
• Las imágenes GIF están bien para logotipos o dibujos animados, pero este tipo de archivo es menos adecuado para fotos y otras imágenes con muchos colores.
  • Las imágenes GIF solo admiten colores de 8 bits con un máximo de 256 colores para una imagen. Por lo tanto, es de esperar que la reproducción de una ilustración o fotografía en color de 16 o 24 bits no sea tan buena.
  • Las imágenes GIF también admiten transparencia. Es posible un poco de transparencia, lo que significa que un color puede hacerse transparente.
  • El entrelazado también es compatible con imágenes GIF, lo que significa que el visitante del sitio tendrá una idea de cómo se verá la imagen antes de que se cargue por completo.
  • El formato GIF también admite animación.
• Asegúrese de que la URL indique el formato de archivo de la imagen (.webp .gif, etc.).

Advertencias

• ¡No Hotlink!