Questo è puramente per un sito Web mobile che deve avere schede orizzontali.
La difficoltà è che potrebbero esserci potenzialmente 5-7 schede, con 5 più probabilità. Il testo per ciascuna scheda è lungo, il che potrebbe comportare una scarsa visibilità delle schede.
Faccio fatica a pensare a diversi modi e approcci per rendere questa una buona esperienza per gli utenti mobili.
Qualcuno ha qualche suggerimento per realizzare questo progetto tenendo conto di quelle restrizioni?
Sembra che potrebbe applicarsi anche a una navigazione principale orizzontale per un sito. Brad Frost ha diverse opzioni per i sistemi di navigazione responsive , ma i prossimi due sembrano più appropriati per quello che stai cercando di ottenere dalle sue opzioni. Ecco questi due e un terzo approccio:
Schede a discesa
Un modo popolare per risolverlo è passare dalle schede a un menu a discesa .
Schede impilate
Un altro approccio sarebbe quello di impilare le schede .
Schede scorrevoli
Un'altra opzione che appare sulle interfacce mobili sono le schede scorrevoli.
Aggiungerò solo un altro esempio;)
Questa interazione è usata in Rookie . Ho preso la GIF da questo fantastico articolo sui menu di hamburger .
Ecco un esempio iOS quello che @Matthew ha suggerito come schede scorrevoli:
Vorrei anche aggiungere che puoi averlo centrato e avvolto su due righe (ad esempio tre elementi nella riga superiore e due in basso). Potrebbe essere necessario apportare lievi modifiche al design, ad esempio per renderle più simili a pulsanti e facilmente cliccabili.