Trvl, un nuovo tema per tumblelog

trvl-home

Un altro giovedì è appena passato e questo significa che WordPress.com può aver rilasciato un nuovo template che si aggiunge alla collezione. Così è stato e oggi quindi siamo qui a parlare di Trvl un tema mimimalista disegnato da Danny Cohen, perfetto per un blog personale, meglio se un tumblelog.

Formato dei Post

Trvl supporta otto formati di post tra quelli previsti da WordPress – Aside (o Digressioni), Gallery, Immagine, Citazione, Link, Stato, Audio e Video – oltre quello standard, permettendoci così ampia libertà di argomenti. Come i vari formati si visualizzano nel tema è possibile vederlo nella classica pagina demo.

Widget

Di default, Trvl sembra non avere alcuna area widget. Invece ne una, posizionata nel footer della pagina, disabilitata (diciamo). Per attivarla dovremo inserire una o più delle nostre widget preferite nell’area altrimenti vuota recandoci, come sempre, nella Bacheca e quindi Aspetto > Widget.

Menù Personalizzato

Trvl come abbiam visto dallo screenshot e dalla sua pagina demo, è un tema per blog che mette al centro di tutto i nostri post. Letteralmente. A riprova di ciò vediamo che, adifferenza di quasi tutti gli altri temi esistenti sulla piattaforma, l’area di visualizzazione del menù di navigazione è riservata alla zona tra la fine del post e quella riservata alle widget (se attivata).

Testata

Quello che può davvero fare la differenza con questo genere di tema è l’adozione di un’immagine personalizzata in testata ( custom header image). Trvl lavora al meglio se quest’ultima misura 950 pixel in larghezza ed almeno 250 pixel in altezza.

Altre speficiche in breve (tutte le misure sono espresse in pixel):

  1. La larghezza della colonna principale, riservata ai post, è larga 690.
  2. La dimensione raccomandata per l’immagine di testata è di  950 per 250.

Bueno: un esempio di personalizzazione

Ciao a tutti,

il tempo è tiranno e non si riesce a star dietro alle cose cui si tengono, specie se non sono essenziali nella vita quotidiana (leggasi salute e lavoro). Per fortuna la voglia di scrivere e parlare delle cose che ci piacciono non manca ed eccomi qui a tradurre un (lungo) articolo d’esempio pubblicato un mese fa dai tipi di WordPress.com in merito alla personalizzazione del proprio blog, fornendo un caso d’uso reale …

Penso sia un’esigenza comune quella di voler personalizzare il template del proprio sito/blog in modo che ci calzi a pennello, come un abito su misura, e che rispecchi in un certo qual modo il nostro gusto estetico e la nostra personalità. Oggi vedremo come è possibile personalizzare quello che oggi è il terzo tema più popolare su WordPress.com e, nonostante ciò, costruire qualcosa di completamente personale.

Diciamo ciao al blog Mi Piace Kate:

Mi Piace Kate

Kate è una graphic designer, come si intuisce un’amante dei gatti e del fai da te che ha scelto di pubblicare le proprie cose utilizzado il tema gratuito Bueno. Abbiamo scelto di parlare del suo blog perchè costituisce un fantastico esemoio di come l’utilizzo di alcune immagini personali e l’utilizzo del Custom Design upgrade (per un costo di 30$) possono cambiare un tema gratuito in uno dal look super-professionale e unico.

Ma bando alle ciance e guardiamo l’immagine seguente che compara la pagina standard dell’home page del tema Bueno con quella realizzata da Kate. Impressionante, vero ?

Bueno Theme

Solo prestando attenzione al cerchio contenente la data di pubblicazione del tema (rosa nella versione originale, chartreuse nella versione di Kate) si capisce quale sia il tema alla base, il fatto che ci sia Bueno a presentare i vari contenuti. Come ci è riuscita? Ecco le sue non-così-segrete tecniche….

Header personalizzato

