Your Inspiration Magazine #04

04

www.yourinspiration-magazine.com

Addio originalità:

usi e abusi nel web design

Blog Design:

User Experience:

Sidebar?

Si, no, forse

Progettare siti web a misura di bambino

Web Experience

Tutorial

Pensieri e Parole

Il valore dei link per i motori di ricerca

Conoscere i feed RSS (terza parte)

Master in Italia: si o no?

showcase Intramontabile, romantico, creativo.

Ispirazione in vintage style

Gennaio | Febbraio 2011 ·· N° 4 sito web: www.yourinspiration-magazine.com

Editoriale ·· Gennaio | Febbraio 2011 ·· N° 4 ·· ·· www.yourinspiration-magazine.com ·· ·· info@yourinspiration-magazine.com ··

Autori: ·· Maurizio Tarchini ·· ·· Programmatore ·· ·· Francesca Luciani ·· ·· Web Designer ··

YIM è a un punto di svolta.

Il successo esplosivo che abbiamo avuto in così pochi mesi dal lancio ci spinge a prendere delle decisioni importanti...

L’attesa del nuovo numero di Your Inspiration Magazine è sempre

·· Simone D'Amico ·· ·· Web Designer ··

trepidante, per tutti i lettori e anche per chi, come noi, lavora dietro le quinte e ha la fortuna di vedere il magazine che prende forma, articolo dopo articolo.

·· Luca Panzarella ·· ·· Imprenditore Creativo ··

Hai dovuto aspettare un po’di più, ma la qualità degli articoli è sempre eclatante e ti stupirà anche questo mese.

Vuoi scommettere?

·· Salvatore Sodano ·· ·· Web Designer ··

Gli amanti delle letture acute e stimolanti, troveranno senz’altro interessante l’articolo che analizza cosa non va nei master italiani e che offre dieci soluzioni alternative allo studio

·· Sara Presenti ·· ·· Web Designer ·· ·· Federico Pian ·· ·· Insegnante e Web Designer ·· ·· Emanuela Pitassi ·· ·· Informatico ·· ·· Michela Chiucini ·· ·· Web Designer ··

sui libri: una lettura curiosa e senza dubbio molto motivante.

In più in questa edizione parliamo anche di Ebook e di come riuscire a ideare, scrivere e vendere un Ebook di successo, argomento che – ne siamo certi – riscuoterà un gran numero di consensi nel nostro pubblico. Si parla anche di Folksonomie (non ne hai mai sentito parlare? tranquillo, ti spieghiamo cosa sono e a cosa possono servire!) di blog design, con un bell’articolo sui metodi di utilizzo – o non utilizzo della sidebar, e di usabilità, con un ottima guida alla realizzazione in un sito…a prova di bambino.

Ami le letture leggere e ironiche? L’articolo sulla situazione

·· Carlo D'Angiò ·· ·· Formatore e Blogger ··

delle donne nel web design ti farà senz’altro sorridere.

Prima di augurarti buona lettura t’invito a lasciare il tuo parere nel sondaggio che abbiamo pubblicato, YIM è a un punto di svolta.

Il successo esplosivo che abbiamo avuto in così pochi mesi dal lancio ci spinge a prendere delle decisioni importanti e speriamo che tu possa contribuire a indirizzare il nostro cammino.

Nando Pappalardo

Progetto grafico ·· Salvatore Giuliano ·· ·· Web & Graphic Designer ·· ·· www.giulianosalvatore.com ·· ·· Alessandra Iacovella ·· ·· Web & Graphic Designer ·· ·· www.thinkaboutstudio.com ··

Direttore Responsabile: Nando Pappalardo Progetto Grafico: Salvatore Giuliano Your Inspiration Magazine non è una Testata Giornalistica poichè i contenuti della rivista stessa non hanno una periodicità regolare e quindi ai sensi della legge n. 62/2001 non può essere considerata un prodotto editoriale

Your Inspiration Magazine è una rivista dedicata al web design che offre materiale (risorse, articoli di ispirazione e di dibattito, tutorial, guide) realizzato da diversi professionisti del settore.

Un punto d’incontro ideato e progettato da e per i web designer italiani, per offrire informazioni utili in un vero e proprio magazine, assicurandone la portabilità dei contenuti anche offline.

Somm Contenuti In questo numero Master in italia: si o no? blog design: sidebar? si, no, forse attenzione, dietro questo sito c'è una donna! come pensare, scrivere e vendere il tuo e-book di grande successo (prima parte)

il valore dei link per i motori di ricerca

Addio originalità: usi

user experience: progettare siti web a misura di bambino addio originalità: usi e abusi nel web design le folksonomie: cosa sono e a cosa possono servire?

La nostra raccolta di tecniche e tutorial

Date uno sguardo alle nostre gallery per prendere ispirazione

04 ·· your inspiration magazine

Blog DEsign: Sidebar? Si, no, forse

12··

Numero

mario

04

Tutorial XML:

Conoscere i feed RSS [Parte 3]

Gimp:

Guida a Gimp: gli strumenti di disegno

e abusi nel web design

A colpo d’occhio Pensieri e Parole

gallery 40··

Attenzione, dietro questo sito c'è una donna!

Pensieri e Parole Come pensare, scrivere e vendere il tuo ebook di grande successo (parte prima)

Web Experience Le folksonomie: cosa sono e a cosa possono servire?

User Experience: progettare siti web a misura di bambino

34··

18·· ·· 05

Pensieri e Parole MASTER IN ITALIA: SI O NO?

•• Ricevo questa email: “Ciao Luca, non ho soldi per iscrivermi a un master e ho poco tempo a disposizione perché lavoro in un bar. Cosa mi consiglieresti per fare carriera come web designer? Sicuro di una tua celere risposta, ti saluto.

PS: sono di Avellino”.

Autore:

Luca Panzarella Dico la verità, all’inizio non volevo rispondere.

Imprenditore creativo esperto di user

Lavori in un bar, fai carriera in un bar, ho subito pensato.

experience, in giro per l’Italia, l’Inghilterra

Invece no, mi sbagliavo: anche l’amico di Avellino deve avere la speranza di fare carriera

e l’America, ma soprattutto online.

come web designer. Anche lui che non può permettersi un master e lavora in un bar.

Ama raccontare, imparare e creare.

Nuovo socio di Figmenta, web agency

Accetto la sfida, caro amico di Avellino senza soldi e sicuro di una celere risposta.

di Firenze, non fa in tempo a concludere

Si parte.

una presentazione di sé stesso che diventa già vecchia.

http://www.lucapanzarella.it/ http://www.lucapanzarella.it/blog/

COSA NON VA NEI MASTER ITALIANI? Questa la situazione: ogni anno i corsi e i master post-universitari aumentano, noi continuiamo a iscriverci, a pagare dai 7000 euro in su per poi accettare uno stage gratuito non appena mettiamo il piede nel mondo del lavoro.

I più vispi di voi noteranno che qualcosa non torna.

Finiamo il corso di studi speranzosi che la segreteria del master faccia il miracolo.

Link: http://bit.ly/eDYfJ9

La segreteria chiede ai quattro amici sparsi in Italia – piccole aziende e multinazionali poco importa, tutti uguali - se vogliono uno schiavo di turno non pagato, e se non c’è posto neanche per quello pazienza.

08 ·· your inspiration magazine

Master in Italia: sì o no?

Cosa non va nei master italiani e dieci soluzioni alternative allo studio sui libri Lo studente di turno si lamenta. In segreteria subiscono in silenzio

per creare i primi rapporti lavorativi.

tutte le sfuriate. La loro incapacità di creare contatti col mondo

Farlo in una città dalla quale vi sposterete vi farà solo perdere

lavorativo è persino giustificata dall’ufficialità della crisi,

tempo nel trovare il primo impiego.

anche se in maniera non ufficiale c’era prima, durante e ci sarà dopo.

Le aziende che cercano personale qualificato non contattano

Ç Ambiente: i colleghi, i docenti, l’organizzazione; vi sembrano

stimolanti? Vi incitano a diventare migliori? Non accontentatevi

i master perché sanno di dover non solo insegnare il mestiere

di una semplice impressione. Investite tempo e denaro

da zero, ma eliminare dalla mente degli studenti tutte le belle

per un controllo accurato.

teorie, gli ideali e i valori troppo alti rispetto alla superficialità,

Fatevi dare l’elenco dei futuri colleghi, parlateci almeno

mancanza di visione e disorganizzazione del mondo lavorativo

una volta. Viaggiano sulla vostra stessa lunghezza d’onda?

italiano.

Così rimane solo chi, al primo lavoro, ci rifila gentilmente tutte le magagne in modo tale che “il ragazzo si fa le ossa”.

Ç Contenuti: lasciate perdere i nomi e le sigle, è un vecchio modo di ragionare. Un master appena nato organizzato

È molto complicato definire chi ha torto in questo gioco morboso.

da degli sconosciuti potrebbe essere molto più utile di uno

Ho visto troppi ragazzi che non vogliono assumersi

dal nome altisonante.

responsabilità e capi che non vogliono delegare poteri.

Puntate a ciò che vi insegnano, non al nome della scuola.

E questo, badate bene, è vantaggioso per entrambi: il capo si compiace dell’essere capo, il nuovo arrivato è contento giocare ancora un po’ a fare l’irresponsabile.

Dei bambini, diciamolo pure.

Che è guarda caso come all’estero ci descrivono: eterni giocherelloni che non vogliono crescere.

A questo punto è probabile che vi sarete chiesti le seguenti domande.

Quanto è comune la situazione appena descritta? Molto.

Ci sono delle eccezioni? Certamente.

Chi è in grado di dirvi quali sono? Nessuno.

Bella scoperta, direte.

Il punto è che ognuno di noi arriva a un master con un diverso background, diverse prospettive, diversi valori.

Solo voi stessi siete in grado di capire qual è il master più adatto, ma purtroppo la maggior parte delle volte lo capirete in ritardo.

Se quindi nonostante la premessa avete deciso di frequentarne uno, ecco quali sono i tre fattori che su tutti raccomanderei di valutare. Ç Città: studiate nel posto in cui c’è la maggiore richiesta del vostro profilo. Gli anni di studio sono fondamentali

·· 09

Pensieri e Parole MASTER IN ITALIA: SI O NO?

LA FORMAZIONE CONTINUA

Ora. Lo so che direte: “la fai troppo facile”.

Lo ammetto: non è facile.

La situazione non è quindi molto rosea.

Per questo è arrivato il momento di presentarvi le dieci soluzioni

Che si fa quindi? Siamo costretti a ripetere questo iter generazione

alternative a un master, che vi permetteranno di studiare

dopo generazione? Spero di no.

senza dover realmente “studiare”.

Ed effettivamente le cose stanno cominciando a cambiare.

Questa parte è tutta per te, caro amico di Avellino senza soldi e con poco tempo. Non ti avevo certo dimenticato.

Tendiamo a credere che l’unico modo per studiare sia iscriversi a un corso di studi: un insegnante da una parte, l’alunno dall’altra. Eppure non è così.

Faccio degli esempi tra mille altri: barcamp, meetup, wikipedia, seminari, yahoo answers, community linguistiche.

La novità è che si può imparare anche senza libri e divertendosi, spendendo poco o nulla, puntando sulla qualità dei contenuti e su un rapporto paritario tra chi insegna e chi impara. Una situazione che ribalta il metodo classico.

Questo però obbliga ad una scelta di vita: studiare sempre.

Qualcuno ne rimane folgorato, qualche altro odia il solo pensiero.

Studiare quando incontri qualcuno, quando viaggi, quando vai al teatro, al cinema, quando guardi la tv, navighi su internet.

Studiare sempre.

Non ci sono libri, né manuali o consigli.

Si parte, si fa, si impara sulla propria pelle e poi decidi cosa ti piace o non ti piace fare.

10 ·· your inspiration magazine

Segui tutti i passaggi e sarà come fare un master in comunicazione. Ç Guarda i video1 di Fabrizio Capobianco all’università di Pavia e di Steve Jobs2 a Stantford.

Ç Iscriviti al canale di youtube di Robin Good3 e guarda

questo video esilarante sulla formazione4.

Ç Segui gli account twitter e diventa amico su Facebook

delle persone che rappresentano un tuo obiettivo professionale Ç Compra un biglietto a/r verso una nuova destinazione su www.momondo.com, una volta arrivato vai su

www.meetup.com o www.couchsurfing.org e incontra la gente che vive lì. Niente italiani. Ç Guarda 365 video dei TED5. Uno al giorno. Non due.

Un video al giorno. Molti hanno anche i sottotitoli in italiano, niente scuse quindi.

Ç Vai ad almeno due barcamp6 al mese. Ce ne sono migliaia in Italia, tutti gratis. Presentati ad almeno 10 persone,

cerca di capire di cosa hanno bisogno e trova una soluzione al loro problema, anche semplicemente presentandogli un amico. Ç Cura la tua presenza online. Apri un blog, friendfeed, linkedin,

twitter. Presentati al mondo virtuale con una descrizione precisa e unica. Non è interessante che tu sappia fare tutto.

Pensa alla cosa che ti riesce meglio e punta su quello. Ç Parla con una persona nuova per almeno 10 minuti ogni giorno.

Non importa chi sia.

Ç Cerca di trasformare la maggior parte dei “devo” nelle tue frasi

con “voglio”. Smettila di dire “oggi devo lavorare”

ma “oggi voglio lavorare”. Se la nuova frase non corrisponde a verità, organizzati per smettere di fare ciò che non ti piace. Ç Valuta sempre prima di accettare consigli. Leggi questa lista:

se ti piace, seguila. Se non ti piace costruisci da solo i tuoi dieci punti da seguire.

