Tutto ciò che viene visualizzato da un browser è codificato o richiamato grazie all’HTML.
Ogni pagina web è realizzata tramite un linguaggio che si chiama HTML, ossia Hyper Text Markup Language. In parole povere, ogni file HTML è un file di testo ASCII, all’interno del quale esistono delle stringhe che hanno la funzione di dire al browser come deve essere visualizzato un determinato elemento e altre stringhe che, invece, rappresentano i contenuti. Ogni elemento è contrassegnato da un tag, che può avere funzione strutturale, di presentazione oppure semantica. L’insieme di questi elementi permette di costruire una pagina web.
Poiché l’HTML è semplice testo, si possono realizzare siti web utilizzando, per esempio, il semplice Blocco Note di Windows. Nel prosieguo vedrai come scegliere lo strumento di editing più adatto alle tue esigenze. La versione di riferimento di HTML è la 4.01 il cui standard è pubblicato sul sito del W3 Consortium all ‘indirizzo http://www.w3.org/.
La pagina HTML che viene letta dal browser può essere una normale pagina web come quelle che vedrai all’interno di questo testo, oppure il risultato di una elaborazione di un programma lato server scritto in altri linguaggi come il PHP o 1’ASP. All’interno del file HTML possono poi essere integrati o richiamati piccoli programmi javascript e tag CSS (fogli di stile).
Scrivere i tag
Come fa il browser a riconoscere i tag all’interno del testo?
All’interno di una pagina HTML il browser sa di dover interpretare come “tag” tutto ciò che è contenuto tra i simboli di minore “<” e maggiore “>”.
Ad esempio, in questo frammento di codice:
<p align=center>
Questo è un paragrafo centrato! </p>
Si può distinguere il tag “p” (paragrafo) e i suoi attributi dal testo vero e proprio visualizzato sulla pagina.
Puoi notare anche che esiste un tag di apertura, il primo, e un tag di chiusura, che delimita il paragrafo, in questo caso. I tag di chiusura si distinguono per via dello slash “/I” inserito dopo il segno di minore.
La progettazione
Ogni sito Internet è un ipertesto multimediale ovvero un sistema di documenti, immagini, suoni collegati fra loro. Progettare un sito internet può sembrare un’operazione semplice, che richiede qualche competenza tecnica, un buon programma “che fa tutto da solo” e niente di più.
In realtà per realizzare un buon sito è fondamentale partire da alcune conoscenze di base che non sono solo di carattere tecnico. E importante rendersi conto che, indipendentemente dallo strumento di comunicazione che si sta utilizzando, un sito web è un qualcosa che deve trasmettere informazioni. Un buon punto di partenza per realizzare un sito è quindi sempre quello di realizzare un piccolo progetto, prendendo alcuni appunti su un foglio oppure appoggiarsi a degli strumenti appositi come Microsoft Visio o Smart Draw.
Inoltre realizzare un indice e poi una mappa del sito che si sta per costruire è il modo migliore per organizzarsi il lavoro.
Il soffermarsi a pensare ai propri obiettivi, al modo di strutturare i contenuti, alla logica che seguirà la navigazione interna e la strutturazione delle singole pagine, è un esercizio che ti permetterà di lavorare in modo più veloce, coerente e chiaro e di trasmettere a chi navigherà tra le tue pagine la stessa chiarezza.
Ragionare per ipertesti
In questa fase di progettazione non vanno sottovalutate le caratteristiche specifiche del mezzo. Diceva Mc Luhan “il medium è il messaggio” e mai questa massima è stata tanto vera quanto nel web. Le modalità di fruizione di un sito, infatti, condizionano moltissimo la percezione che l’utente ha dei contenuti, la loro comprensione e la generazione di quell’interesse che lo trattiene.
Devi considerare che stai lavorando su un ipertesto, che non è solo un insieme più o meno organizzato di testi e immagini, ma anche un sistema navigabile di collegamenti e associazioni logiche.
Organizzare le proprie risorse
Questo rigore nella progettazione dovrebbe essere riportato a livello pratico anche nella gestione delle risorse che sono inserite nel sito. Andando avanti vedrai come ogni pagina può essere collegata ad altre pagine, a fogli di stile, a immagini o animazioni. Tutto questo insieme di materiali dovrebbe essere salvato sul proprio disco se-condo una logica evidente, con nomi di file comprensibili.
Scegliere gli strumenti preferiti
Un altro passo importante prima di cominciare è scegliere uno strumento di sviluppo che sia congeniale alle proprie competenze e ai propri obiettivi.
Se hai l’anima del programmatore e vuoi avvicinarti al web editing per poi muoverti verso la programmazione più avanzata, sicuramente preferirai lavorare con un editor testuale che ti permette di controllare al massimo il codice.
Manuale web gratis – Seguimi su questo sito semplicemente cercando tutti gli articoli di #prosperica 🙂