Kate ha impostato il look & feel del suo sito direttamente nella testata della pagina, usando un’immagine per il custom header da lei realizzata che riesce ad impostare il tono emozionale del sito, e quindi del suo estensore, mediante un attento uso di forme e colori …

custom header

L’utilizzo di un’immagine personale per l’header del tema non rende necessario l’acquisto di un upgrade, ma è una opzione standard per Bueno (e moltissimi altri temi sulla piattaforma WordPress.com … 152, per essere precisi).

Starei pensando, “Ma io non sono un graphic designer!”? Beh, la notizia è che tu non devi necessariamente esserlo! Basta essere creativi e utilizzare, ad esempio, il tuo word processor preferito e utilizzarle le proprietà di elaborazione del testo con effetti e forme e poi salvare il tutto come un’immagine. Oppure semplicemente utilizzare un’immagine dal significato speciale … Voilà! Personalità al volo…

Colori personalizzati

Kate ha quindi preso i colori scelti per l’immagine dell’header e li ha (sapientemente) distribuiti all’interno delle varie componenti del sito, dai cerchi contenenti le date dei post alle linee di separazione sui titoli dei widget usati. Questo le è stato possibile acquistando il Custom Design upgrade, che le ha permesso di usare esattamente i colori che voleva ed applicare le modifiche al file CSS secondo il suo gradimento.

Se il tema generale di Bueno, sul rosa, non è di tuo gradimento non c’è problema … Bueno viene offerto con sette schemi di colore differenti, che possono essere scelti ed applicati con un paio di click andando nell’apposita sezione della Bacheca, quindi Aspetto e dunque selezionando le Opzioni del Tema. Altrimet puoi utilizzare il Custom Design upgrade to change the colors of fonts and backgrounds even more, senza utilizzare i CSS. (Ma se vuoi affondare i tuoi denti nel vasto menù dei CSS qui troverai un’antipasto).

Font personalizzate

Non sono i colori possono essere modificati acquistando il Custom Design upgrade. Potrai modificare anche le font del tema sceltom andando così a modificare drasticamente l’effeto del tema di partenza. Sul suo “Mi Piace Kate”, Kate ha scelto di utilizzare la classica font serif Ambroise per l’header ed i titoli dei post, e l’altamente leggebile Museo Sans per il contenuto dei post. A questi ha affiancato, infine, l’elegante Raleway per i titoli ed i menù opzione. Se l’argomento dell’uso di font perosnalizzate ti interessa, puoi sempre consultare l’articolo (in inglese) su come altri blogger li utilizzano ed imparare come ottenerne un’anteprima per il tuo sito.

Mi Piace Kate - Blogroll example

Divertirsi con le widget di testo

Kate non ha avuto paura di andare a guardare ‘sotto il cofano’ e manipolare i vari widget a disposizione in modo che apparissero esattamente come voleva. Guarda con attenzione come ha stilizzato il tuo blogroll. Lo ha cambiato dal semplice elenco puntuale una riga per sito ad un blocco compatto ma allo stesso tempo elegante e ben leggibile.

Come ci è riuscita? Semplicemente utilizzato un Text widget piuttosto che il Links widget comunemente utilizzato da tutti per il proprio blogroll. Poiché è possibile inserire codice HTML standard in una widget testuale, è riucita ad inserire l’elenco dei siti da lei seguiti separandoli elegantemente cone una doppia backslash. L’uso di font personalizzate, così come i colori, ha fatto il resto.

mi piace kate widget

Kate ha poi dato un’altra forte personalizzazione alla sidebar del suo blog utilizzado una delle widget preferite dai ragazzi di Automattic ma poco utilizzate tra gli utenti. Una comune widget di testo con un po’ di testo per la parte “about” dell’autrice. Anche qui l’utilizzo di font, colori e testo riesce a dare al visitatore informazioni e contesto rinforzando l’esperienza di navigazione del “brand” Mi Piace Kate brand.

