Introduzione all inguaggio HTML e CSS3 INTRODUZIONE. Prof.ssa Cristina Gena

Transcript

1 + Introduzione all inguaggio HTML e CSS3 INTRODUZIONE Prof.ssa Cristina Gena

2 Introduzione In questa lezione introduttiva approfondiremo i principali concetti legati al web, daremo una definizione del web e di che cosa sono gli ipertesti e gli ipermedia, e introdurremo il linguaggio html. Faremo un breve ripasso di concetti già visti nella lezione di reti. E concluderemo con le caratteristiche delle comunicazione client server. Il Web è un servizio offerto dalla rete Internet, nato verso la fine degli anni 80 con lo scopo di agevolare la comunicazione fra gruppi di ricerca sparsi in tutto il mondo, ed è diventato disponibile per pubblico dall inizio degli anni 90, basandosi sull utilizzo si standard fondamentali che sono il linguaggio HTML, ossia il linguaggio che consente di realizzare le pagine Web, gli URL, che sono lo standard per esprimere gli indirizzi delle risorse pubblicate sul Web, e infine il protocollo HTTP, che è n protocollo a livello applicativo che poggia sulle allo standard TCP /p HTML sta per hypertext Markup Language, ed è appunto un linguaggio per la strutturazione dei contenuti di un documento ipertestuale. HTML infatti arricchisce i documenti con una struttura formale, marcando i dati e conferendo un loro significato comprensibile anche dai software.

3 E importante ricordare che gli standard del linguaggio per il web vengono dettati dal W3C che è un organismo internazionale che si occupa di definire gli standard di tutti i linguaggi per il Web pubblicandoli sulla rete e a questi standard dobbiamo sempre fare riferimento quando vogliamo scrivere delle pagine web che possano essere ritenute valide. Per quando riguarda gli ipertesti, ricordiamo che le pagine Web sono degli ipertesti ossia dei testi che consentono agli utenti una lettura non lineare, come invece avviene quando leggiamo un libro. Negli ipertesti ogni pagina contiene uno o piu collegamenti, chiamati link, ad altre pagine. Gli utenti possono fruire dell ipertesto in maniera non lineare, seguendo ognuno il proprio percorso, che può essere dettato dai loro bisogni informativi. I collegamenti tra le pagine possono seguire criteri gerarchici, come quando ad esempio una pagina è collegata alla sua categoria di apparenza, o paritetici, quando invece ad esempio le pagine presentano dei rimandi ad altre pagine della stessa categoria. Per precisione tuttavia dobbiamo specificare che le pagine Web sono documenti ipermediali, ossia degli ipertesti multimediali, che così legano non solo testi ma anche immagini, suoni, filmati, ossia contenuti multimediali, prodotto con mezzi di comunicazione differenti.

4 Inoltre le pagine possono anche contenere al loro interno dei piccoli programmi chiamati script, che trasformano la pagina html statiche in pagine dinamiche, che poi vengono elaborate dal server web che le ospita e restituite in formato html, come vedremo tra poco. Come sapete le pagine web sono visualizzabili attraverso degli dei programmi chiamati browser, che sono dei software che devono essere installati sui device dell'utente che vuole accedere al Web I browser sono in grado di interpretare le istruzioni scritte nel linguaggio HTML e visualizzarle di conseguenza. Tuttavia l aspetto della pagina e il suo layout vengono decisi da un linguaggio di stile chiamato CSS, Casdanding style sheet, che approfondiremo nelle prossime lezioni insieme all HTML In questo modo attraverso l html si inserisce il Contenuti della pagina e la sua strutturazione semantica, mentre css può decidere come la pagina verrà visualizzata. Quando l utente digita l indirizzo del sito che vuole visualizzare, viene stabilita Una connessione HTTP dal browser verso il server web che ospita la pagina Se tutto procede senza intoppi la pagina viene inviata dal server Web al browser dell utente che interpreta e visualizzerà la pagina.

5 L indirizzo di una pagina web è chiamato URL, uniform resourse locator ed è scritto in maniera standard. Si parte sempre dalla specifica del protocollo, http che è appunto protocollo per il trasferimento di pagine ipertestuali di pagine ipertestuali e dopodiché si specifica l indirizzo logico della risorsa, che verrà poi tradotto tramite il protocollo DNS nell indirizzo del server che ospita il sito stesso. Possono seguire poi una serie di informazioni che compongono quello che viene ha chiamato path, percorso, che generalmente specifica il nome della pagina Web che si vuole visualizzare. Abbiamo parlato in precendenza di HTTP, che è un protocollo a livello applicativo HTTP sta per HyperText Transfer Protocol, ed è un protocollo che consente di trasferire pagine ipertestuali. http si appoggia sui protocolli sottostanti che, come sapete sono, a livello rete il protocollo IP, che si occupa di gestire gli indirizzi IP e di instradare i pacchetti attraverso le reti di comunicazione, a livello traporto il protocollotcp che si occupa di stabilire una comunicazione a due vie tra due nodi della rete che vogliono comunicare e di garantire la corretta trasmissione dei dati. HTTP è fatto per lavorare attraverso una architettura client server. È importante ricordare che le pagine Web sono ospitate da dei server Web, ossia dei computer collegati costantemente alla rete e dotati di indirizzi IP pubblici, mentre noi navighiamo sulla rete assumiamo il ruolo dei client ossia siamo dei clienti che richiedono ai server dei servizi.

6 Nello specifico il client richiede al server attraverso il protocollo http una pagina web, la quale, se tutto funziona correttamente viene inviata dal server web attraverso una risposta è HTTP Un server, generalmente, può servire più client contemporaneamente. Le pagine web richieste al server posso essere delle semplici pagina html statiche, oppure delle pagine contenente degli script, dunque dei piccoli e programmi scritti in linguaggi di scriptng lato server come php, asp, jsp. Quando un client richiede una di queste pagine a un server web, il server, prima di restituirle, elabora le istruzioni contenute nello script e poi ci invierà la risposta, scritta in html e css.