Roșu favon. Mod universal de a crea favonov

O parte integrantă a site-urilor moderne este pictograma Favicon, care vă permite să identificați rapid una sau altă resursă din lista fila browserului. De asemenea, este dificil să trimiteți un program de calculator fără propria dvs. etichetă unică. În același timp, site-urile și software-ul în acest caz combină elementul nu este destul de evident - ambele utilizează pictograme în format ICO.

Aceste imagini mici pot fi create ca un program special, deci cu ajutorul serviciilor online. Apropo, este ultima pentru astfel de scopuri care sunt mult mai mari, și vom lua în considerare o serie de astfel de resurse cu dvs. în acest articol.

Lucrul cu grafica nu este cea mai populară categorie de servicii web, însă, în ceea ce privește generarea de icoane, există cu siguranță de ales. Conform principiului operației, astfel de resurse pot fi împărțite în cele în care vă desenezi o imagine și site-uri care vă permit să convertiți o imagine deja pregătită în ICO. Dar, în mare parte, icoanele generatoare oferă ambele.

Metoda 1: editorul x-icon

Acest serviciu este soluția cea mai funcțională pentru crearea unei imagini ICO. Aplicația Web vă permite să trageți în detaliu pictograma sau să profitați de imaginea finalizată. Principalul avantaj al instrumentului este capacitatea de a exporta o imagine cu o rezoluție de până la 64 × 64.


Deci, dacă aveți nevoie să creați un set întreg de pictograme de dimensiuni unic-dimensionale - nimic mai bun decât editorul x-icon pentru aceste scopuri pe care nu le găsiți.

Metoda 2: favicon.ru

Dacă este necesar, pentru a genera pictograma favicon cu o rezoluție de 16 × 16 pentru un site web, un instrument excelent poate servi, de asemenea, ca un serviciu online de limbă rusă favicon.ru. Ca și în cazul soluției anterioare, aici puteți desena în mod independent pictograma, pictura fiecărui pixel separat și creați Favicon din imaginea finită.


Ca rezultat, un fișier de extensie ICO care reprezintă o imagine de 16 × 16 pixeli este salvat pe PC. Serviciul este perfect pentru cei care au nevoie doar de a converti imaginea într-o mică pictogramă. Cu toate acestea, și pentru a arăta fantezia în favicon.ru nu este deloc interzisă.

Metoda 3: favicon.cc

Similar cu cel precedent ca nume și pe principiul operațiunii, dar chiar și o icoane de generare mai avansate. În plus față de crearea de imagini convenționale de 16 × 16, serviciul facilitează desena un Favicon.ico animat pentru site-ul dvs. În plus, resursa conține mii de pictograme personalizate disponibile pentru descărcare gratuită.


Dacă interfața vorbitoare de limbă engleză nu vă deranjează, atunci nu există absolut nici un argument în favoarea muncii cu serviciul anterior. În plus față de faptul că favicon.cc poate genera pictograme animate, resursa recunoaște, de asemenea, în mod corect transparența imaginilor importate, care este un analog de limbă rusă, din păcate, privat.

Metoda 4: favicon.by

O altă opțiune a generatorului de pictograme Favicon pentru site-uri. Este posibil să creați icoane de la zero sau pe baza unei imagini specifice. Din diferențele, este posibilă evidențiarea funcției importării imaginilor din resurse web ale unor terțe părți și o interfață destul de elegantă și concisă.


În general, nu există diferențe în colaborarea cu serviciile deja luate în considerare în acest articol, cu toate acestea, prin conversia imaginilor în ICO, Favicon.By resursează resursele semnificativ mai bune și este destul de ușor de observat.

Metoda 5: Conversia online

Este posibil ca deja să știți acest site ca un convertor de fișiere online aproape omnivor. Dar nu toată lumea știe că acesta este unul dintre cele mai bune instrumente pentru convertirea imaginilor în ICO. La ieșirea puteți primi pictograme cu o rezoluție de până la 256 × 256 pixeli.


După cum puteți vedea, creați o pictogramă ICO utilizând site-ul online-convertisment este complet simplu și se face literalmente pentru câteva clicuri de mouse.

Editorii online de icoane, mulți nu sunt percepuți în mod serios, dar de fapt, astfel de instrumente facilitează în mare măsură fluxul de lucru. Clicurile totale de cuplu vă pot salva din orele de căutare, vizualizări sau auto-dezvoltare. În plus, nu are sens să se folosească cu drepturi depline atunci când există servicii speciale cu funcții ascuțite pentru aceste sarcini specifice.

Site-uri similare Editor Icoanele sunt foarte eficiente. Vă permit:

  • ușor și rapid creați materiale noi;
  • posedă finalizarea la fața locului existent;
  • salvați rezultatul în diferite formate (SVG, ICO & PNG);
  • creați icoane pentru.

În articol, am preluat primii cinci pictograme online gratuite ale editorilor și pentru comparație încercat să creeze un set în fiecare dintre ele.

Iconsflow.