Quando sarai un web designer affermato scrivimi un’email e dimmi come hai fatto. Sicuro di una celere risposta. ••

1 http://bit.ly/g9SdNY

2 http://bit.ly/2eCPrF

5 http://bit.ly/MOvJh

6 http://bit.ly/g2mNxz

3 http://bit.ly/c2BDgz

4 http://bit.ly/hFOvaa

·· 11

Pensieri e Parole Blog design: Sidebar? Si, no, forse

•• Non c’è dubbio, da quando i primi blog si sono affacciati in rete, sono stati fatti passi da gigante per quanto riguarda la creazione di templates.

Tra gli elementi coinvolti senza dubbio la sidebar.

E se nei primi blog si assomigliavano un po’ tutte, adesso abbiamo un panorama Autore:

Michela Chiucini

sicuramente più variopinto.

Ultimamente ne troviamo diverse tipologie e, in alcuni casi, non la troviamo affatto.

Web designer freelance della costa

A seconda dei contenuti del blog e delle scelte di design, una soluzione può rivelarsi

Toscana, ama il design a 360°, la

migliore di un’altra.

tecnologia CSS e il markup semantico.

Il suo obiettivo è far convivere in armonia estetica e funzionalità.

Oltre al suo portfolio gestisce un blog in

Vediamo alcuni esempi con i relativi pro e contro.

Sidebar sulla sinistra

lingua inglese.

I suoi lavori sono stati pubblicati su

Posizionandola a sinistra optiamo per una soluzione meno popolare ma non per questo

importanti pubblicazioni del settore come

meno valida.

.NET, Web Designer magazine, Web

Molto probabilmente sarà la prima cosa notata dai visitatori.

Design Index, Speaking in Styles.

Quindi potrebbe rivelarsi controproducente se desideriamo che i contenuti degli articoli siano i primi a catturare l’attenzione del visitatore.

http://www.colazionedamichy.it http://webislove.com Link: http://bit.ly/eHKU9C

In alcuni casi però, questo può essere esattamente quello che desideriamo ottenere, soprattutto nel caso in cui la sidebar contenga il logo con il titolo e i links del menu.

Ne è un brillante esempio il blog di Andrew Ramos1 [Figura 1].

12 ·· your inspiration magazine

1 http://bit.ly/bbGiXl

Blog design: Sidebar? Si, no, forse Blog e sidebar: 2 elementi imprescindibili. Fino ad oggi.

figura 2 •• La home page di Owltastic [2]

Se guardiamo al markup di Owltastic, ci accorgiamo infatti che l’ordine dei contenuti nel markup è diverso da quelli presentati nella pagina. figura 1 •• La home page di Andrew Ramos [1]

Apparentemente i box della pagina sono disposti in quest’ordine: Nel caso in cui invece vogliamo inserire la sidebar a sinistra con altri contenuti(diversi da logo e navigazione), ma vogliamo

1 Titolo e logo

dirigere comunque l’attenzione verso il contenuto principale,

2 Work with me

dobbiamo usare alcuni accorgimenti, sia dal punto di vista visivo

3 Flickr

che nella scrittura del markup.

4 Twitter 5 Navigazione

Il blog Owltastic [Figura 2] ci offre un esempio pratico

6 Articoli del blog

di questa soluzione.

7 Box pubblicitario

2

8 Categorie di articoli In questo design, la colonna di sinistra spostata verso il basso, il colore di sfondo (simile a quello del background) e la direzione

In realtà l’ordine a livello di markup è ben diversa:

dell’ala del gufo fanno si che il nostro sguardo cada sulla colonna centrale con il menu e i contenuti principali del sito.

1 Titolo e logo 2 Box pubblicitario

Questa soluzione, se non ben implementata anche dal punto

3 Categorie articoli

di vista del markup può presentare degli svantaggi dal punto

4 Navigazione principale

di vista SEO. Infatti più un tipo di contenuto si trova in alto

5 Articoli del blog

nel markup, meglio verrà indicizzato dai motori di ricerca.

6 Work with me

E solitamente questo è un risultato che desideriamo ottenere

7 Flickr

per i nostri articoli.

8 Twitter

2 http://bit.ly/50Kv5

·· 13

Pensieri e Parole Blog design: Sidebar? Si, no, forse

Per ulteriori approfondimenti sulla gerarchia nel markup e sulle tecniche CSS relative3.

Sidebar sulla destra E’ senza dubbio la soluzione più diffusa per varie ragioni.

Per le motivazioni viste nel precedente esempio, se il markup rispetta l’ordine visivo, è da preferirsi da un punto di vista SEO. Inoltre nel mondo occidentale, e in parte anche in quello orientale, siamo abituati a leggere da sinistra a destra quindi semplicemente viene più naturale presentare i contenuti in quest’ordine.

Nel caso di Wegraphics4 [Figura 3] abbiamo un layout a 2 colonne figura 4 •• La home page di Trent Walton [6]

con 2 menu orizzontali nell’header, gli articoli in primo piano e i contenuti secondari nella sidebar sulla destra.

In questo esempio abbiamo una esatta corrispondenza fra l’ordine

The Design Cubicle7 [Figura 5] invece ha un layout a 3 colonne,

in cui sono visivamente disposti i contenuti e il markup.

ma anche qui il contenuto la fa da padrone.

figura 3 •• La home page di Wegraphics [4]

Minimal sidebar

figura 5 •• La home page di Design Cubicle [7]

In questo caso abbiamo 2 sidebar minimali, quella di sinistra con il numero dei commenti, quella di destra con l’archivio

Ma la sidebar può essere declinata anche in modi diversi,

per mese/anno. Da notare che le 2 sidebar tendono ad essere

soprattutto in quei progetti dove non è necessario visualizzare

parte dello sfondo, in modo da rimanere elegantemente

una grande quantità di informazioni above the fold

in secondo piano, a disposizione in caso di bisogno, ma lasciando

oppure se si vuole ottenere un design minimalista.

tutta la scena all’articolo.

5

In questi casi la sidebar esiste, ma solo per contenere appunto una minima quantità di informazioni e quindi dare un maggiore

No sidebar

risalto al contenuto grazie allo spazio negativo che lo circonda.

Vediamo infine alcuni esempi in cui della sidebar si perdono E’ questo il caso di Trent Walton [Figura 4], che utilizza la sidebar

addirittura le tracce. A mio parere anche questa soluzione

a sinistra esclusivamente per contenere i metadata.

ha il suo fascino e tende a incoraggiare lo scrolling della pagina.

6

14 ·· your inspiration magazine

3 http://bit.ly/NAVE 7 http://bit.ly/33nJLX

4 http://bit.ly/9uW3Zf

5 http://bit.ly/NXw1F

6 http://bit.ly/AJear

Nei primi 2 esempi Rainy Pixels8 [Figura 6] e BBQ War9 [Figura 7]

In quest’ultimo esempio di Rob Goodlatte10 [Figura 8] invece

troviamo una navigazione orizzontale e, vista l’assenza di sidebar,

abbiamo una struttura dedicata completamente agli articoli,

sarà così nella maggioranza dei casi.

senza un vero e proprio menu di navigazione.

figura 6 •• La home page di Rainy Pixels [8]

figura 8 •• La home page di Rob Goodlatte [10]

Il design è molto accattivante anche se un semplice link all’elenco degli articoli, magari nel footer per facilitare la consultazione del blog, potrebbe essere aggiunto.

Conclusioni Volendo la lista potrebbe continuare con ulteriori derivazioni delle tipologie appena elencate.

Ogni soluzione è ugualmente valida, tutto dipende dagli scopi del sito e dal tipo e quantità di contenuti.

A questo punto non ci resta che sperimentare per trovare quella più adatta al nostro progetto. ••

Riferimenti Right vs. Left Sidebar11 figura 7 •• La home page di BBQ WAR [9]

8 http://bit.ly/bJ7rcq 12 http://bit.ly/7ZPGgu

9 http://bit.ly/94Tvcr

10 http://bit.ly/2kZ5W

Should a Sidebar Go On the Left or Right?12

11 http://bit.ly/114y3J

·· 15

your inspiration web

Entra nella community di Your Inspiration Web http://forum.yourinspirationweb.com

il nostro forum aspetta solo te.

Forum di discussione su PHP, XHTML, CSS, JAVASCRIPT, CMS, GRAFICA e non solo Suggerimenti, ispirazione e migliorie per i tuoi progetti Feedback dalla community suoi tuoi lavori Aneddoti, curiosita’, di tutto un po’

Pensieri e Parole ATTENZIONE, DIETRO QUEL SITO C'è UNA DONNa!

•• “Buongiorno, avrei bisogno di un preventivo per un sito.”

“Buongiorno Sig. Cliente, ho ricevuto la sua mail, mi dica tutto.”

“Mi scusi, potrei parlare con chi si occuperà direttamente del sito?”

“Eccomi, sono io...”

“Ah...sei una donna...”

Autore:

Francesca Luciani Complimenti, ha uno spiccato talento nel constatare cose ovvie, vorrei rispondere.

"Quella che fa i siti" per i clienti,

Non ne ho il tempo, l'afarensis dall'altra parte del telefono mi trancia la chiamata

Smanettona per se stessa e Web Designer

con una scusa appresa dal manuale dell'arrampicatore sui vetri: “Ho un cliente sotto”.

per chi la sopravvaluta, Francesca o

Sotto la scusa?

"Pikadilly" ha cominciato a lavorare in rete

Rimango a fissare il telefono chiedendomi se sono veramente nel 2010 o se me lo sto

quando si è resa conto che le scorte di

inventando mentre ammorbidisco la carne di mammut battendolo con una clava.

cibo erano drasticamente finite.

A due pedate da Marte c'è ancora chi riesce a trovare la voglia di fare discriminazioni

Adesso sopravvive nella giungla del web

sessuali e di rendere nota la cosa, magari anche di difenderla, giustificarla

bloggando improponibili esperienze

e accompagnarla con un bel rutto esclamativo.

legate al difficile rapporto con la clientela e cercando di convincere il mondo che

In quattro anni da sitivendola ne ho viste e sentite di cose che gli uomini non possono

l'essere smanettoni è una cosa serissima.

nemmeno immaginare, ma non si sa come, molti di loro riescono benissimo ad inventare e a congratularsi con se stessi non solo per averle pensate, ma anche messe in atto.

http://blog.pikadilly.it/ Link: http://bit.ly/dVlSiw

ugualmente l'annuncio, così, tanto per...

Ci sono clienti che dopo secoli di collaborazione ancora mi ritengono uno scherzo.

Ad ogni incontro allungano gli occhi dietro le mie spalle chiedendosi quando arriverà il vero web designer. Su quattro frasi, cinque sono raccomandazioni sul non usare troppi

18 ·· your inspiration magazine

Attenzione, dietro quel sito c'è una donna!

L'uomo sta per conquistare Marte, mentre sulla terra la donna sta ancora mercanteggiando per conquistare il rispetto per sé e per il proprio lavoro

colori e troppo accesi, che tradotto vuol dire “So che in quanto

capacità di accendere un pc pigiando subito il tasto giusto:

donna, nelle vene ti scorre il sangue glitter, ma non mettere

scodinzolano e si complimentano per la mia inaspettata prova

brillantini nel mio sito”.

di intelligenza e, se ho veramente tante tante chiappe,

Sono uomini totalmente programmati per parlare del mondo

riesco anche a conquistarmi il gradino più alto rispetto a quello

al maschile, non concepiscono un'era in cui la donna salta

sul quale si trovano mogli o fidanzate.

dai fornelli al cacciavite con un triplo carpiato e tacco dodici

Ma sempre sotto il loro cane, ovviamente.

senza attaccarsi alla canna del gas se all'anta dell'armadio salta una vite.

Per non parlare dei tacchini che mentre si sta stilando il preventivo per un sito cominciano a raccontare della volta in cui hanno scalato il K2 con le infradito o di come la loro auto superi i 600 Km da spenta, e bla bla bla.

Popolazioni di parole uccise per creare un'immagine totalmente inutile sia per me che per il sito. Dopotutto, davanti hanno una donna, non un professionista con il quale discutere professionalmente di lavoro. E' perfettamente logico.

Si chiama marcare il territorio, essendo impossibilitati a farla su ogni palo, usano il turpiloquio come raggio traente per la femmina. Che in questi casi sono tragicamente io.

All'inizio mi imbalsamavo viva nell'idea di essere la causa di tutto ciò, credevo di aver sbagliato lavoro o che la mia faccia da caramella mou infondesse nei clienti la sensazione di giocare a fare web con una Baby Mia che si dichiarava capace anche di scrivere codice, come surplus allo sbattere gli occhi e sbrodolare dalla bocca. In seguito, confrontandomi con le colleghe weblavoratrici e sommando le esperienze, ho dedotto che in Italia

Sembrano del tutto incapaci di far scendere il proprio cervello

la donna con le mani infilate in un lavoro considerato maschile

dal banano, trastullandosi oltretutto e oltremodo nell'idea di aver

è positivamente ignorata dalla maggior parte dei prostatati,

inizializzato la mia evoluzione intellettuale grazie al lavoro che sto

ma da molti è ancora fortemente puntualizzata e messa in dubbio,

svolgendo per loro, mentre io vorrei solo scartavetrarli via dal mio

o meglio, le sue capacità sono messe in dubbio, almeno fino

campo visivo o magari vederli risucchiati in qualche buco nero

a quando sul lavoro non si comporta come ci si aspetta

di passaggio.

da una donna, allora anche lei viene messa in dubbio.

Se l'evoluzione si è rifiutata di giovarli, qualcosa vorrà dire.

Non ha giovato nemmeno quelli che si stupiscono per la mia

L'esempio si è abbattuto su di me all'incirca otto clienti fa.

·· 19

