nerthase 2.0 » HTML & CSS

[Java] Invio di File ad una Servlet

nerthase — Fri, 04 Jun 2010 17:37:06 +0000

In Java le Servlet sono il primo strumento con il quale si viene a contatto, se si vuole realizzare una applicazione Web dinamica che interagisca con l’utente. Come sicuramente saprete, le Servlet sono in grado di ricevere le richieste HTTP GET o POST, e di restituire un risultato, che può anche dipendere dai parametri passati tramite la richiesta. Questa semplice caratteristica, è realizzabile grazie all’implementazione dei metodi doGet(…, …) e doPost(…, …) che la classe javax.servlet.http.HttpServlet mette a disposizione.

L’unico vero problema che ho riscontrato fin’ora con l’utilizzo di questa classe, è la limitazione da essa imposta riguardo il tipo di dati che è in grado di prelevare dalle richieste GET e POST che riceve. Infatti, con i due metodi sopracitati, è possibile solo elaborare richieste che contengono campi testuali che non fanno riferimento a codifiche particolari. Un classico esempio di questa limitazione, è l’impossibilità di inviare tramite GET o POST una immagine alla Servlet.

Java non offre nativamente altri strumenti per la gestione di contenuti di diverso tipo, quindi bisogna ricorrere ad una libreria esterna. Una libreria molto semplice ed intuitiva è messa a disposizione da Servlets.com ed è reperibile a questo indirizzo. La libreria in questione è com.oreilly.servlet, ed in particolare la classe che ci serve per raggiungere il nostro scopo, è la classe MultipartRequest. Vediamo di seguito un semplice esempio di utilizzo di quanto detto.

HTML – PHP – JSP

Questa porzione di codice, è quella che implementa il form per la scelta del file da inviare alla servlet. Può essere implementato in qualsivoglia linguaggio Web, ma per semplicità assumiamo di volerlo implementare in html.

1
2
3
4

Alcuni commenti riguardo il codice di cui sopra:

Il form utilizza il metodo HTTP POST per l’invio dei dati
ServletDestinazione è la Servlet che implementa il metodo doPost(…, …) per la ricezione dei dati
multipart/form-data è la codifica dei dati inviati alla Servlet

Java – Servlet

Ed ora vediamo come nella Servlet possiamo recuperare i dati della richiesta.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21

import java.io.File;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import com.oreilly.servlet.MultipartRequest;

public class ServletDestinazione extends HttpServlet {
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

String temp_dir = "."; // Directory temporanea per il salvataggio del file
int temp_size = "65536"; // Dimensione massima del file

MultipartRequest mr = new MultipartRequest(request, temp_dir, temp_size);
File f = mr.getFile("file"); // recupero l'oggetto passato nel campo "file"

// Gestione libera del File f
...
}
}

Dal codice di sopra, possiamo notare il semplice utilizzo della classe MultipartRequest e soprattutto delle poche componenti di essa utilizzate. Dai commenti e dai JavaDoc della classe, credo sia abbastanza comprensibile la scelta del costruttore utilizzato, e l’utilizzo del metodo getFile(…) per creare un oggetto File utilizzando l’attributo file della richiesta POST. Questo oggetto File sarà poi completamente manipolabile dalla Servlet senza alcun vincolo riguardo la sua provenienza.

. . .
Link utili

Libreria com.oreilly.servlet

JavaDoc completo della libreria COS

JavaDoc della classe MultipartRequest

Live HTTP Headers: sniffare ed analizzare il traffico HTTP

nerthase — Sat, 15 May 2010 13:16:40 +0000

In un precedente articolo vi ho parlato di come sia possibile effettuare una richiesta POST verso un sito Web utilizzando Java, con il meccanismo dei Socket. Il metodo che vi avevo illustrato si basava principalmente sull’analisi del form presente nella pagina Web che normalmente si occupa dell’invio dei dati. Quindi successivamente in Java, si inviavano i dati al Server Web sostituendosi al Browser ed inviando gli stessi dati che il form avrebbe inviato.

Il problema, o la limitazione principale di questa tecnica, è che non tiene conto di altri eventuali dati che il Browser potrebbe inviare al Server Web. Ad esempio, il Browser quando invia qualsiasi richiesta GET o POST invia anche un identificativo di esso, tramite il parametro User-Agent. Il Server Web che riceve una richiesta GET o POST, potrebbe analizzare i dati che riceve, e non accettare tutte le richieste dove questo parametro non è impostato. Da notare che questo parametro non compare assolutamente nel codice HTTP della pagina.

