Creare un sito con XHTML e CSS. Claudio Canavese (CoD),

Dimensione: px
Iniziare la visualizzazioe della pagina:

Download "Creare un sito con XHTML e CSS. Claudio Canavese (CoD), "

Transcript

1 Creare un sito con XHTML e CSS Claudio Canavese (CoD),

2 Copyright (C) 2009 Claudio Canavese. È garantito il permesso di copiare, distribuire e/o modificare questo documento seguendo i termini della Licenza per Documentazione Libera GNU, Versione 1.2 o ogni versione successiva pubblicata dalla Free Software Foundation; con le Sezioni Non Modificabili Chi siamo, Come contattarci e Serate a tema, con i Testi Copertina Creare un sito con XHTML e CSS, e nessun Testo di Retro Copertina. Una copia della licenza è acclusa nella sezione intitolata "Licenza per Documentazione Libera GNU". Tutti i codici XHTML e CSS presenti in questo documento sono distribuiti come Pubblico Domino. Permission is granted to copy, distribute and/or modify this document under the terms of the GNU Free Documentation License, Version 1.2 or any later version published by the Free Software Foundation; with the Invariant Sections being Chi siamo, Come contattarci and Serate a tema, with the Front-Cover Texts being Creare un sito con XHTML e CSS, and no Back-Cover Texts. A copy of the license is included in the section entitled "Licenza per Documentazione Libera GNU". All XHTML and CSS code in this document are released under Public Domain.

3 Chi siamo A.L.I.D. è un'associazione di volontariato, senza scopo di lucro, che persegue i seguenti fini: 1. Diffondere e promuovere il software libero 2. Favorire la diffusione degli strumenti informatici mediante una corretta alfabetizzazione 3. Contrastare l'adozione di standard chiusi per la gestione elettronica dei documenti, favorendo l'adozione di standard pubblici e liberamente accessibili 4. Favorire l'adozione di licenze di tipo libero anche nella pubblicazione di documentazione tecnica, nei testi scolastici e in tutta la produzione culturale e artistica in genere 5. Favorire il recupero di hardware in disuso attraverso l'utilizzo di software libero 6. Favorire l'accessibilità del software libero, lo sviluppo di un nuovo software libero, la manutenzione di quello esistente e la traduzione in italiano della documentazione e del software stesso 7. Favorire l'adozione del software libero all'interno del mondo degli enti pubblici e privati, delle imprese, dell'associazionismo, della pubblica amministrazione, dell'educazione, della ricerca L'Associazione collabora con altre associazioni affini che perseguano obiettivi analoghi, sia in ambito locale che nazionale o internazionale. Come contattarci Inviando una a o visitando il nostro sito Associazione per le Libertà Informatiche e Digitali Via giovanni Torti Genova C.F

4 SERATE A TEMA Le Serate a tema di ALID sono una serie di incontri aperti a tutti e pensati per avvicinare il grande pubblico ad alcuni argomenti del panorama informatico e digitale. Tutte le serate sono assolutamente gratuite ed i partecipanti, se lo desiderano, possono ricevere copia dei software presentati ed utilizzati durante la serata. Le serate si svolgono sempre il lunedì sera, alle 21, nella sede di ALID in via Giovanni Torti 35 a Genova. Per i laboratori è consigliato prenotare una postazione pc sul sito

5 Indice generale 1 Codice vs. Grafica Il WEB Come funziona La storia In principio c'era l'html La guerra dei browser Il W3C Il linguaggio XHTML Concetti e stili Sintassi fondamentale La nostra prima pagina XHTML La sezione BODY I paragrafi Grassetti e corsivi Tag di blocco e tag in linea Le immagini I link Qualcosa di più complicato CSS: i fogli di stile Sintassi fondamentale Legare il CSS al XHTML Il primo stile Qualcosa di più complicato ID e classi: il CSS alla massima potenza Gli ID Le classi Padri e figli Mischiare le cose La cascata Progettare un layout I div Unità di misura Posizionamento Il layout a due colonne ed intestazione Conclusioni Licenza per Documentazione Libera GNU PREAMBLE APPLICABILITY AND DEFINITIONS VERBATIM COPYING COPYING IN QUANTITY MODIFICATIONS COMBINING DOCUMENTS COLLECTIONS OF DOCUMENTS AGGREGATION WITH INDEPENDENT WORKS TRANSLATION TERMINATION FUTURE REVISIONS OF THIS LICENSE...43

6 1 Codice vs. Grafica Molti si chiedono perché dovrei imparare a scrivere del codice HTML quando ci sono molti programmi che lo fanno per me mentre disegno col mouse? In realtà creare un sito web scrivendo direttamente il codice assicura alcuni importati vantaggi. I vantaggi principali sono: maggior controllo su ogni aspetto della pagina e del sito maggiore compatibilità con i browser, anche con quelli vecchi o con quelli speciali come i programmi usati dai telefonini o dai disabili file più piccoli rispetto a quelli generati con gli editor grafici che spesso inseriscono cose inutili che appesantiscono il codice accessibilità Per accessibilità si intende la possibilità per un disabile di accedere al contenuto ed ai servizi offerti da un sito. Creare un sito accessibile (ad esempio utilizzabile con un browser speciale che trasforma il testo in voce oppure in braille) può davvero fare la differenza per alcune persone tra essere un handicappato e poter interagire col mondo, informarsi, studiare, persino lavorare.

7 2 Il WEB 2.0 Come funziona Sapere come funziona una comunicazione tra un client (il computer del nostro utente) ed un server (su cui è ospitato il sito che abbiamo creato) può essere molto utile per capire cosa possiamo e cosa non possiamo fare. La comunicazione di base tra client e server avviene in tre passi: Passo 1: Il client contatta il server e richiede un file Passo 2: Il server risponde inviando il file richiesto oppure comunicando che il file non esiste Passo 3: La comunicazione viene interrotta Questo ultimo passo è molto importante: tra client e server non si instaura una comunicazione fissa, come quella telefonica, ma ogni volta che una pagina è stata ricevuta il nostro server si dimentica completamente del client fino alla richiesta successiva. Questa procedura viene ripetuta per ogni immagine contenuta in una pagina web, per ogni foglio di stile e per ogni oggetto esterno che abbiamo incluso.

8 2.1 La storia In principio c'era l'html La prima idea di web nasce nel 1989, a marzo, quando sir Tim Berners-Lee scrive una proposta di sistema per comunicare informazioni attraverso internet, intitolata Information Management: A Proposal 1. La prima idea di ipertesto, cioè di un testo in grado di trasportare l'utente verso un altro testo attraverso i link, nasce nel 1990 con il documento WorldWideWeb: Proposal for a HyperText Project 2 ad opera sempre di Tim Berners-Lee assieme a Robert Cailliau e ad altri. Sempre nel 1990, a Natale, nasce il primo server web della storia, basato su un computer NeXT. L'HTML, cioè il linguaggio pensato per creare ipertesti e trasmettere documenti attraverso internet, era in origine molto semplice. Ecco un esempio tratto dalla prima pagina web della storia3: <TITLE>The World Wide Web project</title>... <H1>World Wide Web</H1>... <P> Everything there is online about W3 is linked directly or indirectly to this document, including an... </P>

9 Come si può facilmente vedere l'html si basa sul concetto di tag, cioè di etichetta. Se vogliamo definire il titolo di un documento non facciamo altro che appiccicare l'etichetta TITLE prima e dopo la frase che costituisce il titolo, avendo cura di chiudere l'etichetta aggiungendo un carattere slash (il carattere / ) prima del secondo TITLE. La stessa cosa si può fare per un titolo di primo livello, usando il tag H1 (cioè heading 1) oppure con il paragrafi usando il tag P. I tag sono sempre scritti tra i segno minore e maggiore La guerra dei browser L'HTML era un sistema semplice e allo stesso tempo molto potente ed ebbe un incredibile successo sin dalle sue prime applicazioni. Presto iniziarono a diffondersi i primi web browser, programmi in grado di interpretare questo linguaggio e (successivamente) differenziare graficamente titoli, paragrafi, elenchi, eccetera, permettendo anche la navigazione attraverso i link. Nel 1994 compare sulla scena internazionale il browser Netscape Navigator, un programma a pagamento che contiene parecchie innovazioni rispetto ai prodotti della concorrenza, l'anno dopo Microsoft crea Internet Explorer 1. Inizia così la Prima Guerra dei Browser, una sanguinosa battaglia per ottenere il predominio sul mercato dei browser, principalmente combattuta da Netscape e Microsoft. Per vincere sull'avversario entrambe le ditte inventano nuovi tag, brevettati e non copiabili, che possono essere interpretati solo dal loro prodotto; sono i tag proprietari, che si diffondono velocemente tra i creatori di siti web. Microsoft, ad esempio, crea il tag MARQUEE che permette di far scorrere il testo in maniera animata, Netscape risponde con il tag BLINK, che fa lampeggiare il testo. Microsoft crea il tag BGSOUND che perette di inserire un suono automatico di sottofondo, Netscape rilancia con il tag EMBED in grado di incorporare nelle pagine web non solo suoni ma anche filmati e altri oggetti dinamici. I creatori di siti web iniziano ad apporre speciali loghi sulle loro pagine con scritto sito visibile solo con Internet Explorer oppure sito ottimizzato per Netscape Navigator, diventando quindi parte attiva nella guerra tra i browser e spingendo i loro visitatori ad acquistare l'uno o l'altro prodotto. Quando Netscape inventa il tag FONT, che permette di cambiare il tipo di carattere, la dimensione e altri attributi del testo, le pagine web diventano rapidamente incomprensibili: il codice si riempie di tag che possono essere visti solo da un prodotto specifico e una semplice azione come navigare in internet diventa ogni giorno più difficile, dovendo districarsi nella rete delle compatibilità.

