L'Html è il linguaggio che stà dietro alle pagine web che vedi ogni volta
che navighi in un sito.questo codice lo puoi vedere semplicemente cliccando
sul tasto destro del mouse all'interno di una pagina e scegiere la voce "HTML"
(o in alcuni sistemi operativi "visualizza origine HTML").
il codice HTML è costituito da
tag (righe di testo)ognuno dei quali permette al browser (es:internet explorer\netscape)
di realizzare alcuni comandi.
All'interno del codice Html possiamo trovare altri tipi di linguaggi,come ad esempio
il Javascript ,il Dhtml,asp e altri tipi di linguaggi più complicati che hanno
come fine l'interattività con il visitatore.
per avvicinarsi a questo interessante linguaggio di programmazione la migliore
cosa e comprarsi una delle tante guide che si trovano in libreria e imparare
da li i concetti fondamentali oppure visitare uno dei tanti siti che circolano
in rete riguardo a questo argomento (in fondo alla pagina ci sono alcuni link
esterni)
In questa pagina cercherò soltanto di darvi una prima infarinatura sull'argomento
,che-sicuramente,vi affascinera tanto quanto ha affascinato me
prima
di tutto parliamo degli strumenti
:
- possiamo scegliere un semplice editor di testo come il blocco note di
window (che è anche gratis) oppure -se nn abbiamo voglia di mettere in pratica
quello che abbiamo imparato di html-possimao sempre ricorrere a
- editor avanzati wysiwyg(what you see is what you get::quello che vedi
e quello che fai) che funzionano come semplici programmi di videoscrittura(es:word
di window) nei quali ci si limita a scrivere e ad inserire immagini o altri
oggetti senza sapere un ca**o di html.
alcuni
esempi di editor wysiwyg sono elencati
di seguito ::
- Namo web editor (sicuramente ottimo x cominciare x la sua facilità)
- ms frontpage (editor semplice ma che nn e offerto in trial
o shareware -gratis quindi-)
- dreamwewer (il migliore secondo molti ma difficile x le sue infinite
funzioni)
- go alive (software di adobe altamente professionale e quindi
ostico x cominciare)
..e tanti
altri di minore importanza..
se usate questi editor visuali,costruire siti sarà semplice ma anche troppo meccanico
,e oltre a costruire pagine pesanti e grammaticamente scorrette ,nn potrete mai un giorno spingervi più in là del solito testo e sarete costretti a continuare a produrre pagine steritli e monoone senza poter usufruire delle meraviglie del javascript o di linguaggi server-side come asp e SQL !!
scelto il mezzo parliamo della tecnica ...
la migliore cosa e-come ho detto-comprare un buon manuale,ma si puo imparare
anche molto dal lavoro degli altri e piano piano imparare i rudimenti.
comunque una pagina web e strutturata in questo modo::
__________________________________________________________________________________________
<!DOCTYPE HTML PUBLIC"-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3c.org/TR/html4/loose.dtd
\\dichiarazione
di conformità agli standard del w3c (www.w3c.org)
<html> \\
inizio della pagina
<head> \\inizio
prima parte della pagina non visibile al visitatore
<meta name="Description" content="descrizione
del sito x i motori di ricerca e l'indicizzazione corretta all'interno di essi">
<meta name="Keywords" content="parole,chiave,separate,da,virgole,sempre,x,i,motori,di,ricerca">
<title>oooooooo</title> \\titolo
del sito che appare sulla barra in alto allo schermo del browser
</head> \\fine
prima parte della pagina che nn verra visualizzata dal visitatore
<BODY bgColor=#000000 text="#ffffff" link="#0080ff"> \\caratteristiche generali della pagina
[*i colori sono scritti in valori esadecimali]
adesso puoi scrivere tutto quello che vuoi sia contenuto
nel sito
<FONT color=#ffffff size="2" face="Arial">text<FONT> \\caratteristiche del testo [il colore è ancora in formato esadecimale ,ma se si preferisce si possono utilizzare parole particolari accettate dai browser per i colori base come black \ white \ecc.. | con size si indica la misura del carattere che può andare dall' 1 al 7 per le misure standard e dal-1 al +4 per le grandezze extra | face delinea invece il font del carattere come new times roman,verdana ,ecc.. -> si consiglia di usare font presenti per defaul nei PC dei navigaNTI e di nn andare a cercare caratteri stravaganti]
adesso puoi scrivere tuto quello che vuoi sia contenuto
nel sito
per allineare al centro una scritta usa <center>scritta</center>
per evidenziare in grassetto usa <b>scritta</b>
per sottolineare usa <u>scritta</u>
per mettere la scritta in corsivo <i>scritto</i>
per aumentare la dimenzione del carattere <h1>scritta</h1> .. <h2>scritta</h2> ..<h6>scritta</h6>
per avere uno spazio in bianco senza andare a capo
per aumentare lo spazio
per andare a capo e lasciare una riga vuota <P>
per andare a capo normalmente <BR>
inserire un'immagine <img src="nomefile.jpg" alt="testo alternativo" widtht="400" height="120"> [i formati immagine devono essere per forza o .jpg o .gif o .png | il testo alternativo è quello che si vede quando si posa il cursore sulla foto o quando la foto nn si vede | width è la larghezza dell'immagine e height è la sua altezza -queste due ultime indicazioni nn sono necessarie ma facilitano il caricamento della pagina]
collegamento ipertestuale ad un'altra pagina web <A
href="http://www.hardcore2002online.tk">scritta</A> [si usa l'indicazione http:// ogni volta che si tratta di una pagina web ,ma si possono usare diciture come ftp:// per i siti che ospitano solo files ,o mailto:indirizzo@provider.it per gli indirizzi email | per aprire la pagina linkata in una nuova finestra si deve utilizzare il parametro target="_blank" proprio di seguito alla url separato dal resto tramite uno spazio ]
commento nn visibile al navigante <!--comment --> [serve spesso al webmaster per rendere piu semplice la struttura o per aumentare la densità delle parole chiave nel testo e guadagnare posiazioni nei motori di ricerca]
linea separatrice <hr size="1" width="80%" align="center"> [strumento molto utile che consiste in una linea continua per differenziare i contenuti | il parametro size indica il suo spessore | width è la larghezza che si può esprimere in pixel o in percentuale | align è l'allineamento rispetto alla pagina e supporta le variabili center,left e right]
per mantenere la formattazione originale del testo <pre>text</pre> [utile per le stringhe di codice o per mantenere una certa formattazione del testo]
un elenco a pallini <ul><li>prima voce</li><li>seconda voce</li></ul> [per creare un elenco si usano i tags -ul- (unordered list) e -ol- (ordered list) ,il primo si usa per l'elenco a pallini mentre il secondo per quello numerato . -li- indica invece la voce dell'elenco e va inserito sempre con apertura e chiusura sia in ol sia in ul]
per mantenere la formattazione originale del testo <table width="10%" height="80%" border="0">
<tr>
<td>riga1 colonna1</td>
</tr>
<tr>
<td>riga 2 colonna1</td>
</tr>
<tr>
<td>riga 3 colonna1</td>
</tr>
</table> [le tabelle sono un elemento importante sia dal punto di vista strutturale sia sa quello dell'organizzazione delle informazioni ,la table in apertura supporta i parametri width e height che come sempre sono larghezzae altezza e possono andare in pxl o in percentuale ,border invece indica lo spessore del bordo -> se il valore è 0 allora il bordo nn si vede e la tabella è di tipo strutturale |
-tr-(table row) indica una riga mentre -td- (table data)è il contenuto della casella . se più td sono sono inserite in un tr si formeranno diverse colonne : attenzione pero a riportare lo stesso numero di td in ogni tr della tabella !!]
</html> \\fine
della pagina web
________________________________________________________________________________________
- come avete visto nella maggior parte dei casi a ogni tag <x>
corrisponde un'altro tag </x> di chiusura che non si puo
assolutamente tralasciare
- i meta tag che vi ho mostrato sono solo i piu importanti che
si possono inserire ,ma ne esstono altri che pero nn servono a
molto !
- se usate piu tags -del tipo<X></X>- insieme ricordatevi
di mantenere l'ordine di annidamento (chiusura-apertura) ...come
segue :: <1><2><3>...</3></2></1>
qui finisce la mia mini-guida ,che aveva come obiettivo quello
di offrirvi una piccola panormaica del mondo html (se volete imparare
di + ritornate qui al prossimo aggiornamento)
ultimo aggiornamento :01 - 03 -2003
per + info vai a ==>
www.w3c.org ---------www consortium (fornisce gli standard
per il codice html)
www.html.it ---------sito italiano dedicato all'html-qui trovi
tutto :manuali,esempi,codici gia pronti,ecc..
Per un po' di servizi extra visita ::
www.freetoolkit.net
www.bravenet.com
www.hotscripts.com
www.javafile.com
www.risorse.net
www.webmasterpoint.org
www.stylweb.it
ecc..
Homepage
Preferiti