Creați Favicon online. O modalitate universală de a crea faviconuri Creați o favicon online

Favicon este o pictogramă a unui site web sau a unei pagini sub forma unei pictograme mici, cu dimensiunea de 16x16 pixeli (sau mai mare). Utilizatorul poate vedea un favicon sub forma unei imagini mici în bara de adrese a browserului din stânga linkului către un site deschis, lângă numele site-ului în marcaje și file, în rezultatele unor motoare de căutare, directoare, servicii de marcare , etc.

La un moment dat, favicon-urile puteau fi create doar în format .ico, deoarece era acceptat doar de vechiul browser Internet Explorer. De aici provine numele favicon (prescurtarea cuvântului englezesc FAV orite ICONA– „pictogramă pentru favorite”). „Favorite” era numele dat marcajelor în browserul IE.

Astăzi, pictogramele pentru site-uri web și pagini pot fi create în multe alte formate, inclusiv jpg, png, gif și, bineînțeles, ico-ul vechi.

De ce ai nevoie de un favicon?

Instalarea unor astfel de pictograme vă permite să accelerați căutarea vizuală pentru fila dorită, mai ales dacă există multe dintre ele deschise. Să vezi o imagine recunoscută este mult mai ușor și mai rapid decât să te uiți la titlurile paginilor.

Așa arată favicon-urile într-un browser.

Dacă motoarele de căutare arată favicon-ul proiectului dumneavoastră în rezultatele căutării, acest lucru va avea un efect pozitiv asupra creșterii pozițiilor acestuia. Un logo frumos, stilat și în același timp simplu va atrage atenția publicului țintă și va încuraja utilizatorul să meargă mai degrabă pe site-ul dvs. decât pe următorul. Toate acestea vor ajuta la creșterea ratelor de clic și, în consecință, la creșterea factorilor comportamentali.

Mai mult, icoana va fi amintită de utilizatori, iar după ceva timp va deveni recunoscută pentru un public larg, ceea ce va fi și o atracție suplimentară pentru vizitatori.

Nota. Este mai bine să instalați un favicon pe o resursă web deja optimizată.

De exemplu, motorul de căutare Yandex are roboți speciali YandexFavicons care indexează favicon-urile. Aceștia vizitează site-uri pentru a colecta și actualiza insignele aproximativ o dată pe lună.

În acest sens, rar apar actualizări, după care merită să verificați dacă există o pictogramă schimbată sau nouă pentru site. Prin urmare, după instalarea unei noi imagini, modificările în afișarea resursei dvs. relative ar trebui să aștepte cel puțin două săptămâni (acesta este minimul).

Odată ce motorul de căutare găsește pictograma, va trebui să o convertească în format PNG (dacă este făcută în format ICO). După aceasta, puteți găsi favicon-ul resursei dvs. la adresa (folosind Yandex ca exemplu): http://favicon.yandex.net/favicon/URL-address-of-your-site.

Cum se creează o favicon pentru un site web?

Nu este suficient să faci un favicon pur pentru spectacol. Dacă doriți să devină o sursă suplimentară pentru atragerea de vizitatori, este important să știți cum să creați corect o pictogramă de site.

Cataloage și servicii pentru crearea favicon-urilor

Puteți crea o pictogramă pentru un site web sau una dintre paginile acestuia, mai ales dacă vă simțiți confortabil cu Photoshop și alte programe similare. Dacă nu aveți nici abilitățile, nici timpul, nici dorința, astăzi există o abundență de servicii speciale convenabile disponibile pentru generarea de favicon-uri și galerii, care oferă pictograme gata făcute pentru proiectele dvs.:


Și acestea nu sunt toate generatoare și cataloage, așa că un webmaster modern poate găsi cu ușurință favicon-ul care îi place.

Aspectul pictogramei

