Buon Anno 2010 a tutti!

Anche se con alcune ore di ritardo ci tenevo a farvi i miei più sinceri auguri.

Gli sfondi desktop sono un ottima fonte di ispirazione, tuttavia se si utilizza un certo wallpaper per lungo tempo diventa difficile trarne ispirazione da esso.

Sfondo desktop di gennaio 2010

Siamo al primo del mese dell’anno 2010: Gennaio per molti sarà il ritorno alla normalità con attività di ogni genere.

Il sito Smashing Magazine propone una raccolta di  Wallpapers per PC ispirati al solo mese di Gennaio con la possibilità di poter scegliere diverse risoluzioni per il download degli sfondi.

Ogni sfondo può essere scaricato con o senza il calendario del mese di Gennaio e tutti risultano davvero ben fatti, da designer di tutto il mondo.

Vediamo subito alcuni esempi di sfondi invernali ( anche HD) per computer:

© 2008 Ziogeek.com

Google Labs ha introdotto recentemente lo strumento Browser Size che ci permette di analizzare le parti di un sito più visualizzate e visibili dagli utenti.

Browser Size, come si usa?

Questo strumento è stato utile alla stessa Google quando recentemente ha spostato di qualche pixel più in alto il bottone per scaricare il software di Google Earth e si è vista incrementare il numero di download dovuto al fatto che in precedenza alcuni utenti non riuscivano a vedere il bottone.

Semplici problematiche come queste non sono da sottovalutare sopratutto se si lavora nel campo del Web Marketing o se si è un SEO.

Il servizio consente di inserire in alto a sinistra l’indirizzo (l’URL) del proprio sito web o blog  e succesivamente cominciare ad analizzare il grafo visuale trasparente che viene ridimensionato sopra la Home del sito/blog.

IL grafo visuale indica in percentuale il numero di visitatori che riesce a vedere quella parte del sito senza dover scrollare la pagina. Se quindi il webmaster inserisce materiale e script  importante in zone dove la percentuale varia dal 10 al 50% è molto probabile che molti visitatori non abbiano la possibilità di visionare ad una prima occhiata quel bottone o quel post preciso.

Il funzionamento del servizio si avvale di un campione di visitatori provenineti dal motore di ricerca e analizza altezza e lunghezza del browser utilizzato dagli utenti in questione.

© 2008 Ziogeek.com

Da oggi Ziogeek ha l’onore di pubblicare alcuni articoli sul WebDesign realizzati da Tommaso Baldovino. Tommaso cura TomStardust, un blog italiano autorevole sul Web Design. In questo post Tommaso ci da delle indicazioni su come fare a Migliorare l’Usabilità di un sito.

Navigando in rete ho spesso la sensazione che l’usabilità sia spesso trascurata. E’ davvero inutile prestare attenzione all’esperienza dei propri visitatori? Ovviamente no.

Quelle che seguono sono indicazioni il più possibile generiche per migliorare l’usabilità del vostro sito. Non diventerà usabile semplicemente seguendo questi 9 punti, ma penso siano un buon punto di partenza.

1. Nome del sito

Il titolo del sito deve essere chiaro e visibile in ogni pagina, così come il logo (se esiste). E’ consuetudine inoltre che l’area occupata da questi elementi abbia un link alla homepage: è frustrante tentare di cliccare un elemento e scoprire che non porta da nessuna parte.

2. Tagline / Sottotitolo

La tagline è una breve frase che comunica velocemente lo scopo del sito che si sta visitando. Difficile farne a meno: che si tratti di un portfolio, di un blog o di un sito aziendale, è bene che il visitatore capisca subito l’argomento trattato.

3. Titolo della pagina

E’ essenziale che ogni pagina sia identificata in maniera univoca. Il titolo della pagina dovrebbe essere presente anche tra i tag <title></title>: questo permetterà di riconoscere un sito anche se sono aperte più finestre (o più tab) del browser.

4. Breadcrumb / Path / Briciole di pane

E’ il modo migliore per far capire ad un visitatore dove si trova. In italiano il breadcrumb viene chiamato anche “briciole di pane”, e la sua funzione è evidente. Se avete un sito su più livelli non potete farne a meno.

