Þegar ég byrjaði að segja fólki um mikilvægi favicon við heildarstefnu sína á netinu, segjast þeir venjulega það sama: "Ert þú ekki að taka þetta vörumerki hlutur svolítið of langt?"

Svar mitt fer venjulega: "Ekki ef þú ert alvarleg um eigin vörumerki viðleitni þína!"

Það er satt, favicons eru mjög lítill hluti, líklega minnst mikilvægur hluti af a staður, en það er athygli að smáatriðum sem gerir síðuna standa út; og jafnvel þótt það hljóti brjálaður, eru favicons mjög mikilvægir frá vörumerki.

Miðað við WDD er vefsíða sem miðar að hönnuðum áhorfendum, er mér víst að margir af þér vita nú þegar hvaða favicons eru og hvernig á að búa til þau; en þessi grein getur ennþá hjálpað þér að takast á við hvers vegna þú ættir að gera þau og einnig þjóna sem góð vefsíðaniðurstaða.

Ég deili stórum lista með favicon-tengdum auðlindum hér að neðan, svo íhuga að merkja þessa síðu til framtíðar tilvísunar. Ó, og ef þú gerir það skaltu taka WDD favicon rétt í bókamerkjalistanum þínum;)

Bara ef þú ert ekki hönnuður eða einhvers konar svartur belti í favicon-listum, nær þessi grein líklega allt sem þú þarft að vita um þessar svívirðilegu litlu 16 × 16 pixlar og jafnvel nokkrar áhugaverðar favicuriosities . Svo gaman!

Hvað er favicon?

Favicons eru lítil fermetra myndir, venjulega 16 × 16 dílar sem eru notaðar af vöfrum til að sýna myndrænt framsetning á vefsvæðinu sem er heimsótt á vinstri hlið af veffang vafrans. Þú hefur sennilega séð marga favicons áður, jafnvel þótt þú veist ekki hvað þeir eru. Ef það er einhver vafi, þá mun myndin að neðan hjálpa.

Favicons

Tvö dæmi um favicons í Google Chrome flipa vafra.

Ef þú hefur áhuga á að skilja eitthvað af sögu internetsins, hér er áhugavert staðreynd:

Orðið favicon er portamentau úr orðum "uppáhalds" og "táknmynd" og það var nefnt sem slík vegna þess að það var fyrst studd af Internet Explorer 5 og aðeins ef þú notar ekki IE, er þetta bókamerki bókamerkja er kallað eftirlæti.

Hver er tilgangur favicon?

Til baka á fyrstu dögum internetsins voru verkfæri eins og Google Analytics aðeins draumar í huga nokkurra nördanna, svo skrítið að þetta gæti hljómað, þá voru favicons notuð sem leið til að meta umferð á vefsvæði með því að telja fjölda gesta sem bókamerki síðuna. (Það er annað áhugavert stykki í sögu internetsins!)

En áhugaverðar staðreyndir til hliðar, aðalástæðan fyrir því að hafa favicons nú á dögum er að bæta reynslu notenda. Favicons eru notaðar í öllum nútíma vafra á netfangalistanum, á tengistikunni, á bókamerkjaskipan og í vafraflipum. Að auki sýna nokkrar vafrar einnig favicons þegar þú býrð til smákaka hlekkur fyrir samsvarandi vefsíðu á skjáborðinu þínu og farsímanum þínum.

Víst er helsta ástæðan fyrir því að hafa favicon að vera augljós bati í reynslu notenda. Vefsvæði án þess að einn mun sýna almenna vafra tákn á öllum þeim punktum af samskiptum sem ég nefndi hér að ofan, og ef þér er annt um reynslu notenda þarftu að hugsa um favicons.

favicons

En ég get ekki forðast að sjá hlutina í gegnum merkingu vörumerkis, þekkingarþáttar míns, þannig að ég held að favicons séu jafnvel meira viðeigandi frá vörumerki. Aftur, með svo mörg stig samskipta, ekki nota þau til að hækka vörumerki vitund er glæpur. Sannleikurinn er sú að finna skapandi leiðir til að bæta netvörunina þína er alltaf krefjandi verkefni og að hafa favicon er auðveld og einföld leið til að ná því. Svo fáðu þig einn vinur minn!

Hvernig á að búa til favicon?

Að búa til vefsíðu favicon er auðvelt sem baka. Reyndar þarftu ekki einu sinni að vera hönnuður til að gera það. Vissulega hjálpar það ef þú ert, þar sem þú getur sett hæfileika þína til að vinna og búið til eitthvað sem raunverulega stendur upp, en jafnvel þeim sem eru minna tæknilega kunnugt um það getur gert það í um 5 mínútur eða minna með því að nota rétt verkfæri.

Vefsíðurnar á listanum hér að neðan leyfa þér að búa til favicon einfaldlega með því að hlaða upp fyrirliggjandi mynd. Svo ef þú vilt búa til favicon fyrir vörumerkið þitt, er allt sem þú þarft að gera að hlaða inn lógóinu þínu á einn af eftirfarandi vefsvæðum og hlaða niður favicon skránni. Auðvelt peasy, sítrónu squeezy.

Hér er Favicon rafallarlistinn sem þú ert að leita að:

Vefsíðan hér að ofan breytilegt hvað varðar skrána sem þú færð; sérstaklega hvað varðar skráarstærð og framlengingu. Ef þú ert að leita að því að fá sem mestu samhæfa skrá mögulega mæli ég eindregið við að hlaða niður myndum sem eru 16 × 16 dílar með "ico" sniði.