Pensieri e Parole ATTENZIONE, DIETRO QUEL SITO C'è UNA DONNA!

Lunedì post apocalisse calcistica (leggi, derby Roma-Lazio perso ingiustamente dalla Roma). Interno giorno. Luogo dell'incontro:

Ç Io che dopo essermi messa il rossetto, firmavo con lo stesso rossetto e con un bacio il contratto, il cliente e tutti

Bar dello Sport. Il cliente asseriva che in quello squallido bar aveva

i plurisessantenni che in quel momento litigavano per un rigore

condotto gli affari più importanti della sua vita (ricevere in regalo

tolto alla Lazio (per altro giustissimo) lanciandosi le dentiere.

la suoneria Waka Waka cantata da Leone di Lernia dopo aver attivato un servizio di sfondi cretini per il cellulare e compare

Il film, quello vero, si concluse con me che firmavo il contratto

un paio di calzini a dieci centesimi in meno da un venditore

impugnando una maschissima penna, mentre il cliente si stupiva

ambulante). E poi aveva il caffè gratis. Lui, io no.

di sapermi anche capace di scrivere il mio nome per esteso e non con una semplice X.

Eravamo alla firma del contratto. Mentre cercavo la penna,

Nonostante avessi condotto una trattativa da Nobel per la vendita,

un rossetto che giaceva nei fondali della mia borsa fece

i pregiudizi del cliente e quel rossetto erano bastati per vedermi

la sua comparsata volando sul tavolo. Il cliente, che già aveva

sospettata di troppo donnismo.

ampiamente scodellato tutti i suoi poco impliciti dubbi riguardo l'affidare ad una “come me” (leggi, una donna) il proprio futuro

Di tempo ne è passato da quel giorno, ma i miei dubbi

sul web, si affrettò a chiedermi quasi al collasso cosa volessi farci

sono rimasti allo stesso punto, nel corso degli anni reali e virtuali

con quel rossetto.

le domande a riguardo si sono moltiplicate come doppie punte.

Nei suoi occhi ho visto passare le seguenti sceneggiature:

Ad esempio, perché quando una donna cerca di essere

Ç Io che dopo essermi messa il rossetto, firmavo il contratto con un bacio.

Ç Io che dopo essermi messa il rossetto, firmavo con un bacio sia il contratto sia il cliente.

Ç Io che dopo essermi messa il rossetto, firmavo con lo stesso rossetto il contratto.

20 ·· your inspiration magazine

professionale, spesso le risposte ottenute sono le stesse che certi uomini si aspettano da lei, ovvero divagazioni, maxipunture di fattacci personali durante gli incontri di lavoro e dimostrazioni di macismo violentemente imbarazzanti?

Ma soprattutto, il web sta cancellando l'idea della donna disinformatizzata e incapace di tenere un mouse in mano senza scambiarlo per un telecomando?

Ci sta provando, ma a mio avviso in un modo del tutto sbagliato.

Se da una parte è piacevole vedere donne fare gruppo

Negli ultimi tempi ho notato come nel neutro suolo virtuale stiano

senza sgozzarsi con le limette per unghie, dall'altra si lancia

tragicamente avanzando delle differenziazioni, ma stavolta le mani

un messaggio che incentiva i potenziali clienti a credere

sul grilletto non sono piene di peli, ma finemente smaltate:

che qualche differenza in verità c'è, esiste e va tenuta d'occhio

è la donna che si sta ghettizzando.

se non addirittura circumnavigata non affidando i propri lavori alle donne.

Offline ci sono voluti anni per dimostrare e controdimostrare che il cervello non porta cravatte né tacchi a spillo e ancora gli afarensis non si sono estinti, tuttavia la rete offre un Eden unisex, dove non è necessario coprire la nostra natura piazzandoci tra i bit una foglia di fico, semplicemente perché le capacità intellettive non hanno sesso.

I salottini in cui la donna si autocelebra per quello che sa fare non servono a sotterrare le discriminazioni, ma ad evidenziarle con tante lucine al neon, a dire che purtroppo siamo così, però ti dimostriamo che sappiamo fare qualcosa.

E intanto là fuori il cliente medio continua a infangarsi nell'idea

Siti per weblavoratrici, incontri, pink dinner party, concorsi

che una donna ammaestrata per fare un lavoro da uomo è solo

per eleggere la donna più web dell'anno (ecc.), urlano qualcosa

una donna che prima o poi farà valere la sua natura e vidimerà

tipo “Siamo donne, ma sappiamo fare il web” come se cercassimo

contratti con baci al lampone e cuoricini.

noi stesse una guerra tra sessi che la rete non richiede, perché per sua natura manda avanti chi sa fare cosa, ignorando

O magari con lo stampo delle tette.

se chi la fa ha il ciclo puntuale o la calvizie precoce.

Eh, gli piacerebbe.

·· 21

Pensieri e Parole Come pensare, scrivere e vendere il tuo eBook di grande successo [parte 1]

•• Ante Scriptum: questo tutorial ha lo scopo di far capire la differenza tra un autore sconosciuto che lotta per vendere qualche copia del suo libro (o eBook) e un autore che invece riesce a vendere centinaia di copie ancora prima di pubblicarlo, a scatola chiusa, solo perché porta la sua firma o perché tratta un argomento particolare.

Autore:

Carlo D'Angiò

È importante tenere presente che le tecniche e le strategie presentate in questo tutorial (e nelle parti successive) sono molto potenti e, in quanto tali, è necessario che vengano

Ha svolto la professione di consulente

applicate secondo una rigida etica morale.

del lavoro per 12 anni.

Il tutorial fornisce gli strumenti per mettere in piedi un progetto editoriale di grande

Poi 4 anni fa ha scoperto il segreto

e immediato successo, ma l’uso improprio di questi strumenti ne violerebbe lo spirito

per lavorare di meno e godersi di più

in base al quale sono stati creati.

la vita. Oggi lavora da casa con il suo blog

Ecco perché ti chiedo di leggerlo con la promessa di usare queste informazioni solo

e vive di rendite online.

per condividere contenuti di valore e aiutare gli altri a fare meglio qualcosa nella vita.

Il tutorial si compone di più parti.

http://www.lavoro-casa.org

Questa è la prima parte.

Se penso al fatto che la mia vita è cambiata con un ebook che in due anni ha generato più di 100 mila euro di fatturato, offrendomi una ragione più che valida per ripensare al mio lavoro e alle mie scelte, allora credo che valga la pena di dedicare a quest’argomento un’attenzione veramente speciale.

Del resto, la questione degli eBook, ovvero, dei libri in formato elettronico,

Link: http://bit.ly/i9SXVM

è oramai un affare di interesse collettivo, non solo per i vari tablet di lettura (Kindle, iPad etc.) che traggono valore aggiunto proprio dal fatto di essere dei contenitori senza limite di documenti elettronici (come i PDF, gli ePub etc.), ma soprattutto

22 ·· your inspiration magazine

Come pensare, scrivere e vendere il tuo eBook di grande successo [parte 1]

per la loro esaltante compatibilità (in avanti) con quello che sembra essere un vero e proprio fenomeno epocale di self publishing e nano editoria.

3 Venderlo, ossia, proporlo sul mercato attraverso procedure e strategie di condivisione che possano realizzare un interessante ritorno di investimento.

Non ci soffermiamo su questo aspetto, anche perché l’analisi dell’impatto economico dell’eBook sull’indotto editoriale

A questo punto, abbiamo già uno schema delle cose da fare.

di tipo tradizionale darebbe spazio a nuovi argomenti

È uno schema semplice, direi quasi banale.

che non possono essere trattati esaustivamente in questa sede.

Anche gli autori meno esperti sanno che serve prima di tutto un’idea del libro, poi un metodo per scriverlo e infine

Tuttavia, è sufficiente dare un’occhiata a librerie come Clickbank,

una buona strategia di promozione e di vendita.

Amazon, Lulu etc. per comprendere che il fenomeno del nanismo editoriale, alimentato dal marketing della coda lunga

Eppure, conosco centinaia di persone che non riescono

dei venditori, è molto più vasto e significativo di un’apparente

ad avviare questo tipo di attività semplicemente perché

rivalsa a suon di trombe di piccoli autori bistrattati dal sistema,

non rispettano lo schema. Commettono l’errore di invertire le fasi.

ed ha a che fare - evidentemente - con un riassetto generale

Si concentrano troppo sulla vendita, per esempio, trascurando

del mercato, dove la domanda dei lettori non è più controllata

l’idea. Oppure, pensano che sia solo una questione di talento

dalla pubblicità dei giganti, ma spazia liberamente tra le migliaia

nella scrittura, come se i lettori potessero scorgere

di offerte monotematiche e di nicchia di cui è gremito il web.

da quei pochi elementi esterni (titolo, sottotitolo, sinossi etc.)

In tutto ciò, il formato elettronico del libro ha svolto e ancora svolge un ruolo straordinario.

Ma concludo questo passaggio, suggerendo a chiunque voglia approfondire l’argomento di leggere «I piccoli saranno i primi» di Seth Godin, un libro luminoso che stigmatizza un certo sistema economico, oramai morente, e offre spunti di business davvero interessanti a coloro che cercano una via d’uscita.

E ora veniamo al tema principale di questo tutorial, che a quanto pare ha tre obiettivi dichiarati rispetto all’eBook: 1 Pensarlo, ovvero, idearlo sia come scelta di argomenti, sia come proposta di soluzioni 2 Scriverlo, cioè, usare delle tecniche per sviluppare contenuti coordinati, coerenti e di qualità

·· 23

Pensieri e Parole Come pensare, scrivere e vendere il tuo eBook di grande successo [parte 1]

il livello della qualità narrativa e dei contenuti.

Quindi, se lo scopo di un autore è solo quello di incassare soldi, c’è il rischio concreto di fare un buco nell’acqua, perché manca

La verità è che ci sono autori che riescono a pre-vendere centinaia

alla base dell’offerta quello spirito sociale di condivisione

di copie a scatola chiusa, prima ancora di pubblicare l’ebook.

che conferisce valore ai contenuti.

Il che vuol dire che esiste uno sporco segreto per far funzionare

Tuttavia, se esiste una differenza tra ciò che è spendibile

le cose. Ed è ciò di cui parleremo noi oggi e nelle restanti parti

e ciò che non lo è sul piano del business, questa è sicuramente

di questo tutorial.

nella scelta del genere letterario.

Gli eBook di tipo how to sono senza dubbio il genere

Una sola premessa, prima di cominciare: l’ebook è un libro elettronico e, come tale, può contenere romanzi, poesie,

più profittevole tra quelli spendibili in regime di self publishing.

partiture musicali, fotografie o guide operative.

Come pensarlo

Noi ci riferiamo solo alle ultime, alle guide pratiche di tipo how to

Ci vuole una buona idea del libro. Cosa scriviamo?

(come fare per) o ai manuali di crescita personale e professionale, poiché trovano un mercato molto più conveniente e motivato

Per chi lo scriviamo? E perché?

che spesso consente un mark-up che è 30-50 volte superiore

Una regola importante, in questo genere di cose, è porsi l’obiettivo

al costo di produzione.

primario di aiutare le persone a fare meglio qualcosa nella vita.

Il che presuppone una chiara visione di quelli che sono i bisogni

Per molti, infatti, la scelta di scrivere un eBook è legata

tangibili della gente. Non si può aiutare qualcuno a cui

alla prospettiva del guadagno che si ricava dalle vendite online.

non serve aiuto.

Come vedremo fra poco, il guadagno è la naturale conseguenza

Ma presuppone anche un’esperienza significativa sull’argomento

di un lavoro ben fatto di chi aiuta le persone.

che vogliamo trattare. L’incompetenza, per intenderci, non aiuta

24 ·· your inspiration magazine

le persone e non crea valore.

(o di altre schifezze simili) che ti fa svanire il dolore, un po’

C’è ancora un altro aspetto da prendere in considerazione,

per colpa mia che ho sempre avuto un brutto rapporto

prima di metterci a scrivere, e ha a che fare con il rapporto

col dentista, il fastidio si era trasformato in una grave infezione

emotivo che esiste tra noi e l’attività che vogliamo compiere.

da cui scaturiva un dolore insopportabile.

Si chiama passione e determina il successo di molte iniziative,

Come al solito, presi un’aulin. Ma stranamente il principio attivo

perché aggiunge alle nostre performance un valore intrinseco

del farmaco questa volta reagì al contrario.

che non può essere rimpiazzato diversamente.

Il dolore diventò straziante. Pensai di morire, di non riuscire

In altre parole, dobbiamo chiederci se l’argomento che vogliamo

a superare quel pomeriggio (per poi andare l’indomani

trattare ci appassiona, ci piace, ci coinvolge pienamente,

dal dentista).

oppure no. È importante rispondere a queste domande, non solo per una questione di responsabilità che ci lega alle aspettative

Cominciai a piangere.

dei lettori, ma soprattutto per noi stessi.

Singhiozzavo per la quantità di lacrime che mi uscivano Conosco persone che lavorano faticosamente (e male),

e dallo spavento. Soffrivo e mi rendevo conto che un dolore

perché non amano quello che fanno. Ne conosco altre, invece,

del genere non era normale. Al ché i bambini si spaventarono,

che compiono attività divertenti e guadagnano un sacco

come pure mia moglie, che nel frattempo si mise al telefono

di soldi semplicemente perché fanno (e sanno fare) ciò che più

nella speranza di riuscire a rintracciare qualcuno che potesse

le appassiona.

aiutarmi. Dopo circa un’ora, finalmente, Tonino (il mio dentista) rispose al cellulare. Mia moglie gli spiegò l’urgenza e riuscì

Competenza e passione, dunque, sono i primi due ingredienti

a ottenere un appuntamento immediato presso il suo studio.