Dimensiunea standard a favicon-ului este de 16x16 pixeli. Exista si dimensiunile 24x24, 32x32, 48x48 si 64x64. Trebuie să înțelegeți că pictograma unui site este fața sa, de care traficul depinde într-o anumită măsură. Prin urmare, este necesar să abordați cu înțelepciune crearea unui favicon. Iată câteva reguli despre cum ar trebui să arate o pictogramă pentru a atrage atenția utilizatorilor:

  • Stil corespunzător temei site-ului. Imaginea ar trebui să fie dominată de aceleași culori și elemente care sunt utilizate în designul resursei de internet sau al logo-ului acesteia. De fapt, aceasta este sarcina principală a favicon-ului – să corespundă site-ului.
  • Usor de inteles. Nu ar trebui să desenați o abundență de elemente și să le sculptați una peste alta. Utilizatorul, care privește pictograma, ar trebui să înțeleagă ce este descris pe ea și să nu încerce să dezvăluie „sensul ascuns”. Minimalismul rezonabil este cheia succesului.
  • O imagine memorabilă. Acest punct este strâns legat de cele două anterioare. Tema și simplitatea favicon-ului se vor asigura că utilizatorii își vor aminti mai repede și mai ușor. Încercați să utilizați o imagine care, atunci când o persoană se uită la ea, o poate descrie într-un cuvânt. De exemplu, același motor de căutare „Yandex” a abordat această problemă perfect, iar acum, când vedeți logo-ul sub forma literei „I”, vă veți aminti imediat acest motor de căutare.

Instalarea unui favicon

După crearea unui favicon, acesta trebuie instalat pe site. Este foarte ușor să faci asta:

  1. Încărcați imaginea favicon.ico în folderul rădăcină al site-ului dvs. web;
  2. Scrieți următorul cod în codul HTML al site-ului propriu-zis, în metaeticheta head:

Codul favicon ar trebui să fie situat între etichete. Este în general acceptat că atunci când se codifică este folosit cât mai sus posibil în cod.

Se afișează Favicon pe mobil

Favicon pentru site-uri mobile folosit ca pictogramă principală a site-ului dvs. Când deschideți un site pe un telefon mobil, această favicon este afișată pe ecranul principal de acces rapid din browser. Site-ul dvs. poate fi adăugat pe ecranul principal al telefonului, iar favicon-ul mobil este inclus și aici.


După cum puteți vedea în captura de ecran de mai sus, pe VKontakte și Avito, favicon-ul nu este adaptat pentru dispozitive mobile, așa că este folosită prima literă a domeniului.

În era telefoanelor mobile, fiecare site web trebuie să folosească astfel de Favicons pentru a fi afișate pe telefoanele mobile. Acest lucru creează o experiență convenabilă pentru vizitatorii site-ului dvs.

Pictogramă pentru iOS

Pentru ca favicon-ul să fie afișat pe dispozitivele iOS și în browserul Safari, trebuie să scrieți următorul cod:

Android

Pentru dispozitivele care rulează pe Android, scriem:

Dar acest cod va afișa favicon-ul tău, doar în browser. Și pentru ca pictograma să fie afișată pe desktopul smartphone-ului, trebuie să specificați un fișier manifest.

Conținutul său:

( „nume”: „%title%”, „pictograme”: [ ( „src”: „\/android-chrome-36x36.png”, „dimensiuni”: „36x36”, „tip”: „imagine\/png „, „densitate”: „0,75” ), ( „src”: „\/android-chrome-48x48.png”, „dimensiuni”: „48x48”, „tip”: „imagine\/png”, „densitate” : „1.0” ), ( „src”: „\/android-chrome-72x72.png”, „dimensiuni”: „72x72”, „tip”: „imagine\/png”, „densitate”: „1,5” ) , ( „src”: „\/android-chrome-96x96.png”, „dimensiuni”: „96x96”, „tip”: „imagine\/png”, „densitate”: „2.0” ), ( „src” : „\/android-chrome-144x144.png”, „dimensiuni”: „144x144”, „tip”: „imagine\/png”, „densitate”: „3.0” ), ( „src”: „\/android -chrome-192x192.png”, „dimensiuni”: „192x192”, „tip”: „imagine\/png”, „densitate”: „4.0” ) ] )

Dar asta nu este tot.În noile versiuni de Android (începând cu Lollipop), browserul dumneavoastră poate fi recolorat în culoarea interfeței site-ului.


Pentru a realiza o astfel de caracteristică, scrieți o linie și setați-vă culoarea:

Windows Phone

Nu uitați nici de favicon în Windows Phone:

Pentru setări mai avansate pentru pictograme în Windows Phone, puteți utiliza următoarele valori:

#8A2BE2

Fișierul de configurare în sine:

Servicii pentru generarea și verificarea favicon-urilor

digitalagencyrankings.com

Introdu adresa site-ului tău web și obține o analiză.


Nu neglijați configurarea favicon-ului pentru dispozitivele mobile. Amintiți-vă că acest lucru este convenabil pentru vizitatorii dvs., le este ușor să vă vadă site-ul în browser și să acceseze el.

Concluzie

