Bună ziua, dragi cititori! Articolul de astăzi este despre crearea unui favicon (favicon.ico) pentru site-ul dvs. web. Din această postare veți afla ce este o favicon, în ce dimensiuni vine această pictogramă și de ce trebuie neapărat să o creați și să o instalați pe blogul dvs. În plus, articolul va oferi generatoare de favicon care vă permit să creați o favicon online în câteva minute, precum și site-uri de unde puteți descărca galerii și colecții de favicon-uri gata făcute.

Mai întâi, să ne dăm seama ce este un Favicon, de ce este nevoie de el, poate ne putem descurca fără el?

1. Ce este un favicon și pentru ce este?

Concept Favicon provine din două cuvinte în engleză Favorites Icon, care pot fi traduse ca pictogramă (imagine mică) pentru „favorite”. „Preferate” este numele dat marcajelor în browserul Internet Explorer de bază. De exemplu, arată astfel în browserul Chrome:

Pentru fiecare resursă există o imagine mică, ceva ca un mini . Sunteți de acord că este mai convenabil să marcați nu adresele URL ale site-urilor, ci siglele lor mici - favicon-uri. Apropo, pe lângă aceasta, favicon-ul este afișat în bara de adrese a browserului imediat înainte de adresa URL a paginii deschise a site-ului sau în titlul marcajului:

Favicon este un fișier mic (16x16 pixeli) cu extensia .ico (această extensie este folosită de sistemele de operare pentru a stoca pictograme). Aproape fiecare site web are Favicon.ico, indiferent pe ce găzduire se află sau ce motor/temă folosește. Generatoarele și galeriile de favicon online vă permit să creați o pictogramă în câteva minute din orice imagine, să o desenați de la zero sau să descărcați una gata făcută, așa că, dacă nu utilizați deja un favicon pe blog, corectați rapid situatia.

Pentru ce este această poză mică? În primul rând, acesta este un mini logo pentru site-ul dvs., vizitatorii dvs. își vor aminti mai bine. Prin urmare, dacă decideți să-l creați, atunci încercați să vă asigurați că favicon-ul atrage atenția vizitatorilor și este ușor de reținut. Și în al doilea rând, cel mai popular motor de căutare din RuNet, Yandex, își plasează favicon-ul lângă fiecare site în rezultatele sale, ceea ce vă permite să vă evidențiați resursa de la altele care nu au o pictogramă. Utilizatorii sunt mai dispuși să viziteze acele site-uri lângă care există o imagine (indiferent de ce), ceea ce înseamnă că favicon-ul permite .

Apropo, Yandex are chiar și un bot special care nu indexează conținutul de pe site, ci doar indexează favicon-urile de resurse. După ce ai creat un favicon și l-a instalat pe site, va trebui să așteptați puțin până când același bot Yandex îl indexează, iar acest proces durează de obicei de la o săptămână la o lună. Există trei moduri de a verifica dacă Yandex a indexat favicon-ul dvs.:

• Introdu adresa site-ului tău în caseta de căutare din Yandex (de exemplu, http://site) și vezi dacă există o favicon în apropiere.
• Urmați linkul http://favicon.yandex.net/favicon/ site-ul web(unde trebuie să înlocuiți „site” cu adresa URL a site-ului dvs.). Dacă pictograma este indexată, o veți vedea.
• Accesați Yandex.Webmaster (http://webmaster.yandex.ru) și verificați favicon.ico

2. Generatoare și galerii Favicon online

Deci, ne-am dat deja seama ce este un favicon, care este atât de necesar pentru un site. Am aflat că ar trebui să fie de 16 pe 16 în pixeli, iar extensia sa ar trebui să fie .ico. Acum există mai multe moduri de a crea favicon.ico:

1. Descărcați o pictogramă gata făcută din galeriile de favicon.
2. Creați o favicon de la zero folosind Photoshop sau un generator online.
3. Faceți un favicon dintr-o imagine finită (dimensiunile imaginii nu sunt importante).

2.1 Colecții și galerii Favicon

1. http://www.thefavicongallery.com/ — o mică galerie care include pictograme pe o varietate de subiecte. Conține aproximativ 300 de imagini. Pentru a descărca fotografia care vă place, trebuie să faceți clic dreapta pe ea și să selectați „salvare ca”, apoi să salvați favicon-ul pe computer.
2. http://www.iconj.com/— mai mult de 3 mii de pictograme pentru fiecare gust și culoare. Este posibil să salvați imaginea în format .gif sau .ico. Puteți chiar să luați codul html al pictogramei. Există faviconuri animate. Singurul dezavantaj al colecției este că există doar 30 de pictograme pe o pagină, așa că va trebui să vă uitați prin multe pagini pentru a alege imaginea potrivită.
3. http://www.favicon.cc/– o colecție uriașă de favicon-uri, dar există doar 20 de piese pe o singură pagină, va dura mult timp pentru a derula.
4. http://www.favicon.co.uk/- de asemenea, o galerie bună care conține multe favicon-uri. Există 144 de pictograme pe fiecare pagină, ceea ce face navigarea foarte convenabilă. Temele favicon-urilor sunt foarte diferite.
5. — o mică colecție (84 de bucăți) de mini-imagini pentru site-ul dvs.

2.2 Cum să faci o favicon pentru un site web de la zero

Avantajul creării unui favicon de la zero este că pictograma rezultată va fi unică, iar unicitatea este foarte importantă! Prin urmare, este mai bine să nu fii leneș și să petreci 5-10 minute creându-ți propriul favicon.

Nu ar trebui să fie probleme cu generarea pictogramei, deoarece... totul este clar aici.

2.2.4 Favicon-Generator.org

Un alt generator de favicon online bun. Puteți ajunge la el folosind acest link - http://favicon-generator.org/.

Nici cu acest generator nu ar trebui să fie probleme. Captura de ecran arată funcțiile generatorului de favicon online.

2.3 Cum se creează un Favicon pentru un site web dintr-o imagine existentă

Dacă nu doriți să faceți o favicon pentru site-ul dvs. de la zero, puteți utiliza o imagine care va deveni baza unui mini-logo. În acest caz, va trebui să pregătiți o imagine în avans (de preferință una pătrată, altfel modelul poate fi distorsionat la crearea favicon.ico) și apoi să o utilizați în serviciul online generator de favicon. Să ne uităm la cele mai populare două resurse.

2.3.1 Favicon.ru

Generatorul online este foarte ușor de utilizat, poate converti cu ușurință orice imagine de orice dimensiune într-o pictogramă mică de 16x16 pixeli. Acum veți vedea singur cât de ușor este să lucrați cu acest serviciu.

Există două moduri de a adăuga o imagine:

• Folosind butonul „Selectați fișierul”, găsiți imaginea dorită pe computer și încărcați-o.
• Introduceți în câmp adresa imaginii de pe Internet (acest fișier poate să nu fie nici pe computerul dvs.), iar serviciul va face totul singur.

După ce fișierul este descărcat, tot ce trebuie să faceți este să faceți clic pe „ Creează favicon.ico!" și așteptați câteva secunde. În continuare, va trebui doar să descărcați favicon-ul pe computer.

2.3.2 Favicon.cc

Acest generator online este mai puternic decât precedentul, dar și mai complex. Pentru a începe, urmați linkul - favicon.cc, apoi faceți clic pe „Importați imaginea” (în fereastra din stânga).

Apoi, faceți clic pe butonul „Selectați fișierul” și încărcați imaginea dorită. Pe baza acestuia, va fi creată o favicon pentru site-ul dvs. În acest caz, va trebui să alegeți ce să faceți cu imaginea atunci când o reduceți:

• Păstrați dimensiunile – lăsați neschimbat raportul de aspect al imaginii.
• Pictograma Micșorare la pătrat – aduceți părțile laterale ale imaginii la un aspect pătrat, dar imaginea poate fi distorsionată.

După ce încărcați fotografia, o puteți edita în generatorul online sau o puteți lăsa neschimbată. Dacă sunteți mulțumit de favicon.ico rezultat, descărcați-l pe computer.

3. Cum se instalează o favicon pe un blog WordPress

Cel mai adesea, favicon-ul se află în folderul rădăcină al site-ului, în plus, este mai convenabil, așa că vom lua în considerare această opțiune. Acest lucru se face în doi pași.

PRIMUL PAS. În primul rând, va trebui să găsiți o linie de cod html în tema care specifică calea către favicon. Pentru un blog WordPress, trebuie să găsiți fișierul header.php (Header) și să găsiți linia, ar trebui să arate cam așa (poate diferi ușor în funcție de temă):

Trebuie să înlocuiți această linie cu următoarele două:

IMPORTANT! Aceste linii ar trebui să fie plasate în interiorul etichetelor Și

AL DOILEA PAS. Acum trebuie să adăugați favicon-ul în folderul rădăcină al site-ului. Accesați găzduirea dvs. și plasați un fișier numit favicon.ico(dimensiune 16x16 pixeli).

Dacă ai făcut totul corect, acum site-ul tău are propria favicon.

O nouă lecție în stil atelier și de data aceasta aflăm secretele faviconului. Favicon - o pictogramă mică care apare în marcaje și în bara browserului. Dacă ai propriul tău site web și vrei să ieși în evidență față de ceilalți chiar și în lucruri mărunte - favicon necesar. Bineînțeles, arată cel mai avantajos printre marcaje, pe fundalul unei liste estompate de adrese fără nicio identificare grafică. Cu toate acestea, lecția noastră nu este atât despre cum să atașați o favicon la bara browserului, cât despre cum să vă desenați propria favicon în Photoshop.

În ce format ar trebui să salvez favicon-ul?

Totul depinde de browser. Pentru Microsoft Explorer format de pictogramă adecvat ICO. Am întâlnit deja acest format când am făcut cursorul. Pentru alte browsere de la Google Chrome inainte de Apple Safari obișnuit va face GIF sau PNG. Favicon poate fi translucid. Pentru a face acest lucru, trebuie să îl salvați în translucid PNG, apoi convertiți în format ICO. Acest lucru se poate face într-un program bun IcoFX. Cu toate acestea, există o mulțime de site-uri terțe pentru generarea de favicon-uri, iar cel mai evident dintre ele este www.favicon.ru

Cum să plasezi un favicon pe un site web?

Cum să fii sigur că favicon Va funcționa? Trebuie îndeplinite 4 condiții.

• Fișierul ar trebui să fie numit - favicon.
• Dimensiunea faviconului 16 pe 16px
• Locul optim pentru un favicon este folderul rădăcină al site-ului.
• Scrieți adresa pictogramei în metaetichete hederîn indexul site-ului.

În expresia HTML arată astfel:

Puteți crea mai multe pictograme pentru browsere diferite, de exemplu una în format ICO, iar celălalt în PNGși indicați toate acestea prin etichetă legătură . Browserele moderne caută cel mai adesea un fișier în rădăcina site-ului numit favicon, cu toate acestea, pentru a fi sigur, nu strica să indicați linkurile exacte.

Creați o favicon în Photoshop

Crea favicon foarte simplu. Vrei să faci unul ca acesta? favicon ca VKontakte sau Odnoklassniki? Bun favicon nu se poate face prin reducerea imaginilor mari în tot felul de „generatoare” favicon, care sunt pline de ele pe Internet. Favicon-ul este foarte mic. De fapt, suntem oarecum artă cu pixeli, care are propriile sale caracteristici. Nu puteți scrie o scrisoare și doar o reduceți la 16px .

Ca favicon va fi neclară și neclară, deoarece marginile literei se vor suprapune cu câțiva pixeli la redimensionare. Se va dovedi oarecum anti-alias, ceea ce este de obicei bun, dar în cazul pixel art-ului, astfel de tranziții pur și simplu nu sunt necesare. Pe de altă parte, ar trebui să evitați „fărâmarea” excesivă a rotunjirii, altfel veți ajunge cu gif-uri hello 1999.

Creați un fișier de dimensiune 16 X 16px . Vom crea un translucid foarte simplu favicon s sub forma unei scrisori, cu un pic de profunzime. Adâncimea va fi creată prin umbră și gradient.

Desenarea fundalului

De ce în introducerea acestei lecții vezi un uriaș neted și lins favicon? Pentru că l-am mărit pentru introducerea la lecție. Cum am reușit să măresc imaginea calitativ? 16px? Foarte simplu, lucrez întotdeauna în vector dacă este posibil să-l folosesc și dacă are sens. Iar vectorul suportă cu ușurință orice transformare și nu își pierde calitatea.

Selectați un instrument Instrument dreptunghi rotunjit. În panoul de setări, selectați modul, care vă va permite să desenați în vector. În meniul derulant al panoului există o bifă - Snap la pixeli. Acest lucru este necesar pentru ca traseele vectoriale să fie fixate în pixeli și să nu se deseneze „între” ei.

Avem o suprafață favicon, iar marginile translucide vor crea o rotunjime netedă. Acum este timpul să scapi de fundalul alb, nu este nevoie. Opriți vizibilitatea acestuia. Sau faceți dublu clic pe strat, transformându-l într-un strat obișnuit, apoi ștergeți-l.

O parte integrantă a site-urilor web moderne este Favicon, care vă permite să identificați rapid o anumită resursă în lista de file ale browserului. De asemenea, este dificil să ne imaginăm un program de calculator fără propria etichetă unică. În același timp, site-urile și software-ul în acest caz sunt unite de un detaliu nu în totalitate evident - ambele folosesc pictograme în format ICO.

Aceste imagini mici pot fi create folosind programe speciale sau servicii online. Apropo, acestea din urmă sunt mult mai populare în astfel de scopuri și vom lua în considerare o serie de astfel de resurse în acest articol.

Lucrul cu grafica nu este cea mai populară categorie de servicii web, dar atunci când vine vorba de generarea de pictograme, există cu siguranță o mulțime din care să alegeți. Pe baza principiului de funcționare, astfel de resurse pot fi împărțite în acelea în care desenați singur imaginea și site-uri care vă permit să convertiți o imagine gata făcută într-o ICO. Dar, practic, toate generatoarele de pictograme oferă ambele.

Metoda 1: Editor X-Icon

Acest serviciu este cea mai funcțională soluție pentru crearea de imagini ICO. Aplicația web vă permite să desenați pictograma în detaliu manual sau să utilizați o imagine gata făcută. Principalul avantaj al instrumentului este capacitatea de a exporta imagini cu o rezoluție de până la 64x64.

Deci, dacă trebuie să creați un set întreg de același tip de pictograme de dimensiuni diferite, nu veți găsi nimic mai bun decât X-Icon Editor în aceste scopuri.

Metoda 2: Favicon.ru

Dacă trebuie să generați o pictogramă favicon cu o rezoluție de 16x16 pentru un site web, serviciul online în limba rusă Favicon.ru poate servi și ca un instrument excelent. Ca și în cazul soluției anterioare, aici puteți fie să desenați singur o pictogramă, colorând fiecare pixel separat, fie să creați o favicon dintr-o imagine finită.

Ca rezultat, un fișier cu extensia ICO este salvat pe computer, care este o imagine de 16x16 pixeli. Serviciul este perfect pentru cei care au nevoie doar să transforme o imagine într-o pictogramă mică. Totuși, a-ți arăta imaginația în Favicon.ru nu este deloc interzis.

Metoda 3: Favicon.cc

Asemănător precedentului atât ca nume, cât și ca principiu de funcționare, dar un generator de pictograme și mai avansat. Pe lângă crearea de imagini obișnuite de 16x16, serviciul vă permite să desenați cu ușurință un favicon.ico animat pentru site-ul dvs. web. În plus, resursa conține mii de pictograme personalizate disponibile pentru descărcare gratuită.

Dacă interfața în limba engleză nu vă deranjează, atunci nu există absolut niciun argument în favoarea lucrului cu serviciul anterior. Pe lângă faptul că Favicon.cc poate genera pictograme animate, resursa recunoaște corect și transparența în imaginile importate, de care omologul în limba rusă îi lipsește, din păcate.

Metoda 4: Favicon.by

O altă opțiune pentru un generator de favicon pentru site-uri web. Este posibil să creați o pictogramă de la zero sau pe baza unei anumite imagini. Printre diferențe, putem evidenția funcția de import a imaginilor din resurse web terțe și o interfață destul de elegantă, laconică.

În general, nu există diferențe în lucrul cu serviciile deja discutate în acest articol, cu toate acestea, resursa Favicon.by se descurcă mult mai bine cu conversia imaginilor în ICO, iar acest lucru este destul de ușor de observat.

Metoda 5: Conversie online

Este probabil să cunoașteți deja acest site ca un convertor de fișiere online practic omnivor. Dar nu toată lumea știe că acesta este unul dintre cele mai bune instrumente pentru a converti orice imagini în ICO. Ca rezultat, puteți obține pictograme cu o rezoluție de până la 256x256 pixeli.

După cum puteți vedea, crearea unei pictograme ICO folosind site-ul Online-Convert nu este deloc dificilă și se poate face în doar câteva clicuri de mouse.

Bună ziua, dragi cititori ai site-ului blogului. Conversația din articolul de astăzi se va concentra pe așa-numitele pictograme Favicon.ico. Ne vom da seama ce este un favicon, de ce trebuie să îl instalați pe site-ul dvs. web și cum să creați singur o pictogramă de dimensiunea necesară.

În principiu, pentru a crea un favicon, nu este deloc necesar să folosiți niciun generator online special, deși este destul de convenabil și simplu. Puteți încerca să o faceți în Photoshop, dar implicit, din păcate, nu poate salva imagini în format ICO. Prin urmare, pentru a învăța Photoshop să lucreze cu ICO, va trebui să instalați un plugin special.

Dar dacă nu vă simțiți confortabil cu Photoshop (la fel ca și cu acesta), atunci vă va fi mult mai convenabil să utilizați unul dintre numeroasele servicii online enumerate mai jos. Mai mult, în unele dintre ele vei putea desena o nouă pictogramă complet de la zero, iar în altele vei putea reface o imagine existentă (care ți se potrivește) într-un format favicon.

Ei bine, cea mai ușoară opțiune este să descărcați colecția Favicon dintr-o galerie sau catalog online. Citiți mai jos despre unde le puteți obține.

Cum să creați un Favicon online și de unde puteți descărca o colecție a acestora

Permiteți-mi să dau mai întâi exemple de servicii (așa-numitele generator de favicon), unde puteți, fără abilități speciale, să creați un mini-logo complet decent pentru site-ul dvs. sau cel puțin să convertiți automat o imagine potrivită în formatul necesar pentru încărcarea unui favicon pe site.

1. Faviсon.cc— un generator de favicon online destul de convenabil. Folosind-o, puteți, de exemplu, să vă creați propria pictogramă de la zero (complet exclusivă), desenând-o pixel cu pixel. Pentru a face acest lucru, va trebui să faceți clic pe butonul „Creare New Favcon” din partea stângă a ferestrei de servicii.

   

   În centrul paginii generatorului există o zonă în care fiecare pătrat este un pixel al viitorului tău favicon. Sarcina ta este să pictezi aceste pătrate cu culori diferite. Pentru a picta un pătrat cu o culoare, trebuie să bifați caseta din partea dreaptă a ferestrei de serviciu în câmpul „Color Picker”, selectați culoarea dorită din paleta situată acolo și faceți clic pe pătratul dorit. Pentru a elimina umbrirea incorectă, bifați caseta „transparentă” și faceți clic pe pătrat, în urma căruia acesta va deveni incolor (transparent).

   Pentru a muta un pixel pe panza generatorului, va trebui să bifați caseta „mutare”. Puteți vedea rezultatul muncii dvs. la scară reală în zona „Previzualizare” de sub pânză. Dacă Favicon-ul pe care l-ați creat vi se potrivește, faceți clic pe butonul „Descărcare” pentru a-l salva pe computer. Ca urmare, veți primi un fișier grafic pe care îl puteți descărca și încărca apoi pe serverul de găzduire.

   Acum știi cum să faci un mini logo pentru site-ul tău de la zero. Dar dacă nu ai talente grafice, atunci poți folosi serviciul generator online încărcați orice imagine pentru viitoarea favicon, care va servi drept blanc. Poza poate avea absolut orice dimensiune și format. Pentru a încărca fișierul pictogramă în serviciul online, va trebui să faceți clic pe butonul „Importați imaginea” din partea stângă a ferestrei serviciului.

   

   În fereastra care se deschide, faceți clic pe butonul „Răsfoiți” și găsiți o imagine potrivită pe computer. Apoi alegeți ce să faceți cu raportul de aspect al imaginii dvs. când o convertiți la 16 pe 16 (pătrat). Acest lucru este adevărat dacă imaginea pe care o încărcați nu este pătrată. În acest caz, sunt posibile două opțiuni: lăsați raportul de aspect neschimbat (Păstrați dimensiunile) sau convertiți imaginea într-o vizualizare pătrată (pictograma Reducere la pătrat). În al doilea caz, imaginea viitorului favicon va fi distorsionată de-a lungul uneia dintre axe.

   Pentru a încărca în generatorul online și a vă converti imaginea, va trebui să faceți clic pe butonul „Încărcare”. Favicon.ico creat din acesta va fi editabil în același mod ca cel pe care l-ați desenat. Când ați terminat de lucrat la capodopera dvs., faceți clic pe butonul „Descărcare” pentru a o descărca pe computer.

   Acest serviciu online are și posibilitatea de a utiliza colecții de favicon-uri create de alți utilizatori și puse la dispoziția publicului. Pentru a vizualiza exponatele disponibile în galerie, va trebui să faceți clic în partea stângă a ferestrei fie pe butonul „Ultimele Favicons” pentru a vizualiza colecțiile sortate după data creării, fie pe butonul „Top Rated Favicons” pentru a vizualiza galerii sortate după rating.

2. Favicon.ru- cândva acest serviciu a fost mult mai simplu decât generatorul online descris mai sus, dar recent a devenit aproape analogul său, dar numai în rusă. Favicon.ru nu numai că vă permite să convertiți orice imagine pe care o aveți (pe computer sau pe Internet) în formatul ICO cu o dimensiune de 16 pe 16 pixeli, dar face și posibil să o desenați de la zero, pixel cu pixel.

   

   Această versiune a generatorului de favicon online este notabilă, poate, doar pentru că este casnică. De aceea a ajuns în acest articol. Deci, pentru a lucra cu el, trebuie să faceți clic pe butonul „Selectați fișierul” din partea de sus a paginii principale și să specificați calea către imaginea dorită pe computer. Imaginea descărcată și convertită în formatul Favicon.ico poate fi corectată și apoi salvată pe computer. Totul este simplu și convenabil.

3. Logaster.ru este un generator de logo online, dar pe lângă logo-uri, creează și o favicon. Spre deosebire de toate celelalte servicii, nu trebuie să desenați un design favicon sau să îl convertiți dintr-un logo.

   

   Pentru a crea un favicon, trebuie mai întâi să introduceți numele site-ului sau al companiei și să selectați tipul de activitate. Serviciul va oferi câteva zeci de șabloane favicon gata de utilizare. Puteți citi mai multe despre cum să creați o favicon. După ce ați creat Favicon.ico, puteți descărca fișierul pe computer în format ICO sau PNG.

După aceea, tot ce trebuie să faceți este să faceți clic pe butonul „Creați”. Pe pagina care se deschide, veți vedea un link pentru a descărca favicon-ul rezultat.

O selecție de generatoare online, colecții și galerii de faviconuri

Dacă dintr-un motiv oarecare nu v-a plăcut generatorul de favicon descris mai sus, atunci vă pot sugera să vă încercați norocul la una dintre următoarele servicii online gratuite:

1. FaviconGenerator - vă permite să convertiți orice imagine descărcată de pe computer în formatul favicon dorit (puteți încărca imagini).
2. AntiFavicon este un generator de Favicon destul de interesant. Pe el poți creați un favicon cu o inscripție. Va trebui să introduceți textul inscripției în câmpurile „Text de sus” și „Tex de jos” și să ajustați schema de culori în zona „Culori”.
3. FavIcon din Pics este un alt serviciu online simplu - specificați calea către imagine pe computer, convertiți și descărcați fișierul rezultat în format ICO și GIF.
4. Iconj - ceea ce este remarcabil este că puteți fie să descărcați pictograma creată, fie să o lăsați în serviciu și să primiți un link către acest fișier
5. DeGraeve este un generator de Favicon destul de puternic, similar ca funcționalitate cu Favicon.cc revizuit anterior. Și aici puteți face totul fie de la zero, fie încărcați o imagine, care ulterior poate fi ajustată și descărcată în format ICO de o dimensiune adecvată.
6. Generator - vă permite atât să generați o favicon dintr-o imagine încărcată, cât și să o creați de la zero într-un editor special.
7. Editor de pictograme online favicon.ico - ei bine, face totul - creând favicon-uri de la zero și modificând o imagine existentă.
8. Favicon online este un instrument foarte funcțional pentru crearea și editarea mini-logo-urilor
9. Generator Favicon gratuit - în cazul în care nimic din lista de mai sus nu vi se potrivește.
10. Generator de favicon - simplu și de bun gust...

Dacă nu îți pasă de exclusivitatea mini-logo-ului tău pentru site și nu poți să te chinui cu editorii și generatorii, atunci poți alege o pictogramă potrivită pentru tine pe site-urile în care acestea sunt un ban pe duzină. La urma urmei, de fapt, absolut orice pictogramă care măsoară 16 pe 16 pixeli, pe care o poți descărca de pe Internet sau o poți găsi în adâncul computerului tău, ni se va potrivi.

Dar trebuie să rețineți că favicon-ul trebuie să atragă în primul rând atenția utilizatorilor. În mod ideal, un utilizator ar putea să vă recunoască site-ul doar uitându-se la Favicon, deci este mai bine dacă este unic, dar puteți căuta și ceva ieșit din comun pe internet.

Dacă nu ai dorința sau oportunitatea (nu ești artist și nu ai fost niciodată), atunci cel mai simplu mod ar fi să încerci să cauți în galerii cu colecții de faviconuri gratuite:

1. Galerie de pictograme pentru site-ul favicon.ico - peste 15.000 de mini-logo-uri pentru site-ul dvs. pentru orice gust și culoare
2. Iconj este o colecție destul de mare de icoane concepute de alți oameni și puse la dispoziția publicului
3. Favicon.cc - 55 de mii de opțiuni diferite pentru toate ocaziile. Există, de asemenea, favicon-uri animate, care vor fi vizibile doar în browserul FireFox.
4. Galeria Favicon - încă câteva pictograme care se potrivesc dimensiunii

Dacă cunoașteți alte resurse similare, voi adăuga link-urile dvs. la această listă.

Cum să instalați un Favicon pe un site web și să specificați calea către acesta

Browserul dvs. și robotul de căutare Yandex vor căutați faviconul în primul rând în folderul rădăcină al site-ului dvs. Prin urmare, vă puteți conecta pur și simplu la site prin FTP și încărcați fișierul Favicon.ico în directorul său rădăcină (de obicei folderele public_htm sau htdocs) (este mai bine să îi scrieți numele cu litere mici). Acum deschideți resursa într-un browser și vedeți dacă pictograma de pe filă s-a schimbat. S-a schimbat? Nu? Ei bine, e în regulă.

Dacă nu ați reușit să plasați un favicon în acest fel, atunci poate fi necesar, deoarece... Se întâmplă adesea ca o versiune veche să fie încărcată din cache. Puteți încerca, pentru mine răspunde cel mai bine la modificările făcute fără a șterge memoria cache. Dacă problema nu se află în memoria cache a browserului, atunci aceasta înseamnă că site-ul dvs. are o locație diferită pentru favicon, diferit de folderul rădăcină. Cum pot verifica asta?

Deschideți codul sursă al oricărei pagini de pe site-ul dvs. Pentru a vedea codul sursă, faceți clic dreapta pe pagină și selectați elementul corespunzător din meniul contextual (de exemplu, „Codul sursă” în vechea Opera sau „Codul sursă paginii” în Mazila Firefox sau „Vizualizare codul paginii” în Google Chrome sau „Vizualizați codul HTML” în IE) sau apăsați combinația de taste Ctrl+U. Acum uitați-vă în partea de sus a codului paginii pentru o linie care specifică calea către favicon.ico.

Ar putea arăta cam așa:

Acum, cunoscând această cale, vă puteți conecta din nou prin FTP și vă puteți încărca favicon-ul folosind calea specificată, înlocuind-o pe cea deja de pe site. Dacă nu au mai avut loc modificări în bara de adrese a browserului, încercați din nou să ștergeți memoria cache a browserului.

ÎN Joomla Favicon se află de obicei în folderul cu șablonul pe care îl utilizați (calea către acesta în Joomla 1.5 a fost scrisă în fișierul index.php din directorul aceluiași șablon, dar în Joomla 3 totul a devenit puțin mai complicat). Acestea. Pentru a schimba favicon-ul în Joomla, tot ce trebuie să faceți este să urmați această cale și să încărcați fișierul favicon.ico acolo și să răspundeți afirmativ la întrebarea despre înlocuire:

/templates/folder_with_the_design_template/favicon.ico

Fișierul Favicon în WordPressîn mod implicit, poate fi și în folderul cu tema pe care o utilizați (calea către aceasta este, de asemenea, setată acolo):

/wp-content/themes/Folder_with_theme_you_are_using/favicon.ico

În general, dacă vrei setați sau modificați calea către favicon, care ar fi înțeles atât de browsere, cât și de robotul de căutare Yandex, atunci va trebui să îl scrieți în fișierul șablon corespunzător pentru Joomla, WordPress sau orice alt motor, între etichetele de deschidere și de închidere CAP, următoarele linii de cod:

În ce fișier șablon trebuie să scrieți aceste rânduri depinde de motorul site-ului dvs. De exemplu, în în WordPress trebuie să deschideți fișierul header.php pentru editare: wp-content/themes/Folder_with_your_theme_design. Deschideți header.php în editor și găsiți la început eticheta Html HEAD de deschidere. În orice loc după acesta, dar înainte de HEAD de închidere, scrieți una dintre liniile de cod de mai sus indicând calea către fișierul dvs. grafic mini-logo.

Cum să instalați favicon animat? Practic, exact la fel ca unul obișnuit. Singura diferență va fi codul inserat în șablonul site-ului dvs., cu care indicați browserelor și robotului de căutare Yandex calea către fișierul grafic dorit. Faptul este că Faviconul animat va avea o extensie GIF și, prin urmare, în liniile de cod va trebui să scrieți ceva de genul acesta:

Aceasta este toată diferența dintre favicon-urile animate și cele obișnuite. Dar vă rugăm să rețineți că pictograma animată va funcționa numai în FireFox în alte browsere, va fi statică. Yandex, când vă încărcați faviconul animat, îl convertește într-un format PNG static. Dar, după părerea mea, nu merită problemele - instalarea unuia animat în loc de un mini-logo obișnuit pentru un site nu are prea mult sens. Dar asta e doar IMHO meu.

Multă baftă! Ne vedem curând pe paginile site-ului blogului

Puteți viziona mai multe videoclipuri accesând

S-ar putea să fiți interesat

Analiza site-ului web în serviciile online gratuite Pr-cy, Cy-pr, Be1, Xseo și altele
Utilizabilitate - cum să vă faceți site-ul convenabil pentru vizitatori și să încercați să-i lăsați să citească articolele dvs. cât mai mult timp posibil
Client FTP online Net2ftp și Google Alerts - servicii utile pentru webmasteri
Pictograme, insigne, fundaluri, imagini și logo-uri pentru site (servicii online IconFinder, Freepik, PSDGraphics și altele)

Bună, dragi prieteni! Astăzi voi scrie despre cum să faci o favicon pentru un site web sau blog. Mai mult, voi lua în considerare 2 moduri de a crea un favicon. Veți învăța cum să creați o iconiță favicon în Photoshop și să utilizați un serviciu online ;-).

Înainte de a începe să citiți acest articol, vă sfătuiesc să citiți și alte postări utile care vă vor îmbunătăți resursa: „”, ?”, „”.

Acum să revenim la subiectul postării. Dacă un site nu are un favicon, atunci pierde foarte mult. În primul rând, o favicon poate crește traficul de la Yandex. Întreabă cum? Foarte simplu. Faptul este că Yandex arată, de asemenea, favicon-ul site-ului lângă antetul Titlu. Și dacă titlurile și descrierile a două resurse sunt aproximativ aceleași, dar una are favicon și cealaltă nu, atunci vizitatorul va merge cel mai probabil la resursa cu favicon.

Ei bine, și în al doilea rând, o astfel de pictogramă mică vă poate distinge resursa de altele. Prin urmare, favicon-ul trebuie să fie strălucitor și memorabil. Deci haideți să încercăm să o creăm așa.

Cum să faci o favicon pentru un site web de la zero

Pentru a crea o favicon, voi folosi . Este foarte usor de folosit. Mai întâi, trebuie să specificați culoarea pe care o veți folosi la crearea favicon-ului. Pentru a face acest lucru, setați nuanța și saturația.

După ce ați ales o culoare, începem să desenăm favicon-ul. Dacă ai desenat ceva greșit, îl poți șterge. Pentru a face acest lucru, bifați caseta de lângă instrumentul „transparent”.
Așa că am făcut un astfel de favicon în câteva minute ;-).