10 2.2 Il W3C La situazione si fa presto talmente insostenibile che una persona, che fino ad allora era stata in silenzio, decide di dire basta. Non si tratta di una persona qualunque, ma proprio di Tim Berners-Lee: l'uomo che ha inventato il web. Nasce così il W3C o World Wide Web Consortium, un organizzazione libera con il compito di definire gli standard internazionali per la comunicazione attraverso internet ed evitare quindi che le singole ditte possano imporre tag proprietari e brevetti. Il W3C inizia un'opera di disinfezione del codice HTML, ripulendolo dai tag proprietari ed iniziando la campagna Viewable With Any Browser, cioè Visibile con tutti i browser. La Prima Guerra dei Browser finisce ufficialmente quando Microsoft, con una mossa inaspettata, decide di fornire Internet Explorer assieme al sistema operativo Windows, scoraggiando così completamente l'acquisto di qualunque altro browser sul mercato: la gente è convinta che Internet Explorer sia fornito gratuitamente con il sistema operativo e quindi non è motivata ad acquistarne altri. Netscape subisce un brusco calo di vendite e dopo poco fallisce, ma prima di chiudere decide di rilasciare il codice sorgente di Netscape Navigator liberamente. Questo codice verrà preso dalla comunità del software libero, migliorato e aggiornato e darà vita prima al browser Mozilla e poi al più noto Mozilla Firefox e al motore di rendering Gecko (usato dai browser Netscape, SeaMonkey, Beonex, Camino, Galeon, Epiphany e da molti altri) Nel 1990 il W3C rilascia un nuovo standard chiamato XHTML, un sorta di HTML migliorato, anzi: ripensato da zero per essere più potente, più compatibile e più accessibile dei suoi predecessori.

11 3 Il linguaggio XHTML 3.0 Concetti e stili XHTML è un linguaggio completamente orientato alla marcatura dei concetti: non ha alcun tag per definire lo stile. Tutta la parte di presentazione di una pagina web è lasciata al nuovo linguaggio CSS, separando così nettamente la parte di informazione da quella di presentazione. Dall'unione di XHTML e CSS nasce la pagina web finale, contenente i concetti contenuti nel XHTML formattati secondo le regole specificate nel CSS Comprendere la separazione dei concetti dallo stile è fondamentale per creare siti web professionali e accessibili. Ad esempio: nel vecchio HTML esisteva il tag B il cui compito era quello di rendere in grassetto (B come bold) alcune parole. Nel XHTML questo tag è stato sostituito con strong, il cui significato è parte di testo con una forza maggiore rispetto al resto. Graficamente anche strong viene reso con il grassetto, ma concettualmente c'è una bella differenza: un lettore di schermo può leggere le parti di testo marcate come strong usando una voce più marcata e dando così una vera idea del concetto che chi può vedere associa inconsciamente al grassetto. Allo stesso modo il vecchio tag I per il corsivo è stato sostituito con em che significa enfasi.

12 Utilizzando i fogli di stile possiamo non solo specificare la resa grafica di tag come strong ed em, ma anche la resa vocale (coi fogli di stile speciali per i lettori di schermo) o per la stampa, le proiezioni ed altro. Possiamo addirittura avere più stili per una stessa pagina e permettere all'utente di navigare nel nostro sito con i colori e l'impaginazione che preferisce. 3.1 Sintassi fondamentale Vediamo ora la sintassi fondamentale dell'xhtml. L'XHTML usa i tag come il vecchio HTML, ma scritti esclusivamente minuscoli. Via via che proseguiremo con gli esempi vedremo alcuni esempi di tag. La struttura di una pagina XHTML è simile a questa: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-strict.dtd"> <html> <head> </head> <body> </body> </html> Possiamo identificare tre sezioni fondamentali: la DOCTYPE, cioè la dichiarazione di che linguaggio abbiamo usato per scrivere la pagina web. Nei nostri esempi utilizzeremo la DOCTYPE XHTML versione 1.0 strict, dove strict sta a significare completa aderenza allo standard w3c. La DOCTYPE è l'unica parte di una pagina XHTML che non è compresa nel tag HTML. la sezione head che contiene informazioni di supporto alla pagina. Qui inseriremo l'autore della pagina, il titolo da mostrare nella barra del titolo del browser, le parole chiave, eccetera. Qui è dove specificheremo anche il foglio di stile da utilizzare. La sezione body che contiene il testo vero e proprio della pagina La DOCTYPE è molto complicata, ma per fortuna è sempre uguale ed è sufficiente fare copia e incolla da una pagina già scritta senza porsi tante domande.

13 3.2 La nostra prima pagina XHTML Iniziamo ora con un semplice esercizio: creeremo la nostra prima pagina XHTML specificando un testo come titolo del documento. Apriamo quindi un editor di testo ed inseriamo la struttura base della pagina mostrata nel paragrafo precedente, poi, nella sezione head, inseriamo un tag title contenente il testo La mia prima pagina web. Il codice finale dovrebbe apparire come questa: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-strict.dtd"> <html> <head> <title>la mia prima pagina web</title> </head> <body> </body> </html> Aprendo questa pagina in un browser possiamo notare che in alto, nella barra del titolo della finestra, è comparso il testo che abbiamo specificato, mentre la pagina vera e propria è completamente vuota. Questo accade perché, come già detto, la sezione head contiene solo informazioni di supporto alla pagina. 3.3 La sezione BODY Ora spostiamoci nella sezione body ed inseriamo un tag h1 contenente il testo Ciao mondo!. Il nostro codice dovrebbe apparire così: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-strict.dtd"> <html> <head> <title>la mia prima pagina web</title> </head> <body> <h1>ciao mondo!</h1> </body> </html>

14 h1 significa intestazione di primo livello ed è il tag utilizzato per i titoli principali delle pagina web. Se carichiamo il file appena creato nel nostro browser noteremo che finalmente è comparso qualcosa nella finestra: il testo che abbiamo inserito è stato formattato come un titolo. Anche se non stiamo ancora specificando uno stile con il CSS (che impareremo dopo) il nostro browser cerca lo stesso di dare una resa grafica differente ai vari elementi della pagina. Questo accade perché tutti i browser utilizzano, in caso non ne trovino uno, un loro foglio di stile interno. 3.4 I paragrafi Inseriamo ora un tag p con alcune linee di testo al suo interno. Proviamo anche ad andare a capo all'interno di questo tag, come mostrato di seguito: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-strict.dtd"> <html> <head> <title>la mia prima pagina web</title> </head> <body> <h1>ciao mondo!</h1> Ciao mondo, questa è la mia prima pagina web. Accipicchia... sono emozionato! </body> </html> Salviamo e ricarichiamo la pagina nel browser: il testo è comparso ed è stato formattato come un paragrafo ma... è scritto tutto di seguito e non va a capo. Ogni browser, infatti, ignora i ritorni a capo e gli spazi (escluso il primo) in modo da permetterci di formattare il codice in maniera facilmente leggibile senza che questo si ripercuota sulla presentazione finale della pagina.

15 Se volessimo dire al browser di andare a capo dopo il punto dovremmo utilizzare un nuovo tag che significa appunto ritorno a capo. Il codice diventerà: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-strict.dtd"> <html> <head> <title>la mia prima pagina web</title> </head> <body> <h1>ciao mondo!</h1> Ciao mondo, questa è la mia prima pagina web.<br /> Accipicchia... sono emozionato! </body> </html> notate la strana sintassi del tag br: non viene aperto e poi chiuso ma viene scritto tutto compreso tra i segni minore e maggiore e addirittura con uno spazio prima del carattere slash. In effetti non avrebbe molto senso aprire e chiudere un tag come br, visto che non deve circondare alcun testo ma semplicemente sostituire un carattere singolo, il carattere, appunto, di ritorno a capo. Alcuni tag, quindi, non si aprono e chiudono normalmente ma vengono scritti con questa sintassi speciale. Lo spazio prima dello slash è fortemente consigliato anche se alcuni browser moderni sono in grado di interpretare correttamente il tag anche senza di esso. Programmi più datati, infatti, hanno difficoltà ad adattarsi a questa nuova sintassi (tipica del XHTML e che in HTML normale non esisteva) e lo spazio permette loro di comprendere il tag. Ecco alcuni esempi di tag che non si aprono e chiudono: TAG Significato <br /> vai a capo <hr /> linea orizzontale <img /> immagine

