Utente:Patafisik (WMF)/Sandbox2/T
Vector 2022 non è una nuova skin in senso stretto.
Un restyling vero e proprio dei wiki Wikimedia consisterebbe in un singolo cambiamento maggiore che avrebbe un effetto sul funzionamento del sito stesso. Nel caso di questo progetto abbiamo apportato una serie di cambiamenti individuali. Ogni funzionalità è stata trattata come un piccolo progetto indipendente. Alla fine, queste funzionalità sono state riunite insieme a livello di design, con una stessa identità visiva.
Si tratta di una decina di funzionalità sviluppate e implementate separatamente.
Il Web team è partito dall'analisi dell'esistente e dalle buone intuizioni e caratteristiche sviluppate individualmente su alcuni singoli wiki. Non ha creato delle specifiche di prodotto dettagliate. Ogni funzionalità è stata sviluppata e implementata separatamente, ed è stata testata prima della sua distribuzione sui wiki pilota. Le funzionalità già distribuite potrebbero ancora richiedere qualche rifinitura nel corso del tempo. Leggi come lavora il Web team e come sono state apportate le modifiche in dettaglio.
Il nuovo logo è più piccolo rispetto a prima.
Abbiamo riconfigurato il logo e riorganizzato l'header. Questo ci permette di proporre alcune funzionalità molto usate nell'header fisso, disponibile in qualunque punto della pagina senza bisogno di scorrere in alto.
La barra laterale è diventata ripiegabile.
La barra laterale ripiegabile sulla sinistra, chiamata anche "menu principale", rende l'esperienza di lettura e scrittura più chiara. Quando il menu è chiuso ci si focalizza maggiormente sul contenuto. Allo stesso tempo, il menu è sempre a disposizione e apribile con un click se necessario, cliccando sull'icona del menu hamburger (en) (
) in alto a sinistra del logo.
La larghezza del contenuto può essere limitata.
Una lettura efficiente è cruciale per la maggior parte delle persone che usano Wikipedia.
Come spiegato anche qui, leggendo linee più corte, i lettori sollecitano meno i muscoli oculari ed evitano così l'affaticamento della vista. Inoltre, paragrafi più stretti permettono ai lettori di comprendere e memorizzare meglio nuove informazioni.
Tuttavia, per andare incontro alle esigenze di tutti, in basso a destra nella pagina abbiamo introdotto un selettore o toggle (
) che permette di passare dalla larghezza fissa a quella a pagina intera secondo le proprie esigenze. La larghezza fissa o a schermo intero può essere impostata dagli utenti loggati anche nelle proprie preferenze, selezionando "Abilita la modalità con larghezza limitata".
La limitazione dell'area del contenuto offre nuove opportunità per ulteriori sviluppi dell'interfaccia: alcuni wikimediani hanno suggerito di metterci gli infobox, o le immagini, o ancora le note. Come parte di un progetto separato, prenderemo in considerazione come usare questo spazio in linea con le aspettative della comunità.
La nuova barra di ricerca contestualizza la ricerca.
La barra di ricerca è stata spostata per renderla più visibile.
Il nuovo widget di ricerca propone la modalità di scrittura predittiva e un contenuto più interattivo, fornendo la miniatura delle immagini delle pagine e delle brevi descrizioni. Grazie a questa contestualizzazione la ricerca è più veloce ed efficace, ed è più facile trovare il risultato voluto.
È stata anche integrata nell'header fisso: l'icona è la lente d'ingrandimento 
che si trova sulla sinistra.
I collegamenti interlinguistici sono stati spostati nella barra del titolo.
La maggior parte dei lettori si concentra sull'area del contenuto e non nota i link nella barra laterale.
Lo spostamento dei collegamenti interlinguistici nella barra del titolo della voce rende più facile il passaggio da una lingua all'altra. I collegamenti interlinguistici in una posizione più evidente e la lista compatta delle lingue del selettore universale consentono ai nostri lettori e redattori multilingue di trovare più rapidamente le loro lingue preferite.
Ad alcuni utenti della Wikipedia in italiano questa modifica potrebbe sembrare irrilevante e non necessaria. Tuttavia, Vector 2022 è destinato ad essere di default su tutti i wiki Wikimedia e intende adattarsi alle necessità di varie comunità. Per esempio, abbiamo tenuto conto delle esigenze degli utenti dei paesi emergenti in cui la consultazione dei wiki Wikimedia cresce più velocemente.
Per tutti questi motivi abbiamo portato avanti questo cambiamento.
Inoltre, il pulsante delle lingue diventa un hub per quel che riguarda le lingue in generale: integra al suo interno il collegamento allo strumento Traduzione contenuti e permette di aggiungere e modificare i collegamenti interlinguistici su Wikidata.
Per i wikipediani esperti e e per chi salta da un'edizione linguistica di Wikipedia all'altra (da una skin all'altra), un cambiamento delle abitudini potrebbe essere spiazzante. Per questo, nella barra laterale, nella posizione classica delle lingue in Vector, abbiamo messo un avviso che ricorda la nuova posizione delle lingue (vedi anche come attivare la stessa skin su tutti i wiki).
L'header fisso dà accesso a varie funzionalità senza dover scorrere in cima alla pagina.
L'header fisso, detto anche intestazione fissa o o barra superiore statica, permette agli utenti connessi di accedere da qualunque punto della pagina ad alcuni link importanti e molto usati, come connettersi e disconnettersi, modificare, andare alla pagina di discussione o alla cronologia, consultare altre versioni linguistiche, ecc., senza dover scorrere la pagina fino in cima.
L'header fisso in Vector 2022 è anche personalizzabile, permette infatti di aggiungere link e icone. Attualmente è disponibile solo per alcuni namespace.
Il nuovo indice è sempre disponibile durante la lettura.
L'indice fornisce informazioni sul contesto della pagina nel suo insieme e allo stesso tempo permette di navigare all'interno della pagina.
In Vector 2022 si trova nella barra laterale e ed è stato reso fisso sulla pagina: in questo modo è più facile navigare tra le diverse sezioni ed è sempre disponibile sulla pagina senza dover scorrere fino in cima.
Quando viene chiuso, è "nascosto" sotto all'icona 
nella barra del titolo.
Durante la lettura, la sezione consultata è in grassetto. È possibile aprire o chiudere le sottosezioni secondo le proprie esigenze. Il link "Inizio" permette di risalire in cima alla pagina.
Per averlo sempre in cima alla voce basta ripiegare la barra laterale (il menu principale).
- Stati del nuovo indice
-
Indice aperto -
Indice chiuso (icona
) -
Indice appuntato -
Indice aperto -
Indice chiuso (icona) -
Indice appuntato
Gli Strumenti della pagina (come "Puntano qui", "Modifiche correlate", o "Scarica come PDF") non si trovano più nella barra laterale ma in un nuovo menu sulla destra.
Questo permette di navigare in maniera più intuitiva e di distinguere con chiarezza tra gli strumenti per navigare all'interno del wiki in generale ("Menu principale", sulla sinistra) e gli strumenti relativi alla pagina specifica che si sta guardando (menu degli "Strumenti", sulla destra).
Facilita inoltre e rende più intuitiva la comprensione della funzione di ogni link, senza doverci cliccare sopra. Come spiegato qui sotto, abbiamo voluto ridurre la confusione dovuta all'eccesso di link per i nuovi lettori e i nuovi contributori.
Come altri elementi di Vector 2022, l'indice è sempre disponibile sulla pagina, quando viene chiuso si trova nella barra degli strumenti della pagina (la barra orizzontale delle linguette della pagina) sotto la scritta Strumenti. (vedi i tre stati dei menu).
Il menu utente, apribile quando serve in alto a destra, mette a disposizione tutti i link riguardanti l'utenza in una posizione intuitiva, rendendo più chiaro lo scopo di questi link.
Solo le notifiche e la lista degli osservati speciali si trovano fuori dal menu e sono accessibili con un solo click, quest'ultima in particolare su richiesta dei wiki pilota.
Per gli utenti connessi il menu utente è sempre disponibili in qualunque punto della pagina, sulla destra dell'header fisso.
Le rifiniture grafiche rendono l'interfaccia accessibile e visivamente coerente.
Ci sono vari fattori che influenzano la leggibilità - per esempio la dimensione del font, il contrasto, il tipo di font, la lunghezza della linea, e lo spazio vuoto.
Abbiamo proceduto con delle rifiniture grafiche, ossia delle migliorie al design che rendono coerente l'interfaccia nel suo insieme e in linea con il Manuale di stile e le linee guida per l'accessibilità dei siti Web pubblicate dal Web Accessibility Initiative.
Abbiamo invertito l'ordine della barra del titolo della pagina e della barra degli strumenti della pagina (la barra orizzontale delle linguette della pagina). Abbiamo messi in evidenza bordi e sfondo e modificato i colori dei link. Il font è stato ingrandito, in attesa di rendere la dimensione del font personalizzabile. Abbiamo indicato la sezione attiva dell'indice e lavorato sulla configurabilità delle sezioni.
Questi cambiamenti rendono coerenti le funzionalità sviluppate separatamente e l'interfaccia nel suo insieme. Inoltre, aumentano l'accessibilità di Wikipedia. (Leggi anche il nostro post su Diff sull'accessibilità di Vector 2022)
In Vector 2022 i link sono raggruppati in menu separati per tipologia. I menu sono disponibili aperti, chiusi o fissati ("appuntati" come con una puntina).
I menu compatti diminuiscono il sovraccarico cognitivo, un problema che abbiamo individuato in fase di progettazione per cui una quantità eccessiva di link sulla pagina distrae e rende poco comprensibile l'interfaccia nel suo insieme per i lettori e i nuovi utenti.
Raggruppando i link nei menu abbiamo potuto proporre l'header, l'indice e il menu degli strumenti della pagina fissi quando si scorre verso il basso.
Per gli utenti loggati, lo stato prescelto per ogni menu è persistente: viene conservato se si cambia pagina, rendendo l'interfaccia più flessibile e personalizzabile secondo le proprie esigenze.
Il codice di Vector 2022 è stato migliorato avendo in testa la performance.
Per raggiungere i nostri obiettivi abbiamo migliorato le nostre pratiche di sviluppo frontend e affrontato varie sfide, lavorato sulle limitazioni dell'architettura, semplificato terze parti, a volte riparato codice rotto o non più manutenuto.
Abbiamo migliorato la retrocompatibilità, aggiunto API e rinforzato i contratti riguardanti l'integrazione di codice. In generale, abbiamo migliorato il supporto per le terze parti. Abbiamo ridotto il codice da manutenere, e durante il processo abbiamo migliorato la situazione anche per il codice delle altre skin.
Abbiamo lavorando con altri designer della Wikimedia Foundation allo sviluppo di una vera e propria cassetta degli attrezzi del sistema di progettazione.