Iconsflow.com - Vector Icons + Editor vă permite să creați seturi personalizate și să le exportați în bună calitate (SVG, ICO & PNG). Principalul avantaj al serviciului este prezența a doi editori:

  • principalul în care este selectată paleta, stilul, efectele;
  • editorul formularului în care puteți schimba formularul curent sau puteți desena unul nou.

Dacă ați creat deja icoane în Illustrator, descărcați pur și simplu fișierele SVG și experimentați cu medii diferite. În Iconsflow există anumite restricții cu utilizare gratuită, deci asigurați-vă că vă familiarizați înainte de începerea începerii. Pentru utilizatorii novice există lecții și secțiuni de ajutor, în plus, este posibil să lucrăm în editorul icoanelor din limba rusă.

Vector editor iconsflow:

Exemple de lucru:

Flaticons.

Cu flaticons.net, puteți crea propria dvs. pictogramă plată (într-un stil plat) bazată pe modele gata făcute. Setați dimensiunile, alegeți desenul și fundalul principal (cercuri, inele, dreptunghiuri), schimbați culoarea. Acest editor al pictogramei este gratuit, dar are două dezavantaje:

  • În primul rând, puteți descărca fișiere numai în format PNG.
  • În al doilea rând, va trebui să creați separat fiecare obiect, pentru că Este imposibil să se dezvolte imediat un set complet.

În ciuda faptului că vârful popularității a trecut deja, mulți le folosesc în desenele lor. De exemplu, dezvoltatorii vă permit să descărcați un set gratuit de icoane plate sociale. Rezultatul muncii în Editorul Flaticons:

Generator de pictograme la lansator.

Proiectul Generator Generator de la Launcher este gratuit și, după cum credem, este mai potrivit pentru utilizatorii avansați. Acest editor de pictograme online vă permite să încărcați imagini / clipuri și să adăugați text. Puteți descărca o pictogramă la un moment dat în dimensiuni 5 (48 x 48; 72 x 72; 96 x 96; 144 x 144; 192 x 192).

Ca un clip de bază, se utilizează un set de grafică în stilul de design material din GitHub. Serviciul conține astfel de setări ca: fundal de liniuțe, formă, culoare sau transparență, scalare + efecte suplimentare. Rezultat:

Android Material Icon Generator este un alt instrument pentru crearea de icoane plate. Serviciul serviciului este cu siguranță efectul sub forma unei umbre lungi. Dacă aveți nevoie de astfel de soluții - acest editor de pictograme va fi opțiunea perfectă.

Începeți prin selectarea unei imagini din galerie, apoi determinați culoarea, forma fundalului din spate (cerc sau pătrat), lungimea umbrei, saturația, atenuarea - și pictograma dvs. este gata. Totul este extrem de simplu. Pentru uz personal, site-ul este complet gratuit.

După descărcarea în fișier, veți găsi 6 dimensiuni diferite PNG și un fișier vectorial SVG. În ilustrator, pictograma SVG va fi neclară, dar din fericire, arată bine în browser. Ca rezultat, se dovedește ceva de genul:

Site-ul Simunity este un generator de bază HTML5, unde puteți crea o pictogramă și apoi copiați codul pentru ao afișa în proiectele dvs. web. Materialele sursă utilizează pictogramele minunate de fonturi pentru care sunt selectați diferiți parametri: culoarea, cadrul, dimensiunea și stilul umbrelor.

Acest serviciu este util dacă aveți nevoie să creați rapid icoane originale simple pentru site. Aplicația Simunity Rezultatul:

TOTAL. Editorii online ai icoanelor considerate mai sus sunt instrumente excelente pentru a optimiza designerii. Nu are sens să descărcați unele programe când totul poate fi ușor și rapid făcut în rețea. Din această selecție, poate puteți selecta Iconsflow. Conține cel mai mare număr de funcții: icoane galerie, loading svg, cod pentru încorporare, previzualizare, creare propriile șabloane, export PNG, ICO și SVG, adaptare dimensiune, stiluri de modă și editor vectorial încorporat. În plus, acesta este singurul editor gratuit al icoanelor din limba rusă, dacă este important pentru dvs.

Dacă știți orice alte servicii similare, trimiteți opțiuni în comentarii.

Noua lecție în stilul de atelier și de data aceasta vom înțelege secretele faviconului. Favicon. - pictograma mică, care este afișată în marcaje și șir de browser. Dacă aveți propriul dvs. site web și doriți să obțineți diferit de alții, chiar și în lucruri mici - favicon. Suntem necesari. Este foarte profitabil, desigur, se uită între marcajele, pe fundalul unei liste de adrese decolorate fără nici o identificare grafică. Cu toate acestea, lecția noastră nu este atât de mare despre cum să atașați Favicon la șirul browserului, cât de mult despre cum - cum să vă atrageți propriul favicon în programul Photoshop.

Ce format pentru a salva favicon?

