Come funzionano queste icone: 🌍🌎🌏✅️?


123

Vedo questi personaggi come icone colorate:

🌍🌎🌏✅️

Funziona solo in Firefox per me. Se non riesci a vedere i caratteri a colori, sembra così sul mio sistema (probabilmente dipende dal carattere):

descrizione dell'immagine

Posso persino vederli nei titoli firebug e tab:

descrizione dell'immagine

descrizione dell'immagine

descrizione dell'immagine

E c'è un file completo di loro. Ho anche fatto questo document.title animazione con loro, che dimostra che funzionano anche al di fuori dell'HTML.

Cos'è quello?


I commenti non sono per una discussione estesa; questa conversazione è stata spostata in chat .
Journeyman Geek

Sto usando Opera e sicuramente non li vedo come hai mostrato nell'immagine "sembra così". Quindi, sono tentato di modificarlo dalla tua domanda ma non sarebbe molto sostanziale ...
Stephan Bijzitter,

37
@StephanBijzitter: il fatto che tu e gli altri non vediate le icone in questo modo è il motivo per cui l'immagine è importante. Non rimuoverlo.
user2357112


2
Parola chiave: OpenType-SVG ( stateofwebtype.com/#OpenType-SVG , color.typekit.com )
Prinzhorn

Risposte:


145

Questi personaggi sono emoji riconosciuti dagli standard Unicode che definiscono ciò che ogni personaggio presenta.

Il loro esatto aspetto è diverso per ciascun sistema operativo e per ogni applicazione, ma tutti rappresentano la stessa cosa.

Il globo (🌏) è un carattere Unicode 1F30Fe si chiama EARTH GLOBE ASIA-AUSTRALIA . il secondo (✅) si chiama WHITE HEAVY CHECK MARK ed è Unicode 2705.

In questo modo, ci sono migliaia di emoji, alcuni supportati da ogni applicazione e altri con meno supporto. Vedi l'elenco completo qui http://www.fileformat.info/info/emoji/browsertest.htm


56
Il loro esatto aspetto dipende dal tipo di carattere utilizzato, poiché il tipo di carattere è ciò che definisce l'aspetto di un personaggio e gli emoji sono solo personaggi.
totymedli,

23
In realtà, il secondo è (come hai detto) WHITE HEAVY CHECK MARK combinato con VARIATION SELECTOR-16 . ✅️ copiato dalla domanda sembra un segno di spunta bianco in una casella verde, ✅ copiato dalla tua risposta sembra un segno di spunta bianco con un bordo nero e quando incollo il selettore di variazione dopo il tuo segno di spunta bianco con un bordo nero, ottengo il stesso ✅️ segno di spunta bianco in una casella verde. Schermata di questo commento per chiarezza
Stijn

4
Potrebbero non aver notato a causa dello scarso supporto dei caratteri. Sul mio browser, lo sfondo verde non viene visualizzato.
user2357112

8
@Stijn, per me in Chrome entrambi sono il segno di
Yisroel Tech

6
Questo non risponde alla domanda, che riguarda il modo in cui viene riprodotto in Firefox, non il motivo per cui le emoji sono lì.
oldmud0

73

Firefox utilizza un carattere speciale per questi personaggi emoji . Impiega una funzione relativamente nuova e altrimenti utilizzata raramente dei caratteri TrueType: glifi di colore a strati. Oltre a ciò (ovvero con un carattere speciale con glifi precolorati) queste icone sono normali caratteri Unicode.

Windows ha il supporto nativo per questi caratteri colorati solo nelle versioni 8.1 e successive , quindi Firefox installa EmojiOne in privato e utilizza il proprio renderizzatore di caratteri per esso in Windows 7. Ciò spiega anche l'assenza di icone emoji colorate nella maggior parte delle altre applicazioni.


2
Se in Win10 esiste un supporto nativo per glifi di colore a più livelli, perché continuano ad apparire in bianco e nero, ad esempio in Edge?
Bas

5
@Bas, come possiamo vedere tramite gli strumenti per sviluppatori Edge, l'interfaccia utente di Segoe Emoji non viene selezionata per visualizzare questa pagina (altri caratteri monocromatici lo fanno). Inserire il carattere nell'attributo famiglia di caratteri fa il trucco: i.imgur.com/IXiNC86.png
aitap

4
@Bas Il supporto emoji colorato è nelle ultime anteprime Edge e sarà nella prossima versione pubblica.
Josiah Keller,

1
Curiosamente, Firefox sulla mia casella Ubuntu 16.10 mostra glifi in bianco e nero (dopo ho avviato Win10 e confermato che sono effettivamente colorati)
Luca

2
@Luke Ubuntu ha pianificato il supporto per glifi di colore per Unity 8.
Stommestack

25

In breve : Firefox utilizza un carattere in cui questi simboli appaiono come sono.

Questi personaggi fanno parte dello standard Unicode.

Unicode è uno standard del settore informatico per la codifica, la rappresentazione e la gestione coerenti del testo espresso nella maggior parte dei sistemi di scrittura del mondo. Sviluppata in collaborazione con lo standard Universal Coded Character Set (UCS) e pubblicata come The Unicode Standard, l'ultima versione di Unicode contiene un repertorio di oltre 128.000 caratteri che coprono 135 script moderni e storici, oltre a più set di simboli. -Wikipedia

Pertanto, a differenza di ASCII (che aveva pochissimi), Unicode contiene diversi set di simboli. Ora, sebbene sia stato standardizzato su quale codice dovrebbe rappresentare l'alfabeto o il simbolo, Unicode non specifica esattamente come dovrebbe apparire il simbolo. Pertanto, tutti i sistemi operativi hanno i propri set di simboli grafici per apparire diversi. Questo può includere alcuni colorati e altri solo contorni o bianco e nero.

Inoltre, è anche possibile che i caratteri abbiano il proprio set di arte per questi simboli in modo che i personaggi possano adattarsi all'aspetto dell'applicazione. Anche all'interno dell'applicazione, potresti avere pagine diverse utilizzando diversi set di immagini. Quindi, puoi interagire con il personaggio come faresti altrimenti, ma sembrerebbe solo diverso.

Puoi vedere come appaiono esattamente le emoji (per 🌍🌎🌏, passa a # 1483) su varie piattaforme qui .


4
128.000 sono molte icone da disegnare. Non incolpo gli artisti per aver scelto icone in bianco e nero anziché a colori.
Dan,

@ Dan, 128.000 è il numero di caratteri, non simboli. Questi includono anche caratteri linguistici, che sono enormi in numero per lingue come il giapponese o il mandarino.
PulseJet,

1
@ Dan, intendevo solo che non ci sarebbero 128.000 simboli che avrebbero dovuto essere colorati. Non sto dicendo che non ce ne sono molti da colorare, ma questo non è affatto vicino a 128.000.
pulsejet

1
Ah, io non intendo dire che essi dovrebbero essere colorate, semplicemente che disegno che molti di tutto ciò è sufficiente a farmi non voglio complicare (cioè il colore) nessuno di loro. Haha.
Dan,

2
@Dan nessuno disegna così tanti punti di codice e quasi nessun carattere contiene caratteri per tutti i punti di codice Unicode. Il renderer dei caratteri sostituirà glifi da un altro carattere quando il carattere corrente non contiene quei glifi. Perché non esiste un carattere che contiene tutti i glifi Unicode?
phuclv,

2

Questi personaggi "lavoro" allo stesso modo di altri personaggi, ad esempio a, ø, λ, ଶୁ, e , il lavoro. I caratteri sono rappresentati da un numero astratto, che viene utilizzato per selezionare e indicizzare un carattere disponibile per visualizzare il carattere.

Sul sistema, sembra che Firefox fa proprio il rendering, e ha accesso ai caratteri contenenti glifi per 🌍, 🌎, 🌏e ✅️. Altre applicazioni normalmente usano i caratteri resi disponibili dal server X (o equivalente), quindi limitati ai caratteri che hai installato o indirizzato al tuo server (ad es. Con xset +fpo simili).

I caratteri multicolori sono uno sviluppo recente e ancora abbastanza sperimentale; tradizionalmente, i glifi dei caratteri sono un singolo colore che può essere composto su qualsiasi sfondo.


1

È diverso su ogni browser, quindi puoi aggiungere un carattere specifico al tuo sito Web, che si carica in questi emoji . Per esempio:

Questo post sopra su Graphics Design Ci sono caratteri Emoji gratuiti? potrebbe anche essere interessante. Senza un carattere icona così personalizzato, devi tenere a mente che il tuo sito web avrà un aspetto diverso in ogni browser.


Questo è solo un elenco destinato a guidare le persone agli emoji e agli emoticon unicode più velocemente.


0

Questi sono solo caratteri Unicode, quindi tutte le caselle di testo che supportano Unicode possono visualizzarli senza problemi, a condizione che il carattere e glifi siano disponibili sul sistema. Tuttavia l' aspetto e l' aspetto di ciascun personaggio Unicode dipendono dal renderer e dal font utilizzati per essi.

Tradizionalmente i personaggi sono riempiti solo con un singolo colore. Gli emoji colorati sono una novità, quindi il loro supporto varia da piattaforma a piattaforma. Varie tecniche sono state inventate per colorare come PNG incorporati, SVG o maschere a strati . Ma tutti richiedono un nuovo renderer che non era disponibile nei sistemi operativi precedenti.

Di conseguenza dalla versione 50.0 Firefox ha incorporato il proprio renderer e font per supportare le emoji colorate. Puoi trovarlo nelle note di rilascio

Cambiato

Aggiunto un set Emoji integrato per sistemi operativi senza caratteri Emoji nativi (Windows 8.0 e versioni precedenti e Linux)

Il file del font si trova in %FirefoxInstallDir%\fonts\EmojiOneMozilla.ttf

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.