Le nuove tendenze tecnologiche dell’elearning

Oggi più che mai, l’importanza di un LMS di qualità viene riconosciuta dalle organizzazioni di tutto il mondo. Le aziende fanno ricorso sempre più spesso ad attività di formazione del personale per migliorare le prestazioni del proprio staff, la produzione e i processi produttivi. Pertanto, come non mai, è diventato ancora più necessario disporre di un sistema LMS aggiornato e funzionale e affidabile.

Naturalmente, ogni progresso tecnologico, è accompagnato da un’evoluzione sistematica dei sistemi LMS cercando di adattarsi e integrare il più possibile quanto le nuove tecnologie hanno loro da offrire.  Continue Reading


Come funziona davvero l’ottimizzazione per i motori di ricerca (SEO)?

Nel mio articolo precedente, “Come funziona davvero Google Search?” abbiamo visto le basi su come Google esegue la scansione del web, indicizza i dati e presenta i risultati di ricerca utilizzando un sistema a punteggio chiamato PageRank per determinare quali collegamenti devono essere visualizzati per primi. Vi ho promesso, alla fine dell’articolo di parlare del SEO e dei metodi (leciti) per aumentare il pagerank.

Il termine SEO è sempre più spesso utilizzato in ambito informatico. Libri, seminari, siti web e professioni sono state creati per promuovere e discutere questo argomento. In questo articolo vorrei presentare le possibilità che Google mette a disposizione dei webmaster in ambito SEO. In sostanza, le raccomandazioni di Google sono basate sul controllo dei contenuti, procedure tecniche e controllo sulla qualità. Google inoltre fornisce alcune istruzioni su come aggiungere l’URL del sito e una sitemap per agevolare al meglio il processo di indicizzazione. Continue Reading


Come funziona davvero Google Search?

C’è poco da dire: Google non è un motore di ricerca; Google è il motore di ricerca. Vi capita spesso di usare Google? E non vi chiedete mai il motivo per cui alcuni risultati vengono visualizzati prima rispetto ad altri? Forse perchè alcuni link sono più attinenti che altri, oppure perchè vengono aggiornati spesso… Insomma, in parole povere, come fa Google a stabilire l’ordine di priorità dei risultati? Ma poi perchè mi faccio queste domande, quando posso cercare con Google le risposte? Continue Reading


Centrare un DIV in verticale e orizzontale

Spesso ci capita di dover centrare degli elementi contenuti all’interno di un <div> più grande e di dimensioni prefissate. Sappiamo che se utilizziamo l’attributo margin: 0 auto; l’oggetto viene centrato in orizzontale. Scrivere margin: 0 auto; equivale a dichiarare:

Tuttavia, questo metodo non centra l’oggetto contenuto nel <div> in verticale. In realtà, anche utilizzando margin-top: auto e margin-bottom: auto, non risolveremmo un bel niente. 

Per risolvere questo piccolo grande problema, ci viene in aiuto un trucchetto che permette di risolvere il problema. Vedremo come centrare l’oggetto in verticale e in orizzontale relativamente alla pagina, quindi al tag <body>. Per fare questo, occorre definire un #ID nel nostro foglio di stile come di seguito specificato:

e poi applicarlo al tag <div>

Con lo stesso meccanismo, possiamo centrare un <div> all’interno di un altro <div>, ma sarà necessario specificare delle dimensioni prefissate sia in altezza che in larghezza anche per il <div> più esterno.

e quindi, in html, scriveremo:

Semplice, no?


Google Glass in ambito medico?

I Google Glass saranno probabilmente disponibili all’inizio del 2014, e mentre Google ha incentrato la campagna di comunicazione sull’uso “social” degli occhiali, c’è chi pensa come questa nuova tecnologia possa avere applicazioni di vasta portata in ambito sanitario sia personale che professionale.

google-glass-works

Centri di ricerca e medici di tutto il mondo hanno mostrato un interesse a sperimentare ed esplorare le potenzialità di Google Glass in ambito medico.