Totul depinde de browser. Pentru Microsoft Explorer. Formatați pictogramele potrivite Ico.. Cu acest format, ne-am confruntat deja când au făcut cursorul. Pentru alte browsere de la Google Chrome. inainte de Apple safari. Costum obișnuit Gif. sau PNG.. Favicon. Poate fi translucid. Pentru a face acest lucru, trebuie să fie păstrat în translucid PNG.și apoi convertiți în format Ico.. Puteți face acest lucru într-un program bun ICOFX.Cu toate acestea, pentru generarea de favicon există o masă de site-uri terțe și cele mai evidente de la www.favicon.ru

Cum să puneți favicon pe site?

Cum să fii sigur că favicon. va functiona? Trebuie să respectați 4 condiții.

  • FAILA ar trebui să fie numită - favicon..
  • Favicon Dimensiune 16 pe 16 px.
  • Locul optim pentru favicon este dosarul rădăcină al site-ului.
  • Adresa icoanelor pentru a vă înregistra în meta etichete heder-a. În indexul site-ului.

În expresia HTML se pare că:

Puteți crea mai multe pictograme pentru diferite browsere, de exemplu, unul în format Ico., iar celălalt în PNG. Și toate acestea indică prin etichetă lEGĂTURĂ. . Browserele moderne au căutat cel mai adesea în rădăcina faila numită favicon.Cu toate acestea, pentru încredere că nu va face rău pentru a specifica și a corecta legăturile.

Creați favicon în Photoshop

Crea favicon. foarte simplu. Doriți să faceți același lucru favicon.cum ar fi Vkontakte sau colegii de clasă? Bun favicon. Să nu facă, reducând imaginile mari în tot felul de "generatoare" din Favonov, care sunt pline de pe Internet. Favon este foarte mic. De fapt, suntem buni artă cu pixeli.care are propriile caracteristici. Nu puteți scrie scrisoarea și pur și simplu reduceți-o 16px .

Ca favicon. Fumzles vor fi încețoșați, deoarece marginile scrisorii atunci când redimensionarea vor fi în câțiva pixeli. Va fi bun anti-alias., care este de obicei bun, dar în cazul pixel-art, astfel de tranziții nu sunt doar necesare. Pe de altă parte, merită să se evite și să fie "încurajați" excesiv pe runde, altfel vor primi Hi Gifki 1999.

Creați o dimensiune a fișierului 16 H. 16px . Vom crea un translucid foarte simplu favicon. Cu litera, cu un instrument de adâncime. Adâncimea va fi creată din cauza umbrei și a gradientului.

Desenați fundalul

De ce în screensaverul acestei lecții vedeți un imens neted și lins favicon.? Pentru că l-am majorat pentru un screensaver la lecție. Cum am fost mai bine să măresc imaginea 16px? Foarte simplu, lucrez întotdeauna în vector dacă este posibil să o folosească și dacă acest lucru are sens. Iar vectorul transferă cu ușurință orice transformare și nu pierde ca.

Selectați un instrument Un instrument dreptunghi rotunjit.. În panoul Setări, selectați modul, care va permite tragerea în vector. În meniul derulant al panoului de bifare - Snap la pixeli. Acest lucru este necesar pentru ca contururile vectoriale să fie legate de pixeli și nu au tras "între" ei.

Avem o suprafață favicon., și marginile translucide vor crea o neteză de rotunjire. Acum este timpul să scăpați de fundalul albului alb, nu este necesar. Deconectați vizibilitatea acestuia. Sau faceți un dublu clic pe strat, transformați-l într-un strat regulat și apoi eliminați-l.

Un element foarte important al designului blogului este FAVON - o imagine mică (16x16 pixeli). Dimensiuni mici - dar un efect imens! Acest articol este dedicat modului de a crea Favon.ico pentru site-ul online, cu ajutorul serviciilor speciale. Veți citi mai multe detalii cu faptul că este pictograma Favon, pentru care este folosit, ce fel de funcții au, cum să o adăugați la blog și să creați online. De asemenea, veți afla unde descărcați colecția de Favicon ICO gata pentru site.

În general, postul este foarte informativ și interesant, vă sfătuiesc cu tărie să vă familiarizați cu el, oricine nu are favonki.

În primul rând, să arătăm mai detaliat ceea ce este Favon și pentru care este folosit.

Favicon este o reducere a două cuvinte (eng. Favorite Icon), care este tradus ca o pictogramă (imagine foarte mică) pentru "Favorite". Favorite - așa-numite marcaje în browserul Internet Explorer. Aspectul Favicon este aproximativ ca acesta:

Faceți un fixator pentru site-ul a devenit foarte simplu, astfel încât această mini a dobândit popularitate largă. În plus, puteți descărca pictograma Ready a Favicon ICO pentru site, care va fi adăugată numai. Alegerea din galerie, puteți decora site-ul dvs. și îl puteți admira în browser (iată cum arată această imagine mini-crom):

