7 petua pakar mengenai ikon Web menetapkan penggunaan dan faedah

Adakah anda tertanya-tanya menggunakan set ikon untuk laman web anda dan yang mana satu untuk dipilih? Petua pakar ini mungkin dapat meyakinkan anda tentang apa yang sudah diketahui oleh banyak pembangun web profesional: jauh lebih mudah untuk mencari ikon dari set ikon yang disertakan, daripada mencari ikon satu persatu dan mencari cara untuk menjadikannya entah bagaimana konsisten bersama.

Kami meminta komuniti petua terbaik mereka untuk menggunakan set ikon, dan banyak dari mereka bersetuju menggunakan set ikon Font Awesome yang popular, tetapi itu bukan satu-satunya set ikon yang terdapat di pasaran.

Set ikon mana yang anda gunakan? Beritahu kami dalam komen!

 Adakah anda menggunakan set ikon khusus untuk laman web anda? Adakah anda menggunakan Font Awesome untuk penggunaan tertentu (iaitu dengan Shopify, untuk buletin, ...)? Sekiranya demikian, mengapa anda menggunakannya, dan apa pengalaman anda dengan set ikon? Pernahkah anda menggunakan CDN mereka, adakah anda memperhatikan peningkatan penggunaan anda?

Jeff Roscher: ia menambah gaya sederhana yang menarik bagi pelanggan yang moden dan menarik

Kami menggunakan Font Awesome di eWorkOrders.com. Ini adalah sebahagian dari laman pemasaran dan perisian kami sebagai tawaran perkhidmatan (SAAS), sistem pengurusan penyelenggaraan berkomputer (CMMS). Di laman pemasaran kami, ia menambah gaya sederhana yang bagus yang diharapkan oleh calon pelanggan moden dan menarik. Kami telah menambahkan acara sempadan dan penunjuk tetikus yang menarik untuk menjadikannya lebih interaktif dan menarik. Untuk pelanggan kami, ikon Font Awesome digunakan sebagai petunjuk visual di dalam medan input untuk membantu mengenal pasti jenis data apa yang harus dimasukkan, seperti ikon kalendar di medan tarikh, sampul surat di bidang alamat e-mel, atau ikon telefon di medan untuk nombor telefon. Mereka digunakan pada butang berfungsi, seperti mengedit, menyalin, dan mencetak.

Ikon digunakan untuk memberikan maklumat visual cepat mengenai data seperti ikon tanda seru merah di sebelah pesanan kerja yang tertunggak atau ketika sesuatu memerlukan perhatian. Mereka berada di beberapa tempat lain juga untuk menjadikan program kelihatan lebih baik ..

Font Awesome memang hebat! CDN mereka cepat dan terdapat banyak pilihan untuk setiap jenis ikon yang kami perlukan. Kami tidak pernah kecewa.

Jeff adalah presiden eWorkOrders.com. eWorkOrders adalah CMMS berasaskan web yang mudah digunakan yang membantu pelanggan menguruskan permintaan perkhidmatan, pesanan kerja, aset, penyelenggaraan pencegahan, dan banyak lagi.
Jeff adalah presiden eWorkOrders.com. eWorkOrders adalah CMMS berasaskan web yang mudah digunakan yang membantu pelanggan menguruskan permintaan perkhidmatan, pesanan kerja, aset, penyelenggaraan pencegahan, dan banyak lagi.

Rachel Foley: cara yang berpatutan untuk mengakses perpustakaan ikon besar dengan mudah

Di Peta Pelanggan Saya, kami sepenuhnya bergantung pada Font Awesome untuk ikonografi kami di semua saluran pemasaran dan produk kami termasuk:

  • Laman web
  • E-mel
  • Media Sosial
  • Grafik Tersuai
  • Aplikasi Mudah Alih
  • Aplikasi Web

Kami menggunakan Font Awesome kerana cara yang berpatutan untuk mengakses perpustakaan ikon besar dengan mudah. Gaya lebih menyeronokkan sesuai dengan jenama kami; ditambah, kemampuan untuk kita menggunakan berat dan gaya ikon yang berbeza memberi kita kebebasan.

Kami menggunakan CDN untuk aplikasi kami yang memberikan kesan yang sangat konsisten di seluruh pengalaman pengguna produk. Tambahan - sangat mudah untuk ditingkatkan apabila kita perlu. Dengan bahan pemasaran, kami sedikit lebih fleksibel dan menggunakan campuran CDN, versi pemasangan dan vektor tempatan kami.