Con un concorso pubblico, Google ha selezionato 8.000 “vincitori” per acquistare i Google Glass a 1.500 dollari. Questi vincitori sono diventati il gruppo di utenti beta che ha sperimentato gli occhiali in vari ambiti, aiutando Google a risolve i bug prima del definitivo lancio sul mercato. Tra questi beta-tester il centro medico Radboud University in Olanda è stato il primo sistema sanitario a testare i Google Glass in Europa. L’ospedale, che rappresenta un importante centro di innovazione, ha voluto esplorare i vantaggi di questa nuova tecnologia, diventando così parte integrante della campagna di marketing di Google.

Ma esattamente come potrebbero essere applicati in ambito medico i Google Glass? Gli specialisti pensano che le possibilità siano infinite. Medici e operatori sanitari possono accedere alle informazioni in tempo reale, indossando gli occhiali di Google. Oppure potrebbero comunicare con colleghi a distanza, attraverso la webcam integrata negli occhiali, ottenendo un feedback immediato per migliorare l’efficienza e la qualità delle cure prestate al paziente. Ma il vero potenziale si potrebbe avere in sala operatoria. I chirurghi potrebbero vedere i risultati della TAC del paziente in tempo reale e ottenere un feedback sui loro progressi per migliorare i risultati.

Harry Van Goor è chirurgo e docente in chirurgia presso la Radboud University. Ha testato i Google Glass durante un’operazione addominale. Ha filmato l’intervento per tre ore con i Google Glass e ciò ha permesso agli studenti di seguire l’intervento dal punto di vista del medico chirurgo. Anche se il filmato era un po’ traballante, i primi risultati sono promettenti.

Oltre ad essere uno strumento didattico, Van Goor ha utilizzato gli occhiali come strumento di documentazione e registrazione delle procedure adottate nell’intervento chirurgico. “Di solito è possibile prendere appunti registrando la voce con un microfono, ma attraverso i Google Glass è possibile registrare il video oltre che l’audio, ottenendo una documentazione molto più precisa e affidabile”, spiega Van Goor.

Molti sostengono che operando con un menu pop-up davanti all’occhio possa essere fastidioso per il chirurgo. Secondo Van Goor invece ciò non rappresenta un problema: “il piccolo schermo in alto a destra dei Google Glass è sopra il mio occhio. Quando faccio l’intervento devo guardare in basso e non ho problemi di visuale o altri distrattori, quindi posso concentrarmi totalmente sul mio lavoro”, ha aggiunto.

Un altra critica che spesso viene avanzata è se la tecnologia dei Google Glass riesce a fornire una protezione adeguata della privacy dei pazienti. Effettuare registrazioni su di essi potrebbe rappresentare una evidente violazione della privacy. Se gli ospedali vogliono massimizzare l’utilità di Google Glass, è necessario avere l’accesso ad informazioni specifiche del paziente. Tutto ciò potrebbe essere un chiaro ostacolo in ambito sanitario se non si utilizzano adeguati sistemi di protezione e autorizzazione all’accesso delle informazioni.

Quindi, anche se le applicazioni in ambito healtcare potrebbero sembrare infinite, Google Glass è ancora poco più di un prototipo, il che rende difficile prevedere il suo futuro nel mondo della sanità.


Qualche consiglio per migliorare un corso e-Learning

Creare un corso distribuito su piattaforma e-Learning richiede molta più pianificazione e dettagli di quanto si pensi. Un corso ben fatto e ben organizzato avrà un impatto positivo sulla formazione delle persone, soprattutto in un ambito aziendale. Dal momento che l’e-learning si è imposto come strumento per veicolare una buona formazione, vediamo quali potrebbero essere 5 punti da tenere a mente durante la progettazione del corso per evitare che il corso si riveli un disastro. Continue Reading


Progetto completo di una chat con Server-Sent Event e HTML5 + Jquery

