Crea pubblicazioni di grande impatto visivo

Scopri le nuove potenti opzioni di personalizzazione su Medium

Monica Cainarca
7 min readApr 7, 2016

I consigli di Elizabeth Tobey, responsabile del Community Management di Medium, per sfruttare al meglio le nuove funzionalità appena introdotte.

A partire da oggi, le opzioni di personalizzazione per le pubblicazioni sono aumentate in modo esponenziale.

Non tutti sono esperti di design (e molti non hanno nemmeno un occhio particolare per il design – parlo con cognizione di causa), ma chiunque può dare alla propria pubblicazione su Medium un look unico e professionale tenendo a mente alcuni semplici principi guida.

Migrazione

Le pubblicazioni si possono creare da zero su Medium o a partire da contenuti migrati da un’altra piattaforma. Il nostro Help Center (in inglese, per ora) offre una guida che ti aiuterà a migrare i tuoi contenuti su Medium (e il tuo dominio personalizzato, se vuoi).

Logo, avatar e intestazione

Per prima cosa: ti consigliamo di iniziare a personalizzare il design della pubblicazione creando un bel set grafico con il logo, l’avatar e l’intestazione.

Sono elementi che erano già disponibili per le pubblicazioni e ora li abbiamo ampliati e resi ancora più potenti.

Usa i file .png trasparenti per il logo, l’avatar e l’intestazione. In questo modo il logo sarà visualizzato al meglio con qualsiasi tipo di sfondo e intestazione. Puoi creare i file .png in applicazioni come Photoshop o GIMP.

  • Il logo della pubblicazione (il logo mostrato in cima a ogni post) non deve essere di dimensioni superiori a 600 pixel in larghezza e 72 pixel in altezza.
  • L’avatar (l’icona che appare di fianco al nome della pubblicazione, come in fondo a ogni post) deve essere di 60 x 60 pixel.
  • L’intestazione può essere di dimensioni piccole, medie o grandi (S, M e L di fianco a Header Size). Puoi anche inserire un’immagine in un’intestazione di grandi dimensioni: la proporzione è di 2:1 con una dimensione minima di 1500 px in larghezza e 750 pixel in altezza.

Altri consigli sulle intestazioni

Le intestazioni sono state rinnovate e ora offrono vari modi di ottenere un look unico e personalizzato, combinando le diverse opzioni a disposizione.

Il nostro strumento di personalizzazione del layout della homepage.

Dimensioni dell’intestazione e opzioni per le immagini

L’intestazione per la pubblicazione può essere piccola, media o grande. Se ne scegli una piccola o media, potrai scegliere solo il colore di sfondo.

Intestazione piccola.
Intestazione media.

Per intestazioni di grandi dimensioni, puoi anche inserire un’immagine di sfondo. L’immagine deve essere di almeno 1500 px in larghezza e 750 px in altezza, ma ti consigliamo di utilizzare le dimensioni massime possibili, con un rapporto 2:1 (ossia, con larghezza doppia rispetto all’altezza).

Intestazione grande.

Le immagini di intestazione di grandi dimensioni potrebbero essere tagliate nell’area di visualizzazione sul desktop o mobile, ma puoi personalizzare il punto focale per fare in modo che la parte dell’immagine che vuoi sempre visualizzata sia esattamente dove deve essere.

Logo nell’intestazione

Se vuoi inserire un logo all’interno dell’intestazione, usa la massima risoluzione possibile e avrai un logo che rende perfettamente ovunque.

Diamo per scontato che il logo inserito sia ottimizzato per la risoluzione retina, ossia di dimensione doppia rispetto alla dimensione alla quale sarà visualizzato. Se inserisci un logo di 2000 px in larghezza e 1000 px in altezza, Medium lo interpreta come 1000 px in larghezza e 500 px in altezza. Lo facciamo in modo che il logo sia perfettamente visualizzato ovunque, sia su un telefono cellulare che su uno schermo retina gigante.

Il logo sarà poi visualizzato a dimensioni più piccole per adattarsi all’intestazione se ha una risoluzione superiore all’area dedicata al logo, ma un logo più piccolo dell’area apposita non potrà essere ingrandito.

In parole semplici: crea il logo alla massima risoluzione possibile. Scegli la dimensione di visualizzazione desiderata e raddoppiala.

Opzioni per il layout dell’intestazione

Oltre a personalizzare le dimensioni dell’intestazione, puoi personalizzarla anche inserendo un logo, del testo o entrambe le cose.

Le opzioni per inserire del testo, un logo, o entrambe le cose.

Il logo o il testo possono essere allineati a sinistra o centrati all’interno dell’intestazione. Fai qualche prova per vedere quale opzione rende meglio con i vari formati e colori. Potrai sbizzarrirti come preferisci.

Le opzioni per allineare titolo e logo nell’intestazione

Per esempio, la pubblicazione Those People ha scelto un’intestazione di medie dimensioni con un logo piccolo e quadrato e due righe di testo per il titolo, tutto allineato a sinistra.

Un solo Medium, infiniti stili di personalizzazione per le pubblicazioni.

Colori nell’intestazione e impatto sulla pubblicazione

