Linguaggio HTML

 

per collaborazioni, commenti, critiche, e altro contattateci alla e-mail: clubinfo@libero.it risponderemo al più presto!

Corso sul linguaggio HTML

Terza lezione

di Emilio Sabatucci

Per commentare, dare suggerimenti o consigli (molto apprezzati) e per segnalare eventuali errori o
disattenzioni (sempre possibili), puoi inviare una email all'autore (clicca sul nome sopra). Grazie per la collaborazione!

 


Colori e immagini


Nelle pagine precedenti si è visto come scrivere testi per il web. In questa invece vedremo come rendere più gradevole una pagina web attraverso l'uso di colori e di immagini.

I COLORI
2 sono le parti di una pagina web che possono essere modificati nei colori: i testi e gli sfondi. Per colorare un testo abbiamo già visto che basta racchiuderlo tra i tag < FONT > con l'attributo color. Colorare uno sfondo è altrettanto semplice. Basta infatti inserire all'interno del tag < BODY > l'attributo BGCOLOR.Sempre all'interno di questo tag possono essere inseriti gli attributi: TEXT ( controlla il colore del testo di tutta la pagina )
LINK (controlla il colore dei link che non sono stati ancora cliccati)
VLINK (controlla il colore dei link già cliccati)
esempio: < BODY BGCOLOR="green" TEXT="RED" LINK="yellow" ALINK="navy"> questo produrrà sullo schermo uno sfondo verde con testo rosso link gialli e link cliccati blu

I NOMI DEI COLORI
I colori riconosciuti dai browser sono espressi in due modi:


la secondà possibilità è certamente la più pratica, ma fornisce meno varianti rispetto alla prima. Infatti i nomi dei colori sono limitati rispetto a tutte le loro possibili variazioni che si possono ottenere attraverso il formato RGB: questo formato esprime il colore attraverso una sequenza di 3 numeri (che rappresentano rosso,verde e giallo) compresi tra 0 e 255 ( 0 0 0 esprime il nero, 255 255 255 esprime il bianco). Il valore trovato in formato RGB deve quindi essere convertito nel suo corrispondente esadecimale. Questa operazione però è piuttosto complicata così da rendere di non facile applicazione questo formato, se non attraverso l'uso di appositi convertitori.

LE IMMAGINI
Le immagini sono le parti che più contraddistinguono, nel bene e nel male, una pagina web. Mi spiego subito: La grafica di una pagina è fondamentale, ma ben più importante è la "pesantezza" della stessa. Un sito web può avere una grafica notevole, ma se poi l'utente,nel caricarlo su schermo, perde più di un minuto difficilmente tornerà a consultarlo. E' utile quindi non riempire una pagina con troppe immagini e soprattuto imparare a compressare le immagini.Le immagini che girano sul vostro computer hanno formati molto vari: 2 soli sono utili per il web: I formati GIF e JEPG. Qualunque immagine vogliate inserire nella pagina, dovrete prima salvarla in uno di questi 2 formati attraverso un programma di grafica (credo vada bene anche l'imaginig di windows).L'immagine perderà un po' in qualità ,quindi spetterà a voi scegliere il formato più adatto. Uno stesso formato dispone di più varianti a seconda del numero di colori utilizzati. Naturalmente più colori vengono utilizzati, più pesante sarà la pagina. In genere il formato GIF è quello più usato per bottoni ed altri oggetti semplici mentre quello JPEG (può anche essere scritto JPG) è più usato per compressare immagini elaborate (soprattutto foto).
Per inserire un'immagine il TAG è < IMG> seguito dall'attributo SRC="nome immagine.gif".
Es:< IMG SRC="foto.jpg">.
Se dovete provare questo TAG sul vostro computer vi consiglio di creare appositamente una cartella in cui inserire sia il codice HTML sia le eventuali immagini.In caso contrario infatti dovreste fare precedere il nome dell'immagine dal percorso attraverso cui il computer può risalire ad essa (es:Documenti/immagine1).

IMMAGINI E TESTI
Normalmente il browser inserirà l'immagine in un'unica riga. Quindi se dovrete affiancare del testo all'immagine, la prima riga sarà a lato dell'immagine,le altre andranno sotto. Per ovviare a questo inconveniente si deve aggiungere al TAG < IMG> l'attributo ALIGN che può assumere come valori RIGHT o LEFT (posizione dell'immagine rispetto allo schermo;testo di fianco all'immagine) e TOP, MIDDLE o BOTTOM (allinea il testo a fianco l'immagine con i bordi superiore, inferiore o con il centro di questa).

GLI SFONDI
Abbiamo già visto come colorare lo sfondo di una pagina; con un TAG semplecissimo è invece possibile inserire un'immagine come sfondo. Basta aggiungere al TAG < BODY> l'attributo BACKGROUND seguito dal nome dell'immagine:
es. < BODY BACKGROUND="sfondo.gif"> In questo modo il browser userà l'immagine come sfondo ripetendola varie volte a seconda delle sue dimensioni. Il mio consiglio è sempre quello di usare immagini piccole che possano essere concatenate. Un immagine grande infatti oltre a portare rallentamenti nella fase di caricamento, porta difficoltà di gestione: Non potete infatti prevedere quale sarà la grandezza del monitor dell'utente e quindi un'immagine che riempe interamente il vostro schermo potrebbe invece essere riprodotta una volta e mezzo in un altro monitor creando un effetto orribile.

torna sopra


Questo articolo è stato scaricato dal Club di informatica
Pagina curata da:
Emilio Sabatucci