Bagaimana cara kerja ikon-ikon ini: πŸŒπŸŒŽπŸŒβœ…οΈ?

123

Saya dapat melihat karakter ini sebagai ikon berwarna:

πŸŒπŸŒŽπŸŒβœ…οΈ

Ini hanya berfungsi di Firefox untuk saya. Jika Anda tidak dapat melihat karakter berwarna, sepertinya ini di sistem saya (mungkin tergantung font):

uraian gambar; kesan

Saya bahkan bisa melihatnya di pembatas dan judul tab:

uraian gambar; kesan

uraian gambar; kesan

uraian gambar; kesan

Dan ada file lengkap dari mereka. Saya juga melakukan animasi document.title ini dengan mereka, yang menunjukkan bahwa mereka bekerja bahkan di luar HTML.

Apa itu?

firefox unicode TomΓ‘Ε‘ Zato
sumber
Komentar bukan untuk diskusi panjang; percakapan ini telah dipindahkan ke obrolan .
Journeyman Geek
Saya menggunakan Opera dan saya pasti tidak melihatnya seperti yang Anda tunjukkan pada gambar "sepertinya ini". Jadi, saya tergoda untuk mengedit itu dari pertanyaan Anda, tetapi itu tidak akan terlalu besar ...
Stephan Bijzitter
37
@StephanBijzitter: Fakta bahwa Anda dan orang lain tidak melihat ikon seperti itu adalah mengapa gambar itu penting. Jangan hapus itu.
user2357112
3
youtube.com/watch?v=tITwM5GDIAI
J. Hougaard
2
Kata kunci: OpenType-SVG ( stateofwebtype.com/#OpenType-SVG , color.typekit.com )
Prinzhorn

Jawaban:

145

Karakter-karakter ini adalah emoji yang dikenali oleh standar Unicode yang mendefinisikan apa yang disajikan oleh setiap karakter.

Tampilan yang tepat untuk mereka berbeda untuk setiap OS, dan setiap aplikasi, tetapi semua menggambarkan hal yang sama.

Globe (🌏) adalah karakter Unicode 1F30Fdan disebut EARTH GLOBE ASIA-AUSTRALIA . yang ke-2 (βœ…) disebut WHITE HEAVY CHECK MARK dan Unicode 2705.

Dengan cara itu, ada ribuan emoji, beberapa yang didukung setiap aplikasi dan ada yang kurang mendukung. Lihat daftar lengkap di sini http://www.fileformat.info/info/emoji/browsertest.htm

Yisroel Tech
sumber
56
Tampilan yang tepat untuk mereka tergantung pada font yang Anda gunakan, karena font adalah hal-hal yang menentukan bagaimana karakter harus terlihat dan emoji hanya karakter.
totymedli
23
Sebenarnya, yang kedua adalah (seperti yang Anda katakan) WHITE HEAVY CHECK MARK dikombinasikan dengan VARIATION SELECTOR-16 . βœ…οΈ disalin dari pertanyaan terlihat seperti tanda centang putih di kotak hijau, βœ… disalin dari jawaban Anda tampak seperti tanda centang putih dengan batas hitam, dan ketika saya menempelkan pemilih variasi setelah tanda centang βœ… putih Anda dengan batas hitam, saya mendapatkan tanda centang βœ…οΈ putih yang sama di kotak hijau. Cuplikan layar komentar ini untuk kejelasan
Stijn
4
Mereka mungkin tidak memperhatikan karena dukungan font yang buruk. Di browser saya, latar belakang hijau tidak muncul.
user2357112
8
@Stijn, bagi saya di Chrome keduanya adalah tanda centang kotak hijau i.imgur.com/Cv5RTFM.png
Yisroel Tech
6
Ini tidak menjawab pertanyaan, yaitu bagaimana hal itu ditampilkan di Firefox, bukan mengapa emoji ada di sana.
oldmud0
73

Firefox menggunakan font khusus untuk karakter emoji ini . Ini menggunakan fitur font TrueType yang relatif baru dan jarang digunakan: mesin terbang warna berlapis. Selain itu (yaitu memiliki font khusus dengan mesin terbang pra-warna) ikon ini adalah karakter Unicode biasa.

Windows memiliki dukungan asli untuk font berwarna ini hanya dalam versi 8.1 dan seterusnya , sehingga Firefox menginstal EmojiOne secara pribadi dan menggunakan renderer font sendiri untuk Windows 7. Ini juga menjelaskan tidak adanya ikon emoji warna-warni di sebagian besar aplikasi lain.

aitap
sumber
2
Jika ada dukungan asli untuk mesin terbang warna berlapis di Win10, mengapa mereka masih muncul dalam monokrom di, misalnya, Edge?
Bas
5
@Bas, seperti yang bisa kita lihat melalui alat pengembang Edge, Segoe UI Emoji tidak dipilih untuk menampilkan halaman ini (font monokrom lainnya lakukan). Memasukkan font ke atribut font-family berguna
aitap
4
@Bas Dukungan emoji berwarna ada di preview Edge terbaru dan akan di versi publik berikutnya.
Josiah Keller
1
Anehnya, Firefox pada kotak Ubuntu 16.10 saya menampilkan mesin terbang hitam dan putih (saya telah boot ke Win10 setelah itu dan mengkonfirmasi mereka memang berwarna)
Luke
2
@ Lukas Ubuntu memiliki dukungan mesin terbang warna yang direncanakan untuk Unity 8.
stommestack
25

Singkatnya : Firefox menggunakan font di mana simbol-simbol ini terlihat seperti mereka.

Karakter-karakter ini adalah bagian dari Standar Unicode.

Unicode adalah standar industri komputasi untuk penyandian, representasi, dan penanganan teks yang konsisten di sebagian besar sistem penulisan dunia. Dikembangkan bersama dengan standar Universal Coded Character Set (UCS) dan diterbitkan sebagai The Unicode Standard, versi terbaru Unicode berisi repertoar lebih dari 128.000 karakter yang mencakup 135 skrip modern dan historis, serta beberapa set simbol. -Wikipedia

Jadi, tidak seperti ASCII (yang memiliki sangat sedikit), Unicode berisi beberapa set simbol. Sekarang sementara itu telah distandarisasi pada kode apa yang harus mewakili apa alfabet atau simbol, Unicode tidak secara tepat menentukan seperti apa simbol itu. Dengan demikian, semua sistem operasi memiliki set grafik simbol sendiri agar terlihat berbeda. Ini mungkin termasuk beberapa yang diwarnai dan beberapa hanya garis besar atau hitam dan putih.

Selain itu, font juga mungkin memiliki seperangkat seni mereka sendiri untuk simbol-simbol ini sehingga karakter dapat sesuai dengan nuansa aplikasi. Bahkan di dalam aplikasi, Anda mungkin memiliki halaman berbeda menggunakan set gambar yang berbeda. Dengan demikian, Anda dapat berinteraksi dengan karakter seperti yang Anda inginkan, tetapi itu hanya akan terlihat berbeda.

Anda dapat melihat bagaimana tepatnya emoji (untuk 🌍🌎🌏, lewati ke # 1483) terlihat di berbagai platform di sini .

PulseJet
sumber
4
128.000 adalah banyak ikon untuk menggambar. Saya tidak menyalahkan para artis karena menggunakan ikon hitam putih alih-alih warna penuh.
Dan
@Dan, 128.000 adalah jumlah karakter, bukan simbol. Ini termasuk karakter bahasa juga, yang jumlahnya sangat besar untuk bahasa seperti Jepang atau Mandarin.
PulseJet
1
@ Dan, saya hanya bermaksud bahwa tidak ada 128.000 simbol yang harus diwarnai. Tidak mengatakan tidak ada banyak warna, tapi itu tidak mendekati 128.000.
PulseJet
1
Ah, saya tidak bermaksud mengatakan bahwa mereka semua harus diwarnai, hanya bahwa menggambar bahwa banyak hal sudah cukup untuk membuat saya tidak ingin menyulitkan (yaitu warna) salah satu dari mereka. Ha ha.
Dan
2
@Dan tidak ada yang menggambar poin kode sebanyak itu, dan hampir tidak ada font yang mengandung karakter untuk semua poin kode Unicode. Pemberi font akan menggantikan mesin terbang dari font lain ketika font saat ini tidak mengandung mesin terbang tersebut. Mengapa tidak ada font yang berisi semua mesin terbang Unicode?
phuclv
2

Karakter ini "bekerja" dengan cara yang sama seperti karakter lain, seperti a, ΓΈ, Ξ», ଢୁ, にdan 晨, bekerja. Karakter diwakili oleh angka abstrak, yang digunakan untuk memilih dan mengindeks font yang tersedia untuk menampilkan karakter.

Pada sistem Anda, tampak bahwa Firefox tidak render sendiri, dan memiliki akses ke font yang berisi mesin terbang untuk 🌍, 🌎, 🌏dan βœ…οΈ. Aplikasi lain biasanya akan menggunakan font yang disediakan oleh X server (atau yang setara), jadi terbatas pada font yang telah Anda instal atau arahkan ke server Anda (misalnya dengan xset +fpatau serupa).

Font multi-warna adalah pengembangan terbaru dan masih cukup eksperimental; secara tradisional, font mesin terbang adalah warna tunggal yang dapat dikomposisi dengan latar belakang apa pun.

Toby Speight
sumber
1

Ini berbeda pada setiap browser, sehingga Anda dapat menambahkan font tertentu ke situs web Anda, yang memuat emoji ini . Sebagai contoh:

Posting ini di atas tentang Desain Grafis Apakah ada font Emoji gratis? mungkin juga menarik. Tanpa font ikon khusus, Anda harus ingat bahwa situs web Anda akan terlihat berbeda di setiap browser.

Ini hanya daftar yang dimaksudkan untuk memandu orang untuk emoji dan unicode smiley lebih cepat.

RaisingAgent
sumber
0

Itu hanya karakter Unicode sehingga setiap kotak teks yang mendukung Unicode dapat menampilkannya tanpa masalah, asalkan font dan mesin terbang tersedia di sistem. Namun tampilan dan nuansa untuk setiap karakter Unicode tergantung pada penyaji dan font yang digunakan untuk mereka.

Karakter tradisional hanya diisi dengan satu warna. Emoji berwarna adalah hal yang cukup baru, karenanya dukungan mereka bervariasi dari platform ke platform. Berbagai teknik telah ditemukan untuk pewarnaan seperti embedded PNGs, SVGs atau masker berlapis . Tetapi semuanya membutuhkan penyaji baru yang tidak tersedia di OS lama.

Akibatnya sejak versi 50.0 Firefox telah menyematkan renderer dan font sendiri untuk mendukung emoji berwarna. Anda dapat menemukannya di catatan rilis

Berubah

Menambahkan set Emoji bawaan untuk sistem operasi tanpa font Emoji asli (Windows 8.0 dan lebih rendah dan Linux)

File font dapat ditemukan di %FirefoxInstallDir%\fonts\EmojiOneMozilla.ttf

phuclv
sumber