Ecco qui il nuovo layout del nostro sito fatto con i fogli di stile e senza tabelle.
Il sito è scritto in linguaggio Xhtml 1.1 validato dal W3C e viene letto da tutti browsers, rispettando tutti i parametri della accessibilità.
Per la validazione del validatore del World Wide Web Consortium fare clic
qui
per sapere cosa sia il W3C potete leggere questa pagina della Wikipedia italiana (enciclopedia libera).
Questo nostro sito è fluido (fluid) e quindi viene visto con qualsiasi tipo di risoluzione di schermo (dal 640x480 all'800x600 al 1024x768 eccetera).
Il nostro eventuale lettore può a suo piacimento ingrandire o diminuire la grandezza dei caratteri (in Internet Explorer = Visualizza --> Carattere) visto che facciamo uso di una grandezza di font relativa (in percentuale) e non fissa.
Inoltre avendo il nostro sito un foglio di stile per la stampa potrete comodamente stampare le nostre pagine senza che vengano stampati il menu orizzontale e quello laterale ma solo il contenuto vero e proprio di ogni singola pagina (potete rendervene conto provando una "Anteprima di stampa").
Sono anni che lavoro nella costruzione di pagine web per la Croce Rossa in Umbria, sono anni che sento dire "Adesso faremo anche noi il nostro sito" e sono anni che questi nascenti siti non li vedo nascere.
Convinto, come sono, che bisogna condividere quello che si sa e non sapendo come poter "scavalcare" certe tipiche reticenze italiote fatte più di gelosie ed invidie che altro, ho deciso di mettere questo template a disposizione di quelle persone che sentono il desiderio di avere il proprio sito in internet.
Grazie a questo template ed ai due fogli di stile che lo accompagnano chiunque potrà finalmente avere questa opportunità mentre noi finalmente avremo il piacere di veder nascere altri siti con nuove idee con cui confrontarsi.
Ci vuole una grossa onestà mentale ad ammettere che non si sa costruire una pagina web.
Ma, non ammettendolo, il bivio si dovrebbe conoscere: a quel punto o non si fa nulla adducendo scuse varie (e questo è un peccato perché magari si hanno idee bellissime da condividere con gli altri) o ci si butta a fare la propria dove, a parte i contenuti magari anche interessanti, chi ci si imbatte capisce subito che non è certo il massimo nella sua struttura.
Sì struttura, perché una pagina web è come una casa: è fatta di cemento, muri portanti, finestre, balconi e tutto il resto.
Non ci si può improvvisare quello che non si è solo perché abbiamo, magari, il programma dedicato che costruisce per noi le pagine; così al massimo otterremo qualcosa di passabile ma di cui non abbiamo alcuna padronanza.
Se invece vorrete approfittare di questa opportunità seguendo inizialmente i miei consigli vedrete che un poco alla volta il tutto (ricordate però che non si finisce mai di imparare) vi sarà chiaro e diventerà vostro come è giusto che sia e allora sì che avrete padronanza della vostra pagina e inizierete quelle modifiche che la faranno diventare sempre più vostra.
Ma, nel frattempo, il vostro sito sarà stato indicizzato dai grandi motori di ricerca perché ben strutturato e quindi avrete i vostri lettori che sono la ragione per cui si fanno le pagine.
Qui in internet una cosa è chiara: viene prima la gallina (la struttura principale) e poi l'uovo (le singole pagine con la loro estetica).
Bisogna sempre ricordarsi che chi cerca qualcosa in internet non cerca voi e la vostra bellissima e vuota pagina di contenuti: cerca, magari, una biografia e vuole una biografia.
Il resto, se gli date quello che cerca, lo vedrà - forse - dopo.
Altrimenti cliccherà sul tasto "Indietro" del suo browser e cercherà in siti altrui quello che sta cercando.
Ricordo ai vari webmasters di Croce Rossa in Umbria che con Ordinanza Commissariale del 19 marzo 2003 (girata a tutte le sedi di Croce Rossa in Regione) sono passato da webmaster regionale dei VdS a webmaster del Comitato Regionale e quindi intercomponente.
Avendo sempre pensato che non c'è alcuna differenza fra noi in quanto tutti facenti parte di un'unica grande famiglia non vorrei ricredermi con alcuni atteggiamenti che vedo qui da noi (mi avete capito).
Quindi, visto che conosco la materia di cui parlo (sicuramente meglio di voi), non capisco come mai alcuni non abbiano ancora messo la partita iva in home page nonostante i miei ripetuti inviti, non capisco come mai nascano siti a mia insaputa, non capisco l'aria di superiorità di alcuni che nemmeno mi rispondono (vero signor "sette prinipi" che sono due anni che te lo dico?).
E mi fermo qui.
Ho detto che non capisco, ma è purtroppo chiaro che capisco.
Non approfittatevi del fatto che sono persona accomodante: brutta razza la mia.
Questa pagina è nel suo interno commentata dal webmaster per facilitare la comprensione dei vari passaggi.
Per poter leggere i commenti basta vedere l'Xhtml qui sotto; i commenti sono scritti in questo modo:
<!-- commento del webmaster -->
per usare questo template di pagina basta salvarlo come (cliccare per aprirlo, selezionare tutto e salvarlo)
index.htm
non vi si apre con internet explorer, eh?
Già perché è stupido; non a caso avrete visto nel vostro girare in internet tanti siti che vi consigliano di navigare con Mozilla/Firefox che è rispettoso dei parametri, pesa pochissimo e non è stupido (chiamiamo le cose col loro nome).
In questo caso cliccateci sopra col tasto destro e "Salva oggetto con nome".
A questo punto lo "stupido" vi proporrà di salvare il file come index.xml avendo visto che il nostro template inizia con una dichiarazione di xml appunto (dalla serie che lo stupido pensa che gli stupidi siete voi); salvate invece il file come index.htm e imparate a cambiare browser...
creare un cassetto col nome css al cui interno mettere i seguenti files (cliccare per salvarli)
skidoo_too.css
skidoo_too_print.css
quindi nel server che ci ospita creare il cassetto (directory) css e copiarci i 2 files di appartenenza mettendo invece il file index.htm nella directory principale del server stesso.
L'idea originale di questo template è di Ruthsarian che l'ha messa a disposizione di chiunque ne voglia far uso, mentre la traduzione del codice, l'aggiustamento di alcuni parametri, l'aggiunta di altri ed altro ancora sono stati fatti dal webmaster della Croce Rossa dell'Umbria, Maurizio Prattico.
Sperando di avervi fatto cosa gradita rimango a vostra disposizione per eventuali chiarimenti su come lavorare con questo template.
Potete scrivermi qui:
Maurizio Prattico (apre il vostro programma di posta elettronica)
Questo template, una volta presaci confidenza, vi permette di lavorare sul vostro sito senza alcun programma dedicato alla costruzione di pagine internet.
Basterà far uso di un buon editore di testo come quello da me usato per scrivere a mano le pagine web.
E' gratuito, molto ben fatto e tradotto anche in italiano:
EditPad
(e, rimanendo in tema di stupidi, se andrete a vedere con EditPad i due fogli di stile come per miracolo diventeranno qualcosa di intelligibile cosa che non è con il Blocco note).
Caricata la pagina con EditPad basta andare a cambiare solo alcune semplici cose (avendo messo nelle Opzioni di EditPad l'a capo automatico).
In ordine partendo dall'alto del template:
description come vi consiglio con il mio commentokeywords anche questo da me commentato
Leggendo la pagina vedrete ad alcune voci di menu la scritta accesskey="UnaLetteraAlfabeto"; si chiamano tasti di accesso rapido e servono ad aiutare i portatori di alcune tipologie di handicap a navigare nel vostro sito senza dover necessariamente cliccare col puntatore del mouse su di un link.
Dovrete creare una pagina, che nel menu orizzontale ho chiamato "Tasti accesso" per spiegare quali siano i tasti usati.
Potete prendere spunto dalla mia pagina che trovate qui.
La pagina dei tasti di accesso rapido insieme alla "Mappa del sito" aiutano un sito a diventare accessibile; quindi vi consiglio di crearle.
Cercare, dove è possibile, di mettere le voci di menu in ordine alfabetico per facilitare la lettura degli stessi - una regola della "navigabilità" -; quindi i Pionieri verranno prima della Sezione Femminile...
(a buon intenditor).
Quando inserite una immagine accompagnatela con un alt descrittivo e quando inserite un link accompagnatelo con un title; come esempio fate riferimento alle immagini e ai links sul menu laterale dedicati al W3C; anche questo per rispetto ad alcune categorie di disabili.
Avete a disposizione 6 tipi di heading h:
Prima di pubblicare una nuova pagina controllatela col validatore del W3c (gli improvvisati webmasters non sanno nemmeno cosa sia il W3C e non sanno che devono dichiarare il linguaggio con cui scrivono le pagine; voi adesso lo sapete e potete far leggere al validatore la vostra pagina direttamente sul computer prima della pubblicazione).
Avrete notato che quando cliccate su di un link esterno a questa pagina questo non si apre su una nuova finestra.
Il linguaggio da noi qui usato (Xhtml 1.1) infatti vieta questo "trucchetto" che non si può certo dire etico visto che il povero navigante vedrà aprirsi tante di quelle nuove finestre nel suo navigare che alla fine perderà il senso della sua stessa navigazione.
Lasciando a lui la decisione di aprire un eventuale link in un'altra finestra avremo rispettato anche quest'etica molto poco rispettata al giorno d'oggi come se ogni sito si considerasse così importante da voler rimanere sempre presente.
Non è così, lo sappiamo bene.
Mettete nella home page -index.htm- dove volete il numero di partita iva (che per la Croce Rossa Italiana è uguale su tutto il territorio nazionale) come richiesto da legge pena da 258,23 a 2.065,83 €.
Cosa disattesa dai più fino a che qualcuno non decide che può fare tanti soldini per le casse dello Stato.
Come pure la devono mettere tutti coloro che creano un sito aziendale e hanno la partita iva.
Apparentemente il validatore del W3C del foglio di stile trova due errori: non sono errori ma 2 così detti hacks voluti per essere visti in maniera uguale da tutti i browsers (che hanno il potere di vedere ognuno a modo suo le pagine costruite con i fogli di stile)
Ricordate che ci sono regole varie su come scrivere e tanto altro da seguire e, se vi fa comodo, potete leggere queste cose nella sezione da me dedicata all'Xhtml in queste pagine
Chi eventualmente avrà fatto uso di questo master di pagina e me lo comunicherà dandomi l'indirizzo del suo sito lo inserirò qui e, visto che questa pagina sarà spesso letta dai motori di ricerca, la cosa sarà a suo vantaggio oltre a dare a noi il piacere di leggere un nuovo sito.
"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."