della nostra ricetta per scrivere un eBook di successo.

Sul posto, Tonino non perse tempo. Mi iniettò l’anestesia,

Ma manca ancora qualcosa. Manca il fattore “X”, quello sporco

perché non c’era altro modo di calmare la crisi.

segreto che determina le sorti di una pubblicazione sin dalla sua nascita. Sto parlando del “fattore disperante”, ciò che acuisce senza sforzo alcuno i livelli di percezione sensoriale, creando un senso di urgenza nelle cose.

Presta attenzione a questo passaggio e, soprattutto, ricordati la promessa che ti ho chiesto di farmi nell’ante scriptum.

Le persone hanno molteplici problemi. E i problemi creano bisogni.

Ma ci sono alcuni problemi che io chiamo «disperanti», perché creano bisogni urgenti.

Negli anni ho imparato che tra i prodotti o servizi di maggiore successo ci sono sempre quelli che risolvono problemi disperanti.

Ora, per comprendere meglio il mio ragionamento, ma anche per afferrare il meccanismo straordinario di business che è sotteso all’ambito dei bisogni disperanti, voglio raccontarti un episodio che mi ha riguardato direttamente qualche anno fa.

Era domenica pomeriggio.

Mia moglie era alle prese con i miei figli che dovevano fare i compiti per la scuola, mentre io giacevo sofferente sul divano per via di un dolore lancinante al dente del giudizio.

Già da tempo mi dava fastidio. Ma un po’ per colpa dell’aulin

·· 25

Pensieri e Parole Come pensare, scrivere e vendere il tuo eBook di grande successo [parte 1]

di Photoshop. Questo si chiama anche campo di morte, un luogo nel quale possiamo trovarci improvvisamente a subire l’insopportabile pressione delle circostanze. Nel campo di morte non c’è spazio per le indecisioni. Non ci sono alternative o ripensamenti. Si agisce tout court sulla spinta di una motivazione disperante.

Allora, poniamoci l’obiettivo di aiutare le persone a risolvere problemi seri (debiti, salute etc.), a uscire dallo sconforto personale e familiare, a combattere la depressione cronica… e non ci sarà prezzo per quello che avremo fatto.

Ma non dimentichiamo la promessa dell’ante scriptum.

Per esempio, lo sapevi che Fran Kerr, una deliziosa fanciulla malesiana, guadagna più di 100 mila dollari l’anno spiegando sul suo blog - High on health1 - come comportarsi con i brufoli adolescenziali? Sembra un argomento futile, di poco conto.

In realtà, è un problema disperante dei giovani.

E la Kerr ha saputo interpretare l’urgenza della domanda E così, un poco per volta, riuscì a operare e a spegnermi il dolore

per creare contenuti di valore e per farne un business online

definitivamente. Prima di andarcene, gli chiesi quanto dovevo

di grande successo.

pagare. Mi disse che gli dovevo 500 euro, perché c’era da calcolare l’intervento in un giorno festivo.

Un altro esempio significativo? Eccolo.

Voi cosa avreste fatto?

Nel 2009 c’è stato il tentativo mediatico (con un mandante ancora

Io estrassi il mio carnet di assegni, senza discutere, e mi poggiai

ufficialmente sconosciuto) di creare un clima di terrore rispetto

sulla sua scrivania per compilare il foglio.

alla cosiddetta influenza suina (A/H1N1) al solo scopo

Poi mi fermò e mi disse che gli dovevo 30 euro.

di incoraggiare il ricorso alla vaccinazione.

Stava solo scherzando.

Si pronosticavano migliaia di morti come se fossimo nel pieno della peste bubbonica medievale.

Capito il senso di questa storia?

Alla fine abbiamo scoperto che si trattava di un tipo di influenza

Il dolore è una grandissima molla motivazionale.

meno pericoloso della stagionale.

Non c’è nulla come il dolore che possa fermarti dal compiere ogni cosa, compresi gli acquisti e le spese più significative.

Ma come il dolore, ci sono altre fortissime molle motivazionali, e tutte fanno leva sulla disperazione o sull’urgenza del bisogno.

Il segreto di un eBook di successo, il meccanismo inafferrabile che permette ad alcune migliaia di autori di fare soldi online con intelligenza, è nella scelta della motivazione (potente) che sta alla base di ciò che offrono.

Questo non significa che non ci sia mercato per le guide all’uso di Photoshop o per i libri di ricette. Dipende sempre dal livello di urgenza su cui viene decodificato il bisogno del lettore.

Magari ti capita di ricevere un’offerta di lavoro da un’importante studio grafico e solo in quel momento ti accorgi di avere un bisogno disperante di completare la tua conoscenza

26 ·· your inspiration magazine

1 http://bit.ly/64mcrK

Insomma, una bufala stratosferica.

Ma abbiamo anche stabilito subito – sic et simpliciter –

Tuttavia, in quei giorni fu pubblicato un eBook del dott. Roberto

che servono competenza e passione per l’argomento che si vuole

Gava, dal titolo L’influenza suina (A/H1N1) e i pericoli

trattare, altrimenti rischiamo di produrre qualcosa di scarso valore.

della vaccinazione antinfluenzale – Tutto quello che devi sapere per tutelare davvero la tua salute e quella dei tuoi cari.

Abbiamo poi aggiunto una chicca: i problemi disperanti.

Fu un successo strepitoso.

Abbiamo detto, cioè, che la motivazione che sta alla base delle scelte di acquisto delle persone è molto più forte quando nasce da un bisogno urgente.

Che facciamo adesso? Come utilizziamo queste informazioni per ragionare sull’idea e per abbozzare un progetto vincente del nostro eBook? Per esempio, come possiamo scrivere un libro sul web design e nel contempo creare un senso di urgenza nei lettori, cosicché si possa fare leva sulle strategie appena esposte per aumentare le vendite?

Dico queste cose perché nell’immaginario collettivo si distinguono per abitudine le questioni serie dalle facezie, ma non si capisce bene quali siano le prime e quali le altre.

Spesso gli artisti (disegnatori, grafici, fumettisti) sono pregiudicati anche dal contesto familiare. I genitori sognano quasi sempre di avere un figlio avvocato, perché l’arte, la creatività, lo spirito di invenzione non sono considerati come un mezzo di sostentamento o come un modo per arricchirsi.

Ma il mondo è cambiato.

E di certo chi ha disegnato l’iPhone ha avuto modo di dimostrare che in questo nuovo scenario di vita l’impiego più sicuro è proprio quello dell’artista, perché è una figura chiave che non potrà mai essere sostituita, come invece accade per l’avvocato o per il direttore di banca.

Migliaia di copie vendute ancora prima del lancio.

Ma torniamo alle domande di prima.

Credo che adesso sia chiaro cosa intendo per bisogni disperanti.

Come sfruttare la strategia dell’urgenza per pensare, scrivere

E credo che sia ancora più chiaro il motivo per cui parlo di strategie

e vendere un eBook sul web design?

potenti. Usare queste informazioni con intelligenza significa saper scegliere il momento giusto e gli argomenti giusti per offrire

Semplice!

al mercato soluzioni giuste.

Esiste una tecnica poderosa - che ho sviluppato e perfezionato

È una combinazione travolgente.

nel corso di questi ultimi anni - che permette all’aspirante autore

Ma è fondamentale che queste informazioni vengano applicate

di avere una risposta alle sue domande in meno di un’ora.

sempre secondo una rigida etica morale.

Si chiama tecnica dell’incrocio (o anche dei livelli, per via della sua somiglianza al sistema dei layers di Photoshop).

Ora, fermiamoci un attimo e cerchiamo di capire cosa abbiamo detto fino a questo punto.

Ma è ciò di cui parleremo nel prossimo articolo qui su YIM,

Siamo partiti da una considerazione: ci vuole una buona idea

insieme agli altri temi che ci permetteranno di capire come scrivere

del libro, ovvero, dell’eBook.

eBook che vendono. ••

·· 27

Web experience

il valore dei link per i motori di ricerca

••I link non hanno più il valore di una volta. Sono sicuro che avete letto questa affermazione centinaia di volte e non è mia intenzione smentirla, ma credo che per chi si affaccia al Seo per le prime volte può essere fuorviante.

Il fatto che non abbiano più il valore di una volta non significa che siano un parametro Autore:

Salvatore sodano

da sottovalutare, ma solo che a differenza di prima che erano l’elemento cardine nell’algoritmo basato sul Pagerank che Google sfruttava per stabilire l’importanza e la

Web Designer & Developer

popolarità di una pagina web, ora i link sono uno dei tanti fattori utili al posizionamento.

from Frosinone. Adora tutto quello che ha a che fare con l'User Experience

Nel lontano 1997 i links ad una pagina venivano interpretati come voti,

e con lo sviluppo di applicazioni

tutti sostanzialmente uguali e la pagina che ne riceveva di più veniva meglio posizionata.

per il web. Condivide articoli di web

Dopo oltre 10 anni non è più così, Google ha adeguato i suoi algoritmi in modo

design sul suo blog e da circa un anno

da attribuire un “peso” diverso ad ogni link.

scrive per Html.it e per alcuni blog stranieri del settore.

Quindi non hanno più l’importanza di una volta, ma hanno un valore non stabilito dipendente da vari fattori e senza dubbio rivestono ancora un loro ruolo fondamentale

www.yeswebcan.it

a livello Seo. Ora vedremo quali sono i vari fattori che ne determinano l’importanza e come sfruttarli al meglio a nostro favore.

e' importante avere link da siti tematici Link: http://bit.ly/eJxj3W

La cosa più importante in una campagna di link building è riuscire ad ottenere link da siti che trattano lo stesso argomento del nostro.

Pochi link tematici, hanno più valore di tanti provenienti da fonti diverse dalla nostra.

30 ·· your inspiration magazine

Il valore dei link per i motori di ricerca Qual’è il valore dei link nel posizionamento?

Scopriamo insieme i vari fattori che determinano l’importanza di un link e come sfruttarli al meglio

Il motivo è molto semplice.

Questo perchè possono essere un approfondimento sull’argomento

Mettiamo caso il nostro sito tratta di web design, non ha senso

trattato e perchè in altre posizioni tipo sidebar o footer

che riceva segnalazioni da siti di argomenti diversi come ad esempio

spesso vengono inseriti link a pagamento o scambiati,

di salute, benessere, turismo ecc.

quindi poco naturali.

Al contrario invece è molto importante che ottenga link da siti,

Ecco perchè avere contenuti che possono essere attinti come

blog o forum dello stesso settore.

approfondimenti da altri è importante e perchè per ottenere link di valore scrivere guest post per siti autorevoli sicuramente

La tematicità è fondamentale a livello Seo, sia per contenuti che per la link popularity. Bisogna rendere a Google la vita più facile possibile e permettergli di capire subito l’argomento che trattiamo e posizionarci al meglio.

porta più vantaggi rispetto al semplice scambio link.

I link più in alto nel codice html hanno un peso maggiore Un link posizionato in alto e per primo ha più valore rispetto ai link successivi ovvero un link a inizio codice ha indubbiamente un valore maggiore rispetto ad un link alla fine.

Un discorso molto simile lo abbiamo già affrontato nel numero precedente del magazine quando parlammo di ottimizzazione e di quanto era importante cercare sempre di iniziare il testo con le keyword che ci interessa posizionare.

I link esterni hanno maggior valore rispetto ai link interni Sembra una cosa ovvia, ma non sempre è stato così.

In passato link interni e link esterni avevano lo stesso valore

I link hanno un valore maggiore se si trovano all’interno dei contenuti

per Google.

Ovviamente poi si è capito che andava attribuito un valore maggiore a ciò che dicono gli altri di noi rispetto a quello che diciamo noi di noi stessi.

I motori di ricerca sono bene attenti all’analisi dei blocchi

Questo non significa che bisogna abbandonare l’ottimizzazione

e alla segmentazione della pagina.

dei link interni, anzi linkare fra loro le nostre pagine

Oggi i link all’interno del contenuto hanno un valore maggiore

utilizzando il giusto anchor text è un ottimo modo per scalare

per google rispetto ad altri che si trovano in aree meno utili.

le Serp.

·· 31

Web experience

il valore dei link per i motori di ricerca

Meglio avere links provenienti da domini diversi

passa verrà distribuito fra i 50 link, mentre se nella pagina ne sono presenti 2 il valore viene diviso tra questi 2.

Meglio 10 link da 10 siti differenti che 100 link provenienti tutti

Ovviamente il valore passato a ciascun link

dallo stesso sito. Questo perchè se la provenienza dei link

sarà diverso in base ai parametri che abbiamo visto fino ad ora,

è diversa significa che più persone attribuiscono valore

al pagerank della pagina e alla qualità dei link presenti nella pagina.

ai nostri contenuti.

già fornito in precedenza.

I link provenienti da siti verificati hanno un valore maggiore

Quindi ancora una volta vediamo quanto è importante creare

I siti cosidetti di fiducia offrono un valore maggiore rispetto

del contenuto utile e di valore capace di adescare link

agli altri siti.

Questo vuol dire anche che i link attribuiti da nuovi siti valgono di più di quelli che provenienti da siti che ve ne avevano

da parte di quei visitatori che quando trovano risorse interessanti sono portati a indirizzare altre persone verso di essi.

Meglio ottenere link da pagine con pochi link in uscita Meno link sono presenti all’interno di una pagina e maggiore sarà il loro valore!

Sostanzialmente la link juice è la forza che ha un sito di trasmettere autorità ad un altro sito internet, e si misura sulla base del numero di link presenti all’interno di un sito.

Praticamente, se in una pagina ci sono 50 link il valore che il sito

32 ·· your inspiration magazine

Spesso succede che delle pagine o interi siti possano beneficiare