Il parametro User-Agent non è l’unico utilizzato dai Server Web per scartare richieste non provenienti da Browser comuni. Esistono molti altri parametri, che possono essere utilizzati a tale scopo. In questo articolo, utilizziamo Live HTTP Headers per sniffare tutto il traffico HTTP da e verso il Server Web, per capire quindi come configurare nel migliore dei modi il programma Java visto nel precedente articolo.

Live HTTP Headers è un plug-in per Firefox che permette di monitorare tutte le richieste che il Browser fa al Server Web, e tutte le risposte inviate da esso. In questo modo, è possibile visualizzare esattamente una richiesta POST inviata verso il Server, e quindi riprodurla fedelmente in Java. Nel seguito, vediamo come ci si dovrebbe comportare nel caso in cui si volesse riprodurre in Java un meccanismo di login presso un Sito Web, simile, ma più potente, a quello visto nel precedente articolo.

Login su Facebook

Per realizzare questo esempio ho preso come cavia il sito Web più conosciuto al mondo, Facebook. Il meccanismo di login di Facebook è molto semplice, e del tutto analogo a molti altri metodi utilizzati dalla maggior parte dei siti web.

Come prima analisi del sito, si può visualizzare il codice HTML ed individuare il form che effettua il login. Questo passaggio sarà successivamente reso superfluo dall’uso di Live HTTP Headers, però è comunque interessante capire come realizzano alcune tecniche. Di seguito, potete vedere la porzione di codice HTML dove viene costruito il form dell’immagine precedente.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37

<form method="POST" action="https://login.facebook.com/login.php?login_attempt=1" id="login_form">
<input type="hidden" name="charset_test" value="€,�,€,´,水,Д,Є" />
<input type="hidden" id="locale" name="locale" value="it_IT" autocomplete="off" />

<table cellpadding="0" cellspacing="0">
<tr>
<td class="login_form_label_field login_form_label_remember">
<input type="checkbox" class="inputcheckbox" value="1" id="persistent" name="persistent" tabindex="3" />
<label id="label_persistent" for="persistent">Resta collegato</label>
</td>
<td class="login_form_label_field">
<a href="http://www.facebook.com/reset.php" rel="nofollow">Hai dimenticato la password?</a>
</td>
<td class="login_form_last_field login_form_label_field">
</td>
</tr>
<tr>
<td>
<input type="text" class="inputtext DOMControl_placeholder" title="E-mail" placeholder="E-mail" id="email" name="email" value="E-mail" tabindex="1" />
</td>
<td>
<input type="password" class="inputpassword" id="pass" name="pass" value="" tabindex="2" />
<input type="text" class="inputtext hidden_elem DOMControl_placeholder" id="pass_placeholder" name="pass_placeholder" value="" tabindex="2" />
</td>
<td class="login_form_last_field">
<div class="inner">
<label class="uiButton uiButtonConfirm uiButtonMedium">
<input value="Accedi" tabindex="4" type="submit" />
</label>
</div>
</td>
</tr>
</table>

<input type="hidden" name="charset_test" value="€,�,€,´,水,Д,Є" />
<input type="hidden" id="lsd" name="lsd" value="VwSKT" autocomplete="off" />
</form>

Una volta fatta una prima analisi della pagina Web, e di come il form invia i dati al Server, vediamo di iniziare ad imparare ad usare Live HTTP Header. Innanzitutto, bisogna scaricare ed installare il plug-in per Firefox, da link apposito: Live HTTP Headers Download. Una volta installato, il plug-in sarà disponibile dal meù Strumenti.

Una nota molto importante, è che una volta avviato il plug-in, questo visualizzerà tutte le richieste HTTP che al momento Firefox sta effettuando. Quindi abbiate l’accortezza di posizionarvi sulla pagina che volete monitorare, farla caricare completamente, e solo dopo avviare il plug-in. Infatti, come potete vedere dall’immagine seguente, il plug-in è avviato, ma non sta ancora intercettando nulla.

Una volta avviato il plug-in, potete inserire i vostri dati all’interno del form, e successivamente effettuare il login, come fate di solito. Adesso, potete vedere Live HTTP Headers popolarsi di numerose linee di codice, che rappresentano semplicemente le richieste e le risposte che il Browser fa e riceve dal Server Web. Per individuare quale è la richiesta contenente i dati del form, che quindi vi permette di effettuare il login, dovete semplicemente ricercare la prima richiesta POST che è stata effettuata.

