BIOINFO3 - Lezione 101 GLI IPERTESTI Una delle innovazioni introdotte da HTML e dal WWW in generale, rispetto ad un testo normale è sicuramente la possibilità

Presentazione sul tema: "BIOINFO3 - Lezione 101 GLI IPERTESTI Una delle innovazioni introdotte da HTML e dal WWW in generale, rispetto ad un testo normale è sicuramente la possibilità"— Transcript della presentazione:

1 BIOINFO3 - Lezione 101 GLI IPERTESTI Una delle innovazioni introdotte da HTML e dal WWW in generale, rispetto ad un testo normale è sicuramente la possibilità di avere dei collegamenti ipertestuali, cioè la possibilità di caricare un altro documento (pagina web, immagine, programma, filmato,…) semplicemente cliccando sopra ad un suo link. Ora sembra una cosa tanto ovvia e normale ma fino a poco più di 10 anni fa non era nemmeno immaginabile… Testo bla bla bla Il testo compreso tra i due tag e appare sottolineato (normalmente di colore blu). Cliccandoci sopra si viene trasportati alla risorsa specificata dallURL

2 BIOINFO3 - Lezione 102 URL Universal Resource Locator E lo standard utilizzato per identificare le risorse sulla rete. Le risorse sono identificate da un protocollo e da un indirizzo. In pratica con un URL si dice il tipo di risorsa ed il suo indirizzo Es. http://grup.cribi.unipd.it (protocollo http, già visto ieri) ftp:// ftp.ncbi.nih.gov/ (protocollo ftp, per il trasferimento file) mailto: nicola@cribi.unipd.it (protocollo di mail)

3 BIOINFO3 - Lezione 103 INDIRIZZI IP Vi ho già accennato che il colloquio tra due macchine collegate alla rete avviene utilizzando il protocollo TCP-IP. In questo protocollo ogni computer è identificato da un INDIRIZZO IP, formato da quattro cifre (da 0 a 255) separate dal punto Esempio: bmr.cribi.unipd.it 147.162.3.222 Poiché era impossibile ricordarsi gli indirizzi IP dei siti (è più facile ricordarsi www.google.it o 209.85.129.99?) sono stati inventati dei nomi mnemonici di DOMINI con una loro gerarchia. Esempio: i domini com gov edu uk de it…., allinterno del dominio it abbiamo il dominio unipd e al suo interno cribi e bmr itcom unipd cribi bmr

4 BIOINFO3 - Lezione 104 DNS In genere gli esseri umani usano i domini, cioè le versioni mnemoniche degli indirizzi ip. Ma se li conoscete potete usare tranquillamente gli indirizzi ip effettivi. Al livello dei computer però le comunicazioni effettive su internet avvengono esclusivamente attraverso gli indirizzi IP Della traduzione da indirizzo mnemonico a indirizzo IP si occupano dei server chiamati DNS (Domain Name Server) DNS bmr.cribi.unipd.it 147.162.3.222

5 BIOINFO3 - Lezione 105 I LINK IPERTESTUALI

6 BIOINFO3 - Lezione 106 FINESTRA TARGET Può essere utile specificare che la nuova pagina web aperta clickando su un link ipertestuale non sia mostrata al posto della pagina corrente allinterno del browser, ma in una nuova finestra del browser in modo da poterle visualizzare entrambe. E sufficiente usare lattributo target=_blank allinterno del tag target=nome finestra.

7 BIOINFO3 - Lezione 107 TABELLE E una delle cose più utili in HTML perché permette di gestire in modo efficace limpaginazione del testo. Ad esempio, dovendo visualizzare una pagina contenente numerosi record estratti da un database, ciascuno dei quali formato da diversi campi, è sicuramente più utile ed intuitivo mostrarli in una bella tabella ordinata in cui ogni riga rappresenti un record e le colonne i campi, magari usando colori diversi

8 BIOINFO3 - Lezione 108 TABELLE Una tabella è racchiusa tra i tag e. Si può specificare la dimensione in pixel del bordo della tabella disegna un bordo di un pixel disegna una tabella senza bordo Ogni riga è racchiusa dai tag e Allinterno di ogni riga le colonne sono racchiuse dai tag e. Se la colonna è quella dei titoli (in grassetto), anziché si usa Si può specificare il colore dello sfondo della tabella, di una riga o di una singola cella usando lattributo bgcolor=… allinterno dei rispettivi tag. E possibile anche stabilire lallineamento del testo allinterno della cella usando il tag align=…

9 BIOINFO3 - Lezione 109 TABELLE

10 10 FORM Ma uno degli aspetti sicuramente più interessanti di HTML è quello di consentire al visitatore di una pagina WEB di interagire con il server. Lutente, una volta scaricata la pagina sul suo browser potrà inserire dei dati allinterno dei campi di una form. Terminata la compilazione della form egli può premere un bottone di INVIO DEI DATI e automaticamente il browser trasmette questi dati ad un server web chiedendone lelaborazione. N.B. Il server potrebbe anche essere diverso da quello da cui è stata scaricata la pagina Il browser riceverà quindi una nuova pagina web di risposta generata dal server sulla base dei dati trasmessi

11 BIOINFO3 - Lezione 1011 ANCORA UN CLIENT-SERVER! Vediamo un semplice schema riassuntivo nome sequenza posiz. sito RICERCA nomesequenzaposiz. sito 1 Compilazione della form 4 Pagina WEB di risposta SERVER 2 Invio dati della form 3 Elaborazione dei dati

12 BIOINFO3 - Lezione 1012 FORM HTML Vediamo come è organizzata dal punto di vista dellHTML una form. Per il momento ci occupiamo quindi solo del lato client. Quando impareremo a scrivere dei programmi nel linguaggio PERL allora vedremo anche il lato server …campo di input… …… …campo di input… I campi di input possono essere di vario tipo (li vedremo) Action: è un URL (indirizzo web) ma questa volta non di una pagina web, bensì di un programma eseguibile Method: può essere GET o POST (vedremo cosa cambia)

13 BIOINFO3 - Lezione 1013 RIEPILOGO Ipertesti URL Indirizzi IP e DNS I link Tabelle Form