il tema trattato dalla pagina di destinazione.

molto di link da pagine anche sconosciute

Il suo valore è altissimo, alcune pagine web, sono nelle prime

purchè provenienti da siti verificati. Questo perchè siti attendibili

posizioni con parole chiave molto competitive grazie al solo fatto

raramente mettono link verso siti spazzatura.

di avere link da siti che usano le giuste keyword come anchor text.

Ad esempio un link proveniente dal sito del governo americano

Per sfruttare a pieno il link baiting e fare in modo che l’anchor text

avrà un valore maggiore rispetto a un link proveniente

contenga le keyword che a noi interessano è molto importante

da Wikipedia che a sua volta avrà un valore maggiore rispetto

sfruttare un altro parametro: il nome del dominio.

al link proveniente da un blog.

Molto spesso quando otteniamo link spontanei, i visitatori

L'anchor text è fondamentale.

sono portati ad usare come anchor text il nome del dominio stesso.

Se ad esempio io voglio posizionarmi per la keywords “caffè”, faccio in modo che il nome del mio dominio sia www.caffe.....it.

Sicuramente l’anchor text ovvero il testo da cliccare per visitare il link è il fattore più importante in assoluto.

Allo stesso modo dell’anchor-text è importante sfruttare al meglio

Per creare un link utilizziamo il seguente codice:

l’attributo ALT nelle immagini collegate, anche se sembrerebbe che google gli attribuisca meno importanza.

<a href=”http://www.sitoesempio.it” title=”title del

E’ comunque sempre opportuno utilizzare il tag Alt nelle immagini

sito”>anchor text </a>

e non solo per quanto riguarda l’argomento odierno, ma per altri motivi che spiegheremo nei prossimi articoli

Normalmente in un sito, l'Anchor text indica l’argomento della pagina linkata.

Ci sono anche altri fattori utili per attribuire valore ad un link tipo anzianità del link, il testo nelle vicinanze e se si tratta

Ad esempio il testo “creazione siti web” indica ai visitatori

di un link reciproco o meno, ma credo che i parametri presentati

che la pagina web tratta argomenti riguardanti la creazione

siano sufficienti per poter sfruttare a pieno i vostri link in entrata

di siti web. Ma non lo indica solo ai visitatori, anche i motori

e in uscita e gestire al meglio una campagna di link building.

di ricerca sfruttano tale caratteristica nei loro algoritmi per definire

Buon lavoro. ••

·· 33

Web experience

User Experience: progettare siti web a misura di bambino

•• Per realizzare un sito web usabile e a misura di utente bisogna tenere conto di molti fattori importanti. Uno tra questi è la o le classi di utenza che usufruiranno del progetto. Bisogna infatti non perdere di vista gli obiettivi, le abitudini e le motivazioni che spingeranno gli utenti a fare uso del sito web.

Autore:

Simone D'amico

Quando il progetto ha come classe di utenza i bambini, le cose potrebbero sembrare molto più complicate rispetto ad un sito web usuale. Bisogna infatti tenere

Web Designer & Developer

in considerazione le capacità dei bambini, le loro attitudini e molti altri aspetti

from Frosinone. Adora tutto quello

che potrebbero essere dati per scontati quando si progetta l’User Experience

che ha a che fare con l'User Experience

di progetti per “grandi”.

e con lo sviluppo di applicazioni per il web. Condivide articoli di web

In questo articolo vedremo come progettare siti web a misura di bambino, le regole

design sul suo blog e da circa un anno

da rispettare per migliorare l’esperienza utente e cosa questo genere di siti hanno

scrive per Html.it e per alcuni blog

in comune con i più classici.

stranieri del settore.

Le attività svolte dai bambini sul web

www.simonedamico.com Prima di procedere, voglio spendere alcune righe su alcuni dati scientifici elaborati da Telefono Azzurro e Eurispes riguardo le percentuali di utilizzo del web da parte di bambini (fino a 11 anni) e adolescenti (12-18 anni).

Link: http://bit.ly/gfPcVX

In questo articolo volutamentenon tratterò l’età adolescenziale poiché entrano in ballo molti altri fattori, non solo psicologici ma mi soffermerò sull’età preadolescenziale fino agli 11-12 anni. Nel dossier "Bambini e adolescenti: un quadro degli ultimi 10 anni"1

34 ·· your inspiration magazine

1 http://bit.ly/h63HQf

User Experience: progettare siti web a misura di bambino

Le regole da rispettare per progettare un sito web per bambini

ATTIVITA’ BAMBINI (FINO 11 ANNI) Attività

2005

2009

Blog

9,1 %

22,30%

Chat

8,8 %

42,10%

Giochi

47,50%

68,30%

Informazioni

44,20 %

69,30%

Materiale di studio

31,90 %

49,00%

Posta elettronica

13,10 %

27,80%

50,8%

55,90%

Video e multimedia

viene analizzata l’attitudine alla tecnologia dei più giovani.

lo usi anche per connettersi ad internet.

Prescindendo dalla maggior parte dei dati analizzati dalla ricerca

Anche quest ultimo è un dato importante da analizzare in visione

(percentuale di bambini che possiede un cellulare, ecc.) voglio

della progettazione di versioni mobili dell’applicazione web.

soffermarmi sulle attività svolte sul web.

Le ricerche di Nielsen

Nella seguente tabella sono analizzate le attività e le differenze di percentuale rispetto alla precedente analisi svolta nel 2005.

Dopo aver analizzato le attività svolte dai bambini sul web, vediamo ora i differenti approcci che si hanno sul web in base

Come era ovvio attendersi dai dati, c’è un netto incremento

all’età degli utenti. Questi dati sono stati raccolti da Jakob

di utilizzo di internet da parte dei bambini e dall’analisi è risultato

Nielsen2 e rappresentano una base di partenza importantissima

anche che il 21% dei bambini che possiede un cellulare,

per la progettazione dei siti web.

Animazioni ed effetti sonori

Cercare link nella pagina

Advertising

Scrolling

Lettura

Bambini Adolescenti Adulti Ç

Divertente, interessante e accattivante, o gli utenti si adattano facilmente all’attività.

Ç

Gli utenti potrebbero apprezzare l’attività ma un suo uso eccessivo potrebbe risultare problematico.

Ç

Agli utenti non piace l’attività, non la fanno oppure trovano serie difficoltà ad eseguirla.

Legenda:

2 http://bit.ly/fcr2HQ

·· 35

Web experience

User Experience: progettare siti web a misura di bambino

Da questa tabella è possibile trarre le prime importanti conclusioni

di lettura e comprensione di testi lunghi.

sulle abitudini dei bambini (e non solo) e quindi su alcune delle regole importanti da tenere sempre a mente.

Un’altra cosa da evitare è l’utilizzo di caratteri di dimensioni ridotte. È infatti stato dimostrato, sempre dalle ricerche effettuate

La prima cosa importante che risalta è la scarsa o nulla attitudine

da Nielsen, che i bambini (ma anche gli adulti) non amano

alla lettura ad ogni età. È risaputo infatti che testi lunghi

testi scritti con font troppo piccoli.

sono sconsigliati per il web e tutti gli utenti, indipendentemente

Differenze importanti tra un utente adulto e un utente bambino,

dall’età, hanno poca voglia di leggere.

invece, sono la presenza di pubblicità, animazioni ed effetti sonori nel sito. Mentre un utente adulto non sopporta musichette

Nel caso dei bambini poi è ancora più importante rispettare

di sottofondo, animazioni, banner pubblicitari ecc., il bambino

questa regola perché sappiamo benissimo che è l’età

è attratto da tutto ciò che è disegno, divertimento, suoni

in cui si impara a leggere e quindi si hanno anche difficoltà

e soprattutto interazione.

Bambini 3-5 anni

Bambini 5-7 anni

Bambini 7+ anni

Sono bambini che ancora non sanno leggere o stanno imparando. Hanno ancora poca destrezza nel controllare

Hanno imparato da poco a leggere

Sanno leggere ed hanno la capacità di gestire i movimenti del mouse

i movimenti del mouse CONSIGLI DI PROGETTAZIONE Evitare l’uso di finestre pop-up. È molto più semplice per loro gestire contenuti con il pulsante Indietro.

Se necessario è possibile gestire contenuti con finestre multiple.

I bambini riescono abbastanza facilmente a destreggiarsi nelle varie finestre.

Ridurre al minimo i contenuti testuali e, se possibile, fornire alternative vocali. È consigliato in queste fasi ripetere

Fornire sempre la possibilità di eliminare le guide vocali o saltare le istruzioni.

le istruzioni per muoversi all’interno del sito web o le regole del gioco.

Ridurre al minimo il numero dei pulsanti e delle zone cliccabili. Aumentarne invece le dimensioni per permettere la navigazione anche ai bambini con scarse capacità di gestione del mouse.

Evitare la necessità di spostare gli elementi nello schermo.

I bambini hanno già acquisiti le capacità di drag-drop presenti nel sistema operativo.

Posizionare i controlli di navigazione nella parte superiore dello schermo.

Utilizzare un pulsante con una X rossa per chiudere le finestre. I bambini apprendono fin da subito questa convenzione.

Non progettare controlli di navigazione che richiedono l’utilizzo delle frecce direzionali.

36 ·· your inspiration magazine

Progettare le User Interface PER BAMBINI Abbiamo visto finora i bambini come un’unica categoria che va da 0 (in linea teorica) a 11/12 anni.

Suddividendoli ora in tre fasce d’età ( 3-5, 5-7, 7+ ) vediamo quali sono le convenzioni da utilizzare nella progettazione dei design.

Queste convenzioni, trattate esaustivamente da UXmatters3, tengono in considerazione soprattutto le capacità che i bambini nelle differenti fasce d’età.

Un’altra tabella da cui prendere informazioni molto importanti sono delle differenze comportamentali tra bambini e adulti studiate sempre da Nielsen4 .

Conclusioni

La tabella sottostante riassume la tabella integrale con le attività più importanti.

Una cosa che mi permetto di aggiungere alla tabella è il tipo

Trattare in maniera esaustiva l’argomento con un solo articolo

di carattere da utilizzare quando si ha a che fare con i bambini.

è impensabile. Le informazioni contenute in questo testo non possono essere considerate come le uniche da tenere in

Mentre per un progetto normale non penseremmo mai

considerazione ma sono sicuramente una buona base di partenza

di utilizzare un font come il Comic Sans, per i bambini invece

per iniziare a progettare siti web destinati ai bambini. Per maggiori

è altamente consigliato.

approfondimenti rimando ai link allegati all’articolo e ai seguenti:

Uno dei motivi è ovviamente la tendenza al“gioco” ed a tutto

Ç A Study on User Experience Design in U. environment

Ç Design for children5

for Children6 ••

quello che è divertente.

Attività

Bambini

Adulti

Genere di siti web visitati

Intrattenimento

Prima reazione

Veloce giudizio del sito (abbandono se l’impatto è negativo)

Disponibilità ad attendere

Quasi nulla

Esplorazione della pagina Navigazioni multiple nella pagina

Limitata

Adorano provare più opzioni ed esplorare lo schermo Disorienta il bambino

12 pt (bambini più grandi) Problemi nella scrittura e nel controllo

Limitazioni fisiche

del mouse

4 http://bit.ly/fQYocZ

5 http://bit.ly/gYeJe3

Attaccamento al percorso principale Disorienta leggermente l’utente

14 pt (bambini più piccoli)

Dimensione del font

3 http://bit.ly/gIbyUY

Informazione e Comunicazione

6 http://bit.ly/eqnrF3

10pt – 14pt a seconda dell’età

Nessuna (ad eccezione dei disabili)

·· 37

Iscriviti alla newsletter di Your Inspiration Web

e ricevi in regalo

L’eBook “Guida alla realizzazione di un sito dalla A alla Z” una panoramica completa sul mondo del webdesign

Scaricalo subito! www.yourinspirationweb.com/newsletter

SOSTIENI YIM Se questo Magazine è stato per te un’occasione di maggiore comprensione e crescita professionale, se la sua lettura è stata fonte di ispirazione, o semplicemente se senti che è giusto e vuoi contribuire alla sua crescita, puoi sostenere questo progetto in differenti modi: inserendo un banner o un semplice link nel tuo sito/blog o effettuando una donazione.

Per saperne di piu: http://www.yourinspiration-magazine.com/sostieni/

Web experience

Addio originalità: usi e abusi nel web design

•• Ebbene è cosi: anche nel web design, cosi come in tutti i campi dell’arte e della comunicazione, si finisce con l’annoiare. Un effetto gradevole, un layout originale…fino a che l’effetto non prende forma in dieci, cento, mille siti diversi e il layout diviene solo un’accozzaglia di ombre e colori trita e ritrita, senza spessore.

Autore:

Sara Presenti

Non si tratta di copiare ma di assimilare in modo quasi morboso e del tutto spontaneo: ci guardiamo intorno e prendiamo ciò che più ci piace, enfatizzando cosi uno stile grafico

Lavora nel campo della grafica

o un effetto fino a farlo diventare, per l’appunto, un trend. Un qualcosa che va di moda,

e dello sviluppo web e oltre

che funziona. Almeno per un po’.

a collaborare con diverse web agency gestisce con successo la sua attività

E cosi il web si popola di tanti, troppi siti fotocopia. É il caso dell’ormai scontato

di freelance sotto il nome di mascara

“Hi! I’m Matt” che troneggia sul 99% dei siti dei freelancer americani:

design. Come molti freelance si è abituata

va bene la cordialità, va bene essere informale, ma a tutto c’è un limite.

a gestire più ruoli, spaziando dalla grafica cartacea allo sviluppo del codice xhtml e css; nonostante questo la sua passione rimane, sempre e comunque, la grafica per il web.

