MATTIA BONZI

STUDENTE DI GRAFICA E COMUNICAZIONE

ASPIRANTE WEB-DESIGNER

Mattia.bonzi@itsosmilano.com

TECNOLOGIA DELLA

 COMUNICAZIONE

Programma svolto, anno scolastico 2015/2016 4F

SITI WEB

 

Un sito web è un insieme di pagine web correlate tra loro, che risiedono su di un server.

Ad un sito web è associato uno o più domini, ovvero l’indirizzo dal quale è possibile accedere al sito, generalmente si usa un URL (Unifrom Resource Locator) ma in alternativa è possibile utilizzare l’indirizzo ip del server web.

 

Essendo un sistema ipertestuale i documenti sono disposti sul server in una serie di cartelle e sottocartelle ordinate ma non in sequenza, ognuna di essa è accessible, indipendentemente dal documento visto in precedenza.

 

Per questo motivo l’Url è composta dal nome del dominio seguita dal percorso del file richiesto.

(www.example.com/pagine/home.html).

 

Quando questo indirizzo viene inserito in un browser web (client) viene inviata la richiesta al server che la elabora e in risposta ci permette di visualizzare la pagina richiesta.

I siti web si dividono in due categorie principali, statici e dinamici.

 

I primi sono generalmente composti da documenti html e css, non contengono applicazioni e script e non utilizzano database per la raccolta di informazioni.

Hanno strutture molto più semplici rispetto ad un sito dinamico, permettendo una più veloce e fluida navigazione, ma non permettono id interagire con gli utenti.

Es. (Questo sito, www.2tour.it, www.mattiabonzi.altervista.org/sito%20spaddy)

 

I siti web dinamici sono più complessi, generalmente scritti utilizzando html, css, php, javascript, ajax, jquery e altri..

Spesso si avvalgono dell’utilizzo di cms (content management system)(wordpress, joomla, drupal, musexpress) per la gestione dei contenuti. (post, prodotti, utenti…)

In questa tipologia di sito le informazioni, non sono contenute direttamente all’interno delle pagine web, ma sono inserite in database, e mostrate solo quando richieste dall’’utente, questo permette di creare blog, forum, e-commerce e altre piattaforme più complesse.

Es. (www.hatmo.it, www.libreriantigone.com)

 

I MIEI SITI

Durante quest'anno ho realizzato diversi siti su commissione e per amici, utilizzando diversi strumenti, tra cui:

Wordpress, Adobe Muse, MuseXpress, WooCommerce, Bracket, html5 e css3.

MacBook Pro

<

>

Questo sito nasce con l’idea di creare un quaderno multimediale che raccogliere in un solo posto tutti gli appunti e i progetti a cui ho lavorato.

E’ stato creato interamente con adobe muse, versione 2015.2 utilizzando anche alcuni plug-in disponibile nella libreria di www.musegain.com.

Successivamente all’esportazione in html del sito, ho modificato leggermente il css per completare il lavoro, facendo quello che muse non può fare, come per esempio aggiungere il bordo arancione attorno alle immagini con lo zoom nella pagina di arte…

 

La pagina di contatti del sito, visibile anche qui, è stat scritta interamente da me in html/css e php, per sperimentare l’uso del php e migliorare il css utilizzando la funzione “mail()”.

Creato con un design responsive e quindi compatibile con tutti i dispositivi, computer, telefoni e tablet.

E’possibile vedere il codice qui.

 

 

ALGORITMI

 

Un algoritmo è una sequenza di operazioni ordinate ed eseguibili che servono a risolvere un problema.

Per poter essere definito algoritmo il procedimento deve:

  • Avere una formulazione generale
  • Prevedere operazioni di acquisizione di dati esterni
  • Risolve il problema dato

 

 