Deci, Favicon este o imagine mică de dimensiune de 16 × 16 px, cu o extensie.ico (expansiune de pictograme). pentru că Icoana a câștigat popularitate largă, este practic fiecare site, și acesta este un alt motiv pentru a crea o iva pentru site-ul online. Nu contează ce fel de găzduire pe care îl utilizați, pe motorul pe care îl lucrează blog-ul dvs. - în orice caz, puteți crea în modul online și apoi instalați Favicon sau descărcați site-ul de fixare finalizat pentru site. Datorită generatoarelor moderne de pictograme, creația lor nu durează mult timp - unul sau două minute, și totul este gata.

Încă mai aveți FAVONKI? Zborul în curând!

Pentru ceea ce este folosit această mini-imagine. În primul rând, Favon pentru site este ca un logo pentru o companie comercială, aceasta este o modalitate de a ieși din masa totală. Vizitatorii vor recunoaște site-ul dvs. prin căutarea imaginii Favicon. În al doilea rând, Yandex folosește și imaginile lui Favon, le arată lângă rezultatele emiterii, care permite site-urilor cu Favicon să arate mai bine pe fundalul altora. Aceasta înseamnă că utilizatorii vor merge mai des la site-ul dvs., deoarece pictograma le va "atrage". Cu alte cuvinte, această mini-imagine vă va ajuta. Acesta este modul în care arată totul:

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

Apropo, motorul de căutare Yandex are chiar un robot special care indexează aceste icoane și le încarcă în baza de date a motorului de căutare. După ce creați un favon și instalați-l pe site, Yandex după ceva timp (de obicei nu mai mult de o lună) Indexați-l și începeți să arătați în rezultatele emiterii. Puteți verifica oricând dacă mini-logo-ul dvs. este deja în baza motorului de căutare. Acest lucru se poate face cu unul dintre cele 3 moduri:

  • Formați site-ul dvs. în fereastra de căutare Yandex și veți vedea dacă există Favicon lângă acesta.
  • Formați link-ul http://favicon.yandex.net/Favicon/ în browser site.ru.Unde înlocuiți site.ru pe site-ul dvs. Dacă Fava este indexată, o puteți vedea.
  • Mergeți la panoul Yandex.vebmaster, există și un favon.

Și acum să aflăm unde puteți descărca stația pentru site.

2. Generatoare online și colecții Favicon

Acum știm ce este Favon și de ce are nevoie de un site. Ne amintim că mărimea sa în pixeli ar trebui să fie strict egală cu 16-16, iar extensia este numai. Acum învățăm cum să facem un astfel de mini:

  1. Descărcați deja Ready Fava din galerie.
  2. Creați-vă folosind un generator de favonă.
  3. Make de la imaginea finalizată (din nou folosind Generator Favicon)

2.1 Colecții și galerii Favon

  1. http://www.thefavicongaLlea.com/ - Deși o mică colecție, dar utilă. Aici veți găsi icoane pe o varietate de subiecte. Există aproximativ 300 dintre ele aproximativ 300 de bucăți. Pentru a descărca favoritul favicon ICO pentru site, apăsați-l cu butonul din dreapta al mouse-ului și salvați-l pe computer.
  2. http://www.iconj.com/favicon-gallery-page1.html - o altă colecție Favicon pentru un site care conține mai mult de 3 mii de mini-poze. Puteți salva favoritul dvs. în două formate (ICO sau GIF). Dar există, de asemenea, un dezavantaj: puteți vizualiza doar 30 de pictograme pentru a vedea următoarele, trebuie să mergeți la o pagină nouă.
  3. http://www.favicon.cc/?action\u003dicon_list&order_by_rating\u003d1 - Datorită acestei galerie, nu trebuie să vă creați Favon online. Doar selectați și descărcați imaginea dorită. Din nou, la un moment dat puteți vedea 20 Favon, care încetinește procesul de alegere.
  4. http://www.favicon.co.uk/gallery.php - Acest site permite nu numai să faceți o FAVY pentru site, ci și descărcați opțiunile gata făcute. La un moment dat, puteți Peck peste 144 de icoane, care este mult mai convenabil decât în \u200b\u200bcele două opțiuni anterioare. Favi pentru o varietate de subiecte.
  5. http://favicon-generator.org/gallery/ - deși colecția mică, dar utilă de 84 de bucăți de Favonok. Alegeți pe oricine!

2.2 Cum să faci Favon pentru site de la zero

Desigur, puteți descărca pentru site-ul dvs. și gata pentru fava, dar mult mai bine - faceți-vă propriile mâini. În acest caz, așa-numitele generatoare Favicon (generatoare Fav) ne vor ajuta, care vă permit să creați minini frumoase online.

2.2.1 logaster.ru.

Pornește lista noastră online Favonok Generator
Principalul avantaj al serviciului este că nu trebuie să trageți un Phawacon sau să îl convertiți din siglă.
Tot ce trebuie să faceți este să introduceți numele site-ului sau compania și să alegeți subiectul.
După aceasta, serviciul va crea modele favorabile Favicon. Puneți pictograma dorită, font, culoare.
Este foarte convenabil pentru cei care nu adică să deseneze și să lucreze cu programe grafice.

