|
TUTORIAL: COSTRUZIONE PAGINE WEB, SCRITTURA (riassunto).
|
|
TUTORIAL: COSTRUZIONE PAGINE WEB, SCRITTURA (riassunto).
|
|
Di Francesco De Luca _caad2002 Tutorial completo: Scrittura Prima di cominciare ad illustrare gli strumenti basilari per creare pagine web, apriamo un browser (programma per "navigare" in Internet) ed analizziamo alcune informazioni che riguardano l'indirizzamento. I programmi che usiamo abbitualmente come Netscape o Explorer hanno il compito principale di cercare ed aprire determinati file, che a loro volta contengono informazioni affidate a diversi media. L'indirizzo o URL (Uniform Resource Locator) che digitiamo è composto da una parte iniziale che indica il tipo di potocollo da utilizzare per metterci in comunicazione con il server remoto, che in genere è HTTP (HyperText Transfer Protocol), dall'indirizzo del web server che in genere è WWW (World Wide Web) ma che può anche essere w3, home, members ecc., e dall'indirizzo vero e proprio che termina con l'indicazione del tipo di dominio .com .net .org ecc.o della nazione di appartenenza .it .es .de .fr ecc. Quando digitiamo un indirizzo web nel browser il nostro provider fa una risoluzione dello stesso in un indirizzo IP (Internet Protocol) statico, cioè traduce quel testo in un numero che rappresenta il vero indirizzo di una determinata pagina nel web in quanto rappresenta il nodo all'interno della rete. Nel momento in cui il browser punta una pagina automaticamente cerca un file che rappresenta la pagina iniziale di un determinato sito. In genere quel file si chiama index.htm o html (HyperText Markup Language). Questo significa che il primo file che dobbiamo creare del sito in costruzione deve avere questo nome ed estensione. La sigla HyperText Markup Language sta ad indicare il linguaggio che è alla base di tutti i web editor che permettono la creazione di pagine web, prima dei quali, solo fino a pochi anni fa, era necessario conocere l'html per generare ipertesti. Apriamo adesso il programma che utilizzeremo per la creazione delle pagine cioè il Netscape Composer che è un modulo all'nterno del browser Netscape Navigator. L'imagine: 1) L'immagine da utilizzare all'interno della pagina deve essere copiata o trasportata all'interno delle cartelle riguardanti i file del sito. Possibilmente nella stessa cartella dove risiede il file html della pagina che deve ospitarla o in una cartella eventualmente dedicata a contenere solo immagini di alcune pagine, simili tematicamente,del sito. Il Composer ha una opzione ( Leave image at the original location), presente in questa finestra di dialogo, che se deselezionata copia automaticamente l'immagine scelta nel folder dell'html sul quale la si inserisce. In ogni caso è sempre bene assicurarsi della disposizione dei file nelle varie cartelle. 2) Le immagini da pubblicare possono essere di due tipi, .jpg (il + usato) e .gif. In ogni caso devono essere molto leggere per rendere il caricamento della pagina veloce. La risoluzione alla quale vanno salvate è 72 Dpi (Dot per inch) in quanto questa è la risoluzione alla quale i monitor lavorano. Inoltre chi utilizza il programma di fotoritocco Photoshop può ulteriormente scegliere la qualità/risoluzione dell'immagine nel momento in cui salva in .jpg. Nella scala Image Option è sufficiente raggiungere il valore 6/8. Uno degli aspetti fondamentali da considerare creando pagine web è la dimensione delle stesse. Pagine troppo grandi saranno visualizzate male o navigate scomodamente dalla maggiorparte degi visitatori. La risoluzione media utilizzata per i monitor è 1024x768 pixel (larghezza x altezza ) altre possono essere 800x600 o 1280x1024. Quindi è importante che la larghezza degli oggetti o dei testi che utilizziamo all'interno delle pagine non superi i 1024 pixel. Molti portali o siti di società ed istituzioni importanti è impostato sugli 800. Siti particolarmente avanzati hanno pagine che riconoscono la risoluzione dei nostri scgermi e si adattano di conseguenza. Per determinare la larghezza in pixel della pagina che stiamo creando ci sono diversi modi. Per esempio utilizzare immagini che a 72 Dpi non superano la dimensione desiderata in orizzontale. Alcuni programmi di impaginazione web più avanzati hanno anche strumenti di misura come righelli o la stessa dimensione della finestra di lavoro dimensionabile con precisione. A questo punto abbiamo due possibilità principali: creare un collegamento ad una altra pagina sul nostro sito (quello che vogliamo fare ora) o ad una pagina in rete. Selezionando Choose File possiamo scegliere la pagina andando a selezionare il file html da poco creato nella sua cartella. Anche se poi tutto il lavoro sarà trasferito sul server il browser che espolrerà le vostre pagine automaticamente cercherà la pagina all'interno della vostra directory o in rete. Dopo aver selezionato il file html nella sua cartella attraverso i pulsanti Apri nella finestra di dialogo Link to File e OK nella finestra di dialogo Character Properties il testo selezionato sarà linkato alla pagina indicata. Come conferma il testo cambierà colore e presenterà una sottolineatura, caratteristica che segnalerà al visitatore il link attivo. Adesso proviamo a collegare un altro testo ad una pagina esterna. Dopo averlo selezionato riattiviamo il comando Link sul Toolbar principale. Questa volta nella finestra di dialogo Character Properties non dobbiamo scegliere un file html all'interno della directory locale che contiene i file del nostro sito, come precedentemente illustrato attraverso il pulsante Choose File, ma dobbiamo digitare o incollare nell'apposito spazio Link to a page location or local file l'indirizzo web reale della pagina da collegare. A questo punto la frase selezionata condurrà alla pagina esterna in rete. Per finire possiamo provare a linkare altri tipi di oggetti, per esempio possiamo collegare l'immagine iniziale sulla homepage ad una altra immagine più grande senza dover necessariamente creare una nuova pagina che la contenga. C'è la possibilità di un equivoco. E' sottinteso che i testi non linkano solo pagine e immagini linkano solo altre immagini, ovviamente i collegamenti possono essere anche di tipo incrociato cioè immagini che collegano pagine o testi che collegano immagini e molte altre cose in un verso e nell'altro. Per poter collegare l'immagine iniziale che si chiama nebula04.jpg presente sulla homepage ad una altra identica ma più grande che si chiama nebula04G.jpg , entrambi presenti al livello più alto della directory che contiene i file del nostro sito, è sufficiente selezionare l'immagine di partenza con il tasto destro del mouse e scegliere l'opzione Image/Link Properties (oppure attraversoil tasto Link sul Toolbar principale) Ovviamente l'argomento è vastissimo e può essere approfondito attraverso manuali o anche cercando in rete tutorial e articoli vari. Alcuni link utili sono i seguenti. http://www.neosintesi.com/tools/ http://www.mclink.it/docs/mcweb/ita/risorse/ http://italianwebspace.com/db/informatica/manuali/
|