Come potete vedere dall’immagine precedente, la richiesta POST è molto più complessa di quella vista e realizzata in Java nel precedente articolo. In questa richiesta infatti, sono presenti molti campi impostati dal Browser e non dal form HTML, che quindi solo in questo modo potete visualizzare. L’ultima riga della richiesta POST, sono invece i dati inviati tramite il form HTML al Server Web, che dipendono esclusivamente ed interamente da come il form è stato implementato.

In quest’altra immagine, ci tengo a farvi vedere che nonostante la vostra password non sia visibile nella casella di testo relativa ad essa e nemmeno nell’URL della pagina, viene comunque inviata al Server Web in chiaro. Quindi semplicemente sniffando le richieste HTTP di un Browser, sarà possibile visualizzare tutte le informazioni trasmesse, soprattutto le password.

Di seguito trovate il codice della richiesta POST per intero, che potete usare per semplice curiosità, o per provare ad implementare una richiesta POST in Java leggermente più completa.

1
2
3
4
5
6
7
8
9
10
11
12
13
14

POST /login.php?login_attempt=1 HTTP/1.1
Host: login.facebook.com
User-Agent: Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10.6; it; rv:1.9.2) Gecko/20100115 Firefox/3.6
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: it-it,it;q=0.8,en-us;q=0.5,en;q=0.3
Accept-Encoding: gzip,deflate
Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7
Keep-Alive: 115
Connection: keep-alive
Referer: http://www.facebook.com/
Cookie: datr=1273922752-7f53f02bbc25f61b71562a08d1db5c02169342202a5a2c11c0482; lsd=VwSKT; reg_fb_gate=http%3A%2F%2Fwww.facebook.com%2F; reg_fb_ref=http%3A%2F%2Fwww.facebook.com%2F; test_cookie=1
Content-Type: application/x-www-form-urlencoded
Content-Length: 236
charset_test=%E2%82%AC%2C%C2%B4%2C%E2%82%AC%2C%C2%B4%2C%E6%B0%B4%2C%D0%94%2C%D0%84&locale=it_IT&email=email_login%40email.com&pass=tua_password&charset_test=%E2%82%AC%2C%C2%B4%2C%E2%82%AC%2C%C2%B4%2C%E6%B0%B4%2C%D0%94%2C%D0%84&lsd=VwSKT

Spero che questo semplice esempio sia utile a molti di voi, e preciso che non è stato realizzato con secondi fini e non è stato scelto il sito di Facebook a caso. Facebook infatti impone molti ulteriori controlli quando si tenta di effettuare il login, che rende quindi impraticabile la realizzazione in Java di un programma apposito. Per effettuare un login su Facebook, ma anche molte altre operazioni, sono disponibili API che consentono di usare molti degli strumenti di Facebook in modo molto semplice e soprattutto consentito.

Google AdSense: guadagnare con un blog

nerthase — Tue, 27 Apr 2010 19:04:48 +0000

Questa articolo è rivolto a chi si è chiesto almeno una volta, come fare per ricevere un minimo guadagno da tutto il tempo che spende su internet. Questo può essere il caso di un webmaster o di chi semplicemente gestisce un blog su un qualsiasi argomento. Tutte queste persone, riescono a coprire le spese di gestione, grazie alla pubblicità.

Infatti, avrete sicuramente notato che nella stragrande maggioranza di siti web sono presenti alcuni banner pubblicitari o link a siti esterni, che possono risultare più o meno invadenti, e più o meno interessanti. L’amministratore del sito web (o blog) guadagna per ogni click che viene effettuato sulle pubblicità che inserisce, mentre all’utente che effettua il click non viene chiesto assolutamente nulla. Questi costi sono sostenuti dalle aziende che pagano per essere inserite in questo circuito di pubblicità.

Attualmente, il circuito di pubblicità migliore è Google AdSense che pubblica annunci provenienti dal circuito Google AdWords. Queste due componenti di Google sono esattamente quelle descritte prima:

Google AdSense paga il webmaster per i click effettuati sulle pubblicità;
Google AdWords è il programma di gestione delle pubblicità, che quindi riceve i pagamenti delle aziende che comprano la pubblicità.

