Vibulary
Menù
Aspetto e lingua
Termini per argomento · 147 guide

Interfaccia

Impara i nomi dei pulsanti, menu, moduli e altre parti che le persone usano su uno schermo.

01 / Atlas

Tutti i termini di Interfaccia

Apri un termine per un significato semplice, un esempio, quando usarlo, quanto è ufficiale e il suo nome codice.

  2. 02 · Nucleo

    Area di testo Textarea

    Una textarea è un riquadro per digitare diverse righe di testo. Le sue dimensioni possono restare fisse o essere modificabili.

  3. 03 · Nucleo

    Avatar Avatar

    Un avatar è una piccola foto, delle iniziali o un simbolo. Aiuta a riconoscere una persona, un team, un bot o un account.

  5. 05 · Nucleo

    Avviso Alert

    Un avviso è un messaggio breve e importante che viene annunciato senza spostare il focus della tastiera. Non chiede all'utente di rispondere subito.

  6. 06 · Nucleo

    Azioni di massa Bulk Actions

    Le azioni di massa permettono a qualcuno di scegliere molti elementi ed eseguire un'azione su tutto il set scelto.

  8. 08 · Più dettagli

    Barra degli strumenti Toolbar

    Una barra degli strumenti è un gruppo di controlli nominato che le persone usano spesso. Tab entra nel gruppo una volta, poi i tasti freccia si muovono al suo interno.

  9. 09 · Più dettagli

    Barra dei menu Menubar

    Una barra dei menu è un menu che rimane visibile, spesso in una riga orizzontale. I suoi elementi aprono comandi o sottomenu con regole da tastiera in stile applicazione.

  11. 11 · Nucleo

    Barra di navigazione Navigation Rail

    Una barra di navigazione è un elenco verticale breve dei principali luoghi lungo il bordo di uno schermo. È un modello di progettazione comune, non uno standard web.

  12. 12 · Nucleo

    Barra di progresso Progressbar

    Una barra di avanzamento mostra quanto di un compito a tempo è stato completato. Le persone possono leggerla ma non controllarla direttamente.

  14. 14 · Nucleo

    Briciola Breadcrumb

    Un breadcrumb è un percorso di link che mostra la pagina attuale e le sue pagine principali.

  15. 15 · Nucleo

    Campo di Ricerca Search Field

    Un campo di ricerca è un riquadro di testo per trovare contenuti che possono corrispondere alle parole digitate.

  17. 17 · Nucleo

    Campo di testo Text Field

    Un campo di testo è un riquadro con etichetta e una sola riga, dove le persone digitano o modificano il testo.

  18. 18 · Nucleo

    Campo modulo Form Field

    Un'unità di input completa con etichetta visibile, un controllo, un aiuto facoltativo, lo stato di validazione e un messaggio di errore collegato.

  19. 19 · Più dettagli

    Caret di inserimento Insertion Caret

    Il cursore di inserimento è la linea lampeggiante nel testo modificabile. Mostra dove andrà il prossimo carattere digitato o incollato.

  20. 20 · Nucleo

    Caricamento file File Upload

    Il caricamento dei file riguarda la scelta, il controllo, l'invio e la gestione dei file da un dispositivo.

  21. 21 · Nucleo

    Carosello Carousel

    Un carousel mostra uno o pochi pannelli alla volta. Le persone lo muovono con frecce, pallini o strisciando.

  22. 22 · Più dettagli

    Cascader Cascader

    Un Cascader mostra le scelte un livello alla volta. Una scelta apre la successiva lista corrispondente.

  25. 25 · Più dettagli

    casella di elenco Listbox

    Una listbox è un elenco personalizzato di scelte. Gestisce quale scelta è attiva e come i tasti freccia si muovono attraverso l'elenco.

  26. 26 · Nucleo

    Cassetto Drawer

    Un drawer scorre dal bordo dello schermo. Una parte della pagina dietro di esso resta visibile.

  28. 28 · Nucleo

    Chip Chip

    Un chip è un piccolo elemento interattivo che rappresenta un input, un filtro, una scelta o un elemento rimovibile. La sua azione esatta deve essere chiara.

  29. 29 · Nucleo

    Citazione Quote

    Una citazione ripete le parole di qualcuno e indica chiaramente da dove provengono.

  31. 31 · Nucleo

    Cronologia Timeline

    Una timeline mette eventi, stati o tappe in ordine di tempo lungo un percorso visibile.

  33. 33 · Nucleo

    Cursore Slider

    Uno slider muove un cursore lungo una barra per scegliere un valore o un intervallo.

  35. 35 · Nucleo

    Dimensione obiettivo Target Size

    La dimensione dell'obiettivo è l'area completa su cui una persona può cliccare o toccare per utilizzare un controllo. Può essere più grande dell'icona visibile.

  36. 36 · Nucleo

    Distintivo Badge

    Un badge è un piccolo segno non cliccabile attaccato a un altro elemento. Mostra un conteggio, uno stato o un segnale breve ed è un modello di design, non uno standard web.

  37. 37 · Nucleo

    Divisore Divider

    Un divider è una linea visibile o logica tra gruppi, controlli o parti di un argomento.

  38. 38 · Nucleo

    Divulgazione Disclosure

    Una disclosure è un pulsante che mostra o nasconde una sezione correlata. Inoltre indica al software se la sezione è aperta.

  41. 41 · Nucleo

    Etichetta Tag

    Un tag è un'etichetta breve che di solito non può essere cliccata. Raggruppa un elemento o mostra uno stato stabile. Un tag è un modello di design, non uno standard web.

  42. 42 · Nucleo

    Etichetta del modulo Form Label

    Una Form Label dice cosa serve a un campo di inserimento. Il codice collega l'etichetta al suo controllo corrispondente.

  43. 43 · Nucleo

    FAQ FAQ

    Una raccolta di domande frequenti (FAQ) raccoglie le domande che le persone fanno spesso prima di decidere o chiedere aiuto. Le risposte usano le parole e le situazioni che quelle persone conoscono.

  44. 44 · Nucleo

    Fieldset e legenda Fieldset and Legend

    `<fieldset>` e `<legend>` sono elementi HTML integrati per un gruppo di controlli di form correlati. La legenda indica la domanda che condividono.

  45. 45 · Nucleo

    Filtro Filter

    Un filter è un controllo o una regola che mostra solo gli elementi che corrispondono alle condizioni scelte. Non modifica i dati di origine.

  46. 46 · Più dettagli

    Finestra di avviso Alert Dialog

    Una finestra di avviso è una finestra modale per una scelta urgente. Le persone devono capire il risultato prima di continuare.

  47. 47 · Nucleo

    Finestra Modale Modal Dialog

    Un dialog modale è una finestra focalizzata. Blocca lo schermo attuale finché qualcuno non la chiude o la finisce.

  48. 48 · Nucleo

    Fisarmonica Accordion

    Una fisarmonica impila sezioni le cui intestazioni possono aprire o chiudere i propri contenuti.

  50. 50 · Più dettagli

    Foglio inferiore Bottom Sheet

    Un bottom sheet è un pannello facile da usare col tocco. Salisce dal basso e può fermarsi a tratti prestabiliti.

  52. 52 · Nucleo

    Gestione del focus Focus Management

    La gestione del focus sposta il punto attivo della tastiera dopo che la pagina cambia. Restituisce anche il focus quando una superficie temporanea si chiude.

  54. 54 · Nucleo

    Gestione membri Member Management

    La gestione membri è il luogo in cui gli amministratori autorizzati invitano le persone, ne vedono lo stato, cambiano ruoli o rimuovono l'accesso.

  55. 55 · Più dettagli

    Grafico Chart

    Un Grafico trasforma i dati in un'immagine. Può mostrare confronti, trend, intervalli o collegamenti.

  56. 56 · Più dettagli

    Griglia ad albero Treegrid

    Un treegrid è una tabella interattiva con righe che possono avere righe figlie. Le persone possono aprire i livelli delle righe mentre le celle rimangono allineate nelle colonne.

  57. 57 · Più dettagli

    Griglia ARIA ARIA Grid

    Una griglia ARIA è un set interattivo di righe e celle. I tasti freccia spostano il focus su, giù, sinistra e destra.

  58. 58 · Più dettagli

    Griglia dati Data Grid

    Una griglia di dati è una tabella simile a un'app. Le persone possono spostare, selezionare, ordinare o modificare molti dati.

  60. 60 · Più dettagli

    Gruppo toggle Toggle Group

    Un gruppo etichettato di pulsanti attivi o inattivi. Una o più opzioni separate possono restare premute.

  61. 61 · Nucleo

    HTML Semantico Semantic HTML

    HTML Semantico significa scegliere elementi HTML per ciò che fanno, non solo per come appaiono. La pagina mantiene la sua struttura e il comportamento integrato anche senza CSS.

  62. 62 · Nucleo

    Icona Icon

    Un'icona è un piccolo simbolo che aiuta le persone a riconoscere un'azione, un oggetto, uno stato o un gruppo.

  63. 63 · Nucleo

    Immagine Image

    Un'immagine è una foto all'interno dei contenuti. Ha bisogno di regole per dimensione, caricamento, ritaglio e testo alternativo adatte al suo scopo.

  64. 64 · Nucleo

    Indicatore di progresso Progress Indicator

    Un indicatore di progressione mostra che il lavoro sta continuando. Una barra o un anello mostrano un progresso noto. Uno spinner significa che il tempo di attesa è sconosciuto.

  65. 65 · Più dettagli

    Indice tab mobile Roving tabindex

    L'indice tab mobile fornisce un punto Tab a un gruppo. I tasti freccia spostano quindi il focus tra gli elementi all'interno del gruppo.

  66. 66 · Nucleo

    Interfaccia chat Chat UI

    Una chat UI unisce messaggi, nomi dei mittenti, un campo di testo per scrivere, stati di invio e allegati. Mostra anche modi per correggere gli errori.

  67. 67 · Nucleo

    Interruttore Switch

    Un interruttore attiva o disattiva una impostazione, e di solito il cambio avviene subito.

  70. 70 · Nucleo

    Kanban Board Kanban Board

    Una lavagna Kanban mostra i passaggi reali attraverso cui il lavoro passa. Le schede rappresentano il lavoro e i limiti WIP impediscono troppi avviamenti.

  71. 71 · Nucleo

    Lettore multimediale Media Player

    Un media player è un insieme di controlli per audio o video. Include play, progresso, volume, didascalie e altre scelte di riproduzione.

  72. 72 · Più dettagli

    Lightbox Lightbox

    Una lightbox apre i contenuti multimediali in un lettore più grande e scurisce la pagina intorno.

  73. 73 · Nucleo

    Link Link

    Un link è un testo o un elemento multimediale che apre un'altra pagina, file o punto.

  74. 74 · Nucleo

    Link Salta Skip Link

    uno Skip Link aiuta chi usa la tastiera a saltare i menu ripetuti. Sposta il focus sul contenuto principale o su un'altra area chiave.

  75. 75 · Nucleo

    Lista List

    Un elenco mostra elementi correlati in un ordine utile o facile da seguire.

  76. 76 · Più dettagli

    Maniglia di ridimensionamento Resize Handle

    Una maniglia di ridimensionamento è un punto visibile su un bordo o un angolo. Le persone la trascinano per cambiare la grandezza di un pannello, un campo, una colonna o un oggetto.

  77. 77 · Nucleo

    Matrice dei permessi Permission Matrix

    Una matrice di permessi mostra quali ruoli possono eseguire ogni azione in un'area scelta. Rende più facile confrontare le regole di accesso.

  78. 78 · Nucleo

    Menù Menu

    Un menu dei comandi è un gruppo di azioni o scelte con regole speciali per il focus della tastiera. Solitamente si apre da un pulsante o da un'altra area dei comandi.

  80. 80 · Nucleo

    Menu a discesa Dropdown Menu

    Un menu a discesa è un menu di comandi di breve durata che si apre da un pulsante e rimane accanto a esso. Il suo schema semantico usuale è un pulsante menu più un menu.

  82. 82 · Più dettagli

    Menu Contestuale Context Menu

    Un menu contestuale mostra comandi per l'oggetto o l'area che lo ha aperto. Spesso si apre con un clic destro o con il tasto del menu contestuale.

  83. 83 · Nucleo

    Menu Hamburger Hamburger Menu

    Un pulsante con tre linee. Apre la navigazione principale del sito quando non c'è abbastanza spazio per mostrarla.

  84. 84 · Nucleo

    Messaggio di stato Status Message

    Un messaggio di stato segnala un risultato, un progresso o un'attesa senza aprire una finestra di dialogo o distogliere l'attenzione.

  85. 85 · Nucleo

    Metro Meter

    Un indicatore mostra una misurazione all'interno di un intervallo noto. Può anche segnare intervalli bassi, alti e migliori.

  86. 86 · Più dettagli

    Modalità Colori Forzati Forced Colors Mode

    La modalità colori forzati utilizza una palette di sistema scelta dall'utente invece di molti colori della pagina. Questo può rendere più facile distinguere controlli e testo.

  87. 87 · Più dettagli

    Modello Feed ARIA ARIA Feed Pattern

    Il modello di feed ARIA è un flusso in cambiamento di articoli simili. Può aggiungere nuovi elementi o rimuovere i vecchi man mano che le persone lo attraversano.

  89. 89 · Nucleo

    Modulo di accesso Sign-In Form

    Un modulo che raccoglie i dettagli dell'account per accedere. Deve supportare il recupero, i password manager, gli errori chiari e l'invio sicuro.

  91. 91 · Nucleo

    Nome Accessibile Accessible Name

    Un nome accessibile è l'etichetta che il software calcola per un controllo o un'immagine. I lettori di schermo lo usano per identificare l'elemento.

  92. 92 · Nucleo

    Notifica toast Toast

    Un toast è un breve messaggio di stato. Non blocca la pagina e di solito sparirà da solo.

  93. 93 · Più dettagli

    Notifica web Web Notification

    Una notifica web è un messaggio che il browser o il sistema operativo mostra al di fuori della pagina. L'utente deve dare il permesso e il messaggio segue le regole del sistema.

  95. 95 · Nucleo

    Ordine del focus Focus Order

    L'ordine del focus è il percorso che il focus della tastiera segue attraverso una pagina. Dovrebbe corrispondere all'ordine di lettura e di attività.

  96. 96 · Nucleo

    Pagina delle impostazioni Settings Page

    Una pagina delle impostazioni contiene scelte che cambiano il modo in cui un'app funziona attraverso le attività. Buone impostazioni predefinite permettono alla maggior parte delle persone di iniziare immediatamente.

  97. 97 · Nucleo

    Paginazione Pagination

    La paginazione divide una raccolta in pagine numerate e mostra quale pagina è aperta.

  98. 98 · Nucleo

    Passaggi Steps

    I passaggi mostrano la posizione di una persona in un breve processo. Il processo ha un ordine e una fine fissi.

  99. 99 · Nucleo

    Piè di pagina del sito Site Footer

    Il piè di pagina di un sito è l'area finale usata in tutto un sito web. Contiene link secondari, dettagli legali, modi di contatto e informazioni di fiducia.

  100. 100 · Nucleo

    Popover Popover

    Un popover è un piccolo pannello attaccato al controllo che lo ha aperto. Può contenere contenuti strutturati e azioni senza bloccare la pagina.

  101. 101 · Nucleo

    Prova sociale Social Proof

    La prova sociale è una testimonianza verificabile dalle persone. Mostra che persone o gruppi rilevanti usano, si fidano o apprezzano un prodotto.

  102. 102 · Nucleo

    Pulsante Button

    Un pulsante è un controllo che premi per far succedere qualcosa su questa schermata.

  105. 105 · Nucleo

    Puntatore e cursore Pointer & Cursor

    Un puntatore o cursore segna dove si trova un dispositivo di puntamento sullo schermo. La sua forma può indicare selezione, scrittura, trascinamento, ridimensionamento, attesa o indisponibilità.

  106. 106 · Nucleo

    Punto di riferimento Landmark

    Un punto di riferimento è un'area principale di una pagina. La tecnologia assistiva permette alle persone di saltare direttamente a quell'area.

  107. 107 · Nucleo

    Punto di riferimento del banner Banner Landmark

    Un banner landmark è l'area principale dell'intestazione per un intero sito web. Una striscia di annunci larga può anche essere chiamata banner, ma è un modello di design diverso.

  108. 108 · Più dettagli

    Regione Live Live Region

    Una regione live informa la tecnologia assistiva quando cambia un testo importante della pagina. Può annunciare l'aggiornamento senza spostare il focus.

  109. 109 · Più dettagli

    Registro attività Activity Log

    Un registro delle attività elenca le azioni sui prodotti in ordine temporale. Ogni riga indica chi ha fatto cosa, su quale elemento e quando.

  110. 110 · Più dettagli

    Reticolo Scrim

    Una sovrapposizione oscura e trasparente sta dietro a un overlay. Separa l'overlay e fa capire che la pagina sotto è bloccata.

  113. 113 · Nucleo

    Riflusso del contenuto Content Reflow

    Il riformattamento dei contenuti adatta una pagina in uno spazio stretto senza perdere contenuti o funzionalità. La maggior parte della lettura non dovrebbe richiedere lo scorrimento bidirezionale.

  114. 114 · Nucleo

    Scheda Card

    Una scheda è un gruppo ben delimitato che mostra un argomento, i suoi dettagli e le azioni correlate.

  116. 116 · Nucleo

    Schede Tabs

    Le schede utilizzano etichette per cambiare contenuto in un pannello condiviso. Il compito principale rimane aperto.

  117. 117 · Nucleo

    Scheletro Skeleton

    Uno scheletro è un segnaposto semplice a forma del contenuto che si sta ancora caricando.

  119. 119 · Nucleo

    Selettore Spinner

    Uno spinner va in loop per mostrare un lavoro attivo quando non c'è un numero utile di completamento.

  120. 120 · Nucleo

    Selettore data Date Picker

    Un selettore di date è un controllo per digitare o scegliere un giorno su un calendario. Non seleziona un orario del giorno.

  121. 121 · Nucleo

    Selettore di colori Color Picker

    Un Color Picker consente alle persone di scegliere un colore. Può mostrare un'area colore, una barra per la tonalità, dei valori o dei campioni.

  123. 123 · Nucleo

    Selettore orario Time Picker

    Un selettore del tempo è un controllo per digitare o scegliere un'ora locale del giorno. La sua dimensione del passo e il formato di visualizzazione locale devono essere chiari.

  124. 124 · Nucleo

    Seleziona Select

    Una lista di selezione apre un elenco fisso e permette di scegliere un solo valore.

  125. 125 · Più dettagli

    Selezione Albero Tree Select

    Un Tree Select mostra scelte annidate in un albero che si può aprire. Può permettere una o molte scelte.

  126. 126 · Nucleo

    Selezione del testo Text Selection

    La selezione del testo è l'intervallo di testo evidenziato. Le persone selezionano il testo per copiarlo, sostituirlo, annotarlo o modificarlo.

  127. 127 · Nucleo

    Separatore Separator

    Un separatore è una linea visibile che può anche indicare una vera interruzione tra le parti. Se le persone possono concentrarsi su di esso e muoverlo, diventa uno splitter regolabile.

  128. 128 · Nucleo

    Sezione Eroe Hero Section

    Una sezione hero è la zona principale di apertura di una pagina. Spiega in fretta la promessa, a chi è destinata, le prove e l'azione successiva.

  130. 130 · Più dettagli

    Spinbutton Spinbutton

    Spinbutton è il nome ARIA per un controllo che seleziona un valore da un intervallo definito. Le persone di solito possono digitare un valore o aumentarlo e diminuirlo. Un numeric stepper è un modo in cui può apparire.

  131. 131 · Nucleo

    Statistica Statistic

    Una Statistica evidenzia un valore. La sua etichetta, unità, intervallo di tempo e contesto ne spiegano il significato.

  132. 132 · Nucleo

    Stato di errore Error State

    Uno stato di errore rimane visibile quando un'azione o una pagina fallisce. Spiega il problema specifico e fornisce un modo sicuro per recuperare.

  133. 133 · Nucleo

    Stato di successo Success State

    Uno stato di successo conferma che un'azione è terminata. Mostra il risultato duraturo e qualsiasi passo utile successivo.

  134. 134 · Nucleo

    Stato vuoto Empty State

    Uno stato vuoto appare quando una lista o uno spazio di lavoro non hanno contenuti al momento. Spiega il motivo e fornisce un passo successivo utile.

  136. 136 · Nucleo

    Suggerimento Tooltip

    Un tooltip è una breve nota su un controllo. Si apre quando il mouse ci passa sopra o la tastiera lo seleziona. Le persone non possono usarlo come un pulsante.

  137. 137 · Nucleo

    Tabella Table

    Una tabella allinea i fatti collegati in righe e colonne con nome. Di solito è di sola lettura o ha solo azioni semplici.

  140. 140 · Nucleo

    Testo Alternativo Alternative Text

    Il testo alternativo spiega il significato utile di un'immagine quando qualcuno non può vederla. Dovrebbe corrispondere al ruolo dell'immagine su quella pagina.

  141. 141 · Nucleo

    Torna su Back to Top

    Torna su è una scorciatoia sulle pagine lunghe. Riporta la vista e il focus vicino all'inizio.

  144. 144 · Nucleo

    Valutazione Rating

    Una valutazione mostra un'opinione su una scala fissa. La scala può usare stelle, numeri o livelli con nome.

  145. 145 · Nucleo

    Vista salvata Saved View

    Una visualizzazione salvata ricorda come una lista è filtrata, ordinata e mostrata in modo che la stessa visualizzazione utile possa essere aperta di nuovo.

  146. 146 · Nucleo

    Visualizzazione Albero Tree View

    Una tree view è un elenco con livelli. Le righe principali si aprono o si chiudono per mostrare gli elementi figli al loro interno.

  147. 147 · Nucleo

    Visualizzazione calendario Calendar View

    Una vista del calendario posiziona gli elementi programmati su giorni o fasce orarie. Le persone possono scansionare un giorno, una settimana o un mese.