FA sentiasa boleh dipercayai untuk kami sejak kami menerima pakai sepenuhnya pada bulan Januari.

Rachel adalah pereka web berasaskan NYC dan profesional pemasaran kandungan dengan dorongan untuk meningkatkan jenama B2B yang berkembang dan membina kejayaan pemasaran jangka panjang melalui strategi SEO. Dia kini berada di Petakan Pelanggan Saya, sebuah syarikat perisian penjualan B2B yang membuat penyelesaian untuk pasukan penjualan lapangan.
Rachel adalah pereka web berasaskan NYC dan profesional pemasaran kandungan dengan dorongan untuk meningkatkan jenama B2B yang berkembang dan membina kejayaan pemasaran jangka panjang melalui strategi SEO. Dia kini berada di Petakan Pelanggan Saya, sebuah syarikat perisian penjualan B2B yang membuat penyelesaian untuk pasukan penjualan lapangan.

Andrew Ruditser: seperti Font Awesome ditingkatkan, begitu juga kami

Font Awesome is used on all our sites since the dawn of time. When we first started working with Font Awesome, it was mainly used for their Media Sosial Icons. As Font Awesome upgraded, so did we. Not only are their phone icons fantastic, we enjoy the comical icons that they offer. As of recent, Font Awesome announced their version 6 icons. To us, this shows that Font Awesome cares for their users, and want to keep their system up to date with recent code.

Font Awesome kini menawarkan pelbagai ikon untuk dipilih. Kami mendapati fleksibiliti ini dapat membantu kami dari fasa Reka Bentuk hingga fasa Pembangunan kami. Untuk Font Awesome, platform mereka menawarkan dua pilihan untuk pengguna mereka. Pilihan Pertama adalah perkhidmatan Percuma, yang menawarkan 1.588 ikon percuma untuk dipilih. Pilihan kedua adalah keahlian Pro, yang menawarkan 7.842 ikon. Syarikat ini juga mempunyai apa yang kita namakan sebagai cheat sheet Ikon. Senarai ini memaparkan semua ikon mereka yang ditawarkan oleh Font Awesome, yang memberitahu kami jika mereka adalah sebahagian daripada pakej percuma atau pakej pro.

Untuk menambah, Font Awesome juga menawarkan pilihan untuk menarik kod mereka dari CDN mereka. Kami sangat mengesyorkan pergi ke laluan mereka. CDN mereka mempunyai masa tindak balas yang cepat, dan kami mempunyai sedikit atau tidak ada Lag antara laman web kami dan platform mereka.

Andrew Ruditser, Penyelaras Teknologi Utama
Andrew Ruditser, Penyelaras Teknologi Utama

Jeff Romero: menjadikan halaman lebih laju

Kami mengembangkan laman web khusus di Wordpress untuk pelanggan perniagaan kecil hingga menengah. Kami secara historis menggunakan gambar untuk mewakili pelbagai ikon di laman web kami mulai dari profil media sosial hingga ikon telefon dan e-mel. Proses menggunakan gambar untuk ikon memerlukan mencari satu set ikon yang konsisten, memuat naiknya dan kemudian mengubah saiznya untuk memastikannya sesuai dengan laman web ini.

Walaupun ia adalah fail gambar kecil, sedikit proses untuk mendapatkan satu set ikon yang konsisten dan membuatnya sesuai dengan templat laman web ini. Sekarang, dengan menggunakan Font Awesome dan plugin Wordpress-nya, kita dapat mengganti ikon dengan sekumpulan media yang konsisten yang hanya memerlukan penyalinan / tempel baris HTML. Lebih baik lagi, ikon dapat diubah ukurannya dengan sejumlah kecil CSS (menggunakan properti ukuran fon). Ikon dipaparkan lebih baik daripada ikon berasaskan gambar dan mereka dapat dilihat dengan jelas pada peranti mudah alih. Akhirnya, kerana ia adalah baris HTML dan bukannya fail gambar, ia menjadikan kelajuan halaman lebih cepat.

Jeff Romero adalah pengasas bersama Octiv Digital, sebuah agensi pemasaran digital yang mengkhususkan diri dalam strategi SEO tempatan dan perusahaan, pengurusan iklan bayar per klik, reka bentuk / pengembangan web dan perkhidmatan analisis pemasaran.
Jeff Romero adalah pengasas bersama Octiv Digital, sebuah agensi pemasaran digital yang mengkhususkan diri dalam strategi SEO tempatan dan perusahaan, pengurusan iklan bayar per klik, reka bentuk / pengembangan web dan perkhidmatan analisis pemasaran.