Google AdSense offre un sistema di pubblicità molto avanzato, in quanto la pubblicità che offre, non è statica, ma è pertinente al contenuto della pagina in cui viene inserita. Google AdSense è un ottimo strumento per sperare in un leggero guadagno dal proprio sito web, ma molto dipende anche dal traffico che il proprio sito genere. Infatti è ben noto che non tutti i visitatori di un sito effettuano un click su una di queste pubblicità, a volte per mancanza di interesse, o a volte perché ignorano che quello è il principale sostenimento del webmaster. Anche nel mio caso, la pubblicità che inserisco negli articoli è il principale sostenimento per riuscire a pagare i costi di gestione del dominio.

Per quanto riguarda la configurazione di Google AdSense per il proprio dominio, vi rimando alla guida offerta da HTML.it, che è molto completa ed esaustiva. Non credo poteva essere fatto di meglio a riguardo. In giro per la rete si trovano altri metodi per guadagnare qualcosa, ma questo delle pubblicità (soprattutto di Google AdSense) è il migliore in circolazione e quello che richiede un minore impegno da parte del webmaster.

Java: HTTP POST con Socket

nerthase — Sat, 24 Apr 2010 21:39:16 +0000

Come potete vedere nei precedenti articoli riguardanti il Brute Force in Java e i vari metodi di attacco per le password, la sicurezza informatica è uno degli aspetti dell’informatica che preferisco, soprattutto per quanto riguarda la sicurezza in Internet. Vi sembrerà strano, ma non potete immaginare quanta gente dia per scontato il fattore sicurezza mentre naviga in rete, crea account e soprattutto quanto sceglie la password.

Proprio sulla scelta della password vorrei soffermarmi un attimo con una piccola considerazione, basata su dati statistici. Infatti, secondo alcuni studi, la password usata più spesso dagli utenti è la stringa “123456″. Questo dato mi è sembrato sconvolgente, ma posso assicurarvi che è molto realistico. Su questo argomento credo di fare a breve un articolo più approfondito, quindi per ora consideriamo semplicemente l’aspetto che riguarda Java, ed in particolare come fare una richiesta http usando il metodo POST, sfruttando i Socket.

I due argomenti sopra citati sono strettamente collegati, in quanto le applicazioni web sono costruite essenzialmente sfruttando il metodo GET per le varie richieste. Il metodo POST viene usato per elementari requisiti di sicurezza per la trasmissione di dati sensibili, quali appunto username e password al momento del login su un servizio web. Il metodo che vi mostro quindi, può essere appositamente adattato per effettuare un login su un’applicazione web usando Java. Un esempio concreto di ciò, potrebbe essere la creazione di un’applicazione Java che effettua una connessione all’applicazione web per effettuare determinate operazioni.

Solitamente una applicazione web che richiede il login, ha una porzione della pagina che effettua una richiesta POST verso una specifica pagina che si occupa di verificare la correttezza dei dati forniti:

1
2
3
4
5

Per realizzare il nostro scopo, dobbiamo analizzare la pagina specifica, ed annotare la struttura del messaggio inviato tramite POST, e la pagina che riceve i dati, che è specificata nel parametro action dell’elemento form.

Per quanto riguarda la parte Java, questo è un esempio di come realizzare la richiesta POST usando solo le Socket.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53

import java.io.BufferedReader;
import java.io.BufferedWriter;
import java.io.InputStreamReader;
import java.io.OutputStreamWriter;
import java.net.InetAddress;
import java.net.Socket;
import java.net.URLEncoder;

public class SocketPost {
public static void main (String args[]) {
String host = "HOST-WEB-APP";
int port = 80;
String form_action = "PAGINA-DI-LOGIN";

String username = "TUO-USERNAME";
String password = "TUA-PASSWORD";

boolean result = login(host, port, form_action, username, password);
}

private static boolean login (String host, int port, String form_action, String username, String password) throws Exception {
// Dati da inviare tramite POST
// Copmosizione tipica: username=TUOUSER&password=TUAPASSWORD
String data = URLEncoder.encode("username", "UTF-8") + "=" + URLEncoder.encode(username, "UTF-8") + "&" +
URLEncoder.encode("password", "UTF-8") + "=" + URLEncoder.encode(password, "UTF-8");

// Creo il Socket per la connessione all'host
InetAddress addr = InetAddress.getByName(host);
Socket socket = new Socket(addr, port);

BufferedWriter wr = new BufferedWriter(new OutputStreamWriter(socket.getOutputStream(), "UTF-8"));

wr.write("POST " + form_action + " HTTP/1.0\r\n");
wr.write("Host: " + host + "\r\n");
wr.write("Content-Length: " + data.length() + "\r\n");
wr.write("\r\n");

// Invio i dati tramite POST
wr.write(data);
wr.flush();

// Leggo la risposta dall'host
BufferedReader br = new BufferedReader(new InputStreamReader(socket.getInputStream()));

// Solitamente, in caso di pagine di login,
// il codice di risposta per un login valido è 302
if (br.readLine().equals("HTTP/1.1 302 Found")) return true;
else return false;

wr.close();
br.close();
}
}