Astăzi, aproape toate browserele acceptă favicon-uri. Pictograma fiecărui site este unică, iar crearea corectă a acesteia va transmite întreaga esență a site-ului și va crește rata de clic a site-ului dvs. în rezultatele căutării.

Pe baza acestui fapt, putem concluziona că favicon-ul servește ca o modalitate suplimentară de a vă distinge proiectul de un număr mare de alte site-uri, de a crește memorabilitatea și recunoașterea acestuia. Acest lucru va ajuta cu siguranță la creșterea traficului de căutare.

Favicon este o pictogramă mică care apare lângă numele site-ului în fereastra browserului sau în rezultatele motorului de căutare. Nu are nicio funcție pentru SEO, dar utilizarea lui vă permite să creșteți recunoașterea site-ului și, ca urmare, indicatorul CTR. De asemenea, puteți crea favicon-uri pentru retină.

Ce dimensiune ar trebui să aibă un favicon?

De obicei, favicon-urile au dimensiuni de 16x16px sau 32x32px.


În ce format voi primi favicon-ul?

După ce faci un favicon, vei primi un fișier favicon.ico pentru site, adică un fișier cu extensia *.ico. Acesta este ceea ce va trebui folosit în viitor.


 ...


 ...

Cum se creează o favicon online?

Utilizați generatorul de favicon online pe site-ul nostru. Puteți nu numai să creați o favicon dintr-o imagine, ci și să utilizați editorul încorporat care vă permite să creați orice pictogramă pentru site.

Cum să plasați o favicon pe un site web

Trebuie să încărcați favicon-ul în directorul rădăcină al site-ului pentru a obține o adresă precum http://sitename.ru/favicon.ico. Aceasta este calea către imagine. Apoi trebuie să puneți codul în etichetă. Ar trebui să arate așa:

De ce să specificați calea către favicon?

Unele site-uri folosesc diferite favicons pentru a ajuta utilizatorii să navigheze mai bine în secțiunile de resurse, așa că este necesar să se indice calea. Dacă utilizați o singură favicon pentru întregul site, nu trebuie să specificați calea către acesta.

Favicon-ul va fi afișat în rezultatele căutării?

Pentru o perioadă foarte lungă de timp, principalul format de favicon pentru un site web a fost ico. Este convenabil deoarece puteți scrie mai multe dimensiuni de pictograme cu adâncimi de biți diferite într-un fișier simultan. În zilele noastre formatele png și svg sunt mai populare. Formatul svg este folosit în Safari MacOS, iar png este folosit în alte sisteme de operare și platforme. Favicon-urile vin în formate jpeg și gif, dar nu recomandăm să le folosiți, deoarece nu toate browserele acceptă astfel de favicon-uri.

Verificați compatibilitatea browserului pentru diferite tipuri de faviconuri folosind serviciul caniuse.com.

Cel mai promițător format este svg. Acestea sunt favicon-uri vectoriale care sunt ușoare, dar se afișează bine.


Lasă o cerere

Dimensiuni favicon

Desktop

Măr

Cum se creează

La prima vedere, cel mai simplu mod de a crea un favicon pare să fie pur și simplu redenumirea fișierului în formatul dorit. Să presupunem că aveți un fișier favicon.png și pur și simplu îl redenumiți favicon.ico. Nu vă recomandăm să faceți acest lucru, deoarece în multe browsere o astfel de pictogramă va fi afișată cu o eroare sau nu va fi afișată. Cel mai bine este să creați o pictogramă pentru un site web folosind servicii speciale.

Realfavicongenerator.net– generează online favicon-uri de diferite dimensiuni. Încărcați un fișier sursă de cel puțin 260x260 pixeli, de preferință pătrat. Apoi selectați setările pentru iOS, Android, Windows Phone, MacOS Safari. Opțional, selectați nivelul de compresie. Ca rezultat, obțineți toate tipurile de pictograme și cod de încorporare.


Favicon.cc– un alt serviciu pentru crearea faviconului în format ICO. Puteți să încărcați o imagine gata făcută sau să o desenați singur folosind instrumentele unui editor grafic.


Cum se instalează

Setați numele corect– favicon.ico sau alt tip de extensie. Cu toate acestea, rețineți că browserele vechi nu vor putea recunoaște pictograma dacă este într-un format diferit. Înainte de a încărca pe site, deschideți proprietățile fișierului, asigurați-vă că formatul necesar nu este doar în numele fișierului, ci și în tipul acestuia.