Puoi personalizzare il colore di sfondo per l’immagine di intestazione scegliendo qualsiasi tonalità dell’arcobaleno. Il nostro sistema richiede il codice esadecimale del colore (un mix di numeri e lettere che dice a un sito web che colore deve rendere) per rendere con precisione la sfumatura di colore desiderata. Puoi anche scegliere tra temi con colori più audaci (opzione bold) o delicati (subtle). Scegliendo l’opzione bold il tuo colore personalizzato sarà reso in modo più accentuato in tutta la pubblicazione, mentre l’opzione subtle lo renderà in modo più discreto.

Vuoi trovare il colore perfetto per l’intestazione e il codice esadecimale corrispondente? Il fantastico Color Hex è proprio quello che ti serve.

MA GUARDA QUANTI BEI COLORI.

Fai tutte le prove che vuoi con questa tavolozza di colori. La scelta del colore personalizzato ha un impatto su tutti i colori usati all’interno della pubblicazione (incluse le evidenziazioni del testo, i pulsanti e altri elementi dell’interfaccia utente), abbinando in modo dinamico le tonalità complementari in modo che ogni colore sia integrato nel modo migliore.

Il colore personalizzato di Backchannel cambia il look del testo evidenziato e del cuore per i recommend.

Qui vale la pena ricordare il consiglio di utilizzare immagini .png trasparenti per il logo della pubblicazione. Lo sfondo dei file .png trasparenti avrà lo stesso colore del colore di sfondo selezionato, rendendo ancora più professionale l’aspetto della pubblicazione.

Potrebbe essere necessario modificare il file del logo a questo scopo (si può fare facilmente in Photoshop, GIMP, o altri programmi per le immagini).

Sezioni con i tag

Puoi personalizzare la navigazione dalla homepage della pubblicazione in base ai tag che usi nella pubblicazione. Pensa ai tag come a sezioni della tua pubblicazione. Talkback, per esempio, potrebbe usare tag come Feedback, Updates e How To per aiutare i lettori a trovare subito il tipo specifico di post che cercano. Scegli i tag che vuoi mettere in primo piano nell’area di navigazione della homepage – puoi selezionarne fino a sette. “About” è sempre un tag, quindi tienilo a mente durante la progettazione.

Lo strumento per personalizzare i tag della homepage della pubblicazione.

Favicon

Vero che fa un bell’effetto quando un sito ha la sua icona che appare nella scheda del browser, rendendo più facile riconoscere il sito a colpo d’occhio?

Indovina un po’? Ora anche la tua pubblicazione può avere la sua favicon personalizzata.

Questa funzione è disponibile per le pubblicazioni ospitati su domini personalizzati. Vuoi scoprire come avere un dominio personalizzato per la tua pubblicazione? È tutto spiegato nel nostro Help Center (in inglese).

Le favicon personalizzate fanno risaltare la tua pubblicazione nel browser.

Non vuoi o non hai una favicon? Va bene lo stesso. Puoi usare la nostra.

Layout della pubblicazione

Pur non essendo una nuova funzionalità, il layout è probabilmente l’aspetto più importante di una pubblicazione.

La scheda homepage layout ti consente di personalizzare l’organizzazione, il layout e l’aspetto della tua pubblicazione.

Le opzioni sono quasi infinite.

Cominciamo con il layout: gli articoli possono apparire disposti in griglia (opzione Grid), in un flusso (Stream) come sulla homepage di Medium, o in una lista (List). Nell’esempio qui sotto, ho scelto di avere una sezione, con i post ordinati per data di pubblicazione (Latest) e disposti in griglia (Grid).

Talkback, con l’opzione griglia (Grid) e i post ordinati per data di pubblicazione a partire dal più recente (opzione Latest).

Man mano che crescono, le pubblicazioni hanno spesso bisogno di un’organizzazione dei contenuti più precisa di quanto mostrato in questo primo esempio. L’organizzazione è anche fondamentale per sfruttare pienamente i tag che puoi inserire nell’intestazione della pubblicazione.

Per l’organizzazione, puoi disporre le sezioni in modo da evidenziare gli articoli in primo piano (featured) o ordinare lo stream per data di pubblicazione (latest), per tag o per post più letti e raccomandati (trending).

Proviamo quindi a usare un po’ più di fantasia per la nostra pubblicazione.

Nell’esempio qui sotto, ho scelto di usare l’opzione “Featured” per la sezione i alto, per mettere in primo piano due dei miei post preferiti di Talkback con il resto dei miei articoli disposti di seguito in griglia.

Talkback, ora con post in primo piano (featured).

Modificare una piccola parte del layout può avere un impatto significativo sull’aspetto della tua pubblicazione.

Nell’esempio qui sotto, invece, ho cambiato il layout per le anteprime dei post, senza margini e con il testo (titolo e sottotitolo) sovrapposto.

La differenza è significativa (e, in questo caso, non buona).

Un layout a griglia ha un aspetto molto diverso quando le anteprime dei post sono senza margini e con il testo sovrapposto.

Insomma, puoi davvero sbizzarrirti come preferisci con tutte le opzioni di personalizzazione delle pubblicazioni ora disponibili.

Provale tutte, scegli la più adatta alla tua pubblicazione e lascia il segno.

--

--

Monica Cainarca

Translator, editor, dreamer • formerly translator and editor for Medium Italia