Continuiamo la panoramica sulle API Server-Sent Event in HTML5. In questo caso scopriremo e analizzaremo passo dopo passo come creare una chat funzionante. La ragione di questo esempio è principalmente applicare i concetti visti negli articoli precedenti, per meglio comprendere la potente tecnologia che HTML5 ci offre.

Avremo bisogno al solito di un web server, va bene anche XAMPP o qualsiasi altro web server Apache+PHP+MySQL.

Il database

La prima cosa da fare è creare il database con la tabella che conterrà i messaggi che gli utenti invieranno alla chat e che saranno consegnati a tutti i client in ascolto. Il database ha una sola tabella, mediante la quale, oltre a fare da intermediario potrebbe anche rappresentare un’ottimo strumento per filtrare parole non gradite. Lo script SQL è il seguente, potete eseguirlo facilmente su PhpMyAdmin.

La chat

 Chiamiamo questo file chat.html, ed è il file che conterrà il codice HTML+CSS e gli script Javascript del client. L’interfaccia è molto semplice ed è composta principalmente da un contenitore DIV in cui vengono aggiunti man mano i sotto-contenitori DIV dei messaggi. Per completare, ho posizionato sotto la chat due caselle di testo per inserire il nome, il messaggio e il pulsante per inviare tutto al server e di conseguenza agli altri client connessi.

Stream chat

Chiamiamo questo file chatlist.php. Lo stream dei messaggi sarà formato da un file PHP, in particolare in ciclo infinito che effettua un’interrogazione al database MySQL per poi “addormentarsi” per un secondo. Le prime due righe di intestazione sono molto importanti per il meccanismo SSE di HTML5, in quanto per il corretto funzionamento della chat, è necessario impostare il Content-Type come “text/event-stream” e definire il Cache-Control uguale a “no-cache”. Non dimenticatelo.

Le operazioni sul database

Tutte le operazioni sul database preferisco scriverle in un file diverso dagli altri, per mettere un po’ di ordine. Lo chiamiamo dbfunctions.inc e contiene tra l’altro la gestione della connessione al database, oltre alla stampa a video del messaggio necessario al Server-Sent Event.

Il blocco più interessante è quello della funzione ListChat(). Questa funzione interroga il messaggio cercando tutti quei messaggi che sono stati spediti al server nel periodo compreso tra l’ultima interrogazione $MM_LastTime e l’ora corrente $MM_Time. In questo modo vengono pescati solo le ultime righe senza far perdere alcun messaggio. Quindi vengono estratti i campi, formattati in HTML e restituiti alla funzione sendMsg() che si occupa di comporre il messaggio per SSE.

File di supporto

Nell’ultimo file, chiamato chatsubmit.php, inserisco la procedura che viene attivata durante la chiamata di chatTimerHandler() nel file chat.html tramite Ajax con metodo GET. Lo script non fa altro che inserire nel database MySQL il nome e il messaggio digitato dall’utente in modo da poter essere “comunicato” a tutti quanti i client in ascolto.

 


Server-Sent Events in HTML5

Tradizionalmente in un’architettura client-server, come mostrato in figura, una pagina web residente nel client invia una richiesta al server per ricevere una risposta con dei dati. Con l’avvento dell’HTML5, e in particolare della libreria API Server-Sent Events, è possibile, per un server, inviare dei dati a una pagina web “in qualsiasi momento”, tramite dei messaggi push, senza che la pagina in questione ne faccia esplicita richiesta. I messaggi in arrivo possono essere trattati come eventi + dati all’interno della pagina web. 

client-server

Lo sviluppo di un’applicazione web che utilizza le API Server-Sent Events è abbastanza facile. Avrete bisogno di un po’ di codice sul server per lo effettuare lo streaming degli eventi al client; per quanto riguarda il lato client, la gestione di tale eventi è identica a qualsiasi altro tipo di evento.

Le API Server-Sent Events sono contenute nell’interfaccia EventSource. Per aprire una connessione al server e iniziare a ricevere gli eventi, bisogna creare un nuovo oggetto EventSource, specificando l’URI dello script sul server che genera lo stream di eventi. Per esempio:

Una volta istanziato l’oggetto, è possibile iniziare  ad intercettare i messaggi che verranno creati dallo script in sse_test.php:

Lo script sopra non fa altro che “ascoltare” eventuali messaggi in arrivo (cioè, dei messaggi standard dal server ) e aggiungere il testo del messaggio in un contenitore div che poi viene mostrato nella pagina.

È anche possibile ascoltare eventi personalizzati, utilizzando la funzione addEventListener():

Questo codice è simile al precedente, tranne per il fatto che verrà chiamato solo quando il server invierà un messaggio di tipo ping al client.

Il formato del messaggio

Il messaggio che viene inviato dal server al client è un semplice streaming di testo in formato JSON, codificati in UTF-8. Ogni messaggio è separato da una coppia di caratteri speciali \n\n. Una riga del emessaggio che inizia con : è, in sostanza, una riga di commento e viene ignorata. La riga di commento può essere usata per impedire il timeout della connessione: un server può inviare periodicamente un commento per mantenere aperta la connessione.

Ogni messaggio è costituito da una o più righe di testo scritte secondo la notazione nomecampo: valore + \n

Campi

I campi che possono essere utilizzati in un messaggio sono 4. Altri campi, al di fuori di questi, vengono sostanzialmente ignorati.

  • event – rappresenta il tipo di evento. Se nel messaggio viene specificato questo campo, l’evento inviato al browser potrà essere intercettato solo utilizzando addEventListener(). L’handler onMessage() invece intercetta qualsiasi messaggio privo del campo event.
  • data – rappresenta il campo dati per il messaggio, cioè il contenuto che dovrebbe essere visualizzato sul browser. Quando EventSource() riceve più linee che iniziano con “data:”, li concatena, e inserisce un ritorno a capo \n tra ciascuno di essi.
  • id – rappresenta l’ID del messaggio.
  • retry – rappresenta il tempo di riconnessione in millisecondi da utilizzare quando si tenta di inviare un messaggio. Se non viene specificato un valore intero, il campo viene ignorato.

Esempi

Messaggi “data only”

In questo esempio, si ipotizza l’invio di tre messaggi. Il primo messaggio è solo un commento, poiché comincia con i due punti. Come accennato in precedenza, può essere utile come keep-alive della connessione se lo streaming di dati non è costante e c’è il rischio di far cadere la connessione. Il secondo messaggio contiene il campo data con il valore “testo di esempio“. Il terzo messaggio contiene il campo data con il valore “un altro messaggio \n con due linee“.

Eventi specifici

In questo esempio abbiamo alcuni eventi specifici. Ciascun messaggio viene settato il campo event, con il nome della tipologia di evento, e il campo data il cui valore è specificato secondo la notazione JSON con i dati che poi il client “parserizzerà” a dovere.

Miscelazione e la congruenza

Ovviamente è possibile mescolare insieme in un unico flusso di dati sia messaggi generici (solo con il campo data) che messaggi personalizzati.

 Risorse utili

http://dev.w3.org/html5/eventsource/


La distanza di Levenshtein, a cosa serve? (2° parte)

Un’implementazione della distanza di Levenshtein può essere fatta in qualsiasi linguaggio. In questo esempio, verrà utilizzato interamente il linguaggio MYSQL.

Per prima cosa, bisogna creare una routine su MySql. Aiutatevi con phpmyadmin per fare ciò. Eseguite direttamente il codice definito in questo listato per creare e aggiungere la funzione levenshtein() al vostro database MySql.

Se volete potete anche aggiungere quest’altra funzione, che restituisce la percentuale di esattezza della parola data.

A questo punto l’unica cosa da fare è quella di creare una query per interrogare il database utilizzando in modo opportuno la funzione definita sopra.

Il risultato sarà questo:

levenshtein2