16 3.5 Grassetti e corsivi Abbiamo etto che l'xhtml non ha i tag per grassetto e corsivo, ma dispone dei tag corrispondenti per i concetti di forza e di enfasi. Proviamo quindi ora ad inserire un tag strong su una parola all'interno del nostro paragrafo: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-strict.dtd"> <html> <head> <title>la mia prima pagina web</title> </head> <body> <h1>ciao mondo!</h1> Ciao mondo, questa è la mia <strong>prima</strong> pagina web.<br /> Accipicchia... sono emozionato! </body> </html> come possiamo notare nel browser la parola prima viene resa con il grassetto. Se volessimo renderla in corsivo useremmo il tag em e se volessimo entrambe le cose potremmo scrivere: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-strict.dtd"> <html> <head> <title>la mia prima pagina web</title> </head> <body> <h1>ciao mondo!</h1> Ciao mondo, questa è la mia <em><strong>prima</strong></em> pagina web.<br /> Accipicchia... sono emozionato! </body> </html>

17 Notate l'ordine in cui abbiamo aperto e chiuso i tag: potevamo specificare anche prima strong e poi em, ma dobbiamo sempre tenere a mente che i tag vanno chiusi in ordine inverso rispetto a come li abbiamo aperti, quindi: <em><strong>prima</strong></em> è corretto <strong><em>prima</em></strong> anche <em><strong>prima</em></strong> è sbagliato e potrebbe portare ad effetti imprevedibili. Per semplificare potremmo dire che i tag si aprono e si chiudono come le parentesi in matematica.

18 3.6 Tag di blocco e tag in linea Proviamo ad inserire del testo subito dopo la chiusura del tag h1: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-strict.dtd"> <html> <head> <title>la mia prima pagina web</title> </head> <body> <h1>ciao mondo!</h1>ciao ciao ciao Ciao mondo, questa è la mia <strong>prima</strong> pagina web.<br /> Accipicchia... sono emozionato! </body> </html> nel browser il testo appena aggiunto viene visualizzato sotto al titolo, non di seguito, anche se non abbiamo specificato alcun ritorno a capo. Questo accade perché il tag h1 appartiene ai tag di blocco ( block level in inglese). Scrivendo invece qualcosa subito sopo la chiusura di strong il testo verrà messo sulla stessa riga, perché strong è un tag in linea ( inline in inglese). Esistono quindi due tipi di tag: quelli che definiscono un blocco di testo (un paragrafo, un titolo, una tabella, un elenco, ecc) e che sono sempre seguiti dall'a-capo e quelli che invece definiscono concetti che possono essere applicati persino a singoli caratteri all'interno di una parola e sono detti tag in linea. Ad esempio: un paragrafo è un TAG a blocco un titolo è un TAG a blocco un grassetto o un corsivo sono TAG in linea un'immagine è un TAG in linea Questo comportamento può comunque essere cambiato utilizzando i fogli di stile.

19 3.7 Le immagini Il web non sarebbe certo così interessante se non potessimo utilizzare le immagini, proviamo quindi ad inserire una immagine nella nostra pagina di esempio. Per inserire una immagine dobbiamo conoscerne il nome (completo di estensione) ed il percorso. Nell'esempio qui sotto abbiamo utilizzato il logo di alid, il cui file si chiama logo.png e risiede nella stessa cartella della nostra pagina di esempio. Tutto quello che dovremo scrivere sarà qualcosa come: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-strict.dtd"> <html> <head> <title>la mia prima pagina web</title> </head> <body> <h1>ciao mondo!</h1> Ciao mondo, questa è la mia <strong>prima</strong> pagina web.<br /> Accipicchia... sono emozionato! Sono contento di imparare l'xhtml grazie ad <img src="alid.png" alt="alid" /> </body> </html> Se l'immagine non viene visualizzata nel browser abbiamo sbagliato qualcosa. Ad esempio potremmo avere sbagliato il nome, oppure l'immagine potrebbe non essere nella stessa cartella del nostro file XHTML ma in una sotto cartella chiamata magari immagini, in questo caso potremmo scrivere: <img src="immagini/alid.png" alt="alid" /> Notate la strana sintassi del tag img.

20 È un tag che si chiude nello stesso momento i cui si apre, come il tag br, ma contiene al suo interno alcuni parametri aggiuntivi chiamati attributi. L' attributo src stabilisce il percorso in cui andare a prendere l'immagine, mentre l'attributo alt (obbligatorio in XHTML) stabilisce un testo alternativo da mostrare nel caso in cui l'immagine non sia disponibile o non sia possibile visualizzarla (ad esempio perché stiamo usando un lettore di schermo oppure stiamo navigando con un cellulare) Se sbagliamo volutamente il nome dell'immagine, infatti, noteremo che essa viene rimpiazzata dal testo alid, permettendo così anche a chi non può vedere di capire il significato della nostra frase. 3.8 I link L'idea di ipertesto si basa sulla possibilità di collegare più pagine attraverso lo strumento del link. Per provare ad inserire un link abbiamo bisogno di creare una nuova pagina web che collegheremo alla prima. Creiamo quindi la seconda pagina web e scriviamo qualcosa come: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-strict.dtd"> <html> <head> <title>la mia seconda pagina web</title> </head> <body> <h1>benvenuti nella seconda pagina</h1> Se siete arrivati qui significa che ho imparato a fare i link! </body> </html>

21 salviamola con il nome di pagina2.html e scriviamo nella prima pagina: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-strict.dtd"> <html> <head> <title>la mia prima pagina web</title> </head> <body> <h1>ciao mondo!</h1> Ciao mondo, questa è la mia <strong>prima</strong> pagina web.<br /> Accipicchia... sono emozionato! Sono contento di imparare l'xhtml grazie ad <img src="alid.png" alt="alid" /> <a href="pagina2.html" title="link a pagina 2">pagina 2</a> </body> </html> notate anche qui la stessa sintassi del tag img, almeno per quanto riguarda l'uso geli attributi, il tag a (a sta per àncora ), però, si apre e si chiude e racchiude al suo interno il testo pagina 2 che diventerà il testo cliccabile del nostro link. L'attributo href indica quale documento stiamo collegando, mentre title ci permette di inserire una descrizione avanzata che comparirà da sola se lasceremo il mouse sul link per alcuni secondi. L'attributo title è sempre obbligatorio in XHTML per motivi di accessibilità, però a volte è inutile specificare ulteriormente del testo quando il link di per sé ha già significato. In questi casi possiamo lasciare title vuoto, scrivendo: <a href="pagina2.html" title="">pagina 2</a> In XHTML vige la regola che tutti gli attributi vadano sempre scritti con il valore tra virgolette, anche se sono vuoti. Possiamo usare sia le virgolette doppie che quelle singole (gli apici). Se tutto va bene dovremmo essere in grado di saltare dalla nostra prima pagina alla seconda.

22 3.9 Qualcosa di più complicato Provate a creare tre pagine web collegate tra loro seguendo questo schema: Pagina 1: una pagina di benvenuto Pagina 2: una breve descrizione del sito Pagina 3: una galleria di immagini (almeno 3) Assicuratevi di inserire i link in tutte le pagine, in modo che ci si possa spostare agevolmente da una all'altra.

23 4 CSS: i fogli di stile 4.0 Sintassi fondamentale Passiamo ora al linguaggio dei fogli di stile, il CSS (sigla che significa Cascading Style Sheets cioè Fogli di stile a cascata) La comodità dei fogli di stile è che possiamo specificare lo stile di ogni tag i un unico file separato e poi inserire un link speciale in tute le pagine a cui vogliamo applicare quello stile. Pensate di dover gestire un sito con 100, 1000 o anche pagine (e non è difficile trovarne in giro per la rete) e di aver avuto l'incarico di cambiare tutti i titoli in modo che siano scritti in rosso, centrati nella pagina e magari con un carattere diverso da quello che usate adesso. Cambiare ogni pagina una per una (come si doveva fare quando veniva usato il tag proprietario FONT) è praticamente impensabile. Con i fogli di stile dovrete solo modificare una riga i un unico file e automaticamente tutte le pagine collegate a quello stile si adatteranno immediatamente. 4.1 Legare il CSS al XHTML Per legare un pagina XHTML ad un foglio di stile è sufficiente aggiunger un tag speciale all'interno della sezione head. Ad esempio se il nostro foglio di stile si chiama stile.css scriveremo: <link rel="stylesheet" href="stile.css" type="text/css" />