Prima di poter essere in grado di riempire il codice Java, bisogna analizzare il sito presso il quale si vuole effettuare il login, per estrapolare tutti i dati necessari. Questa operazione non richiede un particolare sforzo, ma un minimo di esperienza è sempre d’obbligo. Se avete bisogno di una mano, potete chiedere tranquillamente. Il metodo su illustrato è stato realizzato solo a scopo illustrativo e deve essere utilizzato solo in possesso delle credenziali di accesso, e non per scopi malevoli.

Bloglines: feed RSS sincronizzati online

nerthase — Fri, 23 Apr 2010 20:26:52 +0000

Per chi come me, vuole sempre tenersi aggiornato sugli ultimi articoli dei siti più visitati, dei blog dei propri amici, dei forum e quant’altro, non potrà fare a meno di iscriversi ai feed RSS che questi siti offrono. In un precedente articolo, dedicato a Feedity , abbiamo visto come sia possibile fare questo anche per quei siti che non offrono automaticamente il feed RSS. Adesso invece voglio presentarvi un servizio che mi hanno consigliato spesso, che si occupa di aggregare tutti i feed RSS ai quali ci si desidera iscrivere. Il tutto viene gestito tramite una comoda interfaccia Web, quindi senza installazione di software, e senza problemi di sincronizzazione tra diversi Mac e/o iPhone. Ovviamente il servizio è disponibile anche per Windows. Questo servizio è Bloglines.

Dopo questa breve introduzione, passiamo ad una introduzione dettagliata a Bloglines:

Bloglines è un servizio nato nel 2003, e in costante evoluzione, soprattutto dopo l’acquisizione da parte di IAC Search & Media nel 2005. Da qui in poi, ha subito continui aggiornamenti e miglioramenti in risposta all’utilizzo da parte degli utenti. Attualmente offre un’interfaccia molto snella ed intuitiva, che lascia ampio spazio al nostro interesse, quindi ai feed RSS che si seguono.

Bloglines è un servizio gratuito che richiede la registrazione, dopo la quale si avrà a disposizione la propria pagina personale, dove sarà possibile gestire e visualizzare i feed RSS.

Di seguito una schermata iniziate di quella che sarà la vostra pagina personale su Bloglines, dove nella colonna di sinistra sono visibili i feed RSS controllati, ed i numeri di articoli ancora non letti. Questi blog vengono visualizzati in grassetto. Sulla destra invece, c’è la porzione più grande della pagina, che visualizza gli articoli del feed RSS selezionato. Potete impostare in che modo Bloglines visualizzi gli articoli dal menu opzioni.

Come potete vedere nell’immagine seguente, dalla propria pagina personale sono permesse diverse opzioni, prima tra tutte l’aggiunta di un nuovo feed RSS. Inoltre Bloglines permette la creazione di cartelle per l’organizzazione dei feed RSS per categorie, o per il criterio che si ritiene più opportuno.

Bloglines non è solo un semplice servizio di aggregazione personale di feed RSS, ma è una community molto ampia, e per questo motivo, tutte le liste di feed, sono per default condivise con tutti gli altri utenti. Potete quindi scegliere di rendere privata la vostra lista, o di decidere cartella per cartella cosa condividere e cosa no.

E non finisce qui. Vi assicuro che una volta provato Bloglines abbandonerete tutti i vostri lettori di feed RSS, per passare ad un’unico servizio per gestire il tutto. E lo potete fare anche da iPhone, infatti Bloglines ha una interfaccia ottimizzata per iPhone che rende piacevole e comoda la navigazione e visualizzazione degli articoli su di esso.

Browize: giusta dimensione per le pagine Web

nerthase — Wed, 21 Apr 2010 19:18:34 +0000