Mai jos, există o previzualizare și puteți vedea oricând ce aveți. După ce desenați o favicon, va trebui să o descărcați pe computer. Pentru a face acest lucru, faceți clic pe butonul „Descărcați Favicon”.

Cum să faci un favicon pentru un site web dintr-o imagine gata făcută

Puteți face un favicon din orice imagine. Aceasta ar putea fi fotografia dvs., sigla site-ului sau altceva. Pentru a face acest lucru, trebuie să deschideți Photoshop și să încărcați imaginea pe care doriți să o convertiți într-o favicon. Faceți clic pe „Fișier” - „Deschidere”.

Apoi trebuie să decupați imaginea astfel încât să devină pătrată. Pentru a face acest lucru, selectez instrumentul „Decupare”, încercuiesc partea pe care vreau să o părăsesc și apasă „Enter”.

Apoi, trebuie să reduceți imaginile la 16 px. Pentru a face acest lucru, selectați din bara de instrumente Imagini – dimensiunea imaginii.

Setați lățimea și înălțimea la 16 px și faceți clic pe OK.

Dacă știi să folosești Photoshop, poți face cu ușurință o favicon pentru un site web de la zero. Pentru a face acest lucru, creați un fișier nou cu o lățime și înălțime de 16 px, apoi desenați tot ce doriți acolo și salvați acest fișier în format iso.