24 4.2 Il primo stile Iniziamo ora a definire uno stile per il nostro sito. Riprendiamo la nostra prima pagina di esempio ed assicuriamoci che sia collegata al file stile.css che stiamo per creare: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-strict.dtd"> <html> <head> <title>la mia prima pagina web</title> <link rel="stylesheet" href="stile.css" type="text/css" /> </head> <body> <h1>ciao mondo!</h1> Ciao mondo, questa è la mia <strong>prima</strong> pagina web.<br /> Accipicchia... sono emozionato! Sono contento di imparare l'xhtml grazie ad <img src="alid.png" alt="alid" /> <a href="pagina2.html" title="link a pagina 2">pagina 2</a> </body> </html> Apriamo ora un nuovo documento e scriviamo: body h1 { background-color: blue; color: white; } { text-align: center; font-size: 30pt; } salviamolo come stile.css e ricarichiamo la pagina nel browser... abbiamo appena inventato i colori! Come potete leggere dal foglio di stile abbiamo specificato uno stile per il tag body (cioè per tutta la pagina web) e per il tag h1 (il titolo) Per body abbiamo inserito le proprietà background-color che definisce il colore di sfondo e color che definisce il colore del testo. Per h1 abbiamo specificato un allineamento al centro della pagina e una dimensione della scritta pari a 30 punti (fate attenzione a non mettere lo spazio tra il valore e l'unita di misura pt ).

25 Noterete che il CSS è un linguaggio molto semplice: basta ricordarsi di chiudere le parentesi graffe e di mettere sempre il punto e virgola dopo ogni proprietà. Possiamo specificare qualunque colore, non solo quelli che hanno un nome inglese (come white, black o yellow) ma in questo caso dovremmo utilizzare una notazione speciale indicando i valori di rosso, verde e blu del colore specificato. Per scrivere un titolo in rosso, ad esempio, potremo scrivere sia: h1 { color: red; } h1 { color: #ff0000; } che: oppure ancora: h1 { color: rgb(255,0,0); } i valori di rosso verde e blu variano da 0 (niente) a 255 (il massimo) e posso essere scritti sia in numeri arabi che in notazione esadecimale (dove ff è 255) Per fortuna non serve essere dei geni o sapere fare calcoli esadecimali a mente per capire come specificare un colore: la maggior parte dei programmi di grafica offre la possibilità di visualizzare questo codice per il colore che abbiamo scelto. Per Firefox, inoltre, è disponibile l'estensione Colorzilla che oltre a fornire la scelta dei colori da una tavolozza permette anche di campionare un colore direttamente da una pagina web. 4.3 Qualcosa di più complicato Provate ora a cambiare il vostro foglio di stile in modo da: avere una pagina sfondo bianco e testo nero avere i titoli centrati e color blu avere i link gialli e in grassetto avere i tag strong in grassetto rosso La proprietà per definire un grassetto è: font-weight: bold;

OmegaT per Principianti CAT. di Susan Welsh & Marc Prior

OmegaT per Principianti CAT. di Susan Welsh & Marc Prior OmegaT per Principianti CAT di Susan Welsh & Marc Prior 1 Copyright Copyright 2009-2011 Susan Welsh and Marc Prior Copyright 2013 for this translation Carmelo Serraino & Valter Mura. È concesso il permesso

Dettagli

Informazioni su questo libro

Informazioni su questo libro Informazioni su questo libro Si tratta della copia digitale di un libro che per generazioni è stato conservata negli scaffali di una biblioteca prima di essere digitalizzato da Google nell ambito del progetto

Dettagli

Questo é il link all altra pagina

<a href= page2.html > Questo é il link all altra pagina </a> <a href= page2.html > <img src= lamiaimmagine.jpg/> </a> Tutorial 4 Links, Span e Div È ora di fare sul serio! Che ci crediate o no, se sei arrivato fino a questo punto, ora hai solo bisogno di una cosa in più per fare un sito reale! Al momento hai una pagina

Dettagli

e-spare Parts User Manual Peg Perego Service Site Peg Perego [Dicembre 2011]

e-spare Parts User Manual Peg Perego Service Site Peg Perego [Dicembre 2011] Peg Perego Service Site Peg Perego [Dicembre 2011] 2 Esegui il login: ecco la nuova Home page per il portale servizi. Log in: welcome to the new Peg Perego Service site. Scegli il servizio selezionando

Dettagli

Il test valuta la capacità di pensare?

Il test valuta la capacità di pensare? Il test valuta la capacità di pensare? Per favore compili il seguente questionario senza farsi aiutare da altri. Cognome e Nome Data di Nascita / / Quanti anni scolastici ha frequentato? Maschio Femmina

Dettagli

8. L'USO DEL PROGRAMMA DI POSTA ELETTRONICA INSIEME ALLA GESTIONE PROFESSIONALE DI DOCUMENTI IN FORMATO E-MAIL

8. L'USO DEL PROGRAMMA DI POSTA ELETTRONICA INSIEME ALLA GESTIONE PROFESSIONALE DI DOCUMENTI IN FORMATO E-MAIL This project funded by Leonardo da Vinci has been carried out with the support of the European Community. The content of this project does not necessarily reflect the position of the European Community

Dettagli

Modulo. Programmiamo in Pascal. Unità didattiche COSA IMPAREREMO...

Modulo. Programmiamo in Pascal. Unità didattiche COSA IMPAREREMO... Modulo A Programmiamo in Pascal Unità didattiche 1. Installiamo il Dev-Pascal 2. Il programma e le variabili 3. Input dei dati 4. Utilizziamo gli operatori matematici e commentiamo il codice COSA IMPAREREMO...

Dettagli

Funzioni di base. Manualino OE6. Outlook Express 6

Funzioni di base. Manualino OE6. Outlook Express 6 Manualino OE6 Microsoft Outlook Express 6 Outlook Express 6 è un programma, incluso nel browser di Microsoft Internet Explorer, che ci permette di inviare e ricevere messaggi di posta elettronica. È gratuito,

Dettagli

Appunti sugli Elaboratori di Testo. Introduzione. D. Gubiani. 19 Luglio 2005

Appunti sugli Elaboratori di Testo. Introduzione. D. Gubiani. 19 Luglio 2005 Appunti sugli Elaboratori di Testo D. Gubiani Università degli Studi G.D Annunzio di Chieti-Pescara 19 Luglio 2005 1 Cos è un elaboratore di testo? 2 3 Cos è un elaboratore di testo? Cos è un elaboratore

Dettagli

Virtualizzazione con Microsoft Tecnologie e Licensing

Virtualizzazione con Microsoft Tecnologie e Licensing Microsoft Virtualizzazione con Microsoft Tecnologie e Licensing Profile Redirezione dei documenti Offline files Server Presentation Management Desktop Windows Vista Enterprise Centralized Desktop Application

Dettagli

I Grafici. La creazione di un grafico

I Grafici. La creazione di un grafico I Grafici I grafici servono per illustrare meglio un concetto o per visualizzare una situazione di fatto e pertanto la scelta del tipo di grafico assume notevole importanza. Creare grafici con Excel è

Dettagli

Ultimo aggiornamento.: 18/02/2006 Pagina 1 di 25

Ultimo aggiornamento.: 18/02/2006 Pagina 1 di 25 Introduzione al programma POWERPOINT Ultimo aggiornamento.: 18/02/2006 Pagina 1 di 25 Introduzione al programma POWERPOINT 1 1 Introduzione al programma 3 2 La prima volta con Powerpoint 3 3 Visualizzazione

Dettagli

How to Develop Accessible Linux Applications

How to Develop Accessible Linux Applications How to Develop Accessible Linux Applications Sharon Snider Copyright 2002 IBM Corporation v1.1, 2002-05-03 Diario delle Revisioni Revisione v1.1 2002-05-03 Revisionato da: sds Convertito in DocBook XML

Dettagli

RefWorks Guida all utente Versione 4.0

RefWorks Guida all utente Versione 4.0 Accesso a RefWorks per utenti registrati RefWorks Guida all utente Versione 4.0 Dalla pagina web www.refworks.com/refworks Inserire il proprio username (indirizzo e-mail) e password NB: Agli utenti remoti

Dettagli

INSTALLAZIONE E UTILIZZO DEL COMPILATORE Code::Blocks 8.02

INSTALLAZIONE E UTILIZZO DEL COMPILATORE Code::Blocks 8.02 INSTALLAZIONE E UTILIZZO DEL COMPILATORE Code::Blocks 8.02 Download Si può scaricare gratuitamente la versione per il proprio sistema operativo (Windows, MacOS, Linux) dal sito: http://www.codeblocks.org

Dettagli

Data Alignment and (Geo)Referencing (sometimes Registration process)

Data Alignment and (Geo)Referencing (sometimes Registration process) Data Alignment and (Geo)Referencing (sometimes Registration process) All data aquired from a scan position are refered to an intrinsic reference system (even if more than one scan has been performed) Data

Dettagli

Rilascio dei Permessi Volo

Rilascio dei Permessi Volo R E P U B L I C O F S A N M A R I N O C I V I L A V I A T I O N A U T H O R I T Y SAN MARINO CIVIL AVIATION REGULATION Rilascio dei Permessi Volo SM-CAR PART 5 Approvazione: Ing. Marco Conti official of

Dettagli

Windows Compatibilità

Windows Compatibilità Che novità? Windows Compatibilità CODESOFT 2014 é compatibile con Windows 8.1 e Windows Server 2012 R2 CODESOFT 2014 Compatibilità sistemi operativi: Windows 8 / Windows 8.1 Windows Server 2012 / Windows

Dettagli

CATTURARE LO SCHERMO INTERO O LA FINESTRA ATTIVA

CATTURARE LO SCHERMO INTERO O LA FINESTRA ATTIVA CATTURARE LO SCHERMO INTERO O LA FINESTRA ATTIVA Supponiamo di voler eseguire una istantanea del nostro desktop, quella che in gergo si chiama Screenshot (da screen, schermo, e shot, scatto fotografico).

Dettagli

Calc è il programma per la gestione di fogli di calcolo della suite OpenOffice.org.

Calc è il programma per la gestione di fogli di calcolo della suite OpenOffice.org. Calc è il programma per la gestione di fogli di calcolo della suite OpenOffice.org. Nuovo documento Anteprima di stampa Annulla Galleria Apri Controllo ortografico Ripristina Sorgente dati Salva Controllo

Dettagli

Internet Internet è universalmente nota come la Rete delle reti: un insieme smisurato di computer collegati tra loro per scambiarsi dati e servizi.

Internet Internet è universalmente nota come la Rete delle reti: un insieme smisurato di computer collegati tra loro per scambiarsi dati e servizi. Internet Internet è universalmente nota come la Rete delle reti: un insieme smisurato di computer collegati tra loro per scambiarsi dati e servizi. Internet: la rete delle reti Alberto Ferrari Connessioni

Dettagli

Talento LAB 4.1 - UTILIZZARE FTP (FILE TRANSFER PROTOCOL) L'UTILIZZO DI ALTRI SERVIZI INTERNET. In questa lezione imparerete a:

Talento LAB 4.1 - UTILIZZARE FTP (FILE TRANSFER PROTOCOL) L'UTILIZZO DI ALTRI SERVIZI INTERNET. In questa lezione imparerete a: Lab 4.1 Utilizzare FTP (File Tranfer Protocol) LAB 4.1 - UTILIZZARE FTP (FILE TRANSFER PROTOCOL) In questa lezione imparerete a: Utilizzare altri servizi Internet, Collegarsi al servizio Telnet, Accedere

Dettagli

APPLICATION FORM 1. YOUR MOTIVATION/ LA TUA MOTIVAZIONE

APPLICATION FORM 1. YOUR MOTIVATION/ LA TUA MOTIVAZIONE APPLICATION FORM Thank you for your interest in our project. We would like to understand better your motivation in taking part in this specific project. So please, read carefully the form, answer the questions

Dettagli

Lezione su Informatica di Base

Lezione su Informatica di Base Lezione su Informatica di Base Esplora Risorse, Gestione Cartelle, Alcuni tasti di scelta Rapida Domenico Capano D.C. Viterbo: Lunedì 21 Novembre 2005 Indice Una nota su questa lezione...4 Introduzione:

Dettagli

Corso di Alfabetizzazione Informatica

Corso di Alfabetizzazione Informatica Corso di Alfabetizzazione Informatica Scopo di questo corso, vuole essere quello di fornire ad ognuno dei partecipanti, indipendentemente dalle loro precedenti conoscenze informatiche, l apprendimento

Dettagli

GESTIRE LA BIBLIOGRAFIA

GESTIRE LA BIBLIOGRAFIA GESTIRE LA BIBLIOGRAFIA STRUMENTI DI GESTIONE BIBLIOGRAFICA I software di gestione bibliografica permettono di raccogliere, catalogare e organizzare diverse tipologie di materiali, prendere appunti, formattare

Dettagli

PROVINCIA DI ASTI Sistema Informativo e Statistica Tel 0141.433250 www.provincia.asti.it

PROVINCIA DI ASTI Sistema Informativo e Statistica Tel 0141.433250 www.provincia.asti.it PROVINCIA DI ASTI Sistema Informativo e Statistica Tel 0141.433250 www.provincia.asti.it --==0==-- GNU AFFERO GENERAL PUBLIC LICENSE Version 3, 19 November 2007 Copyright 2007 Free Software Foundation,

Dettagli

Traduzione di TeamLab in altre lingue

Traduzione di TeamLab in altre lingue Lingue disponibili TeamLab è disponibile nelle seguenti lingue nel mese di gennaio 2012: Traduzioni complete Lingue tradotte parzialmente Inglese Tedesco Francese Spagnolo Russo Lettone Italiano Cinese

Dettagli

ITCG Cattaneo via Matilde di canossa n.3 - Castelnovo ne' Monti (RE) SEZIONE I.T.I. - Corso di Fisica - prof. Massimo Manvilli

ITCG Cattaneo via Matilde di canossa n.3 - Castelnovo ne' Monti (RE) SEZIONE I.T.I. - Corso di Fisica - prof. Massimo Manvilli ITCG C. CATTANEO via Matilde di Canossa n.3 - Castelnovo ne' Monti (Reggio Emilia) Costruzione del grafico di una funzione con Microsoft Excel Supponiamo di aver costruito la tabella riportata in figura

Dettagli

GUIDA ALL UTILIZZO DELL ECM 8

GUIDA ALL UTILIZZO DELL ECM 8 GUIDA ALL UTILIZZO DELL ECM 8 GUIDA ALL UTILIZZO DELL ECM 8 1) Introduzione Pg 3 2) L area amministratore Pg 3 2.1) ECM Pg 4 2.1.1) Sezione Struttura Pg 5 2.1.2) Sezione Documento Pg 7 2.1.3) Sezione Pubblicazione