www.mascaradesign.it Link: http://bit.ly/eoZnPR figura 1 •• La home page di “Torchbox”1

40 ·· your inspiration magazine

1 http://bit.ly/8NU2cj

Addio originaltà: usi e abusi nel web design

Uno sguardo ad alcuni dei trend più (ab)usati nell'attuale web design

figura 2 •• Il portfolio di Andy O’Dore2

figura 5 •• Jhonny5 invece fa quello che fa solo grazie al caffè che beve

figura 3 •• il portfolio di GuoYu3

figura 6 •• Jezbel6 è una web designer che ama il suo lavoro, il caffè….i conigli e dormire.

Ciao, sono Sara, amo il web design.. e i gatti

Prendendola da un punto di vista prettamente ironico, è preoccupante il fatto che la maggior parte dei web designer assuma caffè in quantità spropositate e ne sia talmente assuefatta

Un’esasperazione aggiuntiva di questo trend, che già potrebbe risultare abbastanza tedioso, fa si che oltre al nome di battesimo e alle proprie competenze professionali, vengano sbattute in prima

da dichiarare in modo cosi spontaneo!

Web designers? No, modelli

linea altre informazioni pressoché inutili, elargite con il solo scopo di apparire simpatici, estrosi, originali.

Un’altro trend abbastanza comune che molti freelance sembrano

Scopriamo quindi che Adrian beve molto caffè, che Liza preferisce

ricalcare consiste nell’esibire, in modo tutt’altro che discreto,

il tè, che Martin ha 5 gatti e cosi via, in un marasma di parole

se stessi sul proprio portfolio.

fuori luogo e, forse, poco professionali.

Mi spiego meglio: avete presente le classiche e discrete sezioni “about”, dove faceva capolino una piccola foto del web designer di turno? I tempi sono cambiati: adesso il designer si mette in primo piano, con foto eccentriche e pose volutamente narcisistiche.

C’è chi fa la smorfia simpatica, chi opta per un look “da macho”, chi calca la mano per dimostrare di essere fuori dalle righe. figura 4 •• Brannon Sherry4 ci informa che ama fare lunghe passeggiate sulla spiaggia

2 http://bit.ly/idT6uv 6 http://bit.ly/g8CsGw

3 http://bit.ly/hwQhUo

4 http://bit.ly/fYQhBh

Ormai la maggior parte dei web designer propende per abusare

5 http://bit.ly/e6jkRH

·· 41

Web experience

Addio originalità: usi e abusi nel web design

di questa tecnica creando cosi portfolio più simili a book fotografici che a curriculum professionali veri e propri.

Ebbene si, il sorriso, in ogni sua forma, fa vendere: per creare rapport con l’utente e infondere fiducia al brand, sono molte le attività che si basano sulle emozioni positive. Yes People5, per esempio, offre servizi di catering e organizzazione eventi, e si rivolge all’utente con foto solari e gioviali: In questo caso il messaggio è: cortesia e disponibilità al tuo servizio.

figura 10 •• Il look glamour del web designer di Bokche10

figura 7 •• Nic Papic7 con le mani tra i capelli arruffati

Un javascript poco funzionale L’abuso di effetti Javascript, specie se si tratta di effetti poco utili con motivazioni puramente estetiche, è qualcosa con cui dobbiamo fare i conti molto spesso.

Un effetto che sembra aver preso particolarmente piede nel corso dell’anno passato (e di cui potremmo tranquillamente fare a meno in questo 2011) consiste in un movimento – leggero o meno a seconda dei casi - del background o, più nello specifico, dell’header. figura 8 •• Il sito di Dominik Geisler8

Il sito di Dominik Geisler è la prova concreta di quanto questo trend abbia modificato le priorità nei portfolio dei web designer: in home page troneggia una foto, decisamente artistica, di Dominik. Il link ai lavori realizzati, che generalmente figura 11 •• Home page dello studio Bamboo11

dovrebbero avere un notevole risalto, è limitato ad un piccolo e poco visibile banner posizionato nell’angolo sinistro

La home page dello studio Bamboo ondeggia leggermente

dello schermo.

al minimo spostamento del mouse.

figura 12 •• Home page del l’agenzia Italiana “Moovents"12

Anche l’agenzia Italiana “Moovents” ha implementato figura 9 •• Shihab9 invece, preferisce uno stile più aggressivo, quasi “rapper”

42 ·· your inspiration magazine

quest’effetto nell’header della home page.

7 http://bit.ly/bdZXpE

8 http://bit.ly/igvnI8

11 http://bit.ly/dTsHXN

12 http://bit.ly/ePhRjY

9 http://bit.ly/1iQOcI

10 http://bit.ly/aHIcKd

Un..divano nel layout

Dettagli grafici visti e rivisti: nastri e curve

All’inizio il significato di divani, poltrone e sofà posizionati in modo quasi casuale sui layout di diverse web agency mi lasciava

L’elemento grafico più abusato nel web design attuale

un po’ perplessa, non ne capivo il recondito significato.

è senza dubbio la forma “a nastro” effetto 3d.

Con il senno di poi ho compreso che i concetti espressi

Lo troviamo praticamente ovunque, sotto forma di background

con l’immagine di un divano potevano essere etichettati

del menu o come parte integrante del layout stesso.

con comodità, relax, facilità, una specie di carezza emozionale per far sentire a proprio agio un probabile e potenziale cliente.

Un effetto gradevole, bello da vedere, ma che in poco tempo

Nel 2010, quindi, ecco fiorire componenti d’arredo in ogni dove:

è diventato ovvio e decisamente poco originale.

figura 13 •• La home page del sito Experience Internet13

13 http://bit.ly/d3LlG9

figura 17 ••

figura 14 •• La home page dello studio web San Diego14

figura 18 ••

figura 15 •• Home page dell’agenzia Edge of my seat15

figura 19 ••

figura 16 •• Home page di Decorama16

figura 20 ••

14 http://bit.ly/Up2N5

15 http://bit.ly/d4vNc

16 http://bit.ly/gM5Tsg

·· 43

Web experience

Addio originalità: usi e abusi nel web design

figura 24 ••

figura 21 ••

Il bordo incassato Il “bordo incassato” è un separatore grafico a cui, lo ammetto, anche io sono molto affezionata. Un pixel di colore leggermente più chiaro del background affiancato a un pixel leggermente più scuro dello stesso e l’effetto è di un bordo luminoso ed evidenziato, molto più accattivante e particolare di una semplice linea separatrice.

Particolare, ma non originale: possiamo trovare questo effetto su quasi ogni sito che visitiamo, tanto è diventato di routine,

prevedibile.

figura 25 ••

figura 26 ••

figura 22 ••

Il font più abusato del 2010: Lobster Il font Lobster17 è un font che un po’ tutti amano particolarmente: grazioso, originale, calligrafico, gratuito.

Tutte caratteristiche capaci di rendere un font molto famoso.

Al punto da farlo diventare, in poco tempo, uno dei font figura 23 ••

44 ·· your inspiration magazine

più utilizzati nel web design.

17 http://bit.ly/fATgXb

figura 27 ••

figura 31 ••

figura 28 ••

Ma anche in questo caso, attenzione: sarebbe veramente un peccato se un font cosi bello diventasse il nuovo Comic Sans del 2011 e divenisse cosi sinonimo di banalità e cattivo gusto.

Originalità, creare..osare.

In sintesi, finiamo sempre con il compiere le stesse azioni, scegliendo colori, font ed effetti grafici con cui qualcun altro ha sperimentato. Tendiamo a ricalcare e prendere spunto, forse esagerando, forse senza riuscire a dare un’impronta figura 29 ••

personale, una nuova identità a ciò che abbiamo deciso di prendere e fare nostro.

In questo 2011, perché non provare a dare un input al nostro estro creativo che, forse, si è un po’ assopito?

Perché non provare a creare, senza attingere a fonti di ispirazioni esterne, per divenire precursori di nuovi trend nel nostro settore e non semplicemente fautori di tendenze altrui?

Se non l’aveste capito, quella che vi (e mi) lancio con questo articolo.. è una sfida.

figura 30 ••

Siete pronti a coglierla? ••

·· 45

Web experience

Le folksonomie: cosa sono e a cosa possono servire?

•• Sempre in modo più capillare ed esteso, le applicazioni del Social Web permettono agli utenti di creare, pubblicare, gestire e condividere risorse di ogni tipo, come video su Youtube1, pagine web preferite su Del.icio.us2, foto e immagini su Flickr3, oltre che a gestire profili personali diversi su social network differenti come Facebook4 e LinkedIn5. Ogni giorno milioni di persone in tutto il mondo utilizzano queste Autore: Emanuela

Pitassi

applicazioni web non solo per creare, ma anche ricercare una o più risorse.

Emanuela Pitassi si laurea nel 2005 in

Affinché tali risorse siano efficacemente recuperate è necessario che tali sistemi adottino

Tecnologie Web e Multimediali: da allora

un qualche meccanismo di classificazione, volto a organizzare questa moltitudine sempre

progetta e sviluppa applicazioni web.

più crescente di risorse. Ebbene, sempre più spesso sono proprio gli utenti finali stessi

Nel 2009 consegue la laurea specialistica

a essere protagonisti nella fase di classificazione ed organizzazione di tali risorse,

in Tecnologie dell’Informazione con una

tramite l’associazione di termini rappresentativi, chiamati tag, ad una risorsa.

tesi sul web design emozionale.

Oggi è appassionata di web 2.0 e 3.0

Grazie quindi al significato dei tag. gli utenti del Web 2.0 possono condividere e definire classificazioni personali delle numerose risorse presenti sul web.

www.emanuelapitassi.it

Il motivo di tanto successo di queste social application messe a disposizione degli utenti, va ricercato nella semplicità di utilizzo di questi sistemi e nella libertà lasciata agli utenti.

I protagonisti sono gli utenti finali, i nuovi produttori-consumatori di contenuti: ciascuno di essi, (ciascuno di noi) contribuisce a creare le risorse del Web, e successivamente ad organizzarle: questo meccanismo, anche definito come annotazione sociale

Link: http://bit.ly/hrx5hu

è di per sé democratico, poiché coinvolge tutti gli utenti, e permette di ottimizzare lo sforzo di classificazione informativa, in quanto viene “ripartito” e condiviso tra tutti gli utenti.

46 ·· your inspiration magazine

1 http://bit.ly/i4QSLg 5 http://linkd.in/g3kgRy

2 http://bit.ly/h2FuM5

3 http://bit.ly/ibkmht

4 http://on.fb.me/

Le folksonomie: cosa sono e a cosa possono servire?

Come gli utenti organizzano le risorse del Social Web Per capire un po’ più nel dettaglio tale meccanismo nei seguenti

delle risorse basato sulle annotazioni utente, ovvero sulla libera

paragrafi vedremo:

associazione di una parola chiave (tag) ad una risorsa.

Ç alcune definizioni preliminari: cioè cosa significano tag,

Ogni utente utilizza uno o più tag per descrivere una risorsa, creando così una propria classificazione personale delle risorse:

personomia e folksonomia;

tale classificazione è stata definita come personomia.

Ç come classifichiamo le risorse: ovvero quali sono i motivi

Considerando la moltitudine di utenti che utilizza le social

che ci spingono ad annotare una risorsa;

Ç come si possono sfruttare le folksonomie: ovvero

application, l’insieme delle personomie, forma così una folksonomia.

In maniera più formale, una folksonomia può essere vista

mostreremo alcuni esempi in cui sono proprio i tag

come una relazione “ternaria” tra Utenti, Tag e Risorse

ad essere utilizzati per suggerire contenuti o informazioni

e può essere raffigurata come nello schema sottostante [Figura 1].

agli utenti.

Definizioni preliminari

Come classifichiamo le risorse?

Una prima definizione di folksonomia, contrazione di folk

Quali sono le motivazioni alla base della classificazione delle risorse

(dall’inglese “popolare”) e tassonomia (organizzazione)

del Web 2.0? Come e perché aggiungiamo tag a delle risorse?

è stata data da VanderWal6.

Secondo l’autore, si tratta di un sistema informale di descrizione

Quando un utente vuole aggiungere un tag ad una risorsa,

figura 1 •• Folksonomia, vista come relazione “ternaria” tra Utenti, Tag e Risorse

6 http://bit.ly/e2r7Py

·· 47

Web experience

Le folksonomie: cosa sono e a cosa possono servire?

può avere diverse motivazioni personali, ad esempio: Ç può voler descrivere il tipo di risorsa oggetto dell’annotazione, come per esempio “video”, “foto”, ecc…

Ç può utilizzare una caratteristica specifica come descrittore

della risorsa, ovvero descrivere “una parte per il tutto”, è il caso per esempio in cui si indica il nome della persona che compare in una foto, e questo avviene tipicamente su facebook; Ç similmente al punto precedente, può utilizzare un tag per esplicitare l’autore della risorsa, o magari l’anno

a cui fa riferimento, o ancora il luogo: si pensi per esempio alle più comuni piattaforme di blogging, come per esempio Wordpress, che permettono di inserire i tag per descrivere il contenuto del post in oggetto;

Ç può usare un tag come personale promemoria come per esempio “da leggere”;

Ç può usare un tag per rendere la risorsa condivisa

ad un altro utente, anche questo per esempio avviene

Come possono essere sfruttate le folksonomie

quando si utilizza taggare uno o più dei propri contatti su un documento, su una risorsa.

Abbiamo visto che l’attività di social tagging, oltre a permettere una classificazione economica libera e democratica delle risorse,

Queste sono alcune delle motivazioni alla base dell’annotazione

può contribuire a modellare le necessità informazionali degli utenti.

sociale, tuttavia si deve considerare anche un altro aspetto.