Creați pictograme pe mai multe platforme. Specificați dimensiunile și formatele corecte pentru diferite platforme mobile și browsere. Roboții și browserele moderne, atunci când le afișează, selectează cel mai potrivit format dintre cele descărcate. Acesta va fi afișat mai bine decât în ​​timpul redimensionării, când favicon-ul este încărcat singur și trebuie schimbat la dimensiunea necesară. Utilizați serviciul realfavicongenerator.net.

Puneți fișierele în directorul rădăcină al site-uluiși verificați corectitudinea. Pentru a face acest lucru, introduceți „yoursite.com/favicon.ico” în bara de adrese pentru fișierele în format ico, pentru alte formate - extensia de fișier corespunzătoare. Browserul ar trebui să afișeze pictograma.

Scrieți adresa în cod pe pagina principală din etichetă . Dacă cerința este de dorit, dar nu este necesară, deoarece browserele versiunilor noi caută automat favicon-ul în directorul rădăcină dacă nu îl găsesc în. Folosind head, vă puteți seta propriile pictograme pentru diferite pagini ale site-ului.

Desktop (ico) -

Desktop (png) -

Măr -

Safari -

Android -

Pictogramele din gadgeturile Apple sunt întotdeauna rotunjite la colțuri pentru a evita acest lucru, utilizați apple-touch-icon-precomposed în loc de apple-touch-icon.

Verificați răspunsul serverului. Favicon-ul este indexat de un robot special. Pentru ca indexarea să aibă succes, verificați dacă linkul către favicon nu este blocat de la indexare în fișierul robot.txt și returnează un răspuns server HTTP 200.

Aflați dacă favicon-ul este vizibil. Verificați serviciile prin înlocuirea adresei site-ului dvs. web:

Ține minte

    Cel mai comun format de favicon este ico, dar este depășit. Este mai bine să utilizați formatul png și svg. Verificați ce formate acceptă browserele folosind serviciul caniuse.com.

    Anterior, era suficient să creați o dimensiune favicon de 16x16 pixeli. Acum creați pictograme de toate dimensiunile. Dacă ați creat un favicon de aceeași dimensiune, atunci multe browsere îl vor putea traduce la dimensiunea dorită, dar sunt posibile erori și afișare incorectă. Dacă toate dimensiunile sunt specificate în cod, browserul va ridica cea necesară.

    Pentru a face un favicon, utilizați servicii speciale: realfavicongenerator.net, favicon.cc și altele. Generați simultan pictograme online pentru toate tipurile de browsere și platforme mobile.

    Plasați favicon-ul în directorul rădăcină al site-ului sau adăugați un link în etichetă. Dacă aveți nevoie de pictograme diferite pentru fiecare secțiune a site-ului, adăugați-le pe fiecare pagină.

    Verificați dacă indexarea este corectă. Răspunsul serverului trebuie să fie HTTP 200. Verificați vizibilitatea favicon-ului în Yandex și Google prin serviciile motoarelor de căutare.

Materialul a fost pregătit de Svetlana Sirvida-Llorente.

Un element foarte important al designului blogului este favicon-ul - o imagine mică (16x16 pixeli). Dimensiune mică - dar efect uriaș! Acest articol este dedicat modului de a crea o favicon (favicon.ico) pentru un site web online folosind servicii speciale. Veți afla mai multe despre ce este această pictogramă favicon, pentru ce este folosită, ce funcții are, cum să o adăugați pe blogul dvs. și să o creați online. Veți afla și unde descărcați o colecție de iconițe favicon gata făcute pentru site-ul web.

În general, postarea este foarte informativă și interesantă, îi sfătuiesc cu căldură pe cei care nu au încă favicon să o citească.

Mai întâi, să aruncăm o privire mai atentă la ce este un Favicon și pentru ce este folosit.

Favicon este o abreviere a două cuvinte (ICONA FAVORITES în engleză), care se traduce ca o pictogramă (o imagine foarte mică) pentru „Favorite”. Favorite– așa se numesc marcajele în browserul Internet Explorer. Favicon-ul arată cam așa:

Crearea unui favicon pentru un site web a devenit foarte ușoară, așa că acest mini-a câștigat o mare popularitate. În plus, puteți descărca o pictogramă ico favicon gata făcută pentru site, pe care trebuie doar să o adăugați. După ce ai ales-o pe cea potrivită din galerie, poți să-ți decorezi site-ul web cu el și să-l admiri în browser (iată cum arată această mini-imagine în Chrome):

