Etiquetes

dilluns, 9 de gener del 2012

Gràfics dins la pàgina web

El format millor per a fotografies o imatges molt riques de color és el format JPEG, mentre que per a figures geomètriques, texts, imatges molt petites, dibuixos sense gaire colors, logos, etc., el GIF és més aconsellable.




Desenvolupament de la segona part de la pràctica

 Inserir imatges envoltades de text dins la pàgina web

  • Creeu el document m3_5b.htm i poseu-hi el títol "El meu llibre" a partir del menú Modificar Propiedades de la página.
  • Seleccioneu un color de fons mat (que no faci mal als ulls) i accepteu.
  • Cliqueu al botó Icona per a insertar imatgeso a Insertar | Imagen de l'opció Común. Seleccioneu la imatge m3a.jpg de la carpeta imatges. Accepteu.
  • Modifiqueu les mides de la imatge a partir de la finestra Propiedades: escriviu la mida que desitgeu, o amplieu o reduïu la imatge estirant amb el cursor un vèrtex de la imatge que heu inserit. Si voleu estirar la imatge i mantenir les proporcions, premeu la tecla de majúscules alhora que arrossegueu.
  • Escriviu, a l'opció Alt, el text que voleu que es llegeixi quan es posi el cursor sobre la imatge (com a text alternatiu).
  • Si voleu, podeu deixar la imatge sense marc, escriviu el valor 0 a Borde, o, si la voleu amb marc, seleccioneu Borde 1 per posar un marc a la imatge.
  • Centreu la imatge utilitzant el botó d'alinear de la finestra Propiedades.
 Finestra  Propiedades


  • Escriviu el nom de la imatge (sense l'extensió) a la part inferior esquerra, a sota de la imatge reduïda on surt el pes que fa.

 Espai per a escriure el nom de la imatge
D'origen, el programa us dóna el nom més l'extensió de la imatge

  • Guardeu el document. Ja teniu una imatge a la pàgina, però és difícil situar text al voltant.
  • Escriviu a la página web, utilitzant el teclat directament, un text de tres línies sobre el llibre que heu escollit al començament d'aquest mòdul. Podeu recomanar-lo, o bé explicar per què el feu servir.
  • Torneu a col·locar el cursor sobre la imatge i premeu l'opció Alinear | Izquierda: veureu que el text envolta la imatge. Proveu les altres opcions d'arrenglerar per veure quina us convé.
  • Guardeu el document.
  • Premeu F12 per veure com queda la pàgina.
Veureu com el text queda massa enganxat a la imatge. Seria molt convenient deixar un espai de distància al costat i per sobre entre el text i la imatge, ja que visualment l'efecte serà millor.

 "Espacio V" Espacio H" només omplir si no es fan taules
Separació horitzontal i vertical entre el text i la imatge
  • Poseu les dades al quadre Espacio H 12, i 8 al quadre Espacio V de la finestra Propiedades. Si no voleu fer servir aquests valors, proveu-ho amb altres números parells i vegeu com queda.
  • Guardeu la pàgina m3_5b.htm a la vostra carpeta mod3.
  • Premeu F12 per veure com us ha quedat la pàgina.


    Fes un hipervincle a aquesta pàgina en el portal d'entrada que ja vas fer anteriorment,  a la tercera fila segona columna, poseu el text Exercici 04  i no t'oblidis de guardar un pantallazo a la teva col.lecció de Gmail.

Cap comentari:

Publica un comentari a l'entrada