Vance: sangat bagus apabila anda tidak mempunyai pereka dalam pasukan anda

Sebagai pembangun web, saya menggunakan Font Awesome sebagai penyelesaian cepat untuk banyak ikon yang bagus. Oleh itu, Font Awesome sangat baik apabila anda tidak mempunyai pereka dalam pasukan pembangunan anda. Sangat berguna untuk mengembangkan plugin Wordpress kerana pembangun dapat memasukkannya ke dalam plugin mereka menggunakan CDN Font Awesome dalam masa yang singkat.

Pengalaman saya dengan Font Awesome adalah baik setakat ini. Tetapi itu tidak bermaksud bahawa ia tidak mempunyai kekurangan. Salah satu kelemahan yang jelas adalah kelajuan memuatkan halaman (prestasi). Oleh kerana ia adalah penyelesaian yang cepat, anda harus memasukkan sebilangan ikon walaupun anda hanya menggunakan beberapa ikon. Itu dapat mengurangkan kelajuan memuatkan laman web dan skor Google Page Speed ​​(PSI).

Vance, pembangun web dan pemilik web.
Vance, pembangun web dan pemilik web.

Sunny Ashley: sederhana, bersih, dan dikenali serta merta untuk pengunjung baru

Kami menggunakan ikon Font Awesome di footer laman web kami. Secara khusus, kami menggunakan ikon Facebook, Twitter, dan LinkedIn untuk merujuk saluran media sosial kami. Sederhana, bersih, dan dapat dikenali oleh pengunjung baru. Seperti yang diketahui oleh pengguna Font Awesome yang lain, mereka juga sangat cepat dan mudah dikonfigurasi.

Sunny Ashley, pengasas dan Ketua Pegawai Eksekutif Autosopinvoice. Autosopinvoice menyediakan perisian pengurusan kedai untuk kedai dan garaj pembaikan automatik yang bebas.
Sunny Ashley, pengasas dan Ketua Pegawai Eksekutif Autosopinvoice. Autosopinvoice menyediakan perisian pengurusan kedai untuk kedai dan garaj pembaikan automatik yang bebas.

Burak Özdemir: Ikon Bulu tidak menyebabkan ukuran DOM yang berlebihan

Feather Icons adalah koleksi ikon sumber terbuka yang dapat dibaca dan menyenangkan yang direka dan dikendalikan oleh Cole Bemis. Sehingga Jun 2020, terdapat lebih dari 280 ikon yang tersedia. Semua ikon yang disediakan oleh Feather Icons berlesen MIT, dan boleh dimuat turun secara berasingan sebagai fail SVG. Anda boleh menyesuaikan ukuran ikon, warna stroke ikon, dan lebar goresan di laman web Feather Icon sebelum memuat turunnya.

Feather Icons boleh menjadi pilihan terbaik untuk laman web atau projek anda jika anda seorang pembangun atau mengetahui cara menangani beberapa tugas asas asas. Oleh kerana ikon ringan ini juga dapat diberikan dengan perpustakaan JavaScript modular, ikon tersebut tidak menyebabkan ukuran DOM yang berlebihan, metrik yang dapat membahayakan prestasi laman web anda. Oleh itu, dengan menggunakan Feather Icons, anda dapat menurunkan kelajuan pemuatan halaman lebih banyak berbanding dengan pakej lain yang terdapat di pasaran. Satu-satunya kelemahan menggunakan set ikon ini ialah anda tidak dapat mencari sebahagian besar ikon jenama.

Ikon Bulu
Burak Özdemir adalah pembangun web dari Turki. Dia pakar dalam membuat aplikasi berasaskan web.
Burak Özdemir adalah pembangun web dari Turki. Dia pakar dalam membuat aplikasi berasaskan web.

Michel Pinson
Mengenai Pengarang - Michel Pinson
Michel Pinson adalah peminat perjalanan dan pencipta kandungan. Menggabungkan keghairahan untuk pendidikan dan penerokaan, beliau adalah untuk berkongsi pengetahuan dan memberi inspirasi kepada orang lain melalui kandungan pendidikan yang menawan. Membawa dunia lebih dekat bersama dengan memperkasakan individu dengan kepakaran global dan rasa bersemangat.




Komen (0)

Tinggalkan komen