Come molti di voi avranno notato ho partecipato alla gara di home page di GT dimostrando a tutti di essere il grafico più negato al mondo. 
Qualcun altro avrà anche notato che nella mia pagina proponevo l'utilizzo di uno script che analizza la posizione del mouse e la salva su di un database rendendola disponibile per future analisi.
L'idea non è mia..è nata da un discorso sulle landing pages iniziato da Fabio Dell'Orto. In quel thread fradefra oltre a dare altri saggi consigli ha detto:
Originariamente Scritto da
fradefra Sapete che lo studio del movimento del mouse può portare ad interessanti conclusioni? Se qualcuno ci mettesse in grado di tracciare il passaggio del mouse su certi componenti dello schermo (e so che si può fare, anche se non facile), si potrebbe sapere:
1) se il visitatore è realmente sulla pagina o se la pagina è aperta e lui sta bevendo il caffè;
2) quale componente attrae subito la sua attenzione. Molti studi dimostrano che quasi sempre la mano segue l'attenzione e si sposta automaticamente su ciò che attrae. Poi il click non può esserci...ma se sapessi che c'è andato....
3) quale percorso segue il suo sguardo. Il mouse è l'ombra della mente, per un certo profilo di visitatore.
Dopo aver letto questo post mi è venuta un'incredibile voglia di fare lo script, subito soffocata dall'enorme mole di lavoro quotidiano.
Così ho partecipato al concorso con una semplice bozza dello script, più che altro per vedere se riuscivo ad incuriosire qualcuno.
La pagina che ho proposto aveva però un problema enorme che potete capire dalla seguente citazione (tratta dalla mia home)
Originariamente Scritto da
home di kerouac3001 Creare questa homepage ha richiesto varie rinunce: non si possono inserire
link html, ma solo pulsanti che indirizzino allo script di analisi e che facciano in seguito redirect sulla pagina richiesta; non si possono analizzare i dati durante la presenza dell'utente nella pagina, ma solo quando clicca su un link. Questo perché gli script lato
server non permettono un'analisi durante la navigazione, mentre gli script lato
client non permettono la memorizzazione dei dati. La soluzione è: utilizzare uno script lato client che invii i dati raccolti tramite post ad uno script lato server, che potrà gestirli come meglio crede.
Attualmente lo script lato client raccoglie i dati e lo script lato server li visualizza graficamente tramite un'immagine jpeg che potrete vedere cliccando su Link1, mentre cliccando su Link2 potrete vedere i punti di maggior interesse (quelli rossi) e il punto medio (quello verde) calcolato basandosi su tutte le posizioni del mouse. Link3, invece, esegue lo script e poi fa redirect su una nuova pagina (che non esiste, dato che è una gara di homepage).
Il problema è stato risolto grazie all'aiuto di Low che mi ha suggerito di utilizzare il "reload" automatico di un'immagine a cui associare uno script php.
A questo punto mi son messo a buttar giù la seconda bozza dello script che si basa su 2 file principali (quelli di cui vi fornirò il codice) e di un file secondario contenente i dati privati del mio database (questo non ve lo mostrerò ovviamente perchè contiene password e login 
).
il primo file contiene il codice da inserire nelle pagine che si vogliono monitorare:
Codice:
<script>
<!--
// Detect if the browser is IE or not.
// If it is not IE, we assume that the browser is NS.
var IE = document.all?true:false
var bufferImage = new Array();
function Buffer(filename) {
var i = bufferImage.length;
bufferImage[i] = new Image();
bufferImage[i].src = filename;
}
// If NS -- that is, !IE -- then set up for mouse capture
if (!IE) document.captureEvents(Event.MOUSEMOVE)
// Set-up to use getMouseXY function onMouseMove
document.onmousemove = getMouseXY;
// Temporary variables to hold mouse x-y pos.s
var tempX = 0
var tempY = 0
// Main function to retrieve mouse x-y pos.s
function getMouseXY(e) {
if (IE) { // grab the x-y pos.s if browser is IE
tempX = event.clientX + document.body.scrollLeft
tempY = event.clientY + document.body.scrollTop
} else { // grab the x-y pos.s if browser is NS
tempX = e.pageX + document.body.scrollLeft
tempY = e.pageY + document.body.scrollLeft
}
// catch possible negative values in NS4
if (tempX < 0){tempX = 0}
if (tempY < 0){tempY = 0}
// show the position values in the form named Show
// in the text fields named MouseX and MouseY
document.images[Image_Name].src = 'immagine.php?x=' + tempX + '&y=' + tempY;
return true
}
Image_Name = "SHOWPAD";
Buffer("01.gif");
Buffer("02.gif");
Buffer("03.gif");
Buffer("04.gif");
//-->
</script>
[img][/img] il secondo file (immagine.php) contiene il codice php e si occupa della memorizzazione dei dati:
Codice:
<?
require('config_inc.php');
$x = $_GET['x'];
$y = $_GET['y'];
$pagina= $_GET['url'];
// $pagina = $_SERVER['HTTP_HOST'].$_SERVER['PHP_SELF'];
// $query = "SELECT * FROM `dati` WHERE `x`='".$x."' AND `y`='".$y."' AND `pagina`='".$pagina."'";
$query = "SELECT * FROM `dati` WHERE `x`='".$x."' AND `y`='".$y."' AND `pagina`='".$pagina."'";
$result = mysql_query($query);
$row=mysql_fetch_array($result);
$num_righe = mysql_num_rows($result);
if ($num_righe>0){
$tot=$row["tot"]+1;
$query = "UPDATE `dati` SET `tot`='".$tot."' WHERE `x`='".$x."' AND `y`='".$y."' AND `pagina`='".$pagina."'";
$result = mysql_query($query);
}else{
$query = "INSERT INTO `dati` (x , y , pagina, tot) VALUES ('".$x."', '".$y."', '".$pagina."', '1')";
$result = mysql_query($query);
}
?>
Questo è quanto ho fatto finora. Mi scuso per le poche spiegazioni che vi sto fornendo, ma purtroppo non ho molto tempo. Spero che il progetto vi incuriosisca abbastanza da farvi partecipare. Ora come ora abbiamo la base imperfetta.
Imperfetta perché i dati prelevati in questo modo sono troppi e occupano troppo spazio. Sarebbe buono fare come consiglia fradefra:
Originariamente Scritto da
fradefra
Infatti queste analisi si fanno poi con software come SPSS o BrioQuery o altri sistemi di analisi multidimensionale.
Il primo trucco consiste nel ridurre i percorsi a percorsi per step di rilievo (es: sapere che è passato su certi pixel non importa, se sappiamo che un certo insieme di pixel fa parte di un certo componente).
Il secondo trucco, utile per sapere se c'è movimento, è partire dal presupposto che tengo solo il fatto che il movimento c'è e non i singoli pixel. Quindi, invece che una coppia di coordinate al secondo, un
bit al secondo, in uno streaming che rappresenta il tempo. Inoltre, sempre al fine di tenere traccia del fatto che il movimento c'è, possiamo anche decidere di dividere per 10.
Insomma, comincia col tenere tutti i dati, poi con software di analisi fai gli aggregati che ti servono. Se non vuoi spendere la paccata di migliaia di euro di SPSS o le centinaia di BrioQuery, c'è R, software Open-source usatissimo nelle Università.
Ora come ora il mio script fa questo:
ogni volta che il mouse si muove il javascript passa al php 3 variabili (url, x e y) e il php le memorizza in questo modo: se la tripla di dati è già presente nel db allora incrementa di 1 il campo tot (che tiene conto di quante volte la tripla è presente nel db)..se invece la tripla non è presente allora la aggiunge al db.
Il dati non crescono a dismisura perchè sono limitati alle dimensioni della pagina, ma se si vogliono monitorare molte pagine o pagine molto lunghe allora può essere un problema.
La soluzione di fradefra (monitorare aree invece che pixel) è ottima, ma bisogna decidere come sia meglio applicarla. Si potrebbe creare una seconda tabella interna al database in cui inserire (tramite uno script) le aree che ci interessa monitorare in ogni pagina.
Inoltre fradefra propone il monitoraggio del movimento (molto utile)..ma io preferisco fare un passo alla volta. Iniziamo a buttar giùù idee (anche su altri elementi da considerare) e poi avanziamo passo dopo passo verso il completamento dello script.
Non è necessario che i partecipanti al progetto abbiano buone conoscenze di php..la cosa più importante ora è mettere insieme molti cervelli e trovare la soluzione migliore.
Ci sono inoltre 2 fasi principali di cui ci occuperemo. Inizialmente sarà importante raccogliere i dati, ma sarà altresì importante raccoglierli bene. Dobbiamo raccoglierli in modo da poterli in seguito analizzare e farci dire tutto ciò che ci interessa. Questa sarà poi la seconda fase: creare uno script che si occupi dell'analisi
Vi ricordo che sono straimpegnato di questi tempi, ma mi occuperò del progetto ogni volta che avrò tempo libero..chi ha già lavorato con me alla realizzazione di altri script sa che sono molto veloce..quindi anche se avrò poco tempo farò in modo che non vi accorgiate della mia assenza 
P.S. ovviamente in questo progetto c'è un gruppo di persone veramente indispensabile: gli esperti di web marketing. Quindi gente come fradefra, gero, nelli, Catone, Calogero Dimino e tutti quelli che hanno una buona esperienza in questo campo. Questo lo dico per non scoraggiare chi non conosce i linguaggi che useremo per creare lo script. Non è importante solo saper fare una cosa, è ancora più importante sapere cosa deve fare per essere utile..e per far questo non è essenziale nessuna conoscenza di programmazione. | | | |
| |  Monitoraggio | Vigilanza continua di una macchina in funzione, mediante appositi strumenti che ne misurano le caratteristiche. | | |
| | | |
| | | |
| | | Javascript | JavaScript è un linguaggio di scripting orientato agli oggetti comunemente usato nei siti web | | |
| | | |
| | | |
| | | Bit | Bit: (ingl.) Binary digit, cifra binaria. | | |
| | | |
| | | |
| | | HTML | HTML (HyperText Markup Language) nasce per mano di Tim Berners-Lee, il costruttore del primo webserver e del primo browser, come estensione di SGML (Standard Generalized Markup Language) nel 1990. | | |
| | | |
| | | |
| | | Link | Collegamento Ipertestuale | | |
| | | |
| | | |
| | | Marketing | E' un ramo della scienza economica | | |
| | | |
| | | |
| | | Post | Post è il termine utilizzato per segnalare la scrittura e pubblicazione di un messaggio testuale in un determinato spazio web. | | |
| | | |
| | | |
| | | Thread | Indica il termine italiano discussione, nei forum. | | |
| | | |
| | | |
| | | URL | (Uniform Resource Locator) è un indirizzo di una risorsa in Internet | | |
| | | |
| | | |
| | | PHP | E' una piattaforma trasversale lato server scripting language utilizzata per la creazione di pagine web dinamiche | | |
| | | |
| | | |
| | | Server | Ogni coppia hardware-software che fornisce appunto servizi ad utenti chiamati tradizionalmente clienti (clients) attraverso una rete. | | |
| | | |
| | | |
| | | client | In Italiano letteralmente 'cliente', indica sia un componente hardware connesso tramite un protocollo di rete ad un'altra risorsa fisica chiamata server, sia uno 'strato software' che richiede e consuma servizi forniti dalla parte server-side di un applicativo. Quest'ultimo scenario si riferisce implicitamente alla nota e diffusa architettura software client/server. | | |
| | | |
LinkBack URL
About LinkBacks
Rispondi Citando
] 
