Dalam reka bentuk web, seperti yang anda mungkin tahu, setiap butiran penting. Seseorang yang telah beralih kepada sumber anda tidak melihat setiap elemen secara berasingan, tetapi menganggap keseluruhan imej sebagai pakej yang terdiri daripada butiran kecil lain. Oleh itu, jika anda terlepas sesuatu dalam proses membangunkan sumber anda, butiran ini kemudiannya boleh merosakkan keseluruhan kompleks, keseluruhan komposisi.
Perkara kecil seperti itu boleh menjadi, sebagai contoh, latar belakang butang, fon yang salah dipilih bagi beberapa elemen kecil, dan juga favicon. Sesungguhnya, lihat sendiri - tapak yang besar dan terkenal mempunyai ikon individu yang menunjukkannya dalam bahagian "Penanda Halaman" pelayar pengguna. Tanpanya, pembangun sumber itu tidak akan dapat mencipta gubahan yang asalnya mereka usahakan.
Oleh itu, semasa membuat reka bentuk untuk tapak anda, anda harus menjaga perincian seperti favicon. Dalam artikel ini, kita akan bercakap tentang cara memadankannya dengan gaya umum sumber, serta saiz yang sepatutnya ada pada imej ini.
Ikon tapak
Pertama, mari kita tentukan unsur ini. Sekarang, lihat pada tajuk tab penyemak imbas anda. Seperti yang anda boleh lihat, terdapat imej kecil di sebelah kirinya, menunjukkan versi ringkas logo sumber itu. Gambar yang sama juga berdekatan dengan nama tapak yang dipaparkan dalam hasil carian. Inilah panduan pengguna apabila mereka melihat tajuk.
Ramai juruweb memahami bahawa gambar sedemikian diperlukan - tetapi hanya sedikit orang yang mengetahui saiz favicon untuk tapak yang paling sesuai. Oleh itu, dalam artikel ini kami bukan sahaja akan memberikan maklumat tentang cara membuat ikon sedemikian dan cara anda boleh memasangnya pada sumber anda, tetapi juga bercakap tentang saiz imej.
Tujuan favicon
Jadi, gambar berhampiran pengepala tapak digunakan untuk pengenalan. Ini adalah tujuan asalnya: untuk menyatakan tapak yang namanya kita lihat, dan menjadikannya menonjol di mata orang lain. Ini dilakukan semudah mungkin melalui penggunaan grafik: kami secara intuitif melihat maklumat dalam gambar dengan lebih pantas dan lebih mudah daripada dalam format teks. Favicon membantu kami melakukan perkara itu. Tetapi jangan lupa bahawa saiz favicon adalah minimum di mata pengguna. Ini bukan logo dalam "pengepala" tapak, yang mungkin mengandungi maklumat tambahan dalam bentuk inskripsi, beberapa penjelasan atau maklumat hubungan. Semua yang boleh dipaparkan dalam ikon di sebelah nama harus sesuai dengan saiz favicon sebanyak mungkin. Dan dia, seperti yang telah dinyatakan, hanyalah miniatur (hanya 16 kali 16 piksel).
Cara memilihfavicon?
Jadi bagaimanakah juruweb boleh mereka bentuk ikon untuk tapaknya? Perlu diingatkan bahawa hanya memampatkan logo tapak, selalunya, tidak akan berfungsi. Pada lambang yang diletakkan dalam bentuk logo sumber tertentu, pelbagai elemen sering kelihatan, yang tidak akan sentiasa dipaparkan dengan betul dalam bentuk kecil. Adalah lebih baik untuk segera meninggalkan usaha sedemikian.
Sudah tentu, saiz favicon tidak membenarkan bercakap tentang hanya memasukkan inskripsi di sana. Sebarang teks hanya akan tidak kelihatan pada resolusi ini. Kami perlu membangunkan ikon baharu yang akan menyampaikan gaya tapak. Untuk mencari penyelesaian, sekali lagi, mari beralih ke tapak terbesar.
Ramai orang menggunakan huruf pertama yang digayakan pada nama perkhidmatan sebagai favicon. Ini adalah caranya, contohnya, Bing, Yahoo, Yandex, Wikipedia, Google. Terdapat pendekatan lain - jika anda mempunyai nama tapak yang pendek, anda boleh menetapkannya sebagai latar belakang ikon anda. Agar saiz favicon (dalam piksel yang dicapai, saya ulangi, 16 x 16 piksel) untuk memaparkan tulisan ini dengan betul, ia tidak boleh lebih daripada 3 huruf. Inilah yang, contohnya, perkhidmatan Aol lakukan.
Bagaimana untuk membuat favicon?
Terdapat beberapa cara untuk membuat ikon untuk nama tapak. Sudah tentu, yang paling mudah ialah bekerja dengan penyelesaian sedia yang berbeza. Kita boleh bercakap tentang beberapa perkhidmatan atau program yang membolehkan anda membuat ikon daripada imej penuh dengan mengurangkannya. Walau bagaimanapun, saya akan mengesyorkan membangunkan logo sedemikian sendiri. Ini pertama sekali akan memberipeluang untuk mempelajari sesuatu; dan kedua, ia akan menyediakan lebih banyak alat. Apa yang anda perlu tahu untuk ini ialah apa yang perlu dilukis, dan juga tahu saiz favicon yang sepatutnya dalam versi akhir. Kami akan bercakap tentang saiz ikon untuk laman web itu sedikit kemudian, tetapi buat masa ini kami akan perhatikan beberapa kehalusan bekerja dengan imej sedemikian. Khususnya, tanpa menyebut saiz favicon untuk tapak, format imej sedemikian harus dijelaskan. Seperti yang dicatat oleh pereka berpengalaman, gambar mesti disimpan sebagai-p.webp
Anda boleh menyimpan gambar, contohnya, menggunakan Photoshop, tempat lambang akan dilukis.
Dimensi favicon
Jadi, sekarang mari kita bincangkan tentang betapa besarnya gambar yang kita lihat di sebelah nama tapak dalam hasil carian sepatutnya. Secara lalai, seperti yang telah disebutkan, saiznya hanya 16 piksel (pada setiap sisi). Walau bagaimanapun, jika anda cuba mengedit imej ini dalam Photoshop, anda akan melihat sendiri betapa menyusahkannya. Oleh itu, kami mengesyorkan bekerja dengan gambar yang diperbesarkan, yang pada masa hadapan hanya boleh dimampatkan di sepanjang tepi dan disimpan dalam format yang diperlukan.
Multiplatform
Walau bagaimanapun, bercakap tentang betapa besarnya favicon sepatutnya berada di tapak anda, ada satu lagi perkara yang perlu diingat. Tidak semua platform memaparkan imej sumber dengan cara yang sama. Contohnya, peranti dengan paparan Retina "melihat" favicon anda pada 32 kali 32 piksel. Dan dalam Safari dan pada platform Windows baharu, dan sama sekali, ikon ini mencapai saiz 64piksel.
Oleh itu, kami mengesyorkan agar anda menyimpan versi ikon yang berbeza dan hanya menyediakan perubahannya bergantung pada platform pengguna pada masa hadapan. Satu lagi perkara yang menarik - anda boleh cuba memuatkan ikon dalam format terbesar, bergantung pada fakta bahawa ia akan "mengecut" bergantung pada penyemak imbas.
Penyunting luar
Sudah tentu bagus jika anda mahir menggunakan Photoshop dan mengetahui saiz favicon yang sepatutnya dan cara mencapainya sambil menyimpan imej anda. Walau bagaimanapun, terdapat ramai pemula yang tidak pernah menemui editor grafik dengan begitu dekat sebelum ini, jadi mereka tidak dapat melukis imej yang diingini dengan begitu mudah. Untuk membantu juruweb tersebut, terdapat pelbagai perkhidmatan yang membolehkan anda mencipta ikon yang anda minati secara automatik. Malah kebanyakannya adalah percuma, yang tidak memerlukan sebarang pelaburan daripada pengguna.
Kadangkala anda hanya perlu mendaftar untuk bekerja, tetapi, seperti yang anda faham, ini dilakukan sekali - lagipun, syarikat tidak begitu kerap menukar favicon mereka. Lihat Google, yang menukar logo setiap hari, tetapi tidak menyentuh ikon.
Bagaimana untuk memasang favicon?
Secara amnya, menyediakan tapak anda dengan cara yang memaparkan imej yang anda perlukan dengan betul adalah sangat mudah. Ia cukup untuk melakukan satu siri langkah mudah yang membolehkan enjin carian, serta penyemak imbas mudah, membaca maklumat.
Untuk melakukan ini, imej yang dihasilkan mesti disimpan dengandinamakan favicon.ico dan diletakkan dalam akar sumber anda. Itu sahaja, kini imej anda akan dikenali secara automatik dan selepas beberapa lama ia akan dipautkan ke tapak anda.
Selain pengikatan ini, anda boleh menambah satu lagi baris yang akan "mencadangkan" lokasi ikon anda. Ia kelihatan seperti ini:
Pasang kod dalam pengepala tapak.
Kesimpulan
Jadi, selepas membaca artikel kami, anda mengetahui saiz favicon yang sepatutnya untuk tapak dan apakah saiznya. Selain itu, saya fikir anda memahami bahawa mencari ikon yang sesuai untuk sumber anda adalah satu keperluan, kerana ia memainkan peranan anda dalam meningkatkan pengiktirafan dan dari segi beberapa kelebihan tambahan dalam kalangan pesaing anda. Sekurang-kurangnya tapak terbesar melakukan perkara yang sama, yang boleh diambil sebagai contoh utama. Selain itu, ia tidak menyebabkan banyak usaha - setelah membuat favicon sekali dan memasangnya dengan betul di tapak anda, anda boleh melupakannya untuk beberapa bulan akan datang.
Oleh itu, jangan ragu untuk mencuba, tampil dengan sesuatu yang baharu, cuba - dan semuanya akan berjaya!