Deci, un favicon este o imagine mică de 16x16 px, cu o extensie .ico (extensie icon). Deoarece Pictograma a câștigat o popularitate largă, aproape fiecare site o are și acesta este un alt motiv pentru a crea o favicon pentru un site online. Nu contează ce fel de găzduire utilizați, pe ce motor rulează blogul dvs. - în orice caz, puteți crea online și apoi instalați un favicon sau descărcați un favicon gata făcut pentru site. Datorită generatoarelor moderne de pictograme, crearea lor nu durează mult timp - unul sau două minute și totul este gata.

Încă nu ai un favicon? Să te faci bine în curând!

La ce se folosește această mini-imagine? În primul rând, o favicon pentru un site web este ca un logo pentru o companie comercială, aceasta este o modalitate de a ieși în evidență din mulțime. Vizitatorii vă vor recunoaște site-ul uitându-vă la imaginea favicon. În al doilea rând, Yandex folosește și imagini favicon și le afișează lângă rezultatele căutării, ceea ce permite site-urilor cu favicons să arate mai bine în comparație cu altele. Aceasta înseamnă că utilizatorii vor merge mai des pe site-ul tău, deoarece pictograma îi va „atrage”. Cu alte cuvinte, această mini-imagine vă va ajuta. Iată cum arată:

Ei bine, acum vrei să știi cum să faci un favicon? Citiți mai departe și puteți alege o favicon pentru site-ul dvs. din numeroase colecții.

Apropo, motorul de căutare Yandex are chiar și un robot special care indexează aceste pictograme și le încarcă în baza de date a motorului de căutare. După ce creați o favicon și o instalați pe site-ul dvs., Yandex o va indexa după ceva timp (de obicei nu mai mult de o lună) și va începe să o afișeze în rezultatele căutării. Puteți verifica oricând dacă mini-logo-ul dvs. se află deja în baza de date a motorului de căutare. Puteți face acest lucru într-unul din 3 moduri:

  • Introduceți site-ul dvs. în caseta de căutare Yandex și veți vedea dacă există o favicon lângă el.
  • Introduceți linkul http://favicon.yandex.net/favicon/ în browser site.ru, unde înlocuiți site.ru cu adresa site-ului dvs. Dacă fava este indexată, o vei putea vedea.
  • Accesați panoul Yandex.Webmaster, favicon-ul este reflectat și acolo.

Acum haideți să aflăm de unde puteți descărca o favicon pentru site.

2. Generatoare și colecții de favicon online

Acum știm ce este un favicon și de ce site-ul are nevoie de el. Rețineți că dimensiunea sa în pixeli trebuie să fie strict egală cu 16 pe 16, iar extensia trebuie să fie doar .ico. Acum să aflăm cum să facem un astfel de mini-logo:

  1. Descărcați o fava gata făcută din galerie.
  2. Creați-vă propria folosind generatorul de favicon.
  3. Creați dintr-o imagine gata făcută (din nou folosind un generator de favicon)

2.1 Favicon pentru colecții și galerii

  1. http://www.thefavicongallery.com/ - deși o colecție mică, este utilă. Aici veți găsi pictograme pe o varietate de subiecte. În total, sunt aproximativ 300. Pentru a descărca iconița favicon preferată pentru site, faceți clic dreapta pe ea și salvați-l pe computer.
  2. http://www.iconj.com/favicon-gallery-page1.html - o altă colecție de favicon pentru site, care conține mai mult de 3 mii de mini-imagini. Îl poți salva pe cel preferat în două formate (ico sau gif). Dar există un dezavantaj: puteți vizualiza doar 30 de pictograme la un moment dat, pentru a le vedea pe următoarele, trebuie să mergeți la o pagină nouă;
  3. http://www.favicon.cc/?action=icon_list&order_by_rating=1 – datorită acestei galerii, nu trebuie să creați singur o favicon online. Doar selectați și descărcați fotografia care vă place. Din nou, puteți vizualiza 20 de favicon-uri simultan, ceea ce încetinește procesul de selecție.
  4. http://www.favicon.co.uk/gallery.php - acest site vă permite nu numai să creați o favicon pentru site, ci și să descărcați opțiuni gata făcute. Puteți vizualiza 144 de pictograme simultan, ceea ce este mult mai convenabil decât în ​​cele două opțiuni anterioare. Favas pe o varietate de subiecte.
  5. http://favicon-generator.org/gallery/ - deși mică, dar utilă colecție de 84 de favicon-uri. Alege oricare!

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

Desigur, puteți descărca fava gata făcută pentru site-ul dvs., dar este mult mai bine să vă creați propriul dvs. În această chestiune, vom fi ajutați de așa-numitele Generatoare Favicon, care vă permit să creați online mini-imagini frumoase.