Dettagli

Gi-Gi Art. 859 - User's Guide Istruzioni d'uso

Gi-Gi Art. 859 - User's Guide Istruzioni d'uso doc.4.12-06/03 Gi-Gi Art. 859 - User's Guide Istruzioni d'uso A belaying plate that can be used in many different conditions Una piastrina d'assicurazione che può essere utilizzata in condizioni diverse.

Dettagli

I.Stat Guida utente Versione 1.7 Dicembre 2010

I.Stat Guida utente Versione 1.7 Dicembre 2010 I.Stat Guida utente Versione 1.7 Dicembre 2010 1 Sommario INTRODUZIONE 3 I concetti principali di I.Stat 4 Organizzazione dei dati 4 Ricerca 5 GUIDA UTENTE 6 Per iniziare 6 Selezione della lingua 7 Individuazione

Dettagli

Dipartimento del Tesoro

Dipartimento del Tesoro Dipartimento del Tesoro POWER POINT AVANZATO Indice 1 PROGETTAZIONE DELL ASPETTO...3 1.2 VISUALIZZARE GLI SCHEMI...4 1.3 CONTROLLARE L ASPETTO DELLE DIAPOSITIVE CON GLI SCHEMI...5 1.4 SALVARE UN MODELLO...6

Dettagli

MANUALE D USO LEXUN ver. 5.0. proprietà logos engineering - Sistema Qualità certificato ISO 9001 DNV Italia INDICE. 6. Flash top 6 C.

MANUALE D USO LEXUN ver. 5.0. proprietà logos engineering - Sistema Qualità certificato ISO 9001 DNV Italia INDICE. 6. Flash top 6 C. Pag. 1/24 INDICE A. AMMINISTRAZIONE pagina ADMIN Pannello di controllo 2 1. Password 2 2. Cambio lingua 2 3. Menù principale 3 4. Creazione sottomenù 3 5. Impostazione template 4 15. Pagina creata con

Dettagli

UNIVERSITA DEGLI STUDI DI TORINO WORD

UNIVERSITA DEGLI STUDI DI TORINO WORD WORD SOMMARIO 1. Muoversi nel testo... 1 2. Taglia, copia e incolla... 2 3. Aprire, salvare e chiudere... 3 4. Trovare e sostituire... 4 5. Visualizzare in modi diversi... 6 6. Formattare e incolonnare...

Dettagli

Istruzione N. Versione. Ultima. modifica. Funzione. Data 18/12/2009. Firma. Approvato da: ASSEMBLAGGIO COLLAUDO TRAINING IMBALLO. service 07.