Descărcați fișierele Favicon în formate ICO sau PNG.
În detaliu, cum să creați o favorizare cu un logaster, poate fi citit

În plus față de favicon, serviciul creează, de asemenea, logo-uri, cărți de vizită, plicuri și blank.

2.2.2 Favicon.cc - Generator Favonok

Acest alternator simplu este unul dintre cele mai ușoare și mai populare utilizate pentru crearea online Favicon pentru site-ul. Veți putea atrage fiecare pixel al viitorului Fava (acestea sunt 256 de toate). Mergeți la site, veți fi disponibilă fereastra de lucru în care puteți experimenta.

Albastru în captura de ecran de mai sus arată spațiul de lucru - aici veți crea direct o iva pentru site. Mai jos, puteți vedea cum arată fava pe scara inițială (evidențiată în negru).

Lucrul cu acest generator este atât de simplu încât este puțin probabil să aveți întrebări cu privire la modul de a face Favicon ICO pentru site. În general, pe acest site puteți crea întreaga colecție de Favicon online, iar apoi, de exemplu, vinde-le.

Fiecare pătrat din spațiul de lucru este un pixel. Trebuie să-l pictați în culoarea dorită. Puteți alege culoarea în paleta situată în partea dreaptă a spațiului de lucru. Puteți picta pixelul apăsând tasta din stânga și șterge pictura - dreapta.

Imaginea poate fi mutată și deplasată de-a lungul zonei de lucru, pentru care utilizează elementul mișcare..

Pentru a descărca Favonul rezultat, pe care l-ați făcut pentru site, faceți clic pe linkul de descărcare Favicon (evidențiat în roșu).

2.2.3. Amichurin.appspot.com.

Un alt generator frumos favicon, în care în modul online puteți crea o imagine frumoasă. Întregul generator din limba rusă, dar funcționalitatea acestuia va fi mai ușoară decât în \u200b\u200bcazul precedent. Apropo, semnăturile făcute de Bordees nu sunt ale mele.

Din păcate, dar nu am găsit pe acest site colecții Favicon gata făcute, care ar putea fi descărcate pentru site, astfel încât să îl utilizați doar ca un generator.

2.2.4 Generator Favicon-Generator.org.

Foarte bun Generator Favonok. Este foarte asemănătoare celei de-a doua opțiuni, dar puțin inferior pentru el. În general, după cum ați observat deja, principiul de funcționare pe toate aceste site-uri este același. Prin urmare, problemele cu ele nu ar trebui să apară. Alegeți și lucrați cu cel pe care v-ați plăcut.


2.3 Favicon din imaginea finită

Dacă nu doriți să creați un fixator folosind generatoare online de la zero, iar galeria și colecția Favicon ICO pentru site nu sunt potrivite pentru dvs., apoi încercați să faceți o mini-imagine de la imaginea finalizată. Puteți chiar să utilizați fotografia. Aceste imagini sunt, de asemenea, create în modul online utilizând generatoare speciale Favicon.

Pregătiți o imagine pe care doriți să o luați ca bază.

2.3.1 Service Favicon.ru.

Una dintre cele mai populare servicii care ajută la realizarea unui sit al site-ului (prin modul de limbă rusă). Simplu și ușor de utilizat, ajută la realizarea unui mini-logo de la imaginea finalizată.

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

  • Faceți clic pe butonul " alege fișierul"Și descărcați fotografia dorită.
  • Introduceți imaginea URL în câmpul alb (faceți acest lucru dacă fișierul este stocat nu pe computer, ci pe Internet).

După adăugarea imaginii, faceți clic pe " Creafavicon.ico! " Și așteptați un pic, generatorul formează pictograma. După aceea, descărcați imaginea pe computer. Apropo, în plus față de generatorul de pe acest site există o mare colecție de Favicon ICO pentru site-ul dvs.

2.3.2 Service Favicon.cc.

Generator similar, dar cu o funcționalitate mai puternică. Pentru a crea o faimă din imaginea finalizată, mergeți mai întâi la fila "Import Image".

Acum faceți clic pe "Selectați Fișier" și adăugați un fișier de descărcare. Pe bază și va fi creat de Favicon ICO pentru site-ul dvs. Apropo, este posibil să aveți nevoie de o funcție de întindere a imaginii:

  • Păstrați dimensiunile - cu o scădere a raportului de aspect al imaginii, va rămâne aceeași
  • Strângeți-vă la pictograma pătrată - laturile imaginii vor fi afișate tipului pătrat (imaginea poate fi distorsionată).

Prin descărcarea fișierului, veți putea să o editați în modul online utilizând acest generator Favicon. Când rezultatul rezultat va fi aranjat, descărcați FAVA pe computerul dvs.

3. Cum se adaugă Favicon la blogul WordPress

Cu unde să descărcați Faviconul finalizat pentru site sau cum să vă faceți propriul - ne-am dat seama. Acum, să discutăm cum să adăugăm un fava la blogul WordPress.