Il lavoro del Webmaster comporta non pochi problemi, soprattutto per chi lo fa per passione, più che per lavoro. Infatti uno dei primi problemi con i quali tutti i Webmaster si sono confrontati, è la corretta dimensione del proprio sito Web, per renderlo perfettamente visibile su tutti i browser, con qualsiasi risoluzione. Personalmente, quando mi sono trovato in situazioni simili, ho dovuto cambiare la risoluzione al mio monitor, per poi vedere come appariva la pagina. Ma per fortuna, che ora c’è Browize.

Browize è un ottimo tool online, quindi non c’è bisogno di effettuare nessun download e nessuna installazione, che è in grado di cambiare la dimensione della finestra del nostro browser. Non bisogna più ricorrere quindi al trucco del cambio di risoluzione del monitor, perché Browize cambia direttamente dimensione alla finestra, permettendoci di provare tutte le dimensioni più comuni, e vedere come si comporta il layout del nostro sito.

Questo punto potrà sembrare di poco conto ai più inesperti, ma capita più spesso di quanto immaginiate, che un sito progettato perfettamente per una certa risoluzione, ad esempio le pubblicità (fonte di sostegno per i Webmaster) su una sidebar laterale, mentre con un’altra risoluzione, questa sidebar sia completamente oscurata, e non visibile all’utente.

Attualmente i browser supportati sono Firefox, Safari, Internet Explorer ed Opera, mentre Google Chrome rimane fuori dalla lista. Per i browser supportati, Browize consiglia di chiudere tutti gli eventuali tab aperti.

Jimdo: creare siti web gratis

nerthase — Fri, 02 Apr 2010 13:11:11 +0000

Nell’articolo precedente vi ho parlato dei software di blogging e CMS attualmente più usati. Oggi invece voglio farvi conoscere un modo ancora più semplice e veloce per creare un vostro sito web personale. Il servizio si chiama jimdo ed offre la possibilità di creare un sito web o un blog in pochi semplici passi. Tutto quello di cui vi dovrete occupare, sarà scegliere tra i tanti temi che sono proposti, ed iniziare a scrivere i contenuti, anche questo nel modo più facile che si possa immaginare. Tutto questo, rigorosamente GRATIS.

Creazione del sito web

Prima di iniziare a creare il proprio sito web, è necessaria la registrazione gratuita sul sito web di jimdo, che si occuperà di assegnarci immediatamente un nostro spazio web. Inseriamo quindi il nostro username (che sarà usato come indirizzo per il sito) e la nostra email, alla quale sarà inviata la password per l’accesso al nostro sito.

Una volta aver completato la registrazione, ed aver annotato la password comunicata via email, possiamo collegarci al nostro indirizzo web che ci è stato comunicato per email (nel mio caso nerthase.jimdo.com) ed effettuare l’accesso per iniziare la personalizzazione del sito.

Quello che vedete è il vostro sito web, già pronto. Come potete vedere, la personalizzazione è molto intuitiva, ma vediamo comunque alcuni semplici passi da seguire per rendere unica la nostra impronta sul web.

Personalizzazione

Come vedrete, una volta effettuato il login al vostro sito, sulla destra compare una barra delle impostazioni. Tramite questa semplice interfaccia, sarà possibile gestire gran parte delle opzioni del vostro sito. Una delle prime cose da fare, è sicuramente la modifica del layout del sito. Jimdo mette a disposizione molti layout, ma da anche la possibilità di crearsi il proprio layout. Per semplicità, assumiamo di scegliere tra uno dei layout già presenti nelle opzioni.

Facciamo quindi click sulla voce Layout e scegliamo il layout più adatto a noi.

Un altro aspetto più che positivo di jimdo, è la possibilità di vedere tutte le modifiche in tempo reale, direttamente sul proprio sito web. Continuando la personalizzazione, io ho scelto di modificare la testata del sito, e quindi anche il titolo e tutti gli elementi a contorno. Per fare questo, basta fare click sulla testata, per veder comparire il menù di personalizzazione relativo.

Come avrete notato, in pochi minuti avete ottenuto un sito web perfetto per il vostro scopo, ancora una volta, GRATIS. Dopo aver giocato abbastanza con la grafica del sito, è giunta l’ora di iniziare ad inserire i contenuti.

Gestione dei contenuti

Riguardo ai contenuti, jimdo permette la creazione immediata ed intuitiva di pagine web e dei relativi contenuti. Per modificare la struttura delle pagine web (non i contenuti per il momento) basta spostarsi sul menù di sinistra e selezionare la voce Modifica la navigazione.

