In primo piano »
Trello, per collaborare online
Problemi nel collaborare online? Trello è un validissimo strumento per la gestione dei task da assegnare ai membri di un gruppo di lavoro.History API: cambia l’url senza ricaricare la pagina
Come si fa a cambiare l'URL mostrato dal browser senza ricaricare l'intera pagina?Codecademy, e impari a programmare
Codecademy, muovere i primi passi nel mondo della programmazione non è mai stato così semplice.Chosen, trasformare e migliorare i select
Chosen, un plugin jQuery per trasformare e migliorare i campi select dei form rendendoli più usabili.MotionCAPTCHA, l’antispam geometrico
MotionCAPTCHA, evita lo spam disegnando forme geometriche. Un utilissimo plugin jQuery per creare dei CAPTCHA semplici e divertenti.
13
FEB
Trello, per collaborare online
Lavorare da soli è ottimo perché lo scambio di informazioni avviene in uno spazio relativamente stretto: la nostra scatola cranica.
Se da un lato si è più efficienti perché si evitano errori dovuti a comunicazioni ambigue, è anche vero che se il progetto è abbastanza corposo diventa conveniente suddividere il lavoro in sotto-problemi da affidare a persone diverse.
Bisogna stare molto attenti a suddividere per bene il lavoro ma, sopratutto, evitare come la peste i fraintendimenti: spesso è difficile comunicare chiaramente un concetto che a noi sembra tanto semplice.
Come tentare di arginare questo problema e forse anche risolverlo? Servirebbe uno strumento in grado di tener traccia di tutte le task e che nel contempo metta a disposizione potenti strumenti comunicativi e decisionali.
1
FEB
History API: cambia l’url senza ricaricare la pagina
Essendo un web developer non riesco a godermi i siti così come fanno tutti gli altri mortali. Mi pongo sempre delle domande:
- “Come funziona questo?”;
- “Come posso fare per ottenere le stesse cose?”;
- “Come posso migliorare queste funzioni?”.
Spesso ne passa di acqua sotto i ponti prima che trovi una risposta. Proprio in queste settimane ho finalmente scovato una soluzione a questa domanda: “Come fa Facebook a cambiare l’URL senza ricaricare l’intera pagina?“.
Se ci fate caso, quando scorrete le foto di un’album o cambiate pagina all’interno di un profilo, noterete che la pagina non viene ricaricata, eppure l’URL si modifica. Tutti sanno che ajax ci viene in contro per cambiare il contenuto di una pagina, ma quanti sanno come cambiare l’URL?
12
GEN
Codecademy, e impari a programmare
Credo che converrete con me nel pensare al “principio” come la parte più dura della nostra vita da programmatori.
Iniziare a programmare è molto difficile, insomma…
Non mi riferisco a quando si decide di imparare un nuovo linguaggio, ma proprio a quando ci si affaccia per la prima volta su questo affascinante mondo.
La difficoltà principale sta nel comprendere i meccanismi che stanno alla base del “linguaggio macchina”.
Da questa fase non ne escono solo i migliori, ma già si può notare una bella scrematura dei candidati programmatori.
Molti abbandonano perché proprio non riescono a capire i concetti più semplici ma fondamentali. Le guide che si trovano in giro, solitamente, sono un po’ troppo tecniche per i “nuovi arrivati”.
14
DIC
Chosen, trasformare e migliorare i select
L’usabilità di un sito o di una webapp è ciò che può far la differenza tra un successo e un totale fallimento. L’utente non deve rendersi minimamente conto della complessità di tutto ciò che c’è dietro le azioni che sta per innescare.
Prendiamo ad esempio Facebook: è molto complesso, eppure anche gli utenti più “all’antica” riescono ad utilizzarlo senza problemi. Forse è stata proprio questa una delle chiavi della sua incredibile diffusione.
Il Fattore Tempo
Uno dei fattori che caratterizza l’usabilità di un sito è il tempo impiegato dall’utente per compiere un’azione. Se ad esempio la registrazione è troppo lunga, aumenterà il tempo necessario al suo completamento e con esso le probabilità di un ripensamento dell’utente (ossia: perdiamo potenziali clienti).
Vi sarà sicuramente capitato, durante una registrazione, di dover scegliere la vostra nazionalità…
23
NOV
MotionCAPTCHA, l’antispam geometrico
Lo spam è forse la cosa più fastidiosa presente su internet. Bot che navigano 24 ore su 24 alla ricerca di possibili siti da riempire di spazzatura pubblicitaria. Blog, piattaforme, sistemi wiki: nessuno è al sicuro.
Fortunatamente l’uomo ha trovato rimedio (o quasi) a questo problema inventando i CAPTCHA.
I CAPTCHA più diffusi sono costituiti da caratteri quasi illeggibili che dovrebbero in teoria non essere compresi dai bot. Questo è il funzionamento: semplice ma – a quanto pare – efficace.
E se invece di usare i soliti CAPTCHA utilizzassimo qualcosa di molto meno convenzionale e sicuramente più divertente? Sto infatti per presentarvi uno plugin jQuery che vi consentirà di riconoscere gli esseri umani dai bot grazie a dei disegni tanto elementari quanto divertenti.
16
NOV
Trasformare una data in tempo Unix in PHP
Avere a che fare con le date è una delle situazioni più comuni quando si realizza un’applicazione. C’è spesso la necessità di capire in che ordine due eventi sono avvenuti l’uno rispetto all’altro.
Questo è un esempio elementare, ma si possono trovare situazioni molto più complesse come ad esempio quelle riscontrabili durante la realizzazione di un’agenda.
Salvare in un database una data in formato “umano” non è una buona mossa.
Diventerà difficile ordinare le tabelle utilizzando una colonna costituita da date (es.: ’22/07/1990′). Come possiamo cavarcela in maniera elegante ed efficiente? Semplice: utilizzando il tempo Unix (i secondi trascorsi dal 1° gennaio 1970).
Vedremo di creare 2 funzioni capaci di trasformare una data in tempo Unix e di riconvertire quest’ultimo in tempo umano.
La funzione DaiTempoUnix
8
NOV
Fortunecat e Pixmac: 100 immagini free in regalo!
Essere un lettore di Fortunecat.it ha i suoi vantaggi. Grazie ad una partnership con Pixmac.it, ti regaliamo ben 100 crediti corrispondenti a 100 immagini royalty free da utilizzare nel tuo sito o blog.
Pixmac è un noto servizio di microstock, dotato di un archivio di ben 11 milioni di foto da scaricare. Vuoi ricevere i 100 crediti gratuiti? Nulla di più semplice, ti basta partecipare al nostro contest.
Per iscriverti è necessario seguire questa semplicissima procedura:
- Segui @fortunecat_it e @PixmacIT su Twitter.
- Ritwitta questo articolo.
Il vincitore verrà estratto il 22 Novembre, quindi stay tuned. 
31
OTT
Come creare linee diagonali con il CSS
A causa di una connessione non sempre velocissima, i webdesigner sono costretti spesso a trovare dei metodi alternativi per ridurre il tempo di download del sito. La fetta più grande dei tempi di caricamento, solitamente, è occupata dalle immagini.
Ci sono immagini ad alta risoluzione come le foto (e in quei casi più che comprimere non si può fare niente) ed immagini che appartengono alla categoria delle componenti grafiche del sito come ad esempio: pulsanti, icone, ecc…
In questo post vedremo come creare degli elementi diagonali in puro codice CSS, senza l’uso di alcuna immagine. Il risultato finale sarà il seguente:
Per crearlo useremo un “accrocco” con i bordi. Se ci riflettete tra un bordo inferiore ed un bordo laterale si crea una linea di separazione che guarda caso è diagonale! Ecco un esempio di due bordi colorati in modo diverso per rendere visibile quanto appena descritto.
12
OTT
Come creare pulsanti in 3D utilizzando il CSS3
I web designers stanno cominciando a tenere in minor conto la compatibilità del loro codice con i browser più antichi. Molti iniziano ad introdurre piccoli stralci di CSS3.
Magari non lo utilizzano per la grafica dell’intero sito ma – almeno per il momento – solo per le parti più piccole, in modo da non creare un sito completamente illeggibile su Internet Explorer e simili.
In questo post vedremo come creare un pulsante in 3D utilizzando le regole CSS3.
La base: definiamo un div
Per creare il nostro pulsante 3D partiremo da un semplice div contenente un link.
<div class="button"><a href="#">FortuneCat</a></div>
Cominciamo a scrivere le prime regole che renderanno visibile il pulsante.
.button a {
padding: 4px 15px 7px 15px;
width: auto;
height: auto;
background: #0099FF;
color: #fff;
font-family: Arial, Helvetica, sans-serif;
font-size: 16px;
font-weight: bold;
font-style: normal;
text-decoration: none;
cursor: pointer;
}Per il momento il risultato è questo (decisamente inguardabile):
21
SET
jQuery e gli elementi creati dinamicanente
Immaginate di creare un’applicazione che memorizza dei numeri di telefono. Non sappiamo quanti numeri l’utente abbia intenzione di salvare, ma deve essere accontentato in ogni sua necessità. Sia che abbia bisogno di registrare un solo numero sia che necessiti di memorizzarne un migliaio.
L’applicazione, se è fatta come si deve, permetterà all’utente di eseguire questa funzione restando nella stessa pagina, senza che mai questa venga ricaricata. Il modo migliore per creare un’applicazione simile è utilizzare jQuery. Grazie a questa libreria possiamo creare un form dinamico senza limiti.
Quando l’utente vuole inserire un nuovo numero gli basterà cliccare un tasto ed ecco fatto, il campo input è servito. Ma prevediamo anche un’altra possibilità: l’utente deve poter eliminare un campo appena creato. Sembra semplice, in fondo basta giocare con le parentele dei div e di un tastino elimina, ma non è tutto oro quel che luccica.