Questo è particolarmente vero quando si accede all’informazione tramite sistemi di filtraggio (o di raccomandazione) del contenuto:

Quando un utente tagga esprime senza dubbio un particolare

di tutte le numerose risorse annotate.

interesse per quella data risorsa, comunicando che per lui/lei rappresenta qualcosa di importante da leggere o far leggere,

La maggior parte delle applicazioni Web 2.0 offre un sistema

da ricordare o da recuperare in futuro. Perciò i tag forniscono

diretto di filtraggio dell’informazione, basato sul colpo d’occhio:

anche un indicazione delle preferenze degli utenti, che esplicitano

si tratta delle cosidette tagcloud: attraverso questa visualizzazione,

liberamente tramite opportuni termini, i loro interessi, ma anche

a volte statica, a volta dinamica con effetti 3D, vengono presentati

i loro obiettivi.

i tag utilizzati dagli utenti all’interno del sito.

Vedremo ora come tali informazioni possono essere sfruttate.

Generalmente vengono raffigurati i termini maggiormente utilizzati dagli utenti e tipicamente i progettisti di questi sistemi mappano sulla dimensione del carattere del tag, la frequenza di utilizzo del tag. Le più comuni piattaforme di blogging mettono generalmente a disposizione dell’utente plugin specifici per la generazione della tag cloud in base a quanto utilizzato nel proprio blog.

Oppure si possono trovare delle web application esterne ed indipendenti che permettono di creare la tag cloud, da poi importare successivamente all’interno del proprio sito web; un esempio da segnalare lo si può trovare al sito Tag Cloud Generator7 che permette ampia personalizzazione

48 ·· your inspiration magazine

7 http://bit.ly/eRTsP8

e manipolazione dei tag rilevati automaticamente sul vostro sito, dopo averne semplicemente indicato l’URL. Oltre alle tag cloud, sono numerosi gli esempi di portali Web che utilizzano e combinano le informazioni sull’utente (generalmente i loro profili) e le folksonomie che si sono venute a creare, per suggerire contenuti considerati di interesse per gli utenti finali.

Alcuni dei siti più noti, che adottano sistemi di raccomandazione basati sui tag sono: Ç LastFm8: effettuando una ricerca di un genere musicale

o di un cantante, vengono proposti i risultati considerati più

attinenti a seconda di quanto i termini da voi utilizzati per la ricerca, siano stati utilizzati dagli utenti del portale; se non ci dovesse essere una corrispondenza precisa, il sistema vi offre risultati considerati simili, cioè più vicini a quanto avete cercato; Ç Del.icio.us9: tutte le risorse sono classificate dagli utenti

con tag, addirittura è possibile selezionare i tag più popolari

oltre alla libertà intrinseca dei tag che può portare a caratterizzare

o più recenti.

risorse completamente differenti con lo stesso termine, o con termini diversi dallo stesso significato.

Ovviamente l’utilizzo delle folksonomie non è esente da problematiche: basti pensare all’ambiguità del linguaggio

Questo e altro nelle prossime puntate dedicate all’evoluzione

che porta con sé problematiche di sinonimia o di omonimia,

del Web e del suo utilizzo da parte degli utenti. ••

8 http://bit.ly/e9JM20

9 http://bit.ly/h2FuM5

·· 49

52路路 XML:

Conoscere i feed RSS [Parte 3]

58路路 Gimp:

Guida a Gimp: gli strumenti di disegno

Tutorial ·· xml Conoscere i feed RSS (TERZA parte)

XML

•• In questo ultimo articolo sull’argomento RSS feed, realizzeremo un semplice e versatile script capace di leggere i feed di qualsiasi sito e di produrre un output personalizzabile che potrà essere integrato facilmente in una pagina web.

Preparare il layout Autore: Maurizio

Tarchini Come prima cosa crea una pagina index.php.

Maurizio Tarchini è un programmatoretuttofare.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://

Qualche mese fa è stato rapito e da allora

www.w3.org/TR/html4/loose.dtd">

vive ridotto in stato di schiavitù nello scantinato della redazione di YIW.

<html>

Scrive su questo magazine contro la sua

<head>

volontà al soldo di una ciotola di riso per

<meta http-equiv="content-type" content="text/html; charset=utf-8">

articolo.

</head>

www.mtxweb.ch

<body> </body>

difficoltà: media tempo: 45min

Link: http://bit.ly/f63bql

</html>

Ora iniziamo a definire il markup dei singoli articoli che verranno mostrati.

Nel nostro caso faremo una parte header dove andremo a scrivere il titolo dell’articolo e la data di pubblicazione, ed un altra parte nella quale scrivere il contenuto.

52 ·· your inspiration magazine

Conoscere i feed RSS [parte 3]

Realizziamo uno script capace di leggere i feed e di mostrare un output personalizzato <div class="item_header">

html; charset=utf-8">

<a href=”#”><h3>Titolo dell’articolo</h3></a> Scritto Sabato 12 ottobre 2009 alle ore 11:45

<style>

</div>

.item_header{

<div class="item_content">

width: 600px;

Testo introduttivo dell’articolo

background-color: silver;

</div>

border: 1px solid gray; padding: 6px; }

Definiamo ora un minimo di stile: .item_header{

.item_content{

width: 600px;

width: 600px;

background-color: silver;

border: 1px solid gray;

border: 1px solid gray;

border-top: 0px;

padding: 6px;

padding: 6px;

}

margin-bottom: 30px;

.item_content{ width: 600px; border: 1px solid gray;

} </style> </head>

border-top: 0px; padding: 6px;

<body>

margin-bottom: 30px; }

<div class="item_header"> <a href=”#”><h3>Titolo dell’articolo</h3></a>

In modo che il risultato sarò questo:

Scritto Sabato 12 ottobre 2009 alle ore 11:45 </div> <div class="item_content"> Testo introduttivo dell’articolo </div>

La pagina index.php si presenta ora in questo modo:

</body> </html>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose. dtd">

Creare un file di template per la visualizzazione dei feed

<html>

Crea ora il file item_template.php. Dalla pagina index.php

<head>

taglia il markup relativo alla visualizzazione dei feed

<meta http-equiv="content-type" content="text/

(quindi tutto il contenuto del body) ed incollalo in questo

·· 53

Tutorial - xml Conoscere i feed RSS (TERZA parte)

nuovo file che ora si presenterà in questo modo:

string($xmlContent); $this->feedTitle = $this->feedContent-

<div class="item_header">

>channel->title;

<a href=”#”><h3>Titolo dell’articolo</h3></a> Scritto Sabato 12 ottobre 2009 alle ore 11:45

$this->feedLink = $this->feedContent>channel->link;

</div>

$this->feedDescription = $this->feedContent-

<div class="item_content"> Testo introduttivo dell’articolo

>channel->description; }

</div>

Come vedi il costruttore passa come parametri l’url del feed Questo è il file che utilizzeremo per creare l’output dei singoli

ed opzionalmente il numero di news da mostrare

articoli, vedremo presto come.

(di default impostato a 5).

Leggere i feed Quello che faremo ora, sarà sviluppare una classe in grado di leggere i feed di un sito.

Questa classe passerà come parametri l’url del feed ed il numero di articoli da mostrare; valorizzerà una serie di proprietà che potrebbero esserci utili e metterà a disposizione un metodo che manderà in output i singoli articoli basandosi sul layout che abbiamo definito in item_template.php (e che naturalmente potremo modificare a piacimento).

Inizia dunque a creare il file readFeed.class.php ed a dichiarare la classe: In seguito viene valorizzata la proprietà number che utilizzeremo class readFeed

in seguito per limitare appunto il numero di news da visualizzare.