L’unico vero e grande problema è la lentezza dell’esecuzione dell’algoritmo. Per calcolare la distanza di levenshtein di “romme” su una base dati di 8,092 record, il tempo di esecuzione si aggira attorno ai 12 secondi, e peggiora in maniera esponenziale se la stringa da ricercare è più lunga (es. Castelbuono anzichè Roma). Purtroppo l’algoritmo contiene un doppio WHILE all’interno e questo potrebbe rappresentare un ostacolo, sopratutto in una tabella con migliaia di record.

Tuttavia possiamo cercare di ottimizzare la query MySql in fase di interrogazione in modo da cercare di dimezzare i tempi di ricerca. Una prima ottimizzazione è quella di selezionare solamente i termini più “vicini” a quello che stiamo cercando, confrontando la lunghezza degli stessi. Aggiungo quindi una condizione sulla lunghezza del campo CityName, che deve essere di un carattere più (+1) o meno (-1) lunga rispetto a ciò che sto cercando.

 levenshtein3

Abbiamo un netto miglioramento in termini di prestazioni in fase di esecuzione: 1,17 secondi contro 12 secondi del primo! 

Esistono ovviamente altre ottimizzazioni, infatti ne ho implementata una che mi permette di raggiungere un tempo di esecuzione pari a 0,5740 secondi, ma in questo caso bisogna integrare qualche riga di codice PHP. Vi lancio la sfida di cercarne una! Qui sotto invece trovate un altra ipotesi di ottimizzazione…

Spoiler Inside SelectShow

 


La distanza di Levenshtein, a cosa serve? (1° parte)

In teoria dell’informazione e informatica , la distanza di Levenshtein è un’unità di misura per calcolare la differenza tra due stringhe. In altre parole, la distanza di Levenshtein tra due parole A e B è il numero minimo di modifiche di un carattere singolo (inserimento, cancellazione, sostituzione) necessario per modificare la parola A nella parola B. Con edit distance ci si riferisce spesso alla distanza di Levenshtein. La funzione prende il nome dal suo creatore Vladimir Levenshtein, scienziato russo specializzato in teoria dell’informazione, che la scoprì nel 1965.

Esempio

Calcolare la distanza di Levenshtein tra “kitten” e “sitting”. Ovviamente la risposta è 3, poiché sono necessarie tre modifiche per trasformare una parola nell’altra e non c’è altro modo per farlo con meno di tre modifiche:

  1. kitten → sitten (sostituzione di “k” con”s”)
  2. Sitten → Sittin (sostituzione di “e” con “i”)
  3. Sittin → sitting (inserimento di “g” alla fine).

Alcune precisazioni

La distanza di Levenshtein ha alcuni limiti superiori e inferiori. Questi includono:

  • La lunghezza è sempre almeno la differenza della lunghezza delle due stringhe.
  • La lunghezza può essere al massimo uguale alla lunghezza della stringa più lunga.
  • È zero se, e solo se, le stringhe sono uguali.
  • Se le stringhe sono le stesse dimensioni, la distanza di Hamming è un limite superiore alla distanza Levenshtein.
  • La distanza di Levenshtein tra due stringhe non può essere maggiore della somma delle loro distanze di levenshtein da una terza stringa (disuguaglianza triangolare).

Un classico utilizzo

Avete presente quando sbagliate a digitare una parola da cercare con Google? Il motore di ricerca vi consiglia una correzione della parola errata. Guardate l’esempio qui sotto, vi siete mai chiesti come fa Google a correggere le parole errate? La risposta è semplice: Levenshtein!

levenstein

La funzione levenhstein() in PHP

In php è presente da tempo una funzione chiamata appunto levenhstein(), e viene definita di seguito:

dove:

  • str1: prima stringa in ingresso da confrontare
  • str2: seconda stringa in ingresso da confrontare
  • cost_ins: definisce il “costo” dell’operazione di inserimento di un carattere
  • cost_rep: definisce il “costo” dell’operazione di sostituzione di un carattere
  • cost_del: definisce il “costo” dell’operazione di cancellazione di un carattere

continua…


Pagine:1234567