Proprietà degli algoritmi

  • Generalità: non può risolvere il problema utilizzando solo costanti interne al procedimento.

        Esempio (Il procedimento per determinare se 23 è un numero primo, non è un algoritmo)

  • Comprensibilità: L’algoritmo deve essere comprensibile all’esecutore (solitamente il computer)
  • Finitezza: L’algoritmo deve avere un numero finto di passi
  • Riproducibilità: Se eseguito più volte con gli stessi dati di input deve restituire lo stesso risultato.
  • Non ambiguità: L’algoritmo deve prevedere tutte le possibilità che si possono verificare durante l’esecuzione (non possono esserci passaggi o decisione “casuali”)
  • Illimitatezza dei dati input: Non ci devono essere limiti alla grandezza dei dati di input (in linea teorica, in quanto richiederebbe spazio di archiviazione e potenza di calcolo infinite)

 

Variabili

Le variabili sono uno spazio riservato di memoria caratterizzato da un nome che lo distingue, atto a raccogliere le informazioni necessarie per il procedimento.

Possono assumere qualsiasi valore, sia numerico che alfanumerico.

 

Costanti

Le costanti sono uno spazio di memoria contente dati necessari allo svolgimento dell’algoritmo, il cui contenuto è esplicitato all’interno dell’algoritmo.

 

La rappresentazione degli algoritmi

Esistono più modi di rappresentare un algoritmo, il più utilizzato e di più facile comprensione per noi, è il diagramma a blocchi.

Consiste in un digramma formato da figure (simboli con un significato) in successione, collegate da frecce che ne indicano la direzione.

I LINGUAGGI DI PROGRAMMAZIONE

 

I linguaggi di programmazione sono linguaggi che è possibile utilizzare per controllare il comportamento di un computer e quindi per creare applicazioni.

Sono differenti dai linguaggi di markup (html, xml, xhtml) che permettono invece di organizzare e schematizzare i dati (contenuti).

Esistono moltissimi linguaggi diversi (quasi 2500), utilizzabili in modi diversi a seconda delle proprie esigenze.

 

Principalmente si dividono in:

 

  • Imperativi

        Le istruzioni sono comandi espliciti, che operano su una o più variabili e vanno eseguiti in un ordine prestabilito.

        Es. C, C++, PHP, BASIC, RUBY, FORTRAN, LUA, JAVA...

 

  • Funzionali

        Sono basati sul concetto matematico di funzione, non richiedono variabili e sono thread-safe (i dati e il codice possono essere

        utilizzati contemporaneamente da più thread in modo sicuro).

        Es.C#, SCALA…

 

  • Logici

        Le istruzioni sono sotto forma di clausole che descrivono le relazioni tra più variabili.

        Es.PROLOG...

 

Linguaggi di scripting

I linguaggi di scripting nascono con le prime shell unix, il compito di questi linguaggi era semplificare operazioni lunghe e ripetitive, evitando di dover digitare tutti comandi per eseguire un’operazione, ma permettendo di richiamarla da un file dove i comandi sono salvati in sequenza.

Non è possibile creare applicazioni complesse con questi linguaggi, ma l’utilizzo di librerie e file con scrpit già impostati, li rendono più veloci e leggeri rispetto ai comuni linguaggi d programmazione, utilizzabile quindi sul web, sia sul lato client che su quello server.

Es. JAVASCRIPT, PHP, PERL, ASP, APPLESCRIPT…

 

 

Scrpit server side

Gli script sul lato server, vengono eseguiti prima dell’invio della risposta del server (nella fase di elaborazione della richiesta proveniente dal browser) e quindi non è il codice sorgente della pagina ad essere inviato all’utente, ma il risultato delle operazioni contenute in essa.

Prendiamo ad esempio il funzionamento di wordpress, che utilizza dei temi (layout) prestabiliti scritti in php.

Quando noi schiacciamo col mouse su di un link che rimanda ad un articolo (post) il browser manderà la richiesta al server per poter visualizzare l’articolo che è contenuto nel database, a questo punto il server recupera le informazione necessarie dal database (titolo, immagine, testo, commenti, data etc..) e li dispone ordinatamente nel layout in php, trasformandolo in un documento statico in html che viene quindi spedito al broswer e visualizzato dall’utente.

Il file originale in php però non è stato modificato ed è quindi pronto per poter essere utilizzato per altre richieste che vengono elaborate allo stesso modo.

Script client side

