Qual è il nome del modello di web design che mostra la forma del contenuto durante il caricamento del contenuto reale?


12

È abbastanza comune per i siti Single Page Application (SPA) caricare e visualizzare il layout del sito prima di caricarne il contenuto. Ultimamente, ho notato che invece di mostrare semplicemente un messaggio di attesa o "Caricamento in corso ...", molti di questi siti mostrano il modello / layout che il contenuto popolerà, con il testo e le immagini riempiti con geometria piatta forme.

Esempio da Slack

Sembra un buon modello perché è meno stonante che avere una piccola riga di testo di attesa sostituita da un grande dump di messaggi o altro. Vorrei leggere il modello, forse trovare una libreria per farlo più facilmente sul mio sito, ma non ho idea di come chiamarlo, e ho problemi anche a descriverlo in modo abbastanza succinto per cercare in modo efficace sul web . L'esempio più vicino che ho trovato è stato questo vecchio articolo che non dà alla pratica un nome specifico.

Il "segnaposto" è la prima cosa che mi viene in mente, ma ovviamente i <input>tag ora hanno un placeholdlerattributo reale e molte persone chiedono testo di riempimento o altro contenuto (Lorem Ipsum, Kitten Ipsum e simili), quindi i risultati tendono ad essere inutili . Spero che l'industria abbia concordato un nome univoco e descrittivo per questa pratica e non l'ho ancora trovato.


2
il tuo articolo dice "segnaposto contenuto"; cosa c'è che non va in quel nome? Non sono sicuro che ci sia un "nome ufficiale" per questo
Luciano,

Vedo alcune menzioni (di solito chiamando Facebook per nome) usando quella stringa specifica. Il miglior esempio è questa libreria, ma non credo che si adatterebbe bene al modello dichiarativo / reattivo angolare. Continuerò a scavare, grazie.
Coderer

1
@Luciano Il problema è che "segnaposto dei contenuti" potrebbe anche essere Lorem Ipsum e cose simili. Questo è utile anche nella progettazione grafica, quindi il termine è ambiguo.
L'

Risposte:


18

La prima cosa che mi è venuta in mente è stata che il suggerimento sul tipo mostrato nel tuo esempio è sicuramente definito " greeking" .

La ricerca di "greeking utilizzato nel caricamento delle schermate" mi ha portato a più articoli su questa tecnica UX, e in particolare su questo che si riferisce al concetto di segnaposto di contenuto .

Un termine buono come qualsiasi penso.

Quindi, nello specifico, qui hai segnaposto greeking e immagine e insieme tutto può essere indicato come segnaposto contenuto.


2
interessante, mi chiedo quale sia l'origine del termine "Greeking" ...
Digital Lightcraft

1
@DigitalLightcraft Potrebbe avere qualcosa a che fare con l'espressione "è tutto greco per me". Per ulteriori informazioni, non esitate a pubblicare una domanda su English.SE : P
Vincent

Sono contento di poterti aiutare, sì, le origini del "greeking" non mi sono note, scommetto che è interessante.
Mayersdesign,

2
Un po 'interessante riguardo all'origine correlata al lorem ipsum: "L'uso del greeking (chiamato anche testo fittizio) consente ai progettisti di pagine di posizionare il testo su una pagina senza che il contenuto effettivo funga da distrazione. La storia del greeking non è chiara, ma era usato per la prima volta a metà del XX secolo, il testo era basato sulle parole di Cicerone, un leader romano i cui scritti sono ammirati, la lingua che parlava e scriveva era il latino piuttosto che il greco, quindi la denominazione di questo testo fittizio è fuorviante. " fonte
Jamie Bull

4

La parola magica sembra essere greeking (grazie!), Ma questo mi ha aiutato a trovare il termine "Scheletro", che sembra riferirsi alla pratica molto specifica di disporre di contenuti finti per ottenere la forma generale dell'applicazione. Immagino che la teoria sia che può ridurre l'ansia per i tempi di caricamento .


2

Alcuni dei tuoi amici sviluppatore potrebbero riferirsi ad esso come l'effetto luccicante di Facebook , poiché Facebook ha reso popolare la tecnica del segnaposto dei contenuti con un leggero effetto luccicante e ha ottenuto il codice aperto .

Il punto dell'effetto luccichio è indicare che il contenuto reale è ancora in fase di caricamento, in modo che gli utenti non pensino che la pagina sia bloccata e aggiornata.

inserisci qui la descrizione dell'immagine


-1

Quando ho usato questo schema lo abbiamo chiamato una pagina scheletro. Super utile per le grandi pagine che generano contenuti dinamici.


4
In che modo ciò si aggiunge alle risposte esistenti? Sembra che Coderer abbia già menzionato il termine "scheletro"
Zach Saucier il

Benvenuto in Graphic Design! Se hai una reputazione sufficiente, puoi votare la risposta che ritieni corretta. In alternativa, "ascolta" la domanda come preferita e riceverai una notifica di eventuali nuove risposte.
Luciano,

-4

Si chiamano schermi scheletro.


Ciao NIck, benvenuto su GD.SE. Si prega di non pubblicare in doppio le informazioni che sono già state menzionate in altre risposte. Grazie!
Vincent,
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.