Downloaded 14 times
Uploaded byAndrea Spila
Html per bibliotecari
Il documento è un corso di scrittura e comunicazione web per bibliotecari, incentrato sull'HTML e la sua storia. Viene presentato un excursus sull'evoluzione di Internet e del web, seguita da spiegazioni sulle caratteristiche e la struttura dei documenti HTML. Infine, vengono forniti esempi di codice HTML e istruzioni su come creare una pagina web di base.
Html per bibliotecari
- 1. HTML per bibliotecari di Andrea Spila Corsodi scrittura e comunicazione web per bibliotecari Università di Modena e Reggio Emilia
- 2. Agenda Breve storiadi Internet e del web Introduzione all’HTML La mia prima pagina HTML Analisi del codice
- 3. Breve storia diInternet e del web PREISTORIA 1836 Telegrafo (Cooke & Wheatstone) 1858-1866 Primo cavo transatlantico 1876 Telefono (Bell /Meucci) NASCITA DELLA RETE 1957 Lancio dello Sputnik 1958 ARPA (Advanced Research Project Agency) 1962-68 Commutazione di pacchetto 1969 Nasce Internet (ARPANET)
- 4. LA RETE COMEMEZZO DI COMUNICAZIONE 1971 Nasce la posta elettronica 1973 FTP (File Transfer Protocol) 1974 TCP/IP I COMPUTER DIVENTANO PERSONALI 1976 Nasce il primo Apple 1981 Nasce il primo PC IBM 1984 Nasce l’Apple Macintosh Breve storia di Internet e del web
- 5. NASCITA DEL WEB 1989 Nasce il World Wide Web 1990 Nasce l’HTML (basato su SGML) 1991 Prima versione del WWW (CERN) 1993 Mosaic (primo browser HTML) 1997 Viene pubblicato l’HTML 4.0 LA RIVOLUZIONE DEL WEB 1994 Uso commerciale del web 1995 100.000 siti web 1996 500.000 siti web 1997 1.000.000 siti web 2009 231,5 milioni di siti web Tim Berners-Lee Breve storia di Internet e del web
- 6. Che cos’è l’HTML? Acronimo di HyperText Markup Language NON È un linguaggio di programmazione (come C, Pascal, Java) né un linguaggio di scripting (come PHP, ASP, PERL) È un linguaggio di marcatura che indica il modo in cui disporre gli elementi di contenuto sulla pagina Le indicazioni vengono fornite tramite marcatori detti TAG
- 7. Una metafora La paginaweb Il codice HTML
- 8. Un’altra metafora La paginawebIl codice HTML
- 9. Caratteristiche dell’HTML Indipendentedalla piattaforma (si può leggere su qualsiasi computer) Formato testo (si può scrivere in qualsiasi editor di testo) Semplice (sono sufficienti pochi tag di base per comporre una pagina HTML)
- 10. Tag dell’HTML Struttura <TAGattributi>contenuto</TAG> oppure <TAG attributi /> (tag vuoti) Nidificazione <TAG1 attributi> contenuto 1 <TAG2> contenuto 2 </TAG2> </TAG1>
- 11. Tag di base <HTML> </HTML> indica il tipo di documento <HEAD> </HEAD> informazioni sul documento <TITLE> </TITLE> titolo del documento (in HEAD) <BODY> </BODY> contenuto della pagina (si vede nel browser)
- 12. La mia primapagina HTML <HTML> <HEAD> <TITLE>Titolo della pagina</TITLE> </HEAD> <BODY> Contenuto della pagina </BODY> </HTML>
- 13. Nidificazione: scatole cinesi <HTML> <HEAD> <TITLE>Titolodella pagina</TITLE> </HEAD> <BODY> Contenuto della pagina </BODY> </HTML>
- 14. … o matriosche <HTML> <HEAD> <TITLE>Titolodella pagina</TITLE> </HEAD> <BODY> Contenuto della pagina </BODY> </HTML>
- 15. La mia primapagina HTML Proviamo a scriverla nel nostro editor di testi
- 16. <meta name="keywords" content=“parola chiave1,parola chiave2, parola chiave3,…" /> <meta name="description" content="descrizione del contenuto della pagina" /> Metatag
- 17. Altri metadati: RDFDublin Core <!-- RTF dublin core dataset --> <link rel="schema.DC" href="http://purl.org/dc/elements/1.1/" /> <meta name="DC.title" content="orari" /> <meta name="DC.description" content="" /> <meta name="DC.creator" content="Biblioteca Salaborsa" /> <meta name="DC.subject" content="" /> <meta name="DC.publisher" content="Biblioteca Salaborsa" /> <meta name="DC.contributor" content="Mara Benassi" /> <meta name="DC.date" content="2007-01-18" /> <meta name="DC.created" content="" /> <meta name="DC.modified" content="2010-09-13 14:45:59" /> <meta name="DC.type" content="doc" /> <meta name="DC.format" content="text/html" /> <meta name="DC.identifier" content="" /> <meta name="DC.language" content="IT" /> <meta name="DC.relation" content="" /> <meta name="DC.rights" content="Biblioteca Sala Borsa" /> <meta name="DC.license" content="Creative Commons Attribuzione 2.5 Italia" /> <!-- end -->
- 18. Tag di formattazione Stile <b>testo </b> grassetto (anche <strong>) <i> testo </i> corsivo (anche <em>) <tt> testo </tt> telescrivente <u> testo </u> sottolineato <strike> testo </strike> barrato
- 19. Tag di formattazione- 2 Intestazioni <Hn align=left|right|center|justify> ...</Hn> H1 H2 H3
- 20. Paragrafi Nuovo paragrafo <p>...</p> <palign=left|right|center|justify> Contenitori <div>...</div> <span>...</span> Rimando a capo <br /> (tag vuoto)
- 21. Liste Due tipi diliste <ol>...</ol> (liste ordinate) oppure <ul>...</ul> (liste non ordinate) Gli elementi della lista vengono identificati con il tag: <li>elemento</li>
- 22. Liste - 2 Codice <ul> <li>primoelemento</li> <li> secondo elemento</li> </ul> Visualizzazione primo elemento secondo elemento
- 23. Immagini <IMG SRC=“terra.gif” ALT=“Laterra vista dal satellite” WIDTH=90 HEIGHT=90 BORDER=0>
- 24. Tabelle Codice <table border="1"> <tr> <th>Titolo</th> <th>Autore</th> </tr> <tr> <td>Il nomedella rosa</td> <td>Umberto Eco</td> </tr> </table> Visualizzazione
- 25. Link ipertestuali Link aun altro documento/risorsa <A HREF=“URL” TITLE=“List of jobs”>descrizione del link</A> Link a un elemento interno allo stesso documento <A HREF=“#name”>link description</A> <A name=“name">Destination</A>
- 26.
- 27. Grazie per lavostra attenzione! E buon divertimento con andrea.spila@gmail.com