Există, de asemenea, multe servicii pe Internet de unde puteți descărca o favicon pentru site-ul dvs. web. Iată cele mai populare:

• www.audit4web.ru/info/favicon
• www.favicon.cc - un serviciu deja familiar
• www.iconj.com
• www.favicon.co.uk/gallery.php
• thefavicongallery.com
• favicon-gallery.ru/gallery

Cum să faci un favicon pentru wordpress

După ce ați creat sau descărcat un favicon, trebuie să îl atașați cumva pe site. Vă voi arăta acum cum să faceți acest lucru folosind motorul WordPress.

Mai întâi trebuie să încărcați pictograma pe găzduirea dvs. la această adresă: wp-content/themes/theme names/images/

După aceea, accesați Panoul de control – Aspect – Editor, deschideți fișierul header.php și scrieți următorul cod acolo, înainte de eticheta „/head”:

În acest cod trebuie să schimbați:

• website – introduceți-vă domeniul;
• BusinessBlog – introduceți numele subiectului dvs.;
• favicon.ico – indicați numele pictogramei pe care ați încărcat-o pe găzduire.

Acum salvați modificările și vedeți ce aveți:

De asemenea, se poate ca după actualizarea site-ului să nu vedeți nicio modificare. Acest lucru se datorează faptului că browserul vă încarcă site-ul nu de pe server, ci din cache. Prin urmare ai nevoie.
Și dacă aveți un plugin de cache pe site-ul dvs., de exemplu, Super Cache, atunci ștergeți și cache-ul de acolo.

Apoi reîmprospătați pagina și verificați favicon-ul. Acum ar trebui să apară cu siguranță dacă ați introdus corect calea către el pe găzduirea dvs.

Da, și încă ceva. Yandex nu va afișa imediat pictograma în rezultatele căutării. Trebuie să așteptați puțin până când robotul vă reindexează site-ul.

Ei bine, acum asta este totul despre întrebarea cum să faci o pictogramă favicon pentru un site web. Pa tuturor; la revedere tuturor.