Ce l'ho quasi fatta. Nei ritagli di tempo, nei meeting noiosi 🙂 e nelle notti insonni ho messo insieme la struttura di quello che vorrei fosse la nuova faccia grafica di Borborigmi. Non è finita, mancano ancora alcuni dettagli e parecchie passate di cartavetro prima che a si possa dichiarare compiuta, ma penso sia a un livello tale da poter cominciare a utilizzarla, e a sentire che cosa ne pensano i lettori.
Come avevo accennato nel passato, ho voluto fare un template più bianco, più arioso, più largo, più leggibile. Le barre laterali sono diventate due, e il footer adesso ha spazio per un po' di informazioni in più. La paletta di colori che accompagnano il bianco e il nero usa un paio di sfumature di arancione, che - a differenza del violetto di prima - danno un tono più caldo alla pagina. Il carattere della testata si chiama FFF Tusj, che è una reinterpretazione manoscritta del Georgia - il carattere principale dei testi. La tagline del blog è scritta in Miserably Lose; titoli e titoletti sono in Lucida Grande, tranne che per il menù di navigazione in alto per cui ho usato il Trebuchet. Tecnicamente, il template è un child theme di Thematic, con un po' di PHP per un paio di cosettine e tutto il resto disegnato con CSS.
La novità principale, al di là della grafica, è la possibilità di rispondere esplicitamente a un commento. Vediamo se migliora le conversazioni.
Ecco cosa penso mi resti da fare per considerare il template finito:
- Colorare il disegno di me e Oliver nella testata. Non ho proprio avuto tempo, e aspettavo di definire la paletta di colori.
- Migliorare l'intestazione delle pagine di archivio delle categorie. Quella semplicissima di adesso non è granché.
- Cambiare/ricolorare i pallini delle liste nelle barre laterali, almeno per le liste di secondo livello.
- Aggiungere un'immagine sulla destra al footer, con link per tornare in alto. Pensavo di riprendere il disegno di Oliver.
- Aggiungere un bottone per i feed RSS. E il feed RSS nell'head del documento principale.
Migliorare la maschera di ricerca.Fatto 🙂Cambiare la favicon (usando per esempio ancora il disegno della testata, o la "B" nel carattere del titolo).Fatto (anche se l'immagine che ho usato - il mio gravatar attuale - non è proprio adattissima. Ci ritornerò).Aggiornare un po' widget sulle barre laterali, verificare che la formattazione tenga.Fatto, più o meno. E messo a posto anche il footer.Aggiornare le pagine nel menù in alto (per esempio, aggiungere esplicitamente i "Contatti").Fatto 🙂- Testare con vari browser (per ho ora ho provato con Firefox, Safari e Chrome, sembra andare tutto bene, tranne un problemino con gli emoticon in Chrome).
Che ne dite? Vi piace?
Elisa dice
Si, mi piace davvero molto!
Non vedo l'ora di ammirare il template finito in tutti i dettagli.
Ciao!
Gianluigi dice
Bellissimo!
Io, però, i disegni di te e Oliver non li colorerei: già in bianco e nero rendono bene!
Gio dice
concordo sul B/N
peppe dice
Funzia pure su Opera e mi pare ottimo
Stefano dice
Davvero niente male! 🙂 I disegni di te e Oliver anche in bianco non sono male, ma un po' di colore, magari riprendendo l'arancione, forse li farebbe risaltare di più.
L'unica cosa che inizialmente mi ha un po' spiazzato (anche se spiazzato è una parola grossa) sono le due barre laterali, entrambe a destra. Ma pensandoci, metterne una a sinistra e l'altra a destra, non so quanto senso possa avere.
Mi chiedevo come si fa a rispondere direttamente ad un commento?
Marco dice
Le barre restano a destra, è una scelta precisa che mi garba, mentre il testo attorniato da barre a destra e sinistra non mi piaceva proprio.
Si risponde a un commento cliccando su "Rispondi" (è attivo da 30 secondi!). Per adesso i commenti "nidificati" permettono fino a 5 livelli di risposta (poi graficamente diventa illeggibile secondo me), vediamo come va.
Stefano dice
Ok ora lo vedo anch'io!
emilio dice
bello mi piace molto...che ci puoi dire sul tuo futuro professionale..
Marco dice
Al volo: il mio contratto al CERN è stato prolungato fino a fine Agosto, e un laboratorio della collaborazione di cui faccio parte mi ha proposto un contratto temporaneo di un paio d'anni a partire da Settembre nel caso gli altri concorsi per posizioni più permanenti a cui sto partecipando non debbano andare bene. Insomma, non resterò sulla strada 🙂 Appena le cose si chiarificheranno un po' non mancherò di aggiornarvi più seriamente.
emilio dice
waooooooooo sono felice che tu possa restare ..lo speravo tanto ....ciaoo
GIGI dice
Ottimo, Marco! In bocca al lupo, ma sono certo che non resterai per strada.
Emanuele Balboni dice
Ma tu guarda, ho quasi creduto che mi fossero impazziti i segnalibri e di essere finito in altro sito! E dire che lo avevi pure annunciato.
Molto bello complimenti, quasi sul leitmotiv "less is more" (parlando ovviamente di pesantezza grafica e non di contenuti!). Approvo senza riserve la risposta diretta ai commenti (sì, forse oltre 5 diventa illeggibile, esperimento?), il layout della navigazione nelle categorie (ma concordo con il tuo commento sui titoli: si potrebbe forse usare lo stesso del titolo del blog?), e poi... il testo giustificato! (non rammento: nella vecchia versione non era così, giusto?)
(bene e ora la pianto di far uso smodato di parentesi; e poi perché terminano tutte con una domanda?)
Non so se preferisco te e Oliver colorati o in bianco e nero, così mi piace già molto.
Riguardo le due barre a destra hai già risposto, ma sono l'unico elemento che mi aveva lasciato appena perplesso (sarà il testo bandiera a sinistra?).
Due micropulci: su firefox 3.6 per linux il campo per la ricerca è tagliato sulla destra, e i colori delle linguette di "home", "quarta di copertina", etc... sono visibili solo se osservo lo schermo da angolazioni improponibili (questo sul mio portatilino, perché dallo schermo del pc di casa neanche mettendomi a testa in giù) 😀
Marco dice
Potrei aumentare il livello di nidificazione dei commenti fino a 10, ma temo un disastro di leggibilità dell'indentazione crescente. Vediamo come evolve.
Sulle pagine delle categorie potrei tentare di usare il font della testara, ma siccome non si tratta di un font direttamente adatto al web dovrei usare un po' di trucchi. Ci provo appena ho tempo (ma tu, ti intendi di CSS?)
Nella versione precedente il testo non era giustifica, e ho esitato a lungo. Non sono sicuro di capire: ti piace o no?
I colori sono quello che sono, la resa dipende dalla qualità dello schermo. Se vi lamentate in molti scurirò il menu (ovviamente ne ho provati diversi).
Emanuele dice
Beh, se vuoi mi metto a fare 3 risposte alla tua risposta e vediamo che succede 😀
CSS? No, non me ne intendo. Ma Betta sì, credo. Se vuoi chiedo.
Certo che mi piace il testo giustificato: bello, ordinato, leggibile (soprattutto se ci si limita a - quanto? - 100 caratteri per riga).
Ehi, non offendiamo! Gli schermi son quello che sono perché lo stipendio è quello che è, e con quest'ultimo ci devo pure mangiare, mentre a provare a mangiare lo schermo uno rischia di restarci (e non ti dico che saporaccio i cristalli liquidi!) 😛
Stefano dice
Per quanto riguarda i colori a me sembra di vederli, o meglio, vedo che la barra superiore (quella che contiene Home, Quarta di copertina, ecc...) è beige.
I commenti nidificati... sinceramente credo che un po' in leggibilità si perda anche con un massimo di 5 nidificazioni.
Il problema è che se si utilizzano i feed, l'ordine cronologico con cui compaiono non fa capire bene a che messaggio ci si riferisce; mentre sul blog basta scorrere la pagina, ma anche qui c'è il rischio di perdersi qualcosa.
Emanuele Balboni dice
Ehm, con "Migliorare la maschera di ricerca" intendevi forse "evitare che fosse tagliata"? Chiedo umilmente scusa...
Marco dice
yep 🙂
My_May dice
Bello si, ma non trovo l'articolo nuovo (l'ultimo) e quello precedente all'ultimo ecc.
Mi sembra che prima ci fosse una scaletta di articoli dal più nuovo al più vecchio
Io vedo invece in alto: Inizia da qui-Cerca nel sito
scendendo:
Chiacchiere in corso
Ripescati (a caso) dalle viscere
Qui si parla di...
Argomenti
e i nuovi articoli dove sono?In pratica se ci fosse un articolo non ancora commentato non me ne accorgerei.
Marco dice
In effetti ho tolto il widget degli ultimi dieci articoli. Mi costa poco rimetterlo, anche se non sono convinto che serva alla navigazione.
Claudio dice
Bello, mi piace 😀
È molto più personale adesso! 😀
L'unica cosa è la nuvola dei tag in Flash: è un po' pesantuccia, consuma molta CPU, perlomeno su Linux.
Marco dice
Capisco benissimo 🙂 E in effetti è solo un bel giochino, mi chiedo se qualcuno la usi per davvero. Ho provato a sostituirla con una tag cloud più tradizionale, ma non sono sicuro che mi piaccia.
Belinde dice
Altra cosa da fare, figa e con relativamente poco sforzo: invece di dire alla gente che font scaricarsi, usare Font Squirrel e farglieli usare direttamente via CSS: http://www.fontsquirrel.com/fontface/generator
my 2 cents... 😉
Marco dice
@Belinde: ci avevo pensato, e poi ho abbandonato l'idea per mancanza di tempo. I font inconsueti sono solo nella testata, che è un;immagine, mentre tutto il resto è basato su font tradizionali, con adeguati rimpiazzi definiti nel CSS. Ma magari prima o poi ci giocherò (o trovo qualche volenteroso che ci giochi per me).
Jonathan dice
Bello mi piace, anche i colori e i font scelti… mi permetto di darti un solo consiglio: l'immagine di te e oliver… o di oliver e te 😉 la ritoccherei con i bordi non netti come ora ma con l'effetto schizzato che richiama il font del titolo. Per quanto riguarda la colorazione di voi due direi contorni neri a tratti schizzati e un leggero tratteggio arancione nei chiari del maglione e basta e tratteggi neri nelle ombre.
In effetti un po di arancione nel titolo manca… in alternativa al maglione, potresti fare una lettera arancione, come già ci avevi fatto vedere.
5 annidamenti son già molti secondo me, 10 non hanno senso… anche dal puntoni vista logico è poi difficile capire la gerarchia delle risposte
Anche su iPad il campo di ricerca e il suo contenuto fuoriescono a d eta dello schermo.
Marco dice
Mi sa che per il disegno di me e Oliver farò un concorso pubblico di colorazione 🙂
lallo dice
Bello! Complimenti! Io sono un conservatore e di solito le novità mi infastidiscono ma questa l'ho digerita immediatamente.
Carlo dice
Bravo. Complimenti per la passione che ci metti.
E' proprio un bel blog da leggere.
Stephan dice
E' molto più "caldo" ora, ma trovavo più gradevole lo schema colori di prima (qualcuno doveva lamentarsi! hehe) in particolare avere il corpo dell'articolo su uno sfondo di colore differente dal resto, "staccava" un po'.
Ma sicuramente anche questione di abitudine.
My_May dice
Per lo meno ora si legge bene e chiaro la tipologia del blog:
BORBORIGMI (rumori gastrici) di un FISICO RENITENTE (cioè di un fisico che non si piega alla volontà altrui ed emette piccoli "rumori gastrici" appena qualcuno osa piegare la sua volontà... o per lo meno questa mi sembra la traduzione letterale).
Stephan dice
Mi correggo, ora leggo da un'altro schermo molto piu grande e luminoso, mi piace
Marco dice
@Stephan: sono contento che ti piaccia, perché il cambiamento principale al quale puntavo era proprio leberarmi delle barre laterali, e lasciare il testo libero su uno sfondo bianco totale. Ma in parte posso capire lo spaesamento, e infatti avevo anche immaginato e tentato una riga centrale che separasse/definisse la colonna del testo da quelle laterali. Magari la rimetto su, e vediamo le reazioni.
Andrea dice
Ciao Marco,
devo dire che il rinnovamento del sito è veramente bello (anche se solo agli inizi)!!! Comunque io ti scrivo dei suggerimenti:
- per quanto riguarda la colorazione di te e Oliver propongo colori naturali, in stile 'matita' come la scritta "borborigmi" ma meno fitta, senza rispettare i margini di contorno (tanto per dire: stampa l'immagine e dalla per qualche minuto in mano alla 'sofisticata macchina quantistica'... );
- nella versione precedente del sito ero afffezionatissimo alla sfera rotante in cui comparivano tutti i topic trattati, qui trasformatain una lista normalissimia (come mai???);
- infine, ti proporrei di colorare lo sfondo (tutto bianco non mi entusiasma): magari solo le colonne laterali, lsciando bianca la colonna centrale del testo;
P.S. ho visto che hai aggiunto la moderazione... (è forse dovuto a qualche commento/i di post recente...)
ciao
Marco dice
@Andrea: ho tolot la sfera rotante sostituendola con una tag cloud più tradizionale perché la precedente era basata su Flash, che è notoriamente pesante in termini di CPU (qualcuno si è lamentato) e non visibile da tutti i dispositivi. ma concordo sul fatto che la cloud attuale sia poveretta, vedrò di migliorare. Invece lo sfondo resta tutto bianco, come scrivevo altrove era proprio quello che cercavo. Al limite metterò una righina a separare la colonna del testo dalle barre laterali.
Sulla moderazione: c'è sempre stata, molto poco invasiva. Di fatto, filtro solo i commenti che hanno un link, principalmente per frenare lo spam che passa gli altri filtri, e evitare brutti scherzi. Tutti il resto va su in automatico.
Andrea dice
Grazie per la risposta Marco: ho un'altro dubbio.
Considerando il fatto che sei solito (spero sempre di più) proporre quiz ricompensa ai lettori di questo blog, come farai a stabilire un criterio di identificazione (prima i post erano numerati...)??? Non vorrei che la nuova impaginazione ci privi di tutto questo.
Ciao
Marco dice
@Andrea: non starai per caso suggerendo che leggi questo blog solo per le svendite occasionali? 🙂
Andrea dice
Rispondo solo per testare i sottolivelli di risposte...: se vai a scarabellare vecchi articoli, troverai la mia presenza ancora prima che tu avessi l'idea dei concorsi a premi, e se ricerchi tra gli articoli dei concorsi a premi la mia traccia si limita a uno soltanto di questi... il fatto che tu mi ritenga un fan dei saldi mi rattrista molto: sono il connubio Marco-fisica-CERN che mi portano a leggere questo blog 🙂
mara dice
Molto bello, complimenti!
Ottima la scelta dei colori per i caratteri... il disegno lo trovo perfetto in B/N, invece. Per rimanere essenziali.
Michele dice
il template è molto ben fatto, vorrei solo suggerire di lasciare un pò di margine a sinistra della pagina per migliorare la leggibilità.
Anche io trovo che i disegni in B/N siano perfetti!
Marco dice
@Michele: il margine a sinistra è una delle cose che mi ha creato più problemi con gli allineamenti. Prometto che ci guardo, ma i miei poteri con CSS sono limitati 🙂
My_May dice
Marco, secondo me c'è un problema.
Quando io "rispondo" la risposta non è visualizzata come ultimo post ma è visualizzato subito dietro l'intervento "in risposta". Secondo me non facilita la lettura. ciao
Marco dice
@My_may: non è un problema, è una feature 🙂 Si tratta proprio di quei commenti annidati di cui si parlava qui sopra. Puoi scegliere se rispondere a un commento specifico (cliccando su "Rispondi" in calce al commento) o aggiungere un commento più generale con la maschera in basso. Alcuni sembrano contenti di questa innovazione, altri - come te - la trovano confusionaria. Penso che la lascerò attivata ancora per qualche settimana, e poi magari facciamo un sondaggio.