5. Navigazione principale

La navigazione deve essere chiara e coerente tra tutte le sezioni. Non cambiate mai posizione ad un menu, è bene che ogni visitatore sia in grado di orientarsi. Un’eccezione a questa regola è rappresentata dai menu secondari, che possono apparire o meno a seconda della pagina e della presenza di sottosezioni.

Nella navigazione è importante anche contrassegnare la pagina corrente, se presente nei menu, magari rendendola anche non cliccabile.

6. Box di Ricerca

Anche la ricerca è un metodo di navigazione. In certi casi è il modo più veloce per raggiungere informazioni presenti sul vostro sito, magari non più recenti. Se decidete di implementare la ricerca, fate in modo che il box sia visibile e presente in ogni pagina.

7. Link testuali

Uno dei problemi più fastidiosi è trovare in un sito dei link di testo che non appaiono come tali. Se i collegamenti si confondono con il testo normale, è il caso di modificarne l’aspetto. Trovate maggiori informazioni in un articolo sui link che ho scritto qualche settimana fa.

8. Colori e grafica

Così come per la navigazione, anche la grafica deve mantenere una sua coerenza tra le varie sezioni di un sito. E’ bene che i colori utilizzati non cambino tra le varie pagine per non confondere le idee. E’ possibile distinguere sezioni diverse con colori differenti, ma è una soluzione rischiosa se applicata male, spesso è meglio non rischiare.

9. Avvisi

Se sul sito compaiono degli avvisi, è bene che la loro funzione sia chiara. Possono essere contrassegnati da un’icona e da colori differenti, tenendo presenti alcune consuetudini:

• il rosso indica un errore o un avviso importante
• il verde una conferma
• il giallo un avviso generico

E’ bene utilizzare delle notifiche di questo tipo quando vengono eseguite azioni importanti, come una procedura di acquisto. L’utente deve capire senza problemi quello che sta facendo e quali azioni può compiere.

In conclusione

Non è possibile imparare in poco tempo a realizzare un sito usabile, ma avere una checklist da controllare spero possa esservi utile. Tenete comunque presente che queste raccomandazioni non sono universali, potrebbero esserci delle eccezioni a seconda del sito.

Articolo a cura di Tommaso Baldovino, TomStardust.com

© 2008 Ziogeek.com

Ampliamo il numero patterns a disposizione all’interno di Photoshop con sei archivi assortiti che vi permetteranno di personalizzare i vostri lavori. Vi basta scaricare il pacchetto desiderato e aggiungere i pattern all’interno del vostro Photoshop per averli subito a disposizione.

Tech & Screentone Photoshop Patt

L’archivio è disponibile a questo indirizzo (12 Kb)

Photoshop Patterns 2

L’archivio è disponibile a questo indirizzo (352 Kb)

TipClique Photoshop Patterns

L’archivio è disponibile a questo indirizzo (2,8 Mb)

Assorted

L’archivio è disponibile a questo indirizzo (1,7 Mb)

Web 2.0 pattern collection

L’archivio è disponibile a questo indirizzo (181 Kb)

Trendy Patterns

L’archivio è disponibile a questo indirizzo (390 Kb)

© 2008 Ziogeek.com

Aggiungiamo un tocco floreale ai nostri pennelli di Photoshop con sei brushes floreali che vi permetteranno di personalizzare e rendere unici i vostri lavori. Vi basta scaricare il pacchetto desiderato e avviarlo all’interno del vostro Photoshop per avere subito a disposizione i nuovi brushes.

Floral Design Brushes

Il pacchetto è disponibile a questo indirizzo (380 Kb)

Flowers11 – PS Brushes

Il pacchetto è disponibile a questo indirizzo (2,4 Mb)

Hand Drawn Floral Pattern Brushe

Il pacchetto è disponibile a questo indirizzo (911 Kb)

21 Flowers brushes

Il pacchetto è disponibile a questo indirizzo (808 Kb)

Foliage Sketches Brushes

Il pacchetto è disponibile a questo indirizzo (5 Mb)