Istruzione N. Versione. Ultima. modifica. Funzione. Data 18/12/2009. Firma. Approvato da: ASSEMBLAGGIO COLLAUDO TRAINING IMBALLO. service 07. Istruzione N 62 Data creazione 18/ 12/2009 Versione N 00 Ultima modifica TIPO ISTRUZIONE ASSEMBLAGGIO COLLAUDO TRAINING MODIFICA TEST FUNZIONALE RIPARAZIONE/SOSTITUZIONE IMBALLO TITOLO DELL ISTRUZIONE

Dettagli

Come realizzare una buona presentazione (traduzione libera a cura della redazione di EpiCentro)

Come realizzare una buona presentazione (traduzione libera a cura della redazione di EpiCentro) Come realizzare una buona presentazione (traduzione libera a cura della redazione di EpiCentro) Quando si realizzano dei documenti visivi per illustrare dati e informazioni chiave, bisogna sforzarsi di

Dettagli

IMPOSTARE UNA MASCHERA CHE SI APRE AUTOMATICAMENTE

IMPOSTARE UNA MASCHERA CHE SI APRE AUTOMATICAMENTE IMPOSTARE UNA MASCHERA CHE SI APRE AUTOMATICAMENTE Access permette di specificare una maschera che deve essere visualizzata automaticamente all'apertura di un file. Vediamo come creare una maschera di

Dettagli

Si prega di comunicare eventuali errori o inesattezze riscontrate, scrivendo una mail a: otebac@beniculturali.it

Si prega di comunicare eventuali errori o inesattezze riscontrate, scrivendo una mail a: otebac@beniculturali.it TEMPLATE IN MWCMS D A N I E L E U G O L E T T I - G R U P P O M E T A Si prega di comunicare eventuali errori o inesattezze riscontrate, scrivendo una mail a: otebac@beniculturali.it C ONTENTS I template

Dettagli

sull argomento scelto ( evidenziare il testo passandoci sopra con il tasto sinistro del mouse e copiare premendo i tasti Ctrl + C )

sull argomento scelto ( evidenziare il testo passandoci sopra con il tasto sinistro del mouse e copiare premendo i tasti Ctrl + C ) This work is licensed under the Creative Commons Attribuzione - Non commerciale - Non opere derivate 3.0 Unported License. To view a copy of this license, visit http://creativecommons.org/licenses/by-nc-nd/3.0/.

Dettagli

Modulo 2 - Appendice 3 L'editor vi e cenni su sed

Modulo 2 - Appendice 3 L'editor vi e cenni su sed 1 Modulo 2 - Appendice 3 L'editor vi e cenni su sed Laboratorio di Sistemi Operativi I Anno Accademico 2008-2009 Copyright 2005-2007 Francesco Pedullà, Massimo Verola Copyright 2001-2005 Renzo Davoli,

Dettagli

Analisi dei requisiti e casi d uso

Analisi dei requisiti e casi d uso Analisi dei requisiti e casi d uso Indice 1 Introduzione 2 1.1 Terminologia........................... 2 2 Modello della Web Application 5 3 Struttura della web Application 6 4 Casi di utilizzo della Web

Dettagli

NAVIGAORA HOTSPOT. Manuale utente per la configurazione

NAVIGAORA HOTSPOT. Manuale utente per la configurazione NAVIGAORA HOTSPOT Manuale utente per la configurazione NAVIGAORA Hotspot è l innovativo servizio che offre ai suoi clienti accesso ad Internet gratuito, in modo semplice e veloce, grazie al collegamento

Dettagli

Cos'é Code::Blocks? Come Creare un progetto Come eseguire un programma Risoluzione problemi istallazione Code::Blocks Che cos è il Debug e come si usa

Cos'é Code::Blocks? Come Creare un progetto Come eseguire un programma Risoluzione problemi istallazione Code::Blocks Che cos è il Debug e come si usa di Ilaria Lorenzo e Alessandra Palma Cos'é Code::Blocks? Come Creare un progetto Come eseguire un programma Risoluzione problemi istallazione Code::Blocks Che cos è il Debug e come si usa Code::Blocks

Dettagli

Assessorato regionale dell'agricoltura, dello sviluppo rurale e della pesca mediterranea Dipartimento della pesca mediterranea

Assessorato regionale dell'agricoltura, dello sviluppo rurale e della pesca mediterranea Dipartimento della pesca mediterranea Assessorato regionale dell'agricoltura, dello sviluppo rurale e della pesca mediterranea Dipartimento della pesca mediterranea Ufficio del Responsabile Unico della Regione Sicilia per il Cluster Bio-Mediterraneo

Dettagli

Introduzione ad Access

Introduzione ad Access Introduzione ad Access Luca Bortolussi Dipartimento di Matematica e Informatica Università degli studi di Trieste Access E un programma di gestione di database (DBMS) Access offre: un supporto transazionale

Dettagli

Le formule possono essere scritte utilizzando un insieme di funzioni predefinite che Excel mette a disposizione, raggruppate per argomento.

Le formule possono essere scritte utilizzando un insieme di funzioni predefinite che Excel mette a disposizione, raggruppate per argomento. Excel: le funzioni Le formule possono essere scritte utilizzando un insieme di funzioni predefinite che Excel mette a disposizione, raggruppate per argomento. DEFINIZIONE: Le funzioni sono dei procedimenti

Dettagli

Narrare i gruppi. Rivista semestrale pubblicata on-line dal 2006 Indirizzo web: www.narrareigruppi.it - Direttore responsabile: Giuseppe Licari

Narrare i gruppi. Rivista semestrale pubblicata on-line dal 2006 Indirizzo web: www.narrareigruppi.it - Direttore responsabile: Giuseppe Licari Narrare i gruppi Etnografia dell interazione quotidiana Prospettive cliniche e sociali ISSN: 2281-8960 Narrare i gruppi. Etnografia dell'interazione quotidiana. Prospettive cliniche e sociali è una Rivista

Dettagli

MANUALE Gest-L VERSIONE 3.2.3

MANUALE Gest-L VERSIONE 3.2.3 MANUALE Gest-L VERSIONE 3.2.3 Installazione GEST-L 4 Versione per Mac - Download da www.system-i.it 4 Versione per Mac - Download da Mac App Store 4 Versione per Windows 4 Prima apertura del programma

Dettagli

ALFABETIZZAZIONE DI BASE Programma del Corso livello base

ALFABETIZZAZIONE DI BASE Programma del Corso livello base Un po di Storia ISP & Web Engineering ALFABETIZZAZIONE DI BASE Programma del Corso livello base Breve cenno sulla storia dell informatica: dagli albori ai giorni nostri; L evoluzione di Windows: dalla

Dettagli

Zeroshell come client OpenVPN

Zeroshell come client OpenVPN Zeroshell come client OpenVPN (di un server OpenVpn Linux) Le funzionalità di stabilire connessioni VPN di Zeroshell vede come scenario solito Zeroshell sia come client sia come server e per scelta architetturale,

Dettagli

Nitro Reader 3 Guida per l' utente

Nitro Reader 3 Guida per l' utente Nitro Reader 3 Guida per l' utente In questa Guida per l'utente Benvenuti in Nitro Reader 3 1 Come usare questa guida 1 Trovare rapidamente le informazioni giuste 1 Per eseguire una ricerca basata su parole

Dettagli

1 - Cos è l accessibilità e a chi è destinata

1 - Cos è l accessibilità e a chi è destinata 1 - Cos è l accessibilità e a chi è destinata di Michele Diodati michele@diodati.org http://www.diodati.org Cosa significa accessibile 2 di 19 Content is accessible when it may be used by someone with

Dettagli

Guida Così si aggiornano i programmi Microsoft

Guida Così si aggiornano i programmi Microsoft Guida Così si aggiornano i programmi Microsoft Informazione Navigare in Internet in siti di social network oppure in siti web che consentono la condivisione di video è una delle forme più accattivanti

Dettagli

LA POSTA ELETTRONICA

LA POSTA ELETTRONICA LA POSTA ELETTRONICA Nella vita ordinaria ci sono due modi principali di gestire la propria corrispondenza o tramite un fermo posta, creandosi una propria casella postale presso l ufficio P:T., oppure

Dettagli

ThemixInfo Gestione Informazione al Pubblico per Laboratori di analisi e Poliambulatori. Manuale d uso. themix Italia srl

ThemixInfo Gestione Informazione al Pubblico per Laboratori di analisi e Poliambulatori. Manuale d uso. themix Italia srl Gestione Informazione al Pubblico per Laboratori di analisi e Poliambulatori Manuale d uso Versione 08/07/2014 themix Italia srl tel. 06 35420034 fax 06 35420150 email info@themix.it LOGIN All avvio il

Dettagli