A questo punto apparirà un menù che permette la gestione delle pagine web, ma non solo. Da questo menù è anche possibile creare e gestire una gerarchia tra le pagine web stesse. Questa cosa non è affatto scontata in CMS come Joomla, in quanto la costruzione (ma soprattutto la modifica) di una gerarchia può richiedere molto più tempo.

Una volta organizzata la struttura delle pagine web del vostro sito, si può passare alla gestione dei relativi contenuti. Ormai avrete capito che con jimdo tutto è semplicissimo, quindi per modificare il contenuto di una pagina web, basterà fare click su di esso per veder comparire il relativo menù di modifica.

Questo è jimdo!

Non credo ci sia molto da dire ancora, se non che jimdo offre potenti strumenti di amministrazione per il proprio sito web, oltre che utili strumenti per la gestione di Gallerie Fotografiche, Flickr, Google Map, YouTube, del.icio.us e molto altro ancora. Non vi resta che approfittare di 10 minuti liberi, per creare il vostro sito web GRATIS.

Blogger vs WordPress vs Joomla

nerthase — Wed, 31 Mar 2010 17:52:32 +0000

In pieno web 2.0 ognuno di noi sente l’esigenza di avere un proprio spazio personale, blog o sito che sia, quello che conta è la presenza online. Vediamo quindi di fare chiarezza tra le più comuni piattaforme utilizzate. Tra queste, troviamo senz’altro Blogger e WordPress per quanto riguarda le piattaforme di blogging e Joomla per quanto riguarda la creazione di siti web più avanzati e personalizzabili.

Blogger è la piattaforma più diffusa per la creazione di blog personali in maniera rapida ed intuitiva. Più facile di così… non si può…

PRO:

Completamente gratuito. Include uno spazio web del tipo tuonome.blogspot.com. Tutto quello di cui hai bisogno è un account Google.
Incredibilmente semplice da usare e configurare.
Non è richiesta alcuna conoscenza di HTML o linguaggi per la gestione di DataBase.
Ha a disposizione tool per creare articoli o aggiornare il blog in mobilità (vedi iPhone).

CONTRO:

L’indirizzo del vostro blog sarà limitato a tuonome.blogspot.com e non può essere ulteriormente personalizzato.
I plugin a disposizione non sono numerosissimi e non coprono tutte le esigenze.

WordPress è la piattaforma di blogging in diretta concorrenza con Blogger. Anch’esso è semplice da usare e a differenza di Blogger è altamente personalizzabile grazie agli infiniti plugin a disposizione ed al sistema dei widget. Sempre a differenza di Blogger, WordPress mette a disposizione la creazione di account multipli per la gestione dei contenuti.

PRO:

Facile da installare e configurare.
Forum di supporto ricco di informazioni, dove troverete risposte a tutte le vostre domande.
Ottimi plugin disponibili, per ogni vostra esigenza.
Account multipli per la gestione del blog e la creazione dei contenuti.
Può essere installato su qualsiasi dominio di vostro interesse.

CONTRO:

L’acquisto di un dominio da utilizzare con WordPress è a spese vostre, ma almeno potete sceglierlo voi.

Joomla è un CMS (Content Management System) con molte più funzionalità rispetto a Blogger e WordPress. Questo si traduce però in una maggiore difficoltà nella realizzazione e configurazione di un sito basato su Joomla. In compenso, è possibile creare siti web più complessi rispetto ad un semplice blog. Ci sono a disposizione anche in questo caso infiniti plugin, anche per quanto riguarda la creazione di siti web commerciali con la possibilità di effettuare acquisti online.

PRO:

Ottimo.
La dinamicità del sito è altamente configurabile.
Account multipli per la gestione del sito.
Un numero infinito di plugin, da non dimenticare Virtuemart per la creazione di siti web commerciali.
Può essere personalizzato abbastanza facilmente, in maniera più forte rispetto ai precedenti.
Facilmente aggiornabile.

CONTRO:

L’acquisto di un dominio è a spese vostre.
Non adatto a chi si avvicina al web senza conoscenze basilari.
Sono disponibili meno template per la personalizzazione del vostro sito web.
La fase di installazione e configurazione può portare via molto tempo (relativamente a Blogger e WordPress).

Dopo questa breve panoramica dei tre servizi più utilizzati, lascio a voi la scelta. Ricordate che la scelta va presa tenendo in considerazione la tipologia di sito web che andrete a creare, l’utilizzo che ne dovrete fare e l’utenza finale che vi aspettate. Per ora, l’unico servizio che consente di creare un sito web dove è possibile effettuare acquisti, è Joomla, e questo è un punto molto importante a suo favore.

