• Non ci sono risultati.

Laboratorio di Informatica 3 Anno Accademico 2019-2020

N/A
N/A
Protected

Academic year: 2021

Condividi "Laboratorio di Informatica 3 Anno Accademico 2019-2020"

Copied!
21
0
0

Testo completo

(1)

Laboratorio di Informatica 3

Anno Accademico 2019-2020

Luigi Catuogno

[lcatuogno@unisa.it]

Laboratorio di Informatica 3

• Orario delle lezioni:

• Lunedì 16:30-18:30 • Giovedì 12:30-14:30

• Durata: 40 ore

• CFU: 2

• Docente: Luigi Catuogno

(2)

Programma del corso

Laboratorio di Informatica 3

• Cos’è e come funziona il WEB

• Il world Wide WEB:

• Protocolli, architettura e funzionamento • Il client (browser) e il server Web

• Pubblicare contenuti sul Web con strumenti on-line:

• Realizzazione di un sito WEB con Google Sites • Realizzare un canale con You Tube

(3)

Laboratorio di Informatica 3

• Anatomia delle pagine WEB

• I contenuti: testo, immagini, suoni, video…

• L’organizzazione dei contenuti: il linguaggio HTML • I fogli di stile CSS

• Linguaggi di scripting (cenni)

Svolgimento e finalità del corso

(4)

Laboratorio di Informatica 3

• E’ un corso di carattere pratico

• Acquisire la consapevolezza delle tecnologie e delle pratiche che stanno «dietro» alla realizzazione di un sito web.

• Lezioni frontali

• Argomenti di carattere generale • Nozioni propedeutiche

• «The big picture»

• Svolgimento dell’attività di laboratorio:

• Introduzione «teorica» degli argomenti • Esercitazione pratica

• Discussione

Svolgimento dell’esame

(5)

Laboratorio di Informatica 3

• Una settimana prima dell’appello:

• Sarà pubblicata la «traccia» di un progetto da realizzare (una pagina web) con delle specifiche caratteristiche.

• Il candidato deve realizzare la pagina richiesta in tutte le sue parti e salvarla sul proprio Laptop o su un pendrive USB.

• Il giorno dell’esame:

• Il candidato sosterrà un breve colloquio col docente nel quale descriverà il lavoro svolto

• Risponderà a quesiti tecnici (del docente) relativi alle scelte compiute nella realizzazione del sito

• Votazione: superato/non superato

Un esempio

(6)

Riscopriamo la poesia

• Il candidato scelga una poesia (anche una sola strofa) a sua

discrezione e la utilizzi per una pagina WEB che invogli alla riscoperta

di quesa antichissima arte.

• La poesia dovrà essere impaginata inserendo, tra i versi, motivi grafici

e immagini che ne richiamino il contenuto.

• Il candidato dovrà utilizzare 3-5 parole del testo come link verso altrettante pagine che:

• Presentino l’autore

• Illustrino elementi salienti del testo e del suo significato

Requisiti tecnici

• Sono richiesti obbligatoriamente (altrimenti la prova è insufficiente)

• L’utilizzo di fogli di stile in un file .css a sé stante, da utilizzare sia nella pagina principale sia in tutte le pagine secondarie.

• Ciascuna pagina secondaria deve contenere un link alla pagina principal

(7)

Riscopriamo la poesia

Riscopriamo la poesia

(8)

Riscopriamo la poesia

Riscopriamo la poesia

(9)

Libri di testo consigliati:

Libri di testo consigliati:

Google Sites:

Ryan Teeter and Karl Barksdale

Google Sites & Chrome for Dummies

Wiley Publishing Inc. (2009)

ISBN 978-0-470-39678-0

(10)

Libri di testo consigliati:

Youtube:

Rob Ciampa, Theresa Moore

Youtube Channels for Dummies

Wiley Publishing Inc. (2015)

ISBN 978-1-118-95817-9

Libri di testo consigliati:

L’architettura del WWW:

Donatella Sciuto, Giacomo Buonanno, Luca Mari

Introduzione ai sistemi informatici

McGraw-Hill Italia. (2016)

ISBN 978-88-386-9216-1

In particolare:

Cap. 9: «Le applicazioni»

Cap. 9.5 «Le tecnologie per il World Wide Web»

(11)

Libri di testo consigliati:

Il linguaggio HTML e i fogli di stile:

Laura Lemay, Rafe Colburn

HTML & CSS

McGraw-Hill Italia. (2007)

ISBN 978-88-386-4478-8

Libri di testo consigliati:

HTML5:

Daniele Bochicchio e Stefano Mostarda