Elaidon Web Solutions

Elaidon Web Solutions Elaidon Web Solutions Realizzazione siti web e pubblicità sui motori di ricerca Consulente Lorenzo Stefano Piscioli Via Siena, 6 21040 Gerenzano (VA) Telefono +39 02 96 48 10 35 elaidonwebsolutions@gmail.com

Dettagli

Ministero della Salute Direzione Generale della Ricerca Scientifica e Tecnologica Bando Giovani Ricercatori - 2007 FULL PROJECT FORM

Ministero della Salute Direzione Generale della Ricerca Scientifica e Tecnologica Bando Giovani Ricercatori - 2007 FULL PROJECT FORM ALLEGATO 2 FULL PROJECT FORM FORM 1 FORM 1 General information about the project PROJECT SCIENTIFIC COORDINATOR TITLE OF THE PROJECT (max 90 characters) TOTAL BUDGET OF THE PROJECT FUNDING REQUIRED TO

Dettagli

Come si prepara una presentazione

Come si prepara una presentazione Analisi Critica della Letteratura Scientifica 1 Come si prepara una presentazione Perché? 2 Esperienza: Si vedono spesso presentazioni di scarsa qualità Evidenza: Un lavoro ottimo, presentato in modo pessimo,

Dettagli

Data warehouse.stat Guida utente

Data warehouse.stat Guida utente Data warehouse.stat Guida utente Versione 3.0 Giugno 2013 1 Sommario INTRODUZIONE 3 I concetti principali 4 Organizzazione dei dati 4 Ricerca 5 Il browser 5 GUIDA UTENTE 6 Per iniziare 6 Selezione della

Dettagli

InitZero s.r.l. Via P. Calamandrei, 24-52100 Arezzo email: info@initzero.it