2.2.1 Logaster.ru

Lista noastră începe cu un generator de favicon online
Principalul avantaj al serviciului este că nu trebuie deloc să desenați o favicon sau să o convertiți dintr-un logo.
Tot ce trebuie să faceți este să introduceți numele site-ului sau al companiei și să selectați un subiect.
După aceasta, serviciul va crea modele favicon gata făcute. Selectați pictograma dorită, fontul, culoarea.
Acest lucru este foarte convenabil pentru cei care nu știu să deseneze sau să lucreze cu programe de grafică.

Puteți descărca fișiere favicon în formatele ICO sau PNG.
Puteți citi mai multe despre cum să creați o favicon folosind Logaster

Pe lângă favicon, serviciul creează și logo-uri, cărți de vizită, plicuri și antet.

2.2.2 Favicon.cc – generator de favicon

Acest generator simplu este unul dintre cele mai simple și mai populare utilizate pentru crearea de faviconuri online pentru un site web. Veți putea desena fiecare pixel al viitoarei fava (sunt 256 în total). Accesând site-ul, veți avea acces la o fereastră de lucru în care puteți experimenta.

Culoarea albastră din captura de ecran de mai sus arată zona de lucru - aici veți crea direct o favicon pentru site. Chiar mai jos puteți vedea cum arată o fava în scara sa originală (evidențiată cu negru).

Lucrul cu acest generator este atât de simplu încât este puțin probabil să aveți întrebări despre cum să creați o iconiță favicon pentru un site web. Practic, pe acest site poți crea colecții întregi de favicon online și apoi, de exemplu, să le vinzi.

Fiecare pătrat din zona de lucru este un pixel. Trebuie să-l pictezi cu culoarea dorită. Puteți selecta o culoare în paleta situată în dreapta zonei de lucru. Puteți picta un pixel apăsând tasta din stânga și puteți șterge culoarea pictată apăsând tasta din dreapta.

Imaginea poate fi mutată și mutată în jurul zonei de lucru, pentru care se folosește articolul mişcare.

Pentru a descărca favicon-ul rezultat pe care l-ați creat pentru site, faceți clic pe link-ul Download Favicon (evidențiat cu roșu).

2.2.3. Generator Amichurin.Appspot.com

Un alt generator de faviconuri frumoase, în care puteți crea o imagine frumoasă online. Întregul generator este în limba rusă, dar funcționalitatea acestuia va fi mai simplă decât în ​​cazul precedent. Apropo, semnăturile făcute în visiniu nu sunt ale mele.

Din păcate, nu am găsit colecții de faviconuri gata făcute pe acest site care să poată fi descărcate pentru site, așa că folosiți-o doar ca generator.

2.2.4 Generator Favicon-Generator.org

Un generator de favicon foarte bun. Foarte asemănător cu a doua opțiune, dar ușor inferioară acesteia. În general, după cum ați observat deja, principiul de funcționare pe toate aceste site-uri este același. Prin urmare, nu ar trebui să existe probleme cu ele. Alegeți și lucrați cu cel care vă place cel mai mult.


2.3 Favicon dintr-o imagine finalizată

Dacă nu doriți să creați o favicon folosind generatoare online de la zero, iar galeriile și colecțiile de ico-uri favicon pentru site nu sunt potrivite pentru dvs., atunci încercați să faceți o mini-imagine dintr-o imagine gata făcută. Puteți chiar să vă folosiți fotografia. Astfel de imagini sunt create și online folosind generatoare speciale de favicon.

Pregătiți în prealabil poza pe care doriți să o utilizați ca bază.

2.3.1 Service Favicon.ru

Unul dintre cele mai populare servicii care vă ajută să creați o favicon pentru un site web (apropo, un site web în limba rusă). Simplu și ușor de utilizat, vă ajută să realizați un mini logo dintr-o imagine gata făcută.

Puteți adăuga o imagine sau o fotografie (bază) astfel:

  • Faceți clic pe butonul selectați fișierul» și încărcați fotografia dorită.
  • Introduceți adresa URL a imaginii în câmpul alb (faceți acest lucru dacă fișierul nu este stocat pe computer, ci pe Internet).

După ce imaginea este adăugată, faceți clic pe „ Creafavicon.ico!"și așteptați puțin, generatorul va genera o pictogramă. După aceea, descărcați imaginea pe computer. Apropo, pe lângă generator, acest site are și o colecție mare de ico-uri favicon pentru site-ul dvs.