De regulă, Favicon este situat la rădăcina site-ului (în dosarul rădăcină) - vom naviga la el. Dacă Fava nu este în rădăcină, trimiteți-l acolo.

Favicon.ico este adăugat în două etape.

PRIMUL PAS

În primul rând, trebuie să găsiți în subiectul dvs. acest cod de linie responsabil pentru retragerea faviconului. Deschideți pentru a edita fișierul antet (header.php) și găsiți o astfel de locație (sau similară):

Dacă nu există nimic similar și care conține cuvântul favicon.ico, apoi adăugați doar aceste două linii undeva între etichete și.

Pasul doi

Acum trebuie să adăugați Favona însăși la găzduirea dvs., este în dosarul rădăcină al site-ului (altfel, acesta nu va fi afișat). Vino pe găzduirea și descărcați Fav la rădăcina site-ului (numele fișierului este necesar favicon.ico., Sunt necesare dimensiuni 16 × 16 pixeli).
Asta-i tot, în curând Favonka indexează motoarele de căutare și se va transforma în rezultatele emiterii lui Yandex. Și site-ul dvs. va avea propriul dvs. favicon.

La sfarsit, dau un tutorial video despre cum sa creezi o iva pentru site.

Favon - Termenul este tradus literal ca o "pictogramă favorită" - este considerată unul dintre cele mai complexe elemente ale designului web modern. Aceasta este o imagine mică care se află în fila browserului, în bara de căutare și în alte locuri și joacă un rol important în personalizarea site-ului.

Datorită formatului non-standard și a unei mărimi reduse, crearea unui favon poate fi asociată cu dificultăți, atât cu punct de vedere tehnic, cât și de designer.
O sarcină la fel de dificilă este de a asigura compatibilitatea favonului cu diferite browsere.

În acest articol, veți învăța cum să faceți Favon - vom da sfaturi despre design și vom spune despre serviciile de a crea un favicon și cum să adăugați Favon pe site.

Ce este favonul și de ce are nevoie

În ciuda faptului că Favon este un obiect grafic foarte mic, este extrem de important în designul site-ului și în general.

Click pentru a mari imaginea.

in primul rand, Favon face site-ul dvs. mai personalizat și răsucit într-un singur stil cu alte elemente grafice, cum ar fi logo-ul.

În al doilea rând Favono evidențiază site-ul dvs. printre alte resurse web din lista rezultatelor căutării. Site fără această icoană mini va fi decolorată pentru a arăta și a pierde concurenți. Pe scurt, Favon este doar "trebuie să aibă" pentru site-uri.

În al treilea rând Favon permite utilizatorului să găsească site-ul dvs. în catalogul de marcaje sau în alte pictograme de pe desktop.

Crearea unui design favicon

Favon trebuie să reflecte esența și brandul într-un semn mic de dimensiune a emoticonului. O soluție simplă va fi o versiune simplificată a logo-ului companiei, dar ia în considerare: un logo cu drepturi depline, cu text și mărci comerciale nu este potrivit în acest scop.

Aceste site-uri utilizează semnul grafic al mărcii lor (sau cel puțin ceva similar cu acesta).

Nu utilizați text

Ar trebui abandonat de la utilizarea textului, deoarece datorită dimensiunii mici a inscripției, Favon va fi necitit. Puneți pe pictograma 1, maximum 2 litere - de exemplu, primul în numele companiei sau resurselor web; În acest caz, acestea pot fi distinse.

Pixelizarea faviconului

Favononii sunt atât de mici încât fiecare pixel este important în ele. Adesea, cu o scădere a siglei de dimensiuni complete, imaginea este obținută vagă.

Acesta este un fragment al unui logo-ul Facebook de dimensiune completă după ce scade la 32 × 32. Este ușor să vedeți că imaginea "plutește" la margini. Pentru a evita un astfel de defect, editarea pe un nivel de pixeli.
Când lucrați cu icoane, prefer să folosesc programe de editare a imaginilor raster (de exemplu, Photoshop sau PixelMator). La început, reduc logo-ul de dimensiuni complete la 64 × 64 pixeli, pentru că este cel mai mare favon, pe care voi avea nevoie. Lucrarea este foarte dureroasă, poate lua o oră întreagă sau chiar două, dar rezultatul este doar excelent.
Dacă nu aveți timp și abilități în astfel de operațiuni, este mai bine să utilizați servicii online, cum ar fi Logotizer.ru.

Favicon Dimensiune

După ce a primit o pictogramă cu o dimensiune de 64 × 64, de asemenea, creez o pictogramă cu o dimensiune de 32 × 32, 24 × 24 și 16 × 16 pixeli. Fiecare dintre ei are destinația proprie:

- 64 × 64 - "Lista pentru citire" în Safari și Windows
- 24 × 24 - Site-uri fixe în IE9.
- 32 × 32 - pentru ecrane de înaltă rezoluție.
- 16 × 16 - este de obicei utilizat în browsere ca și cum, Safari, Chrome etc.