InitZero s.r.l. Via P. Calamandrei, 24-52100 Arezzo email: info@initzero.it izticket Il programma izticket permette la gestione delle chiamate di intervento tecnico. E un applicazione web, basata su un potente application server java, testata con i più diffusi browser (quali Firefox,

Dettagli

MEGA Process. Manuale introduttivo

MEGA Process. Manuale introduttivo MEGA Process Manuale introduttivo MEGA 2009 SP4 1ª edizione (giugno 2010) Le informazioni contenute nel presente documento possono essere modificate senza preavviso e non costituiscono in alcun modo un

Dettagli

Introduzione agli algoritmi e alla programmazione in VisualBasic.Net

Introduzione agli algoritmi e alla programmazione in VisualBasic.Net Lezione 1 Introduzione agli algoritmi e alla programmazione in VisualBasic.Net Definizione di utente e di programmatore L utente è qualsiasi persona che usa il computer anche se non è in grado di programmarlo

Dettagli

Energy risk management

Energy risk management Il sistema di supporto alle tue decisioni Energy risk management Un approccio orientato agli attori M.B.I. Srl, Via Francesco Squartini 7-56121 Pisa, Italia - tel. 050 3870888 - fax. 050 3870808 www.powerschedo.it

Dettagli

Strumenti 3D per SMART Notebook 11.1. Manuale dell'utente

Strumenti 3D per SMART Notebook 11.1. Manuale dell'utente Strumenti 3D per SMART Notebook 11.1 Manuale dell'utente Registrazione del prodotto Se si registra il prodotto SMART, si verrà informati delle nuove funzionalità e aggiornamenti software disponibili. Registrazione

Dettagli

MODULO DI ISCRIZIONE - ENROLMENT FORM

MODULO DI ISCRIZIONE - ENROLMENT FORM Under the Patronage of Comune di Portofino Regione Liguria 1ST INTERNATIONAL OPERA SINGING COMPETITION OF PORTOFINO from 27th to 31st July 2015 MODULO DI ISCRIZIONE - ENROLMENT FORM Direzione artistica

Dettagli

La Valutazione Euristica

La Valutazione Euristica 1/38 E un metodo ispettivo di tipo discount effettuato da esperti di usabilità. Consiste nel valutare se una serie di principi di buona progettazione sono stati applicati correttamente. Si basa sull uso

Dettagli

INFRASTRUCTURE LICENSING WINDOWS SERVER. Microsoft licensing in ambienti virtualizzati. Acronimi

INFRASTRUCTURE LICENSING WINDOWS SERVER. Microsoft licensing in ambienti virtualizzati. Acronimi Microsoft licensing in ambienti virtualizzati Luca De Angelis Product marketing manager Luca.deangelis@microsoft.com Acronimi E Operating System Environment ML Management License CAL Client Access License

Dettagli

COMINCIAMO A SENTIRCI UNA FAMIGLIA

COMINCIAMO A SENTIRCI UNA FAMIGLIA COMINCIAMO A SENTIRCI UNA FAMIGLIA IL PRIMO GIORNO CON LA FAMIGLIA OSPITANTE FIRST DAY WITH THE HOST FAMILY Questa serie di domande, a cui gli studenti risponderanno insieme alle loro famiglie, vuole aiutare

Dettagli

Che Cos'e'? Introduzione

Che Cos'e'? Introduzione Level 3 Che Cos'e'? Introduzione Un oggetto casuale e' disegnato sulla lavagna in modo distorto. Devi indovinare che cos'e' facendo click sull'immagine corretta sotto la lavagna. Piu' veloce sarai piu'

Dettagli

Boot Camp Guida di installazione e configurazione

Boot Camp Guida di installazione e configurazione Boot Camp Guida di installazione e configurazione Indice 3 Introduzione 4 Panoramica dell'installazione 4 Passo 1: Verificare la presenza di aggiornamenti 4 Passo 2: Per preparare il Mac per Windows 4

Dettagli

Codici sorgenti di esempio per l'invio di email da pagine WEB per gli spazi hosting ospitati presso ITESYS SRL.

Codici sorgenti di esempio per l'invio di email da pagine WEB per gli spazi hosting ospitati presso ITESYS SRL. Data: 8 Ottobre 2013 Release: 1.0-15 Feb 2013 - Release: 2.0 - Aggiunta procedura per inviare email da Windows con php Release: 2.1-20 Mar 2013 Release: 2.2-8 Ottobre 2013 - Aggiunta procedura per inviare

Dettagli

Analisi di massima: L utente dovrà inserire un numero limite, e tramite vari calcoli verrà stampato a video la sequenza.

Analisi di massima: L utente dovrà inserire un numero limite, e tramite vari calcoli verrà stampato a video la sequenza. Relazione tecnica Fibonacci ANDENA GIANMARCO Traccia: Creare un algoritmo che permetta, dato un valore intero e positivo, di stabilire la sequenza utilizzando la regola di fibonacci dei numeri fino al

Dettagli

con software libero Modulo 4 Spreadsheets (Fogli elettronici) Pag. 1

con software libero Modulo 4 Spreadsheets (Fogli elettronici) Pag. 1 con software libero Modulo 4 Spreadsheets (Fogli elettronici) Pag. 1 Indice generale GUIDA A CALC 3.5... 3 1 Utilizzo dell'applicazione... 3 1.1 LAVORARE CON IL FOGLIO ELETTRONICO...3 1.2 MIGLIORARE LA

Dettagli

MINI GUIDA SINTETICA per l uso della lavagna interattiva multimediale

MINI GUIDA SINTETICA per l uso della lavagna interattiva multimediale MINI GUIDA SINTETICA per l uso della lavagna interattiva multimediale InterWrite SchoolBoard è un software per lavagna elettronica di facile utilizzo. Può essere adoperata anche da studenti diversamente

Dettagli

LA FINESTRA DI OPEN OFFICE CALC

LA FINESTRA DI OPEN OFFICE CALC LA FINESTRA DI OPEN OFFICE CALC Barra di Formattazione Barra Standard Barra del Menu Intestazione di colonna Barra di Calcolo Contenuto della cella attiva Indirizzo della cella attiva Cella attiva Intestazione

Dettagli

Il vostro sogno diventa realtà... Your dream comes true... Close to Volterra,portions for sale of "typical tuscan"

Il vostro sogno diventa realtà... Your dream comes true... Close to Volterra,portions for sale of typical tuscan Il vostro sogno diventa realtà... Vicinanze di Volterra vendita di porzione di fabbricato "tipico Toscano" realizzate da recupero di casolare in bellissima posizione panoramica. Your dream comes true...

Dettagli

Boot Camp Guida all installazione e alla configurazione

Boot Camp Guida all installazione e alla configurazione Boot Camp Guida all installazione e alla configurazione Indice 4 Introduzione 5 Cosa ti occorre 6 Panoramica dell installazione 6 Passo 1: verifica la presenza di aggiornamenti. 6 Passo 2: apri Assistente

Dettagli

Business Intelligence a portata di mano: strumenti per una migliore gestione delle informazioni aziendali

Business Intelligence a portata di mano: strumenti per una migliore gestione delle informazioni aziendali Business Intelligence a portata di mano: strumenti per una migliore gestione delle informazioni aziendali Smau Bologna 18 Giugno 2009 Eligio Papa Distribution Channel Sales Manager SAP Italia COSA SIGNIFICA

Dettagli

WWW.TINYLOC.COM CUSTOMER SERVICE GPS/ RADIOTRACKING DOG COLLAR. T. (+34) 937 907 971 F. (+34) 937 571 329 sales@tinyloc.com

WWW.TINYLOC.COM CUSTOMER SERVICE GPS/ RADIOTRACKING DOG COLLAR. T. (+34) 937 907 971 F. (+34) 937 571 329 sales@tinyloc.com WWW.TINYLOC.COM CUSTOMER SERVICE T. (+34) 937 907 971 F. (+34) 937 571 329 sales@tinyloc.com GPS/ RADIOTRACKING DOG COLLAR MANUALE DI ISTRUZIONI ACCENSIONE / SPEGNERE DEL TAG HOUND Finder GPS Il TAG HOUND

Dettagli

5 cabins (1 main deck+ 4 lower deck) Legno: essenza di rovere naturale Rigatino Wood: striped oak

5 cabins (1 main deck+ 4 lower deck) Legno: essenza di rovere naturale Rigatino Wood: striped oak Tipo: Type: 5 cabine (1 main deck+ 4 lower deck) 5 cabins (1 main deck+ 4 lower deck) Legno: essenza di rovere naturale Rigatino Wood: striped oak Tessuti: Dedar Fanfara, Paola Lenti Fabrics: Dedar Fanfara,

Dettagli

Come installare un programma antivirus Pagina 1 di 5

Come installare un programma antivirus Pagina 1 di 5 Come installare un programma antivirus Pagina 1 di 5 Scopo della guida Per non compromettere lo stato di sicurezza del proprio computer, è indispensabile installare un programma antivirus sul PC. Informazione

Dettagli

Manuale per ascoltare e creare file audio Utilizzando la tecnologia Virtual Singer (VS) di Choralia

Manuale per ascoltare e creare file audio Utilizzando la tecnologia Virtual Singer (VS) di Choralia Manuale per ascoltare e creare file audio Utilizzando la tecnologia Virtual Singer (VS) di Choralia Informazioni generali Questo manuale fornisce informazioni e istruzioni per l ascolto e la creazione

Dettagli

SOFTWARE GESTIONE SMS DA INTERFACCE CL MANUALE D INSTALLAZIONE ED USO

SOFTWARE GESTIONE SMS DA INTERFACCE CL MANUALE D INSTALLAZIONE ED USO CLSMS SOFTWARE GESTIONE SMS DA INTERFACCE CL MANUALE D INSTALLAZIONE ED USO Sommario e introduzione CLSMS SOMMARIO INSTALLAZIONE E CONFIGURAZIONE... 3 Parametri di configurazione... 4 Attivazione Software...

Dettagli

Cos è Excel. Uno spreadsheet : un foglio elettronico. è una lavagna di lavoro, suddivisa in celle, cosciente del contenuto delle celle stesse

Cos è Excel. Uno spreadsheet : un foglio elettronico. è una lavagna di lavoro, suddivisa in celle, cosciente del contenuto delle celle stesse Cos è Excel Uno spreadsheet : un foglio elettronico è una lavagna di lavoro, suddivisa in celle, cosciente del contenuto delle celle stesse I dati contenuti nelle celle possono essere elaborati ponendo

Dettagli

Integrare le MFC con Irrlicht. Sezione 1: Creazione del progetto. by Raffaele White tiger Mancuso

Integrare le MFC con Irrlicht. Sezione 1: Creazione del progetto. by Raffaele White tiger Mancuso Integrare le MFC con Irrlicht by Raffaele White tiger Mancuso In questo topic spiegherò come integrare irrlicht in un documento singolo MFC *(1). Io ho usato il visual c++ 6 ma la procedura dovrebbe essere

Dettagli

Ora possiamo specificare la dimensione della casella di immissione dati.

Ora possiamo specificare la dimensione della casella di immissione dati. 1 di 6 17/04/2012 6.37 D'ora in poi, per maggiore chiarezza, scriverò solo quello che sta fra i due tag . Tralascerò i tag head, body, title e form. Ovviamente nei tuoi documenti è necessario che

Dettagli

DynDevice ECM. La Suite di applicazioni web per velocizzare, standardizzare e ottimizzare il flusso delle informazioni aziendali

DynDevice ECM. La Suite di applicazioni web per velocizzare, standardizzare e ottimizzare il flusso delle informazioni aziendali DynDevice ECM La Suite di applicazioni web per velocizzare, standardizzare e ottimizzare il flusso delle informazioni aziendali Presentazione DynDevice ECM Cos è DynDevice ICMS Le soluzioni di DynDevice

Dettagli

Le novità di QuarkXPress 10.1

Le novità di QuarkXPress 10.1 Le novità di QuarkXPress 10.1 INDICE Indice Le novit di QuarkXPress 10.1...3 Nuove funzionalit...4 Guide dinamiche...4 Note...4 Libri...4 Redline...5 Altre nuove funzionalit...5 Note legali...6 ii LE NOVITÀ

Dettagli

P a s q u a l e t t i V e r o n i c a

P a s q u a l e t t i V e r o n i c a PHP: OOP Pasqualetti Veronica Oggetti Possiamo pensare ad un oggetto come ad un tipo di dato più complesso e personalizzato, non esistente fra i tipi tradizionali di PHP, ma creato da noi. 2 Gli oggetti

Dettagli

Il World Wide Web: nozioni introduttive

Il World Wide Web: nozioni introduttive Il World Wide Web: nozioni introduttive Dott. Nicole NOVIELLI novielli@di.uniba.it http://www.di.uniba.it/intint/people/nicole.html Cos è Internet! Acronimo di "interconnected networks" ("reti interconnesse")!

Dettagli

group HIGH CURRENT MULTIPLEX NODE

group HIGH CURRENT MULTIPLEX NODE HIGH CURRENT MULTIPLEX NODE edizione/edition 04-2010 HIGH CURRENT MULTIPLEX NODE DESCRIZIONE GENERALE GENERAL DESCRIPTION L'unità di controllo COBO è una centralina elettronica Multiplex Slave ; la sua

Dettagli

DVR Icatch serie X11 e X11Z iwatchdvr applicazione per iphone /ipad

DVR Icatch serie X11 e X11Z iwatchdvr applicazione per iphone /ipad DVR Icatch serie X11 e X11Z iwatchdvr applicazione per iphone /ipad Attraverso questo applicativo è possibile visualizzare tutti gli ingressi del DVR attraverso il cellulare. Per poter visionare le immagini

Dettagli

FUNZIONI AVANZATE DI EXCEL

FUNZIONI AVANZATE DI EXCEL FUNZIONI AVANZATE DI EXCEL Inserire una funzione dalla barra dei menu Clicca sulla scheda "Formule" e clicca su "Fx" (Inserisci Funzione). Dalla finestra di dialogo "Inserisci Funzione" clicca sulla categoria

Dettagli

Client di Posta Elettronica PECMailer

Client di Posta Elettronica PECMailer Client di Posta Elettronica PECMailer PECMailer è un semplice ma completo client di posta elettronica, ovvero un programma che consente di gestire la composizione, la trasmissione, la ricezione e l'organizzazione

Dettagli

Le cinque cavolate da evitare quando si fa da sé il proprio e-book

Le cinque cavolate da evitare quando si fa da sé il proprio e-book Il favoloso mondo del self publishing Le cinque cavolate da evitare quando si fa da sé il proprio e-book A cura di Sergio Covelli www.pecorenerecords.com Aprile 2011 1) Basta un click, no? Ricordatelo

Dettagli

2 Editor di... stile. 2 Colonna... metrica. 6 Percentuale... di carotaggio. 10 Colonne... libere/utente 11 Colonne... grafico

2 Editor di... stile. 2 Colonna... metrica. 6 Percentuale... di carotaggio. 10 Colonne... libere/utente 11 Colonne... grafico I Parte I Introduzione 1 1 Introduzione... 1 2 Editor di... stile 1 Parte II Modello grafico 4 1 Intestazione... 4 2 Colonna... metrica 4 3 Litologia... 5 4 Descrizione... 5 5 Quota... 6 6 Percentuale...

Dettagli

Esempio di utilizzo di Excel per la gestione delle liste - Predisposizione ed allineamento -

Esempio di utilizzo di Excel per la gestione delle liste - Predisposizione ed allineamento - Esempio di utilizzo di Excel per la gestione delle liste - Predisposizione ed allineamento - Nota preliminare La presente guida, da considerarsi quale mera indicazione di massima fornita a titolo esemplificativo,

Dettagli