Si è anche preoccupata di personalizzare i titoli delle widget utilizzate, quindi “Links” divente “I Like to Look,” e “About” diventa “Oh Hello.” Non perdete quindi occasione di personalizzare ogni più piccolo dettaglio del tuo blog!

Come si vede, alla fine, a Kate è bastato un po’ di buon gusto, pazienza ed attenzione nell’esaminare le possibilità offerte da Bueno e dai vari upgrade della piattaforma WordPress.com per esprimere la propria personalità e gusto estetico.

Nei prossimi giorni spero di riuscire a tradurvi un’altro paio di interessanti articoli sulla personalizzazione dei template WordPress!

 

WordPress.com diventa adattivo

Ciao a tutti,
dopo un piccolo periodo di pausa cerchiamo di rimetterci in carreggiata illustrando le ultime novità di casa WordPress.com.

Iniziamo dalla più eclatante, da oggi 17 gennaio 2013 il layout del sito WordPress.com diventa completamente `adattivo` o, per dirla come gli inglesi responsive.

Vediamo assieme il comunicato ufficiale (tradotto).

responsive-wordpressdotcom

Dalla scorsa settimana hanno cominciato ad apparire agli utenti alcuni cambiamenti gratifi per la home page WordPress.com e per  il WordPress.com Reader. Il lavoro si è concentato in due aree: rendere la navigazione di WordPress.com nella sua interezza un’ottima esperienza sul tuo dispositivo mobile e far si che come piattaforma venisse fatto tutto il possibile per mettere in evidenza tutte le bellissime foto ed i bellissimi video che vengono caricati dagli utenti.

Usare WordPress.com ovunque

Con oltre un miliardo di smartphone attivi nel mondo è stato appurato che renderlo una piattaforma esteticamente piacevole da navigare con qualunque dispositivo. Se effettuiamo l’accesso potremo verificare come è tutto cambiato, in funzione di questo obiettivo progettuale.

Controllare le nostre statistiche, scrivere un nuovo articolo, leggere le ultime novità nella sezione Freshly Pressed, o controllare la pagina delle notifiche attraverso il nostro web browser è ora un’esperienza d’uso molto più piacevole che in passato, specialmente su smartphone e tablet.

Beautiful Media

I cambiamenti più importanti, avrete notato, hanno coinvolto sopratutto la pagina del WordPress.com Reader. Foto sempre più belle e curate vengono pubblicate dagli utenti della piattaforma ed i ragazzi di Automattic volevano fare un lavoro migliore che in passato per far si che i lettori dei vostri blog potessero visualizzarle nel miglior modo possibile. Se nel nostro articolo inseriremo un’immagine in evidenza (detta anche `<tt>featured image</tt>`),  o un’immagine larga almeno 595px, questa verrò posta in evidenza in cima al titolo ed al contenuto del post all’interno della pagina Reader di ciascun utente.

uno screenshot della nuova visualizzazione delle immagini su WordPress.com
uno screenshot della nuova visualizzazione delle immagini su WordPress.com

Usare immagini dalla forte personalità riuscirà a porre un accento particolare al vostro articolo, in mezzo a tutti gli altri. Il team Automattic ha apprezzato molto poter godere visivamente di queste immagini così messe in risalto, e sperano di incontrare il favore del pubblico.

Se invece utilizzeremo immagini dalla risoluzione inferiore queste non verranno poste “in testa” all’articolo nel Reader, ma correttamente riportate all’interno dello stesso, così come da noi deciso al momento della scrittura dello stesso. Nessun contenuto viene perso.

Lo stesso principio si applica, a grandi linee, per i video e le gallery. Nel secondo caso verrà messo in evidenza ai lettori che la gallery è composta da un ‘tot’ di immagini ed un link per la sua migliore visualizzazione.

Nei prossimi due mesi sono programmate le apparizioni di diverse nuove funzionalità nel Reader, quindi prestate attenzione ai piccoli e grandi cambiamenti e non mancate di segnalare le vostre impressioni al team di sviluppo!