Dar crearea lui Favonov mai mic nu se limitează la creația: este necesară o editare suplimentară a nivelului pixelului. De asemenea, puteți adăuga un canal alfa dacă îl considerați necesar. Dacă mai devreme a cauzat dificultăți, aproape toate browserele suportă transparența în faze.

Formate Favicon.

Anterior, au fost acceptate numai fișiere de format ICO Windows, am putea economisi timp prin salvarea unui format de 16 × 16 în format GIF și oferindu-i o extensie .ico. O astfel de recepție a lucrat fără probleme! Dar acum în această metodă nu este nevoie, deoarece instrumentele pentru crearea fișierelor ICO pot fi găsite cu ușurință pe Internet. Mai mult, acum pentru Favonov folosit, dar cele mai frecvente două sunt încă comune.

Ico.

Campionatul Palm aparține formatului ICO. Spre deosebire de fișierele PNG, fișierele ICO pot avea o rezoluție diferită și o adâncime de biți (care este excelentă pentru Windows). Internet Explorer Browser utilizează dimensiunile diferite ale Favon (de exemplu, icoane de 32 pixeli pentru bara de activități Windows 7) și, prin urmare, în acest caz, formatul ICO este singura opțiune.

Fișierele PNG se disting printr-o mare comoditate, deoarece nu au nevoie de instrumente speciale pentru a le crea. Acest format acceptă canalul alfa și vă permite să creați fișierele cele mai mici dimensiuni. Poate că singurul dezavantaj al formatului PNG este că nu este acceptat în browserul Internet Explorer.

Există și alte opțiuni:

- Formatele GIF și animate GIF nu au avantaje, în plus față de compatibilitatea cu browserele foarte vechi.
- Formatul JPG nu este recomandat, chiar dacă imaginea este prezentată ca o fotografie. Acest format nu are claritatea PNG, iar singura demnitate este mai netedă tranziții între culori - o nuanță, care este complet reformată pe o imagine foarte mică.
- SVG ar putea fi o opțiune excelentă dacă mai multe browsere au acceptat Favona acestui format. Până în prezent există compatibilitate numai cu Opera.
- Există, de asemenea, așa-numitul "conformat" PNG - APNG (animat PNG), care este susținut în Firefox și Opera. Cu toate acestea, oportunitatea utilizării sale rămâne în discuție. Animat Favon poate distrage atenția și chiar deranjează utilizatorul.

Creați Favon Online - Instrumente și servicii online

Am ales pentru dvs. cele mai utile servicii care vă vor ajuta să creați Favon Online.

Logotizer.

Logotizerul este un serviciu nou, simplu și convenabil pentru crearea unui FAVON și LOGO pentru site-ul dvs.
Cu acest constructor online, puteți crea un fixor de la zero. Serviciul este axat pe noii veniți, deci nu este dificil să se dezvolte un design bun.

Cum se creează o favoare cu un generator de logotizor online

Spațiul principal de lucru este situat în partea stângă. Puteți vedea dreptul de a vedea că Favon va privi la diverse media - fila browser-ului, bara de activități de calculator sau ecranul smartphone. Foarte confortabil și clar.

Inițial, ar trebui să alegeți un formular pentru un FAVON. Există o mulțime de ele, mai mult de 50. Vă sfătuim să alegeți formulare simple și necomplicate pentru a face o favoare ușor de perceput și memorizat.

În acest stadiu, de asemenea, definiți culoarea formularului, care merge ca un fundal al Favonki și selectați un cadru. Vedeți ce culoare domină în logo-ul dvs. (dacă există), care culorile sunt principalele pe site-ul dvs. Este în acest joc gamma, vă sfătuim să creați un design favicon.

Sub blocul "Formularul" este o colecție de figuri (caractere). Ele nu sunt atât de mult, este păcat că nu vă puteți încărca opțiunile; Dar alegerea este încă destul de interesantă.

Schimbați culoarea, dimensiunea, locația cifrelor! Pe scurt, experiment, bun, serviciul îi permite să facă.

După selectarea figurii, puteți adăuga textul. Așa cum am scris mai devreme, este mai bine să folosiți 1 sau 2 litere, nu mai mult.

Există o selecție extinsă de fonturi. Acesta este cu siguranta plus. Ca și în cazul cifrelor, puteți schimba culoarea, dimensiunea, aspectul textului.

Dacă decideți că un fel de strat din favicon intervine temporar cu sau deloc, puteți să o ascundeți.

După crearea unui favon, serviciul va oferi să o salveze. Înregistrați-vă un cont (în 2017 fără înregistrare în nici un caz), iar apoi puteți descărca fișiere cu o plată mică - 199 de ruble.

Există încă o instrucțiune mică pe site, cum să adăugați Favon pe site, deci cu adăugarea de favicon la site-ul nu ar trebui să aveți probleme. Mai jos în acest articol oferă, de asemenea, recomandări similare.

