Use the left/right arrow keys to navigate, 's' to enable/disable scrolling.

Ipertesti

Installazione Firefox 4, Bluegriffon e Firebug

GetFirefox.com - Scarica Firefox 4.0

Bluegriffon.org - Scarica Bluegriffon 0.9

GetFirebug.com - Scarica Firebug 1.7

Firefox 4

Firefox 4 è l’ultima versione (rilasciata come stabile il 22 Marzo 2011) di uno dei browser più usati al mondo:

Firefox 4 Download Stats

Firefox 4 Twitter Party

Firebug 1.7

Tra le innovazioni introdotte da Firefox all’interno del panorama dei browser web, la più importante è sicuramente il supporto alle estensioni:

Addons Mozilla

Di particolare importanza/utilità per questo corso sarà Firebug 1.7, che ci consentirà ad esempio di ispezionare il contenuto di una pagina.

Bluegriffon 0.9

Bluegriffon 0.9 è un semplice editor HTML WYSIWYG basato sullo stesso “motore” di Firefox 4.0, per questo motivo supporta molte delle funzionalità presenti in HTML5 e CSS3 (ad esempio i tag audio e video)

Cos’è un ipertesto?

Esempio

Testo vs. Ipertesto

Il TESTO, ad esempio nella comune forma di Libro, costituisce una sequenza di paragrafi, pagine, capitoli che sono organizzati in modo da consentirne una agevole consultazione SEQUENZIALE:

Testo Sequenziale

Testo vs. Ipertesto

L’ IPERTESTO al contrario è un metodo di organizzazione NON SEQUENZIALE di informazioni, organizzate in nodi COLLEGATI fra di loro nei modi più svariati:

Ipertesto

Ipermedia

Quando un ipertesto non è composto di solo testo, ma anche di immagini, audio/video e altri contenuti multimediali, si definisce IPERMEDIA

Collegamenti ed Ancore

Collegamento locale

Collegamenti ed Ancore

Un collegamento [Ipertestuale] (LINK o HYPERLINK in inglese) è ciò che consente di passare da un nodo ad un altro in un documento ipertestuale.

Un ancora è un IDENTIFICATIVO interno ad una pagina che può essere utilizzato per collegamenti ad una specifica sezione all’interno della pagina.

Pagina

Da notare che il concetto di pagina in un documento ipertestuale può essere molto diverso da quello di pagina di un documento di testo ordinario (es. un libro).

Ad esempio all’interno di una pagina di un documento ipertestuale potrebbero essere contenuti tutti i capitoli di un libro, o tutte le pagine di un capitolo.

Collegamenti ad altre pagine

Collegamento esterno

Collegamenti relativi

Collegamenti relativi

Collegamenti relativi

Un collegamento viene detto RELATIVO quando viene espresso indicando come raggiungere la destinazione a partire dal percorso corrente:

  • “sottodirectory/pagina2.html”
  • ”../home.html”
  • ”../../index.html”

Collegamenti assoluti (file)

Collegamento assoluto a file

Collegamenti assoluti (http)

Collegamento assoluto a file

Collegamenti assoluti

Un collegamento ASSOLUTO è un collegamento che definisce completamente il percorso di destinazione:

  • “file://home/utente/Scrivania/pagina.html”
  • “www.google.it”
  • “learn.alcacoop.it”
  • “http://www.salug.it”

Web Server e Web Client

Client e Server Web

Web Server e Web Client

Rete di Client e Server Web

Altri esempi di collegamenti assoluti

mailto: o tel:

Collegamenti assoluti

Nei collegamenti assoluti viene spesso specificato il PROTOCOLLO, che se omesso viene interpretato come http.

Tale protocollo indica il metodo di comunicazione richiesto per accedere a tale risorsa ipertestuale, e quindi il programma da utilizzare per poterci accedere.

  • “mailto:” => Un indirizzo email (da utilizzare con il proprio programma di posta elettronica)
  • “http:” => Una risorsa web (da utilizzare con il proprio browser)
  • “file:” => Un documente locale
  • “tel:” => un numero di telefono (se previsto)

Design di un ipertesto

Il GRAFO è un insieme di NODI collegati tra loro con ARCHI

da Wikipedia

Questa struttura matematica ha una gamma di applicazioni vastissima, e tra le altre cose descrive perfettamente le relazioni presenti all’interno di un IPERTESTO

Per questo motivo sono lo strumento ideale per descrivere/progettare un ipertesto.

Design di un ipertesto

Ipertesto

Esercitazione

Esercitazione

  • NOI siamo il committente
  • Obiettivo: realizzare un ipertesto (argomento a scelta)
  • La bozza di progetto dell’ipertesto deve essere presentata attraverso un grafo

Specifiche

  • utilizzare una struttura a cartelle (es. 2 livelli)
  • utilizzo di tutte le tipologie di link (ancora, collegamenti interni/esterni)
  • minimo una decina di pagine totali
  • citare le fonti!

http://learn.alcacoop.it - learn@alcacoop.it

released under CreativeCommons 2.5 by-nc-sa