2.3.2 Serviciul Favicon.cc

Un generator similar, dar cu o funcționalitate mai puternică. Pentru a crea un favorit dintr-o imagine finalizată, accesați mai întâi fila „Importați imaginea”.

Acum faceți clic pe „Selectați fișierul” și adăugați fișierul pe care îl descărcați. Pe baza acestuia, va fi creată o iconiță favicon pentru site-ul dvs. Apropo, este posibil să aveți nevoie de funcția de întindere a imaginii:

  • Păstrați dimensiunile – dacă raportul de aspect este redus, imaginile vor rămâne aceleași
  • Pictograma Micșorare la pătrat – părțile laterale ale imaginii vor fi pătrate (imaginea poate fi distorsionată).

După descărcarea fișierului, îl puteți edita online folosind acest generator de favicon. Când sunteți mulțumit de rezultat, descărcați fava pe computer.

3. Cum să adăugați o favicon la un blog WordPress

Ne-am dat seama de unde să descărcați o favicon gata făcută pentru un site web sau cum să vă faceți propria. Acum să discutăm cum să adăugați o fava la un blog WordPress.

De regulă, favicon-ul se află la rădăcina site-ului (în folderul rădăcină) - pe asta ne vom concentra. Dacă fava nu este în rădăcină, mutați-o acolo.

Adăugarea favicon.ico în doi pași.

PASUL 1

În primul rând, trebuie să găsiți în tema dvs. linia de cod care este responsabilă pentru afișarea favicon-ului. Deschideți fișierul Header (header.php) pentru editare și găsiți această linie (sau similară):

Dacă nu există nimic asemănător care să conțină cuvântul favicon.ico, atunci trebuie doar să adăugați aceste două rânduri undeva între etichete Şi.

PASUL DOI

Acum trebuie să adăugați favicon-ul în sine la găzduirea dvs., exact în folderul rădăcină al site-ului (altfel, nu va fi afișat). Accesați găzduirea dvs. și încărcați fava la rădăcina site-ului (numele fișierului este necesar favicon.ico, sunt necesare dimensiuni 16x16 pixeli).
Asta e tot, în curând favicon-ul va fi indexat de motoarele de căutare și va apărea în rezultatele căutării Yandex. Și site-ul tău va avea propriul său favicon.

La sfârșit, vă ofer un tutorial video despre cum să creați o favicon pentru un site web.

Structura: O favicon este o pictogramă mică care este folosită pentru a vă identifica vizual site-ul în marcaje și este, de asemenea, ceea ce vedeți lângă site-ul sau numele paginii dvs. în filele browserului. De obicei, un favicon este un pătrat de 16x16 pixeli în formatul favicon.ico. În acest articol, vă vom explica de ce „bază” aveți nevoie pentru a începe, vă vom ajuta să creați o favicon folosind editori grafici și vom vorbi despre modalități de a adăuga o favicon pe site-ul dvs. De ce ai nevoie pentru a începe?

  1. Logo-ul dvs. trebuie să aibă cel puțin 512x512 pixeli (trebuie să fie pătrat);
  2. Format imagine .PNG;
  3. Editor grafic Adobe Photoshop sau GIMP.

Creați o favicon folosind Adobe Photoshop

Favicon pe un fundal transparent:

1) Deschideți sigla în format PNG pe un fundal transparent în editor făcând clic pe: „Fișier” - „Deschidere”și selectați o imagine de pe computer. 2) Eliminați numele companiei din logo pentru a utiliza doar pictograma selectând instrumentul "Radieră"și schimbarea culorii principale în alb.
3) Acum, modificați dimensiunea logo-ului la 16x16 pixeli făcând clic pe: „Imagine” - „Dimensiunea imaginii”.
4) Și modificați dimensiunile la 16x16 pixeli. Favicon-ul tău ți se va părea foarte mic, dar nu-ți face griji, totul este așa cum ar trebui să fie.
5) Salvați imaginea făcând clic „Fișier” - „Salvare ca”și selectați tipul fișierului "PNG".
Dacă sigla dvs. arată grozav, treceți la pasul 4.

Favicon pe un fundal cu o culoare corporativă:

1) Ca și în prima opțiune, deschideți fișierul în format PNG, dar nu pe un fundal transparent, ci pe un fundal cu o culoare corporativă. 2) Eliminați textul și lăsați doar pictograma: utilizați instrumentul "Pipetă" pentru a selecta o culoare în funcție de fundal - culoarea din paletă se va schimba automat în cea dorită. Acum, faceți clic pe instrumentul „Penie” și pictați peste text.
3) Schimbați dimensiunea făcând clic „Imagine” - „Redimensionare”și introduceți 16x16 pixeli în câmpul corespunzător. Dacă imaginea pare proporțională, salvați-o în format .PNG și treceți la pasul 4.

