Jak działają te ikony: 🌍🌎🌏✅️?

123

Widzę te postacie jako kolorowe ikony:

🌍🌎🌏✅️

Działa tylko w przeglądarce Firefox. Jeśli nie widzisz kolorowych znaków, wygląda to tak w moim systemie (prawdopodobnie jest to zależne od czcionki):

opis obrazu

Widzę je nawet w tytułach Firebug i Tab:

opis obrazu

I jest ich pełna teczka . Zrobiłem też z nimi animację document.title , co pokazuje, że działają nawet poza HTML.

Co to jest?

firefox unicode

— Tomáš Zato
źródło

Komentarze nie są przeznaczone do rozszerzonej dyskusji; ta rozmowa została przeniesiona do czatu .

— Journeyman Geek

Używam Opery i zdecydowanie nie widzę ich tak, jak pokazałeś na zdjęciu „tak to wygląda”. Kusi mnie, by to

— zedytować

37

@StephanBijzitter: Fakt, że ty i inni nie widzicie w ten sposób ikon, jest powodem, dla którego obraz jest ważny. Nie usuwaj go.

— user2357112

3

youtube.com/watch?v=tITwM5GDIAI

— J. Hougaard

2

Słowo kluczowe: OpenType-SVG ( stateofwebtype.com/#OpenType-SVG , color.typekit.com )

— Prinzhorn

145

Te znaki to emoji, które są rozpoznawane przez standardy Unicode, które określają, co przedstawia każda postać.

Dokładny ich wygląd jest inny dla każdego systemu operacyjnego i każdej aplikacji, ale wszystkie przedstawiają to samo.

Globus (🌏) jest znakiem Unicode 1F30Fi nazywa się EARTH GLOBE ASIA-AUSTRALIA . drugi (✅) nosi nazwę WHITE HEAVY CHECK MARK i jest Unicode 2705.

W ten sposób istnieją tysiące emoji, niektóre obsługiwane przez każdą aplikację i niektóre z mniejszym wsparciem. Zobacz pełną listę tutaj http://www.fileformat.info/info/emoji/browsertest.htm

— Yisroel Tech
źródło

56

Dokładny ich wygląd zależy od używanej czcionki, ponieważ czcionki określają, jak powinna wyglądać postać, a emotikony to tylko znaki.

— totymedli

23

W rzeczywistości drugi to (jak powiedziałeś) BIAŁY CIĘŻKI ZNAK KONTROLNY w połączeniu z WYBOREM WARIACJI-16 . ✅️ skopiowane z pytania wygląda jak biały znacznik wyboru w zielonym polu, ✅ skopiowane z twojej odpowiedzi wygląda jak biały znacznik wyboru z czarną ramką, a kiedy wklejam selektor wariacji po twoim mark białym znaczniku wyboru z czarną ramką, otrzymuję ten sam ✅️ biały znacznik wyboru w zielonym polu. Zrzut ekranu tego komentarza dla jasności

— Stijn

4

Być może nie zauważyli tego z powodu słabej obsługi czcionek. W mojej przeglądarce zielone tło nie jest wyświetlane.

— user2357112

8

@Stijn, dla mnie w Chrome oba są zaznaczone zieloną ramką i.imgur.com/Cv5RTFM.png

— Yisroel Tech

6

To nie odpowiada na pytanie, w jaki sposób jest renderowane w Firefoksie, a nie dlaczego emoji są dostępne.

— oldmud0

73

Firefox używa specjalnej czcionki dla tych znaków emoji . Wykorzystuje stosunkowo nową i rzadko wykorzystywaną czcionkę TrueType: warstwowe glify. Poza tym (tj. Ze specjalną czcionką z kolorowymi glifami) ikony te są zwykłymi znakami Unicode.

Windows ma natywną obsługę tych kolorowych czcionek tylko w wersji 8.1 i nowszych, dlatego Firefox instaluje EmojiOne prywatnie i używa własnego renderera czcionek w Windows 7. Wyjaśnia to również brak kolorowych ikon emoji w większości innych aplikacji.

— aitap
źródło

2

Jeśli natywne wsparcie dla warstwowych glifów kolorów w Win10, to dlaczego wciąż pojawiają się w trybie monochromatycznym, na przykład w Edge?

— Bas

5

@Bas, jak widać za pomocą narzędzi programistycznych Edge, Segoe UI Emoji nie jest wybierane do wyświetlania tej strony (robią to inne monochromatyczne czcionki). Wstawienie czcionki do atrybutu rodziny czcionek rozwiązuje problem

— aitap

4

Obsługa @Bas Colourful emoji jest dostępna w najnowszych wersjach Edge i będzie dostępna w następnej publicznej wersji.

— Josiah Keller

1

Co ciekawe, Firefox na moim Ubuntu 16.10 wyświetla czarno-białe glify (później uruchomiłem system Win10 i potwierdziłem, że rzeczywiście są kolorowe)

— Luke

2

@Luke Ubuntu planuje obsługę glifów kolorów dla Unity 8.

— stommestack

25

W skrócie : Firefox używa czcionki, w której te symbole wyglądają tak, jak wyglądają.

Te znaki są częścią standardu Unicode.

Unicode to branżowy standard komputerowy do spójnego kodowania, reprezentacji i obsługi tekstu wyrażanego w większości systemów pisania na świecie. Najnowsza wersja Unicode, opracowana w połączeniu ze standardem Universal Coded Character Set (UCS) i opublikowana jako Standard Unicode, zawiera repertuar ponad 128 000 znaków obejmujący 135 nowoczesnych i historycznych skryptów, a także wiele zestawów symboli. -Wikipedia

Tak więc, w przeciwieństwie do ASCII (który miał bardzo niewiele), Unicode zawiera kilka zestawów symboli. Chociaż ujednolicono kod, który powinien reprezentować alfabet lub symbol, Unicode nie określa dokładnie, jak powinien wyglądać symbol. Dlatego wszystkie systemy operacyjne mają własne zestawy symboli graficznych, które wyglądają inaczej. Może to obejmować niektóre kolory, a niektóre tylko kontury lub czarno-białe.

Możliwe jest również, że czcionki mają własny zestaw grafiki dla tych symboli, dzięki czemu znaki mogą działać zgodnie z wyglądem aplikacji. Nawet w aplikacji możesz mieć różne strony z różnymi zestawami obrazów. W ten sposób możesz wchodzić w interakcje z postacią tak, jak w innym przypadku, ale wyglądałoby to inaczej.

Można zobaczyć, jak dokładnie emotikonów (dla 🌍🌎🌏, przejdź do # 1483) spojrzeć na różnych platformach tutaj .

— PulseJet
źródło

4

128 000 to dużo ikon do narysowania. Nie winię artystów za wybór czarno-białych ikon zamiast pełnego koloru.

— Dan

@Dan, 128 000 to liczba znaków, a nie symboli. Należą do nich także znaki językowe, których liczba jest ogromna w przypadku języków takich jak japoński lub mandaryński.

— PulseJet

1

@ Dan, chodziło mi tylko o to, że nie ma 128 000 symboli, które należałoby pokolorować. Nie oznacza to, że nie ma wielu do pokolorowania, ale to nie jest blisko 128 000.

— PulseJet

1

Ach, nie chciałem sugerować, że wszystkie powinny być pokolorowane, po prostu rysowanie, że tyle wszystkiego wystarczy, aby nie chciałem komplikować (tj. Pokolorować) żadnego z nich. Ha ha.

— Dan

2

@ Czy nikt nie rysuje tylu punktów kodowych i prawie żadna czcionka nie zawiera znaków dla wszystkich punktów kodowych Unicode. Moduł renderowania czcionek zastąpi glify inną czcionką, jeśli bieżąca czcionka nie zawiera tych glifów. Dlaczego nie ma czcionki zawierającej wszystkie glify Unicode?

— phuclv

2

Te znaki „praca” w taki sam sposób jak inne znaki, takie jak a, ø, λ, ଶୁ, にi 晨, praca. Znaki są reprezentowane przez liczbę abstrakcyjną, która służy do wybierania i indeksowania dostępnej czcionki w celu wyświetlenia znaku.

W systemie, wydaje się, że Firefox ma swoją własną rendering, i ma dostęp do czcionek zawierających glify dla 🌍, 🌎, 🌏i ✅️. Inne aplikacje zwykle używają czcionek udostępnionych przez serwer X (lub równoważny), więc ogranicz się do czcionek zainstalowanych lub wskazanych przez serwer (np. Za pomocą xset +fplub podobnych).

Czcionki wielokolorowe są najnowszym i wciąż dość eksperymentalnym opracowaniem; tradycyjnie glify czcionek są jednym kolorem, który można komponować na dowolnym tle.

— Toby Speight
źródło

1

W każdej przeglądarce jest inaczej, możesz dodać określoną czcionkę do swojej witryny, która ładuje się w tych emoji . Na przykład:

Ten post na temat projektowania grafiki Czy są jakieś darmowe czcionki Emoji? może być również interesujące. Bez takiej niestandardowej czcionki ikony należy pamiętać, że witryna będzie wyglądać inaczej w każdej przeglądarce.

_{To tylko lista, która ma na celu szybsze wprowadzenie emotikonów i emotikonów unicode.}

— RaisingAgent
źródło

0

Są to tylko znaki Unicode, więc wszystkie pola tekstowe obsługujące Unicode mogą wyświetlać je bez problemu, pod warunkiem, że czcionka i glify są dostępne w systemie. Jednak wygląd i działanie każdego znaku Unicode zależy od renderera i użytej czcionki.

Tradycyjnie znaki są wypełniane tylko jednym kolorem. Kolorowe emoji są całkiem nową rzeczą, dlatego ich obsługa różni się w zależności od platformy. Opracowano różne techniki kolorowania, takie jak osadzone pliki PNG, SVG lub maski warstwowe . Ale wszystkie wymagają nowego mechanizmu renderującego, który nie był dostępny w starszych systemach operacyjnych.

W rezultacie od wersji 50.0 Firefox ma wbudowany renderer i czcionkę do obsługi kolorowych emoji. Można go znaleźć w informacjach o wersji

Zmieniono

Dodano wbudowany zestaw Emoji dla systemów operacyjnych bez rodzimych czcionek Emoji (Windows 8.0 i nowsze oraz Linux)

Plik czcionki można znaleźć w %FirefoxInstallDir%\fonts\EmojiOneMozilla.ttf

— phuclv
źródło