{

Quindi, tramite la funzione file_get_contents(), andiamo public

$feedTitle;

a recuperare il contenuto XML all’url che abbiamo passato

public

$feedLink;

nel costruttore.

public

$feedDescription;

Questo contenuto lo passiamo alla funzione simplexml_load_

protected

$feedContent;

string() creando così l’oggetto feedContent, grazie al quale

protected

$number;

possiamo accedere ai vari contenuti del nostro feed.

Come vedi recuperare ad esempio il link del sito sarà a questo

Le prime tre proprietà pubbliche le potremo utilizzare qualora

punto semplice:

ci servisse nome del sito, il suo link o la sua descrizione.

Le altre due proprietà, ad uso interno della classe, conterranno

$this->feedLink = $this->feedContent->channel->link;

l’oggetto XML ed il numero di articoli che vogliamo mostrare.

Scriviamo ora il metodo costruttore:

Passiamo ora al metodo incaricato di creare l’output degli articoli.

Dobbiamo considerare che di tag item ne avremo diversi,

public function __construct($feedUrl, $number = 5)

dunque li dovremo trattare come un array.

{ $this->number = $number;

public function showItem()

$xmlContent = file_get_contents($feedUrl);

{

$this->feedContent = simplexml_load_

54 ·· your inspiration magazine

foreach($this->feedContent->channel->item

as $item)

Ed ottenere questo risultato. { include 'item_template.php'; } return;

}

Come vedi utilizzo foreach per ciclare i vari item.

Ora, ad ogni ciclo, se volessi sapere ad esempio il titlo dell’articolo, lo potrò recuperare da $item->title (che sarebbe come dire $this->feedContent->channel->item->title).

Per ogni articolo, includo il file item_template.php.

Chiaramente, dovremo modificarlo per far sì che vengano inseriti i giusti contenuti. A questo punto non dovrebbe essere difficile: <div class="item_header"> <a href=”<?php echo $item->link; ?>”><h3><?php echo $item->title; ?></h3></a> Scritto <?php echo $item->pubDate; ?>

Abbiamo ancora due aspetti da sistemare.

</div>

Il primo è che non abbiamo ancora limitato il numero di news

<div class="item_content">

da visualizzare. Per fare questo, incrementeremo una variabile

<?php echo $item->description; ?> </div>

ad ogni ciclo. Quando questa variabile arriverà al numero predefinito di news da visualizzare, interromperemo il ciclo.

Modifichiamo dunque il metodo showItem() in questo modo:

Ora dovremo solo utilizzare la classe appena scritta nel file index.php. Iniziamo ad includerla ed istanziarla all’inizio

public function showItem()

del documento passando l’url dei feed di Your Inspiration Web.

{ $inc = 1; foreach($this->feedContent->channel->item

<?php include "readFeed.class.php";

as $item)

{

$feed = new readFeed("http://feeds2.feedburner.com/

include 'item_template.php';

YourInspirationWeb");

if($inc >= $this->number)

?>

{ break;

Ed ora nel body possiamo utilizzare la nostra classe come meglio

}

crediamo.

$inc++; }

Ad esempio potremmo scrivere qualcosa del genere:

return; <body>

}

<h1>Gli ultimi articoli di <?php echo $feed->feedTitle; ?></h1>

In seguito, se vogliamo fare un bel lavoro, la data nel formato standard dei feed non è che sia proprio bellissima.

<?php $feed->showItem();?>

Sviluppiamo dunque un metodo che trasformi la data

</body>

in un formato migliore, magari in italiano.

·· 55

Tutorial - xml Conoscere i feed RSS (TERZA parte)

Per fare questo:

Ç imposteremo il formato data in italiano tramite la funzione setlocale()

Ç ricaveremo il timestamp dalla stringa data utilizzando la funzione strtotime()

Ç e reimposteremo il formato della data utilizzando la funzione

A questo punto lo script è perfettamente funzionante e può essere adattato a qualsiasi esigenza modificando unicamente il file item_template.php Poniamo ad esempio di voler realizzare una specie di widget da inserire nella barra laterale del nostro sito che segnali ai lettori gli ultimi articoli di YIW, una cosa del genere:

strfdate()

Come prima cosa aggiungi in readFeed.class.php, all’inizio del documento, la funzione setlocale(), in questo modo: setlocale(LC_TIME,"it_IT"); Nota: se lavori su piattaforma windows dovrai utilizzare la stringa “ita_ITA”.

Ed ora scriviamo il metodo dateTransform() che prende la stringa data standard e la trasforma in una stringa data in italiano (che possiamo personalizzare come vogliamo) public function dateTransform($dateString) { $timestamp = strtotime($dateString);

Come vedi, in questo caso mostro solo il link (non siamo obbligati

$return = strftime("%A %d %B %Y alle

a mostrare tutto). Per fare questo mi basta intervenire sul template

%H:%M", $timestamp);

in questo modo:

return $return; }

<div class="item"> <a href="<?php echo $item->link; ?>"><?php echo

Ed ora, questo metodo lo possiamo applicare direttamente nel file

$item->title; ?></a>

item_template.php, in questo modo

</div>

Scritto <?php echo $this->dateTransform($item-

E naturalmente definendo la classe css item in questo modo:

>pubDate); ?> .item{ width: 160px;

Ottenendo questo risultato

border-bottom: 1px dashed gray; padding: 6px; }

Conclusione Sempre su windows, è probabile che gli accenti nella data

Siamo giunti alla fine di questa serie di articoli dove abbiamo

creino dei problemi.

approfondito il funzionamento dei feed RSS.

Possono essere risolti applicando la funzione utf8_encode()

Ne abbiamo analizzato la struttura, abbiamo visto come sia

sulla stringa, magari direttamente nel metodo showItem()

possibile implementarli ed infine come possiamo leggerli.

Ora disponi di tutti gli strumenti per poterli utilizzare

return utf8_encode($return);

56 ·· your inspiration magazine

come meglio credi. ••

Realizzare un tema per WordPress adesso è un gioco da bambini.

Vuoi sapere perchè? http://tinyurl.com/39ttfdq

your inspiration web

Tutorial ·· Gimp guida a gimp: gli strumenti di disegno (parte prima)

GIMP

•• Nel numero precedente si sono analizzati gli strumenti di selezione.

Continuiamo in questo articolo con gli strumenti di disegno, dei quali ne vedremo una parte, che si completerà poi con il prossimo numero.

Autore: Federico

Pian

opzioni in comune

Laureato in tecnologie web e multimediali

Molti strumenti di disegno hanno due opzioni in comune e per non ripetersi

e prossimo alla laurea specialistica in

nella spiegazione vengono riportate qui di seguito:

tecnologie dell’informazione.

Lavora come insegnante di informatica e web designer freelance. Inoltre è autore del blog fedeweb.net, dove parla di

Ç Modalità: permette di modificare il comportamento del colore rispetto a quello sottostante.

tutorial e risorse sul web design.

Ç Opacità: permette di variare l'intensità del colore.

www.fedeweb.net

riempimento colore Questo strumento permette di riempire una selezione o un livello con un colore

difficoltà: media tempo: 45min

Link: http://bit.ly/f2SZgB

o una trama a seconda delle opzioni scelte.

Per utilizzarlo, basta fare un clic nell’area che si intende riempire.

Opzioni dello strumento Le opzioni dello strumento sono:

58 ·· your inspiration magazine

Guida a Gimp: gli strumenti di disegno [parte 1]

Ç Tipo di riempimento: permette di riempire l’area con il colore di primo piano, di sfondo oppure con un motivo.

Ç Area coinvolta: permette di riempire l’intera selezione oppure solo le zone con colori simili.

di primo piano e di sfondo, oppure utilizzando le sfumature preimpostate.

Per utilizzare questo strumento, basta effettuare un’operazione di trascinamento da un punto a un altro del foglio, sapendo che più distanti saranno i punti più i colori verranno sfumati.

Scegliendo la seconda opzione si attivano altre voci: Ç Riempi aree trasparenti: riempie aree con bassa opacità. Ç Campionamento diffuso: quando si sta lavorando

su un'immagine con molti livelli e il livello attivo è semi trasparente o ha la modalità del livello non impostata su «normale», il colore usato per l'operazione è quello composto di tutti i livelli visibili. Ç Soglia: più alto sarà il suo valore, più sarà grande l’area coinvolta nel riempimento.

Ç Riempimento per: con quest'opzione è possibile scegliere che componente dell'immagine Gimp userà per calcolare

la similitudine e quindi determinare i margini del riempimento.

Opzioni dello strumento

Installare nuovi motivi

Ç Gradiente: consente di selezionare il tipo di gradiente

desiderato, utilizzando i colori di primo piano e sfondo È possibile inserire nuovi motivi oltre a quelli presenti

impostati dall’utente oppure utilizzando le sfumature

nel programma, in due passaggi.

preimpostate.

1 Apri la trama che vuoi aggiungere ai motivi di Gimp.

Ç Forma: permette di scegliere la forma del gradiente.

2 Vai su Modifica – Copia e poi Modifica - Incolla come - Nuovo

Ç Ripeti: risulta attiva se vengono scelte le forme: lineare,

motivo.

bi-lineare, radiale, quadrangolare e conica e permette

di ripetere la sfumatura se la linea tracciata è più breve Verrà chiesto che nome dare al file della trama e con che nome

delle dimensioni del foglio.

dovrà comparire nella lista.

Sfumatura

Creare nuovi gradienti Se non dovessero bastare i gradienti già disponibili,

Permette di riempire un’area con una sfumatura, usando i colori

si possono crearne di nuovi attraverso questi semplici passaggi.

·· 59

Tutorial ·· Gimp guida a gimp: gli strumenti di disegno (parte prima)

1 Vai nel menu Finestre – Pannelli agganciabili – Gradienti.

Ç Scala: permette di modificare la dimensione del pennello.

2 Nella finestra clicca sul pulsante per creare un nuovo gradiente,

Ç Dinamica del pennello: permette di modificare diversi

si aprirà l’editor dei gradienti.

parametri (opacità, durezza, dimensione e colore)

in corrispondenza di pressione, velocità e casualità.

3 Utilizzando il menu dell’editor (premendo sulla freccetta

Questi parametri sono dedicati più alle tavolette grafiche,

in alto a destra) potremo decidere come impostare i colori,

ma velocità e casualità sono utilizzabili anche con il mouse.

in quanti punti dividere la sfumatura e molto altro ancora.

4 Infine salviamo la sfumatura creata e la ritroveremo tra l’elenco dei gradienti.

Ç Sfumatura in uscita: permette di sfumare il tratto alla distanza specificata. È equivalente a diminuire l'opacità gradualmente mentre si traccia la linea.

Ç Applica jitter: il tratto del pennello, invece di essere continuo, viene “sparso”, in modo più o meno ampio a seconda del raggio impostato nella voce “ammontare". Ç Incrementale: se attiva, ogni passaggio ulteriore

sopra un tratto preesistente aumenterà l'opacità, ma non oltre il livello di opacità impostato per lo strumento. Ç Usa colore del gradiente: viene utilizzata una sfumatura di colori per il tratto del pennello.

Installare nuovi pennelli

Matita

Come detto in precedenza i pennelli sono una risorsa indispensabile per i grafici e in Gimp si possono utilizzare i pennelli realizzati

Permette di disegnare linee nette a mano libera: a differenza

per Photoshop, oltre a quelli creati appositamente

del pennello non produce bordi sfocati anche se viene scelto

per il programma.

un pennello sfocato e non utilizza mai l'anti-aliasing.

Si possono trovare pennelli in diversi siti: Deviantart1, Brusheezy2, Brush Lovers3 e molti altri ancora.

Questo strumento viene raramente utilizzato e pertanto non viene ulteriormente approfondito.

Pennello Permette di effettuare qualsiasi tipo di disegno ed è uno degli strumenti in assoluto più utilizzato dai grafici.

Per utilizzarlo, basta effettuare un’operazione di trascinamento o un semplice clic sul foglio; e il suo comportamento cambierà a seconda delle opzioni dello strumento attive.

Opzioni dello strumento Ç Pennello: permette di scegliere il pennello da utilizzare.

60 ·· your inspiration magazine

1 http://bit.ly/2iVU7q

2 http://bit.ly/9gCa8C

3 http://bit.ly/acEQUF

Una volta scaricato il set di pennelli, se compressi dovremo estrarlo

Se la gomma viene usata su elementi che non supportano

e poi copiarlo nella cartella:

la trasparenza, allora cancellando si mostrerà il colore di sfondo,

C:\Program Files\GIMP-2.0\share\gimp\2.0\brushes.

in caso contrario la cancellazione produrrà trasparenze parziali o totali, in base alle impostazioni dello strumento.

Per seguire il video tutorial su come installare script e pennelli per Gimp4, collegati al mio blog.

Opzioni dello strumento Molte opzioni sono in comune con gli strumenti pennello e matita: due sono presenti solamente per questo strumento: Ç Margine netto: consente di cancellare completamente un gruppo di pixel senza lasciare nessuna traccia.

Senza questa opzione la cancellazione ai bordi del tratto sarà parziale. Ç Antigomma: serve per ripristinare aree di immagine

precedentemente cancellate e funziona solo se il canale alfa del livello è attivo.

Creare nuovi pennelli

Aerografo

Creare nuovi pennelli è un’altra operazione semplice ed estremamente utile, che potrebbe velocizzare di molto

Lo strumento aerografo è adatto per realizzare delicate superfici

le nostre creazioni:

di colore e funziona come il pennello.

1 Creiamo un nuovo foglio delle dimensioni desiderate.

Opzioni dello strumento

2 Creiamo il motivo che vogliamo diventi il pennello da utilizzare

Ci sono molte opzioni in comune con altri strumenti di disegno

in futuro, ad esempio una firma che potremo usare

analizzati in precedenza, a parte l’ammontare e la pressione,

per i nostri lavori, cercando di utilizzare solo il colore nero.

specifiche per questo strumento:

3. Se si sono utilizzati più livelli, andiamo su Immagine –

Ç Ammontare: la barra orizzontale Ammontare imposta

la velocità di applicazione del colore da parte dell'aerografo.

Appiattisci immagine.

Un valore alto produrrà tratti scuri in un tempominore.

4. Poi andiamo su Immagine – Modalità – Scala di grigi.

5. Infine andiamo su Modifica – Copia, Modifica – Incolla come –

Ç Pressione: permette di gestire la quantità di colore

che l'aerografo dipinge. Un valore alto causerà tratti

Nuovo pennello e diamo un nome.

più scuri.

Per seguire il video tutorial su come creare pennelli

Conclusioni

personalizzati per Gimp , collegati al mio blog.

5

Già in questa prima parte abbiamo visto quante possibilità

Gomma

offrono gli strumenti di disegno, specialmente il pennello che permette di realizzare effetti di grande impatto.

La gomma viene usata per rimuovere aree di colore da un livello, una selezione o immagine.

4 http://bit.ly/dEKuoL

5 http://bit.ly/bpxGmq

Nel prossimo articolo vedremo gli altri strumenti di disegno. ••

·· 61

showcase intramontabile, romantico, creativo. ispirazione in vintage style.

•• Lo stile vintage è, per sua natura, uno stile sempre attuale e originale.

Certo, gli elementi dello stile sono assai facili da individuare (texture effetto carta, font retrò, pin-up, ecc..) ma anche se la grafica è facilmente inquadrabile, la creatività e il notevole impatto visivo - nonché emozionale- di quest’ultima rimane senz’altro fuori discussione.

Autore: Sara

Presenti Con questa premessa, un tuffo nel passato e nei gloriosi anni che furono

Lavora nel campo della grafica

non può che farci bene. E se un po’ di ispirazione può aiutarci a dare ai nostri progetti un

e dello sviluppo web e oltre

look & feel vagamente vintage, non resta che approfittarsene.

a collaborare con diverse web agency gestisce con successo la sua attività di freelance sotto il nome di mascara design. Come molti freelance si è abituata a gestire più ruoli, spaziando dalla grafica cartacea allo sviluppo del codice xhtml e css; nonostante questo la sua passione rimane, sempre e comunque, la grafica per il web.

www.mascaradesign.it

figura 1 ••

Link: http://bit.ly/gGqygj 1 http://bit.ly/c6hlrx

62 ·· your inspiration magazine

Intramontabile, romantico, creativo.

Ispirazione in vintage style.

figura 2 ••

figura 3 ••

figura 4 ••

figura 5 ••

figura 6 ••

figura 7 ••

2 http://bit.ly/UdU77

3 http://bit.ly/gC9W81

4 http://bit.ly/hcplAM

5 http://bit.ly/biDOcu

6 http://bit.ly/ceovgQ

7 http://bit.ly/2PgXJH

·· 63

showcase intramontabile, romantico, creativo. ispirazione in vintage style.

figura 8 ••

figura 9 ••

figura 10 ••

figura 11 ••

figura 12 ••

figura 13 ••

8 http://bit.ly/b7ttzK 9 http://bit.ly/9Z5hy 10 http://bit.ly/9ZFe5U 11 http://bit.ly/dHevuD 12 http://bit.ly/eWwlo6 13 http://bit.ly/gKvkXt

figura 14 ••

64 ·· your inspiration magazine

14 http://bit.ly/vOTk3

Non solo web design: advertising..

Un esperimento creativo molto interessante: advertising di tecnologie moderne (social network, prodotti Adobe, ecc.) in stile vintage.

figura 15 ••

figura 16 ••

figura 17 ••

figura 18 ••

a lt o c c a r la a t t u t i Ved p://bit.ly/dma7KO htt

15 http://bit.ly/o5n8g 16 http://bit.ly/gZsFrg 17 http://bit.ly/eN2itb 18 http://bit.ly/1NcHin

·· 65

showcase intramontabile, romantico, creativo. ispirazione in vintage style.

.. e biglietti da visita “Vintage is new modern”, cosi esordisce questo articolo1 che raccoglie una bella collezione di biglietti da visita in vintage style.

Per chi ama questo stile sarà amore a prima vista.

figura 19 ••

figura 20 ••

figura 21 ••

figura 22 ••

ta t u t Vedriaccolta O 7K la a m d y/ .l

bit / / : p htt

19 http://bit.ly/o5n8g 20 http://bit.ly/o5n8g 21 http://bit.ly/gZsFrg 22 http://bit.ly/eN2itb

figura 23 ••

66 ·· your inspiration magazine

23 http://bit.ly/1NcHin

1 http://bit.ly/dma7KO

COLLABORA CON YIM

Your Inspiration Magazine è aperto a chiunque desideri condividere le proprie conoscenze attraverso articoli tematici, tutorial, guide e quant’altro. Inoltre, sei invitato a far parte del team se vuoi: - Collaborare nelle fasi di progettazione e impaginazione del magazine; - Occuparti della revisione degli articoli; - Distribuire YIM nella tua zona, contribuendo cosi a far conoscere il progetto e a conferirgli la visibilità che merita.

- Contribuire alla ricerca di sponsor che, acquistando spazi pubblicitari all’interno della rivista, permettano di coprire i costi di produzione.

per saperne di piu: http://www.yourinspiration-magazine.com/collabora/

your inspiration web

Entra nella community di Your Inspiration Web http://forum.yourinspirationweb.com

il nostro forum aspetta solo te.

Forum di discussione su PHP, XHTML, CSS, JAVASCRIPT, CMS, GRAFICA e non solo Suggerimenti, ispirazione e migliorie per i tuoi progetti Feedback dalla community suoi tuoi lavori Aneddoti, curiosita’, di tutto un po’

·· web: www.yourispiration-magazine.com ·· ·· mail: info@yourispiration-magazine.com ·· hanno collaborato all’impaginazione del magazine:

ì

sandro

ales

giammaria

scarf antonino

è

far doriana

rica

e Fed

colombo

e sodano

ator salv