Crearea unui favicon folosind GIMP - GNU Image Manipulation Program

GIMP este un editor de grafică care permite utilizatorilor să lucreze cu grafică vectorială. Avantajul acestui program este că poți crea un favicon în format .ICO și nu trebuie să folosești convertoare de imagini, așa cum este cazul Adobe Photosop. 1) Deschideți fișierul în program făcând clic „Fișier” - „Deschidere”și selectând imaginea dorită de pe computer.
2) Acum trebuie să eliminați textul, astfel încât să rămână doar pictograma: faceți clic pe paleta de culori și specificați codul de culoare pentru fundalul corporativ. Dacă nu știți, faceți clic pe instrument "Pipetă", îndreptați-l spre fundalul logo-ului și faceți clic stânga - culoarea va fi setată automat. Acum folosind instrumentul "Perie", schițați textul inutil.
3) Reduceți dimensiunea logo-ului la dimensiunea favicon standard - 16x16 pixeli făcând clic pe: „Imagine” - „Redimensionați imaginea”.
4) Exportați logo-ul făcând clic „Fișier” - „Exportați ca...”.
5) Și selectați tipul de fișier de exportat - pictograma Microsoft Windows cu extensia ICO. și faceți clic "Export".
Gata! Acum, puteți folosi o favicon pe site-ul dvs. web!

Avantajele utilizării .ICO față de .PNG sau .GIF

  1. Compatibilitate: Toate browserele, inclusiv IE 5.0, acceptă formatul .ico.
  2. Evitarea erorilor de server 404: Toate browserele moderne (testate cu Chrome 4, Firefox 3.5, IE8, Opera 10 și Safari 4) vor solicita întotdeauna un fișier favicon.ico, așa că cel mai bine este să aveți întotdeauna un fișier favicon.ico.
  3. Un fișier .ico poate conține mai multe pictograme, așa că nu trebuie să creați mai multe fișiere pentru pictogramele de 16x16 și 48x48 pixeli.

Convertiți .PNG în .ICO cu convertoare online

Pentru a converti un fișier .PNG în .ICO puteți folosi convertoare online. De exemplu, am ales online-convert.com, dar puteți alege oricare altul din rezultatele căutării, principiul lor de funcționare este aproximativ același. Deci: 1) Conectați-vă la site și în bara laterală din stânga selectați: „Convertor de imagine” - „Convertire în ISO”.
2) Selectați fișierele de convertit pe computer făcând clic pe butonul „Selectați fișierele”, sau trăgând fișierele în câmpul corespunzător și făcând clic pe butonul „Începe conversia”.
3) Acum, faceți clic "Descărcați" pentru a descărca fișierul .ico pe computer. De asemenea, este posibil să încărcați fișierul în stocarea în cloud sau să descărcați fișierul ca fișier ZIP.

Cum se instalează o favicon pe WordPress?

Încărcați-vă favicon (favicon.ico) în directorul principal (rădăcină) al site-ului. Directorul rădăcină este folderul principal în care se află toate fișierele dvs. WP, cum ar fi index.php și folderele wp-admin, wp-content + wp-includes. Asigurați-vă că plasați favicon.ico la același nivel cu aceste foldere și index.php. 1) Pe WordPress, deschideți „Panoul administrativ”.
2) Intrați în secțiune
3) Faceți clic pe
4) Faceți clic pe fișierul numit "Antet" sau, pentru a edita.
5) Găsiți linia de cod care începe cu si se termina cu /favicon.ico "/>. Schimbați-l dacă există sau adăugați următorul cod sub eticheta HTML . În exemplu, folosim numele favicon ca „favicon.ico”. Îți poți denumi favicon-ul cum vrei. Cod: /favicon.ico"/>; 6) Salvați modificările. Concluzii: Atunci când vă proiectați site-ul web, trebuie să vă asigurați că nu pierdeți detalii importante, chiar și cele mici precum favicon-ul. Adăugarea unei pictograme nu este chiar dificilă. Dar acest lucru minuscul arată că te-ai gândit mult la design și că ți-ai grijă de detalii. Aveți întrebări sau doriți să împărtășiți experiența dvs. de a crea o favicon pentru site-ul dvs. web? Bun venit la comentarii.