Competències bàsiques en TIC
 
 

Mòdul 4: Iniciació a l'Ofimàtica
 
Imprimir la unitat
  Tema: Edició de documents digitals
  Unitat 3.4: Inserció d'imatges (I)
   
  Presentació

Veurem con introduir una imatge en un document digital utilitzant-hi HTML:

És convenient guardar les imatges en la mateixa carpeta que el document.

  Teoria de la unitat
 

 

Les imatges

En un document digital les imatges no necessiten una gran qualitat fotogràfica, es veuen bé amb pocs kb d'arxiu. Que les imatges tinguin poc pes és molt important si la destinació és una pàgina web, perquè així triga menys a carregar-se.

Les imatges inseribles en un document digital són les de format .gif, .jpg i .png.

El format gif va bé en el cas d'imatges amb colors plans, com ara dibuixos; també n'hi ha d'animats. El format .jpg és l'ideal per a fotografies, es pot comprimir molt la imatge sense desvirtuar-ne el color. El format .png pesa més que els .jpg, no perd res en la compressió i és de codi lliure.

Per reduir la imatge de mida i pes cal usar un programa de dibuix o de retoc fotogràfic. En la unitat 3.7 ho practicaràs.

Referenciar una imatge

Per referenciar una imatge es fa servir l'etiqueta

<IMG SRC="nomimatge.jpg">

(recorda que l'extensió pot ser .jpg, .gif, .png). Així es crida una imatge desada a la mateixa carpeta que el document digital.

De moment guardarem les imatges en la mateixa carpeta. Si n'hi ha gaires, normalment es defineix una subcarpeta "imatges" dins la carpeta on hi ha el document digital.

Altres etiquetes:

<CENTER> </CENTER> Situades abans i després de la imatge, la centraran a la finestra del navegador
TITLE="text"
 Dins l'etiqueta imatge, és el text que apareix si per alguna raó no es carrega la imatge; en alguns navegadors apareix també en situar el ratolí sobre la imatge.
WITH="..." HEIGHT="..." Dins l'etiqueta imatge defineixen la mida amb què la mostrarà el navegador. Si no hi són la imatge es mostra amb la seva mida original.

 
  Pràctiques
   
 

 

Per treballar els continguts de la unitat que estem treballant et proposem que facis les pràctiques següents...

Pràctica 1: Inserir una imatge

  1. Crea en el teu directori, dins edició_digital, una carpeta unitat_4.3.4. En aquesta carpeta guarda les imatges (fes servir anomena i desa) que farem servir:

papa1.jpg .. papa2.jpg

  1. Obre la llibreta de Windows i escriu:

<IMG SRC="papa1.jpg"> crida la imatge papa1.jpg que hi ha desada a la mateixa carpeta que el document digital.

  1. Anomena al document ppllona1.htm i desa'l a unitat_4.3.4, obre el document amb el navegador i comprova'n el resultat.
  2. Ara fes un altre document ppllona2.htm que tingui l'aspecte:

 

 
  I ara, què vols fer?
   
 
Imprimir la unitat Inici de la pàgina Inici del mòdul pàgina següent Inici dels materials de formació
   
Actualitzat a 1 de juny del 2007