Ef þú þarft einhverja innblástur skaltu prófa favicon galleríin hér að neðan:

Hvernig á að nota favicon þinn?

Þegar þú hefur favicon þínum vandlega hönnuð, ætti það ekki að taka meira en nokkrar mínútur í tveimur einföldum skrefum að setja það á netþjóninn. Til þess þarftu að fá aðgang að rótarmöppu vefsvæðisins og textaritvinnslu tól til að breyta HTML kóða vefsvæðisins.

Skref 1

Þú þarft að hlaða upp "favicon.ico" skránum á netþjóninn þinn. Til að gera það skaltu benda veffang vafranum þínum á FTP þjóninn þinn; Vefslóðin þín ætti að líta svona út:

Ýttu á Enter og vafrinn mun biðja þig um notandanafn og lykilorð áður en þú veitir aðgang að skráarsmiðjunni. Þegar þú ert kominn inn skaltu bara senda "favicon.ico" skrána til rótarmöppunnar og þú ert búinn.

Skref 2

Nú þarftu að breyta vefslóð vefsíðunnar til að hjálpa vafra að finna myndavélina þína. Haltu FTP glugganum þínum opnum, finndu og haltu skránni "index.html" eða "header.php" úr þjóninum þínum og fylgdu leiðbeiningunum hér að neðan samkvæmt skránum sem þú færð:

Ef vefsvæðið þitt er búið að búa til látlaus HTML skaltu setja kóðann hér fyrir neðan í HEAD-svæðið í skránni "index.html" og ekki gleyma að breyta "yoursite.com" fyrir eigin vefsvæði þitt.

Ef þú notar WordPress skaltu setja kóðann hér fyrir neðan í HEAD svæðið í "header.php" skránni.

Með því gert skaltu hlaða skránni aftur þar sem þú fékkst það frá. Þú ert búinn!

Reyndar eru flestir nútíma vafrar klár nóg til að finna favicon skrá þína jafnvel án nokkurra kóða en aðeins svo lengi sem myndavélin hefur 16 × 16 punkta, það hefur verið nefnt sem "favicon.ico" og er vistuð í rótarmöppunni á vefsíðunni þinni.

Hvernig á að búa til favicon í Photoshop

Með svo mörgum verkfærum sem eru til staðar til að hjálpa þér að búa til favicon þína, afhverju myndir þú vilja taka harða veginn og búa til það í Photoshop? Jæja, ef þú ert hönnuður og vilt fá sem mest út úr favicon þínum, þá er það vissulega faglegur leiðin til að gera það. The bragð er sú að Photoshop styður ekki "ico" skrár, svo þú þarft að hlaða niður þessu tappi úr Telegraphics .

Vertu viss um að setja það upp áður en þú fylgir leiðbeiningunum hér fyrir neðan. Photoshop mun ekki virka án þess.

Leitaðu að "ICO" valmöguleikanum í Photoshop "Save As" reitnum til að staðfesta að viðbótin sé uppsett.

Búðu til nýtt skjal í Photoshop valið valmyndaratriðið "Skrá" og eftirfarandi valkostur "Nýtt", veldu þá striga á 64 × 64 punktum. Af hverju? Þar sem 16 × 16 endanleg favicon stærð er svo lítill, með stærri striga til að vinna á mun hjálpa þér að fá skapandi safa þína flæða. Settu síðan inn lógóið þitt í skjalið og losa töfrandi unicorn-skapandi kraftinn þinn.

Þegar þú ert búinn skaltu einfaldlega velja valmyndina "Mynd" og eftirfarandi valkostur "Myndastærð" og draga úr myndinni í 16 × 16 punkta. Mundu að smella á "Resample Image" og veldu "Bicubic Sharper", þetta er til að tryggja að myndin sé óskýr þegar hún er breytt. Ef þú líkar ekki endanlegu niðurstöðu skaltu einfaldlega afturkalla nýjustu breytingar þínar með "AltCtrl / AltCmd + Z" og halda áfram að vinna að hönnuninni þar til þú ert ánægð með það.

Til þess að ljúka myndavélinni þinni þarftu bara að smella á valmyndina "File" og eftirfarandi valkost "Vista sem", þar sem þú manst eftir því að nefna skrána sem "favicon.ico". Enn og aftur, starf!

Niðurstaða

Favicons eru ein af þessum litlu hlutum sem við leggjum venjulega ekki of mikla athygli á, en sannleikurinn er sá að langt frá því að vera óverulegt, þau eru mjög mikilvægur hluti af vefnum, bæði frá notendaviðmótum og vörumerki, af-útsýni.

Sumir segja að mikill hlutur sé í litlum stærðum og ég held að það sé einnig við favicons því að allir vefur hönnuður og / eða vörumerki sérfræðingur sem alltaf tekur tíma til að bæta við favicon á síðum viðskiptavina sinna, jafnvel þegar viðskiptavinurinn hefur ekki hugmynd um hvað favicon er, sýnir mikla fagmennsku og athygli á smáatriðum; hvers konar gæði sem allir viðskiptavinir meta.

Búirðu til favicons fyrir viðskiptavini þína? Eru þeir of miklar vandræði fyrir of lítið verðlaun? Láttu okkur vita af hugsunum þínum í athugasemdunum.

Valin mynd / smámynd, undursamleg mynd um Shutterstock