Pagine Web dinamiche con JavaScript

nerthase — Thu, 18 Mar 2010 21:42:13 +0000

Pochi giorni fa nel forum di HWUpgrade mi è capitato di aiutare un utente che aveva problemi nel realizzare una pagina Web dinamica. A questo scopo, gli ho illustrato una semplice tecnica che fa uso di JavaScript, e che riporto qui per renderla disponibile a tutti.

JavaScript è un linguaggio di scripting molto usato nei siti Web, ma non voglio fare ora una lezione completa su di esso. Vengo direttamente al dunque, e quindi a mostrarvi come poter realizzare una pagina Web dinamica utilizzando JavaScript:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41

<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Pagina HTML dinamica con JavaScript</title>

<script type="text/javascript">
function mostra () {
// Rendo visibile il DIV del contenuto
document.getElementById("contenuto").style.display = "block";

// Attivo il bottone Nascondi, e disattivo il bottone Mostra
document.getElementById("mostra").style.display = "none";
document.getElementById("nascondi").style.display = "block";
}
function nascondi () {
// Nascondo il DIV del contenuto
document.getElementById("contenuto").style.display = "none";

// Attivo il bottone Mostra, e disattivo il bottone Nascondi
document.getElementById("nascondi").style.display = "none";
document.getElementById("mostra").style.display = "block";
}
</script>
</head>

<body>
<p>Esempio pratico sull'utilizzo di JavaScript per realizzare pagine Web dinamiche.</p>

<div id="pulsante">
<input type="button" value="Mostra" id="mostra" style="display:block;" onclick="mostra()" />
<input type="button" value="Nascondi" id="nascondi" style="display:none;" onclick="nascondi()" />
</div>

<div id="contenuto" style="display:none;">
Contenuto visibile quando viene premuto il pulsante <strong>Mostra</strong>. <br />
Questo testo viene nascosto quando viene premuto il pulsante <strong>Nascondi</strong>.
</div>
</body>
</html>

Il codice di sopra, è abbastanza commentato, e credo sia di facile comprensione anche per i meno esperti. Potete copiarlo direttamente in un nuovo file html per vedere il suo funzionamento, e fare tentativi per adattarlo alle vostre esigenze. Il fulcro di questo codice, sta nella funzione utilizzata in JavaScript:

document.getElementById("ID_DELL_ELEMENTO").style.display = "block";

Questa semplice funzione, imposta lo stile dell’elemento della pagina che ha id=”ID_DELL_ELEMENTO”. In particolare, viene impostato il parametro display dello stile, che rende l’elemento visibile display=”block” o invisibile display=”none”.

Di seguito potete vedere un esempio di funzionamento di questo codice:

Se avete problemi nell’utilizzo di questo codice, o se pensate che non sia adatto alle vostre esigenze, fatemelo sapere, che cerchiamo di trovare insieme una soluzione.

Creare RSS per tutti i siti

nerthase — Tue, 16 Mar 2010 21:24:26 +0000

Spesso mi capita di dover seguire siti web di alcuni miei professori, che non hanno a disposizione i feed RSS. Fino ad oggi usavo alcuni siti web che promettono di controllare gli aggiornamenti della pagina al posto tuo, e di notificarti le novità. Questi siti però non hanno una vita lunga, anzi, spesso funzionano per poco tempo, fino a quando hanno un numero limitato di utenti. Oggi invece ho scoperto Feedity.

Feedity è un servizio web che crea i feed RSS anche per i siti che non li mettono a disposizione. Questa funzionalità è molto utile, in quanto ognuno di noi può creare un feed RSS per un sito di interesse, e soprattutto possono essere effettuate molte personalizzazione.

La cosa più interessante di questo servizio, è la creazione di un canale di feed personale, per ogni sito che si desidera monitorare. Sarà quindi possibile seguire i propri feed (creati tramite Feedity) con il lettore di RSS che si preferisce. Unica nota dolente, è che l’account gratuito notifica un massimo di 10 aggiornamenti per pagina, non immediatamente, ma ogni 5 ore.

Il funzionamento del sito è talmente semplice ed intuitivo che non necessita di alcuna spiegazione. Potete valutare voi di persona, ed in caso di problemi, cercheremo di trovare una soluzione.