După plată, utilizatorul primește 10 remedii de dimensiuni diferite simultan sub toate dispozitivele necesare până în prezent (pictograma Apple Touch, pictogramele Application Microsoft și altele).

Fișierul Favicon.ico în sine este multi-dimensiune și conține pictograme de 4 dimensiuni în 1 fișier (16px, 24px, 32px, 64px). În consecință, dacă adăugați un site pentru a marca browserul sau deschideți o poveste - puteți viziona pictograme de dimensiuni diferite, dar acestea vor fi afișate clar și fără estompare.

În general, serviciul este bun. Simplu, confortabil, nimic inutil.

Realfavicongenerator.net.

- Acesta este un generator mai simplu de Favon care vă permite să creați favononi pentru orice platformă. În plus, resursa poate fi testată de Favon. Introduceți adresa URL a site-ului dvs. și veți vedea cum se arată în fiecare browser și în fiecare sistem de operare. Generatorul real Favicon vă va solicita, de asemenea, cum să remediați deficiențele și să vă faceți chiar mai bine Faviconul.

Favicon.by.

Favicon.by.- Un alt generator FAVON GRATUIT și ușor de utilizat, care convertește fișierele PNG, JPG și GIF în format.ico. Încărcați imaginea de pe computer, selectați Dimensiune (16x16px sau 32x32px) și faceți clic pe butonul "Creați". Pentru a salva Favonul primit pe site-ul dvs., urmați instrucțiunile.

De asemenea, serviciul face posibilă desena logo-ul pe pixeli, dar, pentru a fi cinstit, nu este pentru toată lumea. De exemplu, nu am putut. Aici sunt crucial :)

Cum se adaugă Favon pe site

Puteți adăuga Favon pe site prin realizarea mai multor modificări în codul paginii HTML.

Pasul 1: Descărcați fișierul "Favicon.ico" la serverul dvs. de găzduire.

Pentru a face acest lucru, accesați serverul dvs. FTP la acest link:
FTP: // [E-mail protejat]
Introduceți numele de utilizator și parola. Ele pot fi obținute în panoul de administrator al companiei dvs. de găzduire.
Încărcați fișiere cu Favoks în directorul rădăcină. Directorul rădăcină se numește de obicei "Public_html" sau "www".

Pasul 2: Adăugați Favon la HTML.

Deținerea ferestrei serverului FTP deschis, descărcați fișierul "index.html" sau "Header.php".
Apoi, trebuie să încărcați codul. Codul descărcabil depinde de site-ul dvs. Web.
Dacă site-ul dvs. este pe HTML, găsiți zona capului din fișierul Index.html și introduceți următorul cod:

Dacă site-ul dvs. este pe WordPress, găsiți zona capului din fișierul antet.php și introduceți următorul cod:

/Favicon.ico »/\u003e

Cu aceste coduri, browserele vor putea găsi Favo.
Deci, ați instalat Favon!

Cum se adaugă Favon la WordPress și alte platforme

Dacă resursa dvs. se bazează pe WordPress sau în alte CMS, adăugați Favon la site-ul este foarte simplu. În general, algoritmul pentru adăugarea de favicon pentru diferite platforme va fi același.
1. Trebuie să mergeți la consola site-ului.
2. Găsiți secțiunea "Design" sau "aspect".

3. Mergeți la secțiunea "Setări temă" și găsiți "Favon" acolo.

4. Descărcați Favon de pe computer.

5. Salvați și actualizați pagina.

Cum se creează mai complexul Favona

Acest articol discută modalități simple și rapide de a crea Favonov compatibil cu practicile oricăror browsere și sisteme de operare. Dar când vine vorba de proiectarea și dezvoltarea web, nu există nici o limită a perfecțiunii. Dacă doriți să învățați cum să faceți mai complexe Favon, atingeți pictogramele pentru ecranele principale iOS, icoanele de interfață Metro în Windows, Icoane pentru Google TV și multe altele, vă recomand să vă familiarizați cu aceste materiale: favicon cheat foaie. Există informații complete pe această temă și li se oferă surse bune. Aceasta este o opțiune excelentă pentru acei designeri și dezvoltatori (inclusiv mine), care încearcă în mod constant să-și extindă cunoștințele.

Folosind Favico.js, puteți crea favoriți dinamici cu numere.

De asemenea, este posibil să aveți nevoie de un Favon dinamic, care are o pictogramă în schimbare. Pentru a crea astfel de favonov, vă sfătuiesc să utilizați serviciul favico.js.Disponibil pe GitHub. În timp ce remedierile dinamice sunt compatibile cu toate browserele. Dar pentru acele browsere care le susțin, aceste icoane pot fi o adăugare interesantă și utilă.

Dacă doriți să completați acest articol cu \u200b\u200bun alt sfat sau să puneți o întrebare, lăsați comentariile de mai jos!

Cum se creează o iva pentru un site web - Sfaturi și servicii Updated: 7 februarie 2018 de autor: admin.