Gli script sul lato client, invece, vengono inviati all’utente insieme al documento html, ed eseguiti dall’utente una volta che il file è stato scaricato.

Ad esempio potremmo utilizzare uno script in javascript per verificare che le informazioni inserite in un form (html) siano corrette prima dell’invio al server...

O ancora per creare animazioni complesse non facilmente gestibili con le animazioni css3.

La differenza principale nei due modi di utilizzare gli script sta nel fatto che gli scrpit server-side vengono eseguiti in automatico prima dell’invio della risposta, quelli client-side, invece, vengono eseguiti su richiesta dell’utente dopo aver scaricato la pagina.

JAVASCRIPT (JS)

 

E’ un linguaggio di scripting potente e versatile, molto utilizzato sul web per creare pagine html dinamiche (in parte sostituibile con le animazioni css3).

Permette di far interagire l’utente con la pagina web, di controllare i campi dei moduli e altre operazioni che, se svolte server-side, appesantirebbero il server, con un relativo rallentamento della risposta.

Essendo un linguaggio interpretato (ossia che non ha bisogno di essere compilato, cioè codificato in binario) necessita un interprete (il browser) e non può essere eseguito come programma stand-alone.

E’ basato sugli oggetti, il che vuol dire che qualsiasi elemento html è considerato un oggetto nel codice javascript, ed ognuno a delle proprietà dei metodi e degli eventi particolari.

 

Javscript e html

Per inserire uno script javascript all’interno di una pagina html è possibile fare più cose, utilizzare un file esterno specificandone il percorso oppure inserire lo script direttamente nel documento html.

 

Interno

E’ possibile inserire script javascript direttamente nel codice html in due modi differenti:

 

Direttamente all’interno del codice di un elemento html, attribuendolo ad un tag che rappresenta un evento.

 

<div class=“button1” onclick="alert(‘hello word!’)”>Clicca qui</div>

 

Lo script viene eseguito dal browser nel momento in cui si verifica l’evento html.

 

Oppure per script più complessi e lunghi e possibile utilizzare l’elemento html <script> inserendolo nella sezione <head> o <body>.

 

Esterno

Per script ancora più complessi, o in ogni caso, per alleggerire il documento html, e mantenere separate le parti in js e in html è possibile utilizzare script contenuti in file esterni, semplicemente specificando la url (assoluta o relativa) dei file che li contiene.

Si utilizza il tag html <script> specificando l’attributo src=“” .

<script src=“www.example.com/javascript.js”>

 

Esecuzione di uno script

Per eseguire uno script js associato ad un documento html è necessario usare il gestore di eventi, utilizzando i tag riportati nella tabella con la segante sintassi  onclick=“nome funzione()"

Strutture di controllo

Sono le strutture di codice che permettono all’esecutore di capire quale stringhe eseguire in quale momento.

 

Sequenza: le istruzioni vengono eseguite nell’ordine in cui sono scritte, una dopo l’altra.

 

Selezione: (if, if..else, switch) permette di fare una scelta tra più blocchi di codice.

                    If: Indica l’azione da eseguire quando una condizione è vera.

                    If…Else: Indica le azioni da eseguire quando una condizione è vera e quando è falsa.

                    Switch: Permette la scelta tra più di 2 opzioni attraverso la successione di più “if..else"

 

Ripetizione: (while, do..while, for, for..in) permette di eseguire in ripetizione un blocco di codice.

                    While: Ripete il codice fin tanto che la condizione è vera.

                    Do…While: Esegue una volta il codice prima che incominci il loop, poi lo esegue fino a che la condizione vera.

                    For: Ripete il codice un numero specificato di volte.

 

Array

Un array è una variabile speciale che che è in grado di contenere contemporaneamente più di un valore.

Attraverso alcune funzioni è possibile ordinare ed eseguire ricerche all’interno dei valori contenuti in un array.

Fonti: Wikipedia.org, Html.it, Web-link.it, w3schools.com, digilander.libero.it, scuola.linux.it, home.deib.polimi.it, tanwts.altervista.org, esperienze e conoscenze personali.

INTERAMENTE REALIZZATO DA MATTIA BONZI