Veebikujunduses, nagu te ilmselt teate, on iga detail oluline. Teie ressursile üle läinud inimene ei näe iga elementi eraldi, vaid tajub kogu pilti kui paketti, mis koosneb muudest pisidetailidest. Seega, kui jätate oma ressursi arendamise käigus midagi kahe silma vahele, võib see detail hiljem kogu kompleksi, kogu kompositsiooni rikkuda.
Selline pisiasi võib olla näiteks nupu taust, mõne väikese elemendi valesti valitud font ja isegi favicon. Tõepoolest, vaadake ise – suurtel tuntud saitidel on individuaalne ikoon, mis näitab seda kasutaja brauseri jaotises "Järjehoidjad". Ilma selleta poleks ressursi arendajad saanud luua kompositsiooni, mille poole nad algselt püüdlesid.
Seetõttu peaksite oma saidi kujundust luues hoolitsema sellise detaili eest nagu favicon. Selles artiklis räägime sellest, kuidas see sobitada ressursi üldise stiiliga, samuti sellest, millised suurused see pilt peaks olema.
Saidi ikoon
Esm alt määratleme, mis see element on. Praegu vaadake oma brauseri vahekaardi pealkirja. Nagu näete, on sellest vasakul väike pilt, mis näitab ressursi logo lihtsustatud versiooni. Sama pilt on ka otsingutulemustes kuvatava saidi nime lähedal. Sellest juhindub kasutaja pealkirja nähes.
Paljud veebihaldurid mõistavad, et sellist pilti on vaja, kuid vähesed teavad, milline faviconi suurus on saidile kõige sobivam. Seetõttu ei anna selles artiklis mitte ainult teavet selle kohta, kuidas sellist ikooni teha ja kuidas seda oma ressurssi installida, vaid räägime ka pildi suurustest.
Favoikoni eesmärk
Nii, identifitseerimiseks kasutatakse saidi päise lähedal olevat pilti. See on selle algne eesmärk: väljendada saiti, mille nime me näeme, ja muuta see teiste silmis silmapaistvaks. Seda tehakse võimalikult lihts alt graafika abil: tajume piltidel olevat teavet intuitiivselt palju kiiremini ja lihtsam alt kui tekstivormingus. Faviconid aitavad meil just seda teha. Kuid ärge unustage, et faviconi suurus on kasutaja silmis minimaalne. See ei ole saidi päises olev logo, mis võib sisaldada lisateavet pealdiste, mõningate täpsustuste või kontaktandmete kujul. Kõik, mida saab kuvada nime kõrval oleval ikoonil, peaks võimalikult täpselt vastama faviconi suurusele. Ja nagu juba märgitud, on ta lihts alt miniatuurne (ainult 16 x 16 pikslit).
Kuidas validafavicon?
Kuidas saab veebihaldur oma saidile ikooni kujundada? Tuleb märkida, et saidi logo lihts alt tihendamine enamasti ei toimi. Konkreetse ressursi logo kujul olevatel embleemidel on sageli näha mitmesuguseid elemente, mida ei kuvata alati miniatuursel kujul õigesti. Parem on sellisest ettevõtmisest kohe loobuda.
Muidugi ei võimalda faviconi suurus rääkida lihts alt sildi sisestamisest. Iga tekst on selle resolutsiooni juures lihts alt nähtamatu. Peame välja töötama uue ikooni, mis annaks edasi saidi stiili. Lahenduste leidmiseks pöördume taas suurimate saitide poole.
Paljud inimesed kasutavad teenuse nime stiliseeritud esitähte faviconina. Nii toimivad näiteks Bing, Yahoo, Yandex, Wikipedia, Google. On ka teine lähenemisviis – kui teil on lühike saidi nimi, saate selle määrata oma ikooni taustaks. Selleks, et faviconi suurus (pikslites ulatub, kordan, 16 x 16 pikslit) seda pealdist õigesti kuvaks, ei tohiks see olla pikem kui 3 tähte. Seda teeb näiteks teenus Aol.
Kuidas faviconit luua?
Saidi nimele ikooni loomiseks on mitu võimalust. Kõige lihtsam on muidugi töötada erinevate valmislahendustega. Võime rääkida mõnest teenusest või programmist, mis võimaldavad täisväärtuslikust pildist ikooni teha, vähendades seda. Küll aga soovitaksin sellise logo omal käel välja töötada. See annab esiteksvõimalus midagi õppida; ja teiseks pakub see rohkem tööriistu. Kõik, mida peate selleks teadma, on see, mida joonistada, ja ka teada, mis suurusega favicon lõplikus versioonis peaks olema. Saidi ikooni suurusest räägime veidi hiljem, kuid praegu märgime selliste piltidega töötamise mõningaid nüansse. Eelkõige, ilma saidi faviconi suurust mainimata, tuleks selgitada sellise pildi vormingut. Nagu kogenud disainerid märgivad, tuleb pilt salvestada.png-vormingus (24-bitine) või. ICO-failina.
Pildi saab salvestada näiteks Photoshopi abil, kuhu embleem joonistatakse.
Faviconi mõõtmed
Niisiis, räägime nüüd sellest, kui suur peaks olema pilt, mida me otsingutulemustes saidi nime kõrval näeme. Vaikimisi, nagu juba mainitud, on selle suurus ainult 16 pikslit (mõlemal küljel). Kui aga proovite seda pilti Photoshopis redigeerida, näete ise, kui ebamugav see on. Seetõttu soovitame töötada suurendatud pildiga, mida saab edaspidi lihts alt mööda servi kokku suruda ja vajalikus vormingus salvestada.
Multiplatvorm
Kui aga rääkida sellest, kui suur peaks teie saidil olema favicon, tuleb meeles pidada veel üht asja. Kõik platvormid ei kuva ressursi pilti ühtemoodi. Näiteks Retina-ekraaniga seadmed "näevad" teie lemmikikooni eraldusvõimega 32 x 32 pikslit. Ja Safaris ja uuel Windowsi platvormil ja üldse jõuavad need ikoonid suuruseni 64pikslit.
Seetõttu soovitame salvestada ikooni erinevad versioonid ja edaspidi lihts alt ette näha selle muutmine olenev alt kasutaja platvormist. Veel üks huvitav punkt - võite proovida ikooni laadida suurimas vormingus, arvestades asjaoluga, et see "kahaneb" sõltuv alt brauserist.
Välised toimetajad
Muidugi on hea, kui tunnete Photoshopi hästi ja teate, mis suurusega favicon peaks olema ja kuidas seda pilti salvestades saavutada. Küll aga on palju algajaid, kes lihts alt pole varem graafiliste redigeerijatega nii lähed alt kokku puutunud, mistõttu ei oska nii lihts alt soovitud pilti joonistada. Selliste veebimeistrite abistamiseks on olemas erinevad teenused, mis võimaldavad teil automaatselt luua teid huvitava ikooni. Paljud neist on isegi tasuta, mis ei nõua kasutaj alt investeeringuid.
Mõnikord on vaja ainult töötamiseks registreeruda, kuid nagu aru saate, tehakse seda üks kord – ettevõtted ju nii tihti oma lemmikuid ei vaheta. Vaadake Google'i, mis muudab logo iga päev, kuid ei puuduta ikooni.
Kuidas faviconit installida?
Üldiselt on saidi seadistamine selliselt, et see kuvaks õigesti vajalikku pilti, väga lihtne. Piisab, kui teha mitmeid lihtsaid samme, mis võimaldavad otsingumootoritel ja ka lihtsatel brauseritel teavet lugeda.
Selleks tuleb saadud pilt salvestadanimega favicon.ico ja asetatakse teie ressursi juure. See on kõik, nüüd tuvastatakse teie pilt automaatselt ja mõne aja pärast lingitakse see teie saidiga.
Lisaks sellele köitmisele saate lisada veel ühe rea, mis viitab teie ikooni asukohale. See näeb välja selline:
Installige kood saidi päisesse.
Järeldused
Niisiis, pärast meie artikli lugemist leidsite, kui suur peaks olema saidi favicon ja mis see on. Samuti arvan, et mõistsite, et oma ressursi jaoks õige ikooni leidmine on vajalik, sest see mängib teile kasuks nii tuntuse suurenemise kui ka konkurentide seas täiendava silmapaistvuse mõttes. Vähem alt suurimad saidid teevad sama, mida võib võtta hea näitena. Ja pealegi ei nõua see palju pingutusi – kui olete korra faviconi teinud ja selle oma saidile õigesti installinud, võite selle mõneks järgmiseks kuuks unustada.
Seetõttu katsetage julgelt, mõelge välja midagi uut, proovige – ja kõik läheb korda!