Stilok summerfield

Il pacchetto è disponibile a questo indirizzo (140 Kb)

Spero vi siano piaciuti, fatemi sapere il vostro parere.

© 2008 Ziogeek.com

E’ stata presenta la nuova galleria di template gratuiti per la piattaforma di Blogger.com.
Templates Blogger, pretende essere un punto di incontro per tutte le persone che hanno un blog in blogspot e vogliono personalizzare il proprio blog. Attualmente ci sono circa 200 templates, entro fine anno si spera di arrivare ai 500 templates.Ogni templates contiene:

• Uno screenshot per visualizzare il disegno.
• Un link per la demos online.
• Links del autore o designer del template.
• Link per il download in .zip, che contiene un tutorial per l’installazione.

Se sei un designer e hai templates per blogger, è possibile inviarli a questo indirizzo.
Per ricevere gli aggiornamenti degli utlimi template inseriti è possibile iscriversi al Feed RSS.

© 2008 Ziogeek.com

Perché spendere centinaia di Euro da un Webdesigner quando ci sono siti che offrono layout professionali gratis?

Dal 2000 gli utenti di FreeLayouts.com offrono gratuitamente migliaia di modelli grafici per siti web, account MySpace e Blog Wordpress e Blogger, che non hanno nulla da invidiare a quelli realizzati dai designer professionisti.

Nella vasta collezione di questo sito, potrete trovare layout eleganti di varie colorazioni, sia in XHTML/Css sia in Flash, scaricabili e modificabili liberamente.
Trovare un layout adatto alle proprie esigenze nel database di questo sito è davvero facile e sopratutto veloce, grazie alle categorie, che si dividono in colori e in numero di colonne.  In più è possibile leggere i commenti o vedere il giudizio di altri visitatori sui singoli modelli.

Inoltre da qualche anno, FreeLayouts accetta soltanto templates convalidati secondo il W3C, l’organizzazione che definisce gli standard delle pagine web per renderle accessibili e ben strutturate.

FreeLayouts però non offre un servizio di hosting e una gestione dei contenuti, perciò è richiesta una minima conoscenza del Html per personalizzare le pagine e uno spazio web, magari gratuito come 000WebHost per mettere online le proprie pagine.

© 2008 Ziogeek.com

I nuovi siti sempre di più abbandonano le tabelle per avere un impaginazione più personalizzabile tramite CSS. Online sono disponibili molti esempi di layout possibili, oggi vi presento una risorsa web che ne mette a disposizione più di 40 pronti per il download, gratuitamente.

Basta accedere a questa pagina e selezionare la figura del layout corrispondente scelto. Subito verrà presentato l’archivio da scaricare contenente l’esempio del layout scelto pronto per essere modificato. Si tratta i una risorsa molto utili soprattutto per chi è alle prime armi e vuole capire come si realizzano layout con i CSS.

© 2008 Ziogeek.com

Tutti conoscono Wordpress, la piattaforma di blog che anche Ziogeek usa. Però grazie a plugin sempre più avanzati e temi ben ottimizzati e personalizzati, si possono realizzare siti ad Hoc come ad esempio Contact Manager e  JobPress.

Vediamo come fare per realizzare questi siti:

Contact Manager

Tutto il materiale che serve, è un tema, gratuito, e alcuni plugin pensati ad hoc. Per tutto il materiale e le istruzioni, ecco il tutorial.

Anteprima del tema

JobPress

Per questo tipo di sito invece la questione si fa un po’ più difficile. Il motivo è che il tema è a pagamento, 99$. A questo indirizzo trovate tutte le informazioni.

Anteprima del tema

[Via]

© 2008 Ziogeek.com

Si tratta di icone veramente ben fatte pensate per le vostre web application oppure per personalizzare i vostri siti web o pannelli di amministrazione personalizzati. Ci sono icone per molte funzioni: video, rss, twtter, tag, post, utenti, commenti, podcast e tanti altri.

Ecco il download del pacchetto: PNG files + PSD Sources (3.4 Mb).

Potete inoltre vedere un anteprima di tutte le icone presenti

© 2008 Ziogeek.com