HTML5 con CSS e JavaScript

Editore Ulrico Hoepli Milano. (2015)

Per chi desidera approfondire le innovazioni introdotte con HTML5 e la gestione avanzata dei contenuti multimediali

(12)

Strumenti & risorse

Introduzione

Editor di testo:

(13)

Editor di testo:

• Microsoft Notepad (Bloco Note)

• Komodo Edit

• https://www.activestate.com/products/komodo-edit/

• Atom Edit

• https://atom.io/

Microsoft (e Libre) Office:

(14)

Microsoft Word

Microsoft Word

(15)

La Google-sfera:

La Google-sfera

• Le applicazioni sono installate nel cloud di Google:

• Su richiesta dell’utente, il cloud crea ed esegue una istanza dell’applicazione e la assegna all’utente;

• Il codice del software è eseguito in remoto;

• L’utente vi interagisce mediante il web browser;

• Il browser esegue il front-end dell’applicazione e cura la comunicazione con il back-end;

Alcune Google Apps

(16)

La Google-sfera: Google Docs

Un esempio: Google Docs

1

2

La Google-sfera: Google Docs

Un esempio: Google Docs

3

(17)

La Google-sfera: Google Docs

Un esempio: Google Docs

4

5

Google Sites

(18)

Google Sites

• Strumento gratuito per la creazione di pagine web nella Google-sfera

• Editor di pagine WYSIWYG (What You See Is What You Get)

• Inserimento di testo e altri componenti delle pagine WEB

• Immagini, collegamenti, tabelle

• Possibilità di scelta tra numerosi stili e template pre-definiti

• Possibilità di raffinare il lavoro con un limitato ricorso al codice HTML • Possibilità di interoperare con le altre applicazioni e servizi Google

• E.g. Google Docs, Youtube, Google Maps…

Primi passi in Google Sites

• Cosa occorre:

• Un account Google

• Un browser web tipo Firefox o Google Chrome

• Cosa facciamo:

• Realizziamo un primo semplicissimo sito web

• Cosa impareremo:

• Utilizzo delle funzionalità base dell’editor (comuni a molti prodotti simili) • Utilizzo delle principali componenti di una pagina WEB

(19)

Creazione di un sito Web

Una volta entrati, l’ambiente rende immediatamente disponibili le principali funzionalità.

Creazione di nuovi siti.

Gestione dei siti creati

precedentemente

Creazione di un sito Web

(20)

Creazione di un sito Web

Si procede alla scelta del nome del sito…

… e del tema.

Creazione di un sito Web

E’ possibile che in alcune fasi, il sistema voglia essere sicuro che l’utente sia effettivamente un essere umano e non un

BOT (Programma che realizza automaticamente un gran

numero di siti «fantasma» a scopi illeciti.

Per far questo, il sistema sfida l’utente con un CAPTCHA: una procedura che gli sottopone un problema che (presumibilmente) solo un umano può risolvere. Per esempio, qui si chiade di indicare i riquadri in cui appaiano strisce pedonali.

(21)

Creazione di un sito Web

Il sito appena creato appare pressappoco così. Si tratta di un layout molto semplice. In seguito vedremo come è possibile personalizzarlo.

Creazione di un sito Web

Riferimenti

Documenti correlati

glh International Symposium on Metal lons in Biology and Medicine Book of Abatracta.. 9 th INTERNATIONAL SYMPOSIUM ON MET AL

(2) Auf der Grundlage des Berichts nach Artikel 22 des Vertrags zur Gründung der Europäischen Gemeinschaft kann der Rat unbeschadet der anderen Bestimmungen des genannten Vertrags

RESOLVED to mark a new stage in the process of European integration undertaken with the establishment of the European Communities, RECALLING the historic importance of the ending of

glh International Symposium on Metal lons in Biology and Medicine Book of Abatracta.. 9 th INTERNATIONAL SYMPOSIUM ON MET AL

a Department of Chemistry, University of Sassari, Via Vienna 2, 07100, Sassari, ITALY. b Cerm, Centro di Risonanze Magnetiche, Università di Firenze,

107-8, preferisce ipotizzare uno sbarco della flotta punica nell'insenatura di Is Are- nas, più prossima a Cornus, ma sfavorita dal gioco delle correnti, assai forti, rispetto

Paul Bairoch souligne qu'au 18e siècle, la révolution industrielle n'a pas encore bouleversé la répartition de la population eu­ ropéenne, car elle n'affecte que des

In these studies, gas emissions are continuously measured by a gas analysers system and the sample is taken from the stack gas through an insulated and externally heated