Favicon - (az angol FAVorites ICON-ból fordítva "ikon a kedvencek számára") - egy 16x16px vagy 32x32px méretű webhelyikon, amelyet a böngésző a címsávban vagy egy elmentett könyvjelző mellett jelenít meg. Hagyományosan az ikon neve és kiterjesztése a favicon.ico.

Szolgáltatásunk képes átalakítani az Ön által választott képet (175 Kb-ig) webhelyikonokká (16x16px vagy 32x32px). A generálás után csak fel kell töltenie a favicon.ico fájlt a tárhely kívánt könyvtárába.

Hiányzik az ikon hiba technikai optimalizálás erőforrás, ez csökkenti a márka ismertségét, csökkenti a keresési kivonatok CTR-jét, rontja a webes erőforrások keresését a böngésző könyvjelzői alapján stb.

A Yandex rendelkezik egy speciális botdal, amely egyenként indexeli az összes webhely faviconját. Új ikonok hozzáadása a kereséshez körülbelül két héttől egy hónapig terjed.

Hol tölthetem le a favicont, hogy online legyek?

A létrehozott favicon.ico webhelyikonként történő megjelenítéséhez fel kell töltenie a webhely gyökérkönyvtárába (vagy bármely könyvtárba), és meg kell adnia az abszolút vagy relatív elérési utat () a webhelysablon kódjában (), például kód:

Miért mutasson utat a Favicon felé?

Ha egy webhely ikont használ a teljes webhelyhez, ha a favicon.ico a gyökérmappában található, akkor annak elérési útja elhagyható - a böngészők maguk találják meg, és webhelyikonként jelenítik meg. A nagy vagy egyedi erőforrások kategóriájukhoz különböző webhelyikonokat használnak. Ehhez a megfelelő sablonokban el kell jutniuk a különböző favicon.ico fájlokhoz.

A mai cikk témája az, hogyan lehet online favicont készíteni egy webhelyhez vagy bloghoz a WordPressen. Ha valamilyen oknál fogva még mindig nem tudja, mi az, és miért van szükség erre a fájlra, akkor ajánlom, hogy olvassa el azokat a cikkeket, amelyeket már írtam erről a témáról:

Általában minden webhelynek rendelkeznie kell ezzel a kis képpel.

Hogyan készítsünk egy favicon.ico webhelyhez

Szóval, most megpróbálom elmondani, hol, hogyan és hogyan készítsen favicont. De először tudnia kell, hogy a favicon mekkora legyen az oldal számára?

Favicon ICO, JPEG, PNG, BMP és GIF formátumú kép, amely különböző méretű lehet, kezdve a 16 × 16 pixeltől. Pontosan ekkora ikont kell feltölteni a webhelyre a Yandex robot indexeléséhez.

Más dimenziók másodlagos jelentőségűek, és nem jelennek meg itt Yandex keresés, de böngészőkben történő megjelenítésre használják őket, például az iPhone vagy az iPad készüléken. Ha azt szeretné, hogy webhelye kiemelkedjen a keresési eredmények között, ne feledje az alábbi szabályt.

Ha több különböző méretű favicon van, akkor az oldalkód első helye a 16x16 px kép elérési útja, mivel a Yandex favicon robot csak az első címet olvassa.

A favicon legegyszerűbb módja a Photoshop vagy bármely más grafikus szerkesztő. Még könnyebben tehet, készíthet már kész képet vagy fényképet, és egyszerűen átalakíthatja a kívánt formátumra és méretre. Mivel egy ilyen ikon nagyon kicsi, a kép apró részletei rosszul lesznek láthatók rajta. Ezért jobb, ha a favicont a lehető legegyszerűbbé, ugyanakkor vonzóvá és egyedivé teszi. Végül is ez a webes erőforrás névjegykártyája.

Ha nem vagy nagy szakértő a Photoshopban, akkor nem számít, sok ingyenes generátorszolgáltatás található az interneten egy webhely faviconjának létrehozásához. Némelyikük csak képeket képes ICO formátumra konvertálni, míg mások lehetőséget nyújtanak a semmiből a favicon szerkesztésére vagy létrehozására. Felhívom a figyelmét egy kis áttekintésre az ilyen online generátorokról.

Szolgáltatások online favicon generátor - hozzon létre egy favicon online

Én kezdem a legtöbbet egyszerű szolgáltatások, majd fokozatosan áttérek a haladóbbakra, ahol statikus és animált ikonokat készíthet a semmiből, és szerkesztheti a készeket.

Amikor éppen elindítja a blogot vagy a vállalati webhelyet, és még nincs logója, a Logaster szolgáltatás nagyszerű megoldás az Ön számára. Segítségével létrehozhat egy logót, majd a logó alapján a generátor számos tetszés szerinti kedvenc ikont hoz létre. A kényelem abban rejlik, hogy a logó és a favicon ugyanabban a stílusban készül, így webhelye professzionálisabb lesz.

Egyszerű favicon generátorok

Először is számos olyan webhely létezik, ahol egyszerűen elkészíthet egy ikont a webhelyhez úgy, hogy bármely képet favicon.ico fájlba konvertál, szerkesztés lehetősége nélkül.

A www.favicongenerator.com talán a legkevésbé minimalista szolgáltatás. Semmi sem felesleges - választott egy képet, és rákattintott a „Favicon létrehozása! És letöltötte a létrehozott ikont.

tools.dynamicdrive.com/favicon- egyszerű és tiszta szolgáltatás ahol három méretben készíthet favicont. A fogadott fájlok letöltéséhez kattintson az alattuk található „FavIcon letöltése” gombra.

A www.cy-pr.com/tools/favicon és a www.favicon.co.uk az előzőhöz hasonló szolgáltatások. Az elsőben elkészítheti a favikon méretét 16 × 16 és 32 × 32, a másodikban pedig 48 × 48 és 64 × 64.

www.genfavicon.com - az ikon létrehozásának teljes folyamata három lépést tartalmaz:

1. Válasszon ki egy fájlt (JPEG, GIF, PNG) a számítógépén, vagy egyszerűen írja be a kép URL-jét, és kattintson a Kép feltöltése“;
2. Válassza ki a rajz méretét (16 × 16, 32 × 32, 48 × 48, 64 × 64 vagy 128 × 128) és a kívánt területet, ha a képre csak egy részt akarunk létrehozni a Rögzítés és kép“;
3. Megnézzük az eredményt, és ha minden megfelel nekünk, töltsük le a fájlt.

Animált kedvenc ikon létrehozása egy weboldalhoz online generátorokban

Most nézzünk meg néhány szolgáltatást, ahol animált ikonokat készíthetünk, valamint szöveget adhatunk a latin ábécébe, amely a kúszó vonal ikonjával együtt görget. Az igazi animációt nem minden böngésző támogatja.

www.favicon.by - szolgáltatás oroszul. Csak egy fájl kiválasztása szükséges, beírja a szöveget latinul (ha szükséges), és nyomja meg a „Favicon létrehozása” gombot. Az alábbiakban láthatja az eredményt, és letöltheti az archívumot a fájlokkal együtt.

A www.favicon.com.mx az előzővel teljesen megegyező szolgáltatás, csak angol nyelven.

Hol készíthet favicont a semmiből - online favicon szerkesztők

antifavicon.com - ez a szolgáltatás valamilyen oknál fogva az anti előtaggal érdekes, mert lehetővé teszi, hogy maga készítsen egy favicon.ico fájlt, de nem képként, hanem szövegként színes háttérrel. Csak a megfelelő betűk beírása és a színek kiválasztása szükséges. Egyébként itt készítettem a favicont. Gondoltam később megváltoztatom, de most már megszoktam.

favicon-generator.org - itt a konverter mellett van egy ikonszerkesztő is. Ezenkívül feltöltheti a létrehozott favicont a nyilvános galériába, ahová az oldal többi felhasználója szabadon letöltheti.

A favicon.ru egy népszerű orosz online generátor, ahol mindkettőből létrehozhat favikonokat, és megrajzolhatja azokat. Itt megrendelheti egy favicon létrehozását a szakemberek számára 20 dollárért. Kíváncsi lennék, hogy valaki ott rendel-e?

A www.favicon.cc egy másik népszerű generátor, hasonló az előzőhöz. A szolgáltatás érdekes tulajdonsága, hogy akár 20 másodpercig is animálhat képkockánként.

Láthatja az animált favicont, és letöltheti azt az előnézeti ablakban.

A www.degraeve.com/favicon egy másik online favicon generátor. Ez a szerkesztő az előzőekhez hasonlóan lehetővé teszi a készítést átlátszó háttér ikonok.

Talán a mai napra ez elég, bár ez korántsem minden online szolgáltatás. De még ezek is elegendőek ahhoz, hogy létrehozzanak egy gyönyörű favicont a webhelyedhez vagy blogodhoz, és láthatóak legyenek a keresési eredmények között.

És mégis, elmentettem egy újabb online ikongenerátort az oldalra későbbre. Ez a szolgáltatás külön bejegyzést érdemel, ahol elmondom, hogyan készíthet favicont az iPhone-hoz, IPod touchés IPad böngészőkés részletesebben az animált ikonok telepítésén fogok foglalkozni. Ezen felül bemutatom Önnek a Favicon Validator szolgáltatást, ahol ellenőrizheti és megtekintheti az összes favicon.ico ikont, ha ez a fájl egynél több képet tartalmaz .. Viszlát mindenkit!

A modern weboldalak szerves része a Favicon ikon, amely lehetővé teszi, hogy gyorsan azonosítson egy adott erőforrást a böngésző lapjainak listájában. Azt is nehéz elképzelni számítógépes program saját egyedi címke nélkül. Ugyanakkor a webhelyeket és a szoftvereket ebben az esetben egy nem teljesen nyilvánvaló részlet egyesíti - mindkettő ICO formátumú ikonokat használ.

Ezek a kis képek mindkettőnek köszönhetően létrehozhatók speciális programokés az online szolgáltatások segítségével. Egyébként az utóbbiak sokkal népszerűbbek ilyen célokra, és ebben a cikkben számos ilyen forrást megvizsgálunk.

A grafika nem a legnépszerűbb kategóriája a webes szolgáltatásoknak, de amikor az ikonok generálódnak, mindenképpen sok közül lehet választani. A munka elve szerint az ilyen forrásokat fel lehet osztani azokra, amelyekben maga rajzol képet, és olyan webhelyekre, amelyek lehetővé teszik, hogy egy már elkészült képet ICO -vá alakítson. De alapvetően az összes ikongenerátor mindkettőt kínálja.

1. módszer: X-Icon Editor

Ez a szolgáltatás a legfunkcionálisabb megoldás az ICO képek készítéséhez. A webalkalmazás lehetővé teszi, hogy kézzel rajzolja meg az ikont részletesen, vagy kész képet használjon. Az eszköz fő előnye a képek exportálása 64x64-ig terjedő felbontással.

Tehát, ha azonos típusú, különböző méretű ikonok egész készletét kell létrehoznia, nem talál jobbat az X-Icon Editor-nál, ezekre a célokra.

2. módszer: Favicon.ru

Ha 16x16 méretű favicont kell készítenie egy webhelyhez, akkor a Favicon.ru orosz nyelvű online szolgáltatás is kiváló eszköz lehet. Az előző megoldáshoz hasonlóan itt is rajzolhat egy ikont, minden egyes képpontot külön színezhet, vagy kész képből létrehozhat egy favicont.

Ennek eredményeként az ICO kiterjesztésű fájl mentésre kerül a számítógépére, amely egy 16 × 16 pixeles kép. A szolgáltatás tökéletes azok számára, akiknek csak egy képet kell átalakítaniuk egy kis ikonná. Azonban egyáltalán nem tilos fantáziát mutatni a Favicon.ru oldalon.

3. módszer: Favicon.cc

Az előzőhöz hasonlóan, mind nevében, mind működésében, de még fejlettebb ikongenerátor. A rendszeres 16x16-os képek létrehozása mellett a szolgáltatás megkönnyíti az animált favicon.ico rajzolását a webhelyéhez. Ezenkívül az erőforrás több ezer egyedi ikont tartalmaz, amelyek ingyenesen letölthetők.

Ha az angol nyelvű felület nem zavar, akkor egyáltalán nincsenek érvek az előző szolgáltatással való együttműködés mellett. Amellett, hogy a Favicon.cc képes animált ikonok előállítására, az erőforrás helyesen ismeri fel az importált képek átlátszóságát is, amely sajnos az orosz nyelvű analógtól megfosztva van.

4. módszer: Favicon.by

A favicon generátor másik változata a weboldalak számára. Ikon létrehozása a semmiből vagy egy adott kép alapján lehetséges. A különbségek között szerepel a képek harmadik féltől származó webes erőforrásokból történő importálásának funkciója és egy meglehetősen stílusos, lakonikus felület.

Általánosságban elmondható, hogy nincs különbség a cikkben már tárgyalt szolgáltatásokkal való együttműködés terén, azonban a Favicon.by erőforrás sokkal jobban megbirkózik a képek ICO-kká történő átalakításával, és ezt nagyon könnyű észrevenni.

5. módszer: Online-Convert

Valószínű, hogy ezt a webhelyet már szinte mindenevő online fájl-átalakítóként ismeri. De nem mindenki tudja, hogy ez az egyik legjobb eszköz bármely kép ICO -vá konvertálásához. A kimeneten legfeljebb 256 × 256 pixel felbontású ikonokat kaphat.

Mint láthatja, hozzon létre ICO ikonra Az Online-Convert weboldal használata egyáltalán nem bonyolult, és ez csak néhány egérkattintással történik.

A mai leckében erről mesélek Favicon ikonok (favicon). megmutatom hogyan készítsünk favicon.ico weboldalt(vagy egy blog esetében nincs különbség), és megmutatja, hogyan tud helyezze be a favicont.

Bizonyára sokan még mindig nem tudják, milyen "csodáról" beszélek. Egyszerűen fogalmazva: a favicon egy kép (ikon), amely a böngészőben a webhely címe előtt áll. Világosan megmutatom a blogom Favicon-ját:

Ez az ikon egyfajta logó a blogodhoz. Ezért a favicon létrehozását teljes felelősséggel kell vállalni. Ne felejtsd el, hogy emiatt a blogod kitűnhet mások közül.

Tanterv:

1. Favicon építése a semmiből.
2. Favikon létrehozása innen: kész kép.
3. Szolgáltatások a következővel: kész ikonok a webhelyhez.
4. A kapott ikon csatolása a webhelyhez.

Hogyan készítsünk favicont a semmiből

Van egy nagyon kényelmes szolgáltatás. Van egy favicon.cc címe. Ez a szolgáltatás a faviconok készítéséhez így néz ki:

Nak nek rajz favicon csak válasszon színt és csak festessen. Ha valahol rosszul rajzolt valamit a kép töredékének törléséhez, jelölje ki az átlátszó eszközt (jelölje be a négyzetet), és "távolítsa el" azokat a képpontokat ("négyzetek"), amelyeket el kell távolítani:

A következő favicont rajzoltam:

A favicon.cc-ben az tetszett a legjobban, hogy azonnal láthatja munkájának eredményét eredeti méretében. Ehhez le kell mennie egy kicsit a Previw szakaszra:

Vagy közvetlenül a böngészőben (Opera, Firefox, internet böngésző stb.) lásd a munka eredményét:

Favicon készítése kész képből

Tegyük fel, hogy nem a semmiből kíván létrehozni egy ikont a webhelyéhez, hanem egy kész képből. Ebben az esetben a favicon.ru létrehozásának szolgáltatása kényelmes lesz az Ön számára.

A szolgáltatás orosz nyelven működik, így nem okozhat problémát. Csak jelölje meg azt a képet, amelyet a webhely ikonjának szerepében szeretne látni (a „Tallózás” gomb), majd kattintson a „ Hozzon létre favicon.ico", És akkor már" Töltse le a favicon.ico fájlt”.

A Favicont - a szót szó szerint "kedvenc ikonként" lefordítva - a modern webdesign egyik legnehezebb elemének tartják. Ez egy kis kép, amely a böngésző lapon található kereső sávés másutt, és fontos szerepet játszik a webhely személyre szabásában.

A nem szabványos formátum és a kis méret miatt a favicon létrehozása technikai és tervezési szempontból egyaránt nehéz lehet.
Nem kevesebb kihívást jelentő feladat a favicon kompatibilitásának biztosítása a különböző böngészőkkel.

Ebben a cikkben megtudhatja, hogyan készítsen favicont - tervezési tippeket és szolgáltatásokat adunk a favicon létrehozásához, valamint a favicon hozzáadásához a webhelyéhez.

Mi a favicon és miért van rá szükség?

Annak ellenére, hogy a favicon nagyon kicsi grafikai objektum, rendkívül fontos a helyszín tervezésében és általában.

Kattintson a kép nagyításához.

Először, A favicon személyre szabottabbá és konzisztensebbé teszi webhelyét más grafikai elemekkel, például egy logóval.

Másodszor , a favicon kiemeli webhelyét a listában szereplő egyéb webes erőforrások közül Keresési eredmények... A mini-ikon nélküli webhely unalmasnak tűnik, és elveszíti a versenytársakat. Röviden: a favicon egyszerűen „kötelező” az oldalak számára.

Harmadszor A favicon lehetővé teszi a felhasználó számára, hogy az asztalon lévő könyvjelzők vagy más ikonok könyvtárában gyorsabban megtalálja az Ön webhelyét.

Favicon design készítése

A faviconnak a lényeget és a márkát apró hangulatjel méretű jelben kell megragadnia. Jó döntés a cég logójának egyszerűsített verziójává válik, de kérjük, vegye figyelembe: a szöveggel és védjegyekkel ellátott teljes értékű logó nem alkalmas erre a célra.

Ezek a weboldalak a márka grafikájukat (vagy legalábbis valami hasonlót) használnak.

Ne használjon szöveget

Kerülje a szöveg használatát, mert a favicon kis mérete miatt a feliratok olvashatatlanná válnak. Helyezzen 1, legfeljebb 2 betűt az ikonra - például az elsőt a vállalata vagy a webes erőforrás nevére; ebben az esetben még megkülönböztethetők.

A favicon pixelezése

A kedvenc ikonok olyan kicsiek, hogy minden pixel számít. Gyakran, ha kicsinyít egy teljes méretű logót, a kép elmosódott.

Ez a teljes méretű Facebook logó kivonata, miután 32x32-re kicsinyítették. Könnyen belátható, hogy a kép a széleken "lebeg". A hiba elkerülése érdekében pixelszintű szerkesztést kell végrehajtania.
Az ikonokkal való munka során inkább szerkesztő programokat használok bitképek(például Photoshop vagy Pixelmator). Először a teljes méretű logót 64x64 képpontra csökkentem, mivel ez a legnagyobb favicon, amire szükségem lesz. A munka nagyon fárasztó, akár egy órát is igénybe vehet, akár kettőt is, de az eredmény egyszerűen kiváló.
Ha nincs ideje és készségei az ilyen műveletekhez, akkor jobb használni online szolgáltatások, mint például Logotizer.ru

Favicon mérete

64x64-es ikonnal ugyanúgy létrehozok 32x32, 24x24 és 16x16 képpontot. Mindegyiknek megvan a maga célja:

- 64 × 64 - "Olvasási lista" a Safari és a Windows rendszerben
- 24 × 24 - Rögzített webhelyek az IE9-ben.
- 32 × 32 - A képernyőkhöz nagy felbontású.
- 16x16 - Általában olyan böngészőkben használják, mint az IE, a Safari, a Chrome stb.

De a kisebb favikonok létrehozása nem korlátozódik: gyakran szükség van rá további szerkesztés pixel szinten. Hozzáadhat alfa csatornát is, ha úgy látja. Ha korábban ez nehézségeket okozott, most szinte az összes böngésző támogatja az átlátszóságot a kedvenc ikonokban.

Favicon formátumok

Korábban, amikor csak a Windows ICO fájlokat támogatták, időt spórolhattunk meg, ha egy 16x16-os favicont GIF formátumban mentettünk el, és .ico kiterjesztést adtunk neki. Ez a technika hibátlanul működött! De most erre a módszerre már nincs szükség, mivel az ICO fájlok létrehozásának eszközei könnyen megtalálhatók az interneten. Sőt, most a favikonokhoz használatosak, de a leggyakoribbak még mindig csak a következő kettőt.

ICO

A tenyér az ICO formátumhoz tartozik. A PNG fájlokkal ellentétben az ICO fájlok különböző felbontásúak és bit mélység(ami nagyszerű Windows rendszerhez). Az Internet Explorer különféle méretű ikonokat használ (például 32 pixeles ikonokat a Windows 7 tálcához), ezért ez az eset Az ICO formátum az egyetlen lehetőség.

A PNG fájlok nagyon kényelmesek, mert a létrehozásához nincs szükség speciális eszközökre. Ez a formátum támogatja az alfa csatornát, és lehetővé teszi a legkisebb fájlok létrehozását. Talán az egyetlen hátrány PNG formátum az, hogy nem támogatott internet böngésző Felfedező.

Vannak más lehetőségek is:

- A GIF és az animált GIF formátumok csak a nagyon régi böngészőkkel való kompatibilitással rendelkeznek.
– JPG formátum használata nem ajánlott, még akkor sem, ha a kép fénykép formájában van. Ebben a formátumban nincs egyértelmű a PNG, és az egyetlen előnye több sima átmenetek a színek között - egy nagyon kis képen teljesen láthatatlan árnyalat.
- Az SVG nagyszerű lehetőség lehet, ha több böngésző támogatott ilyen formátumú kedvencek. Addig csak az Operával kompatibilis.
- Van még egy úgynevezett "alformátumú" PNG - APNG (animált PNG), amelyet a Firefox és az Opera támogat. Használatának megvalósíthatósága azonban továbbra is kérdéses. Az animált kedvenc ikon zavaró, sőt bosszantó lehet a felhasználó számára.

Hozzon létre favicon online eszközöket és online szolgáltatásokat

Mi választottunk ki a legtöbbet hasznos szolgáltatások amely segít online favicon létrehozásában.

Logotizer

A Logotizer egy új, egyszerű és kényelmes szolgáltatás favicon és logó létrehozásához a webhelyéhez.
Ezzel az online készítővel a semmiből létrehozhat egy favicont. A szolgáltatás kezdőknek szól, ezért fejlődjön jó design nem lesz nehéz.

Hogyan készítsünk egy favicont a online generátor Logotizer

A fő munkaterület a bal oldalon található. A jobb oldalon láthatja, hogyan fog kinézni a favicon a különböző adathordozókon - a böngésző lapján, a számítógép tálcáján vagy az okostelefon képernyőjén. Nagyon kényelmes és intuitív.

Először ki kell választania a favicon alakját. Nagyon sok van, több mint 50. Azt tanácsoljuk, hogy válasszon egyszerű és bonyolult formákat, hogy a favicon könnyen érthető és emlékezetes legyen.

Ebben a szakaszban meghatározza az alakzat színét is, amely a favicon háttereként jelenik meg, és kiválasztja a keretet. Nézze meg, hogy milyen szín dominálja a logót (ha van ilyen), milyen színek a főek a webhelyén. Ebben a tartományban javasoljuk a favicon kialakítását.

A "Form" blokk alatt alakzatok (szimbólumok) gyűjteménye található. Nincs olyan sok közülük, kár, hogy nem töltheti fel a lehetőségeit; de a választás még mindig elég érdekes.

Változtassa meg a formák színét, méretét, helyzetét! Egyszóval kísérletezzen, szerencsére a szolgáltatás lehetővé teszi ezt.

Az alakzat kiválasztása után hozzáadhatja saját szövegét. Mint korábban írtam, jobb, ha 1 vagy 2 betűt használunk, nem többet.

A betűtípusok széles választéka van. Ez mindenképpen plusz. Az alakzatokhoz hasonlóan megváltoztathatja a szöveg színét, méretét és helyzetét.

Ha úgy dönt, hogy valamilyen favicon réteg ideiglenesen zavarja Önt, vagy egyáltalán nincs rá szükség, egyszerűen elrejtheti.

A favicon létrehozása után a szolgáltatás felajánlja annak mentését. Regisztráljon egy fiókot (2017-ben regisztráció nélkül nincs lehetőség a regisztrációra), és ezt követően fájlokat tölthet le kis fizetéssel - 199 rubel.

A webhely tartalmaz egy kis utasítást arról, hogyan adhat hozzá egy favicont a webhelyhez, így nem okozhat problémát egy favicon hozzáadása a webhelyhez. Hasonló ajánlásokat adunk a cikk későbbi részében is.

A fizetés után a felhasználó azonnal megkap 10 különböző méretű favicont minden ma szükséges eszközhöz (Apple touch ikon, Microsoft Application Icons és mások).

Maga a favicon.ico fájl több méretű, és 4 méretben lévő ikonokat tartalmaz 1 fájlban (16 képpont, 24 képpont, 32 képpont, 64 képpont). Ennek megfelelően, ha hozzáad egy webhelyet a böngésző könyvjelzőihez, vagy megnyit egy előzményt, akkor különböző méretű ikonokat láthat, de ezek világosan és elmosódás nélkül jelennek meg.

Összességében a szolgáltatás jó. Egyszerű, kényelmes, semmi több.

RealFaviconGenerator.net

Egy egyszerűbb favicon generátor, amely lehetővé teszi favikonok létrehozását bármely platformhoz. Sőt, kipróbálhatja a favicont az erőforráson. Írja be webhelye URL-jét, és megnézheti, hogyan néz ki a faviconja minden böngészőben és minden böngészőben operációs rendszer... A Real Favicon Generator azt is megmutatja, hogyan lehet javítani a hibákat, és hogyan lehet még jobbá tenni a favicont.

Favicon.by

Favicon.by Egy másik ingyenes és könnyen használható favicon generátor, amely átalakítja PNG fájlok, JPG és GIF .ico formátumban. Töltsön fel egy képet a számítógépről, válasszon egy méretet (16x16px vagy 32x32px), majd kattintson a "Create" gombra. A kapott favicon mentéséhez kövesse az utasításokat.

A szolgáltatás lehetővé teszi egy pixel pixelenkénti megrajzolását is, de hogy őszinte legyek, nem mindenki képes rá. Például nem tudtam. Itt vagyok olyan görbe :)

Hogyan adhat hozzá favicont a webhelyéhez

Hozzáadhat favicont a webhelyéhez, ha néhány módosítást végez a webhely oldal HTML-kódjában.

1. lépés: Töltse fel a „favicon.ico” fájlt a tárhely-kiszolgálóra.

Ehhez lépjen az FTP-kiszolgálóra a következő link használatával:
ftp: // [e-mail védett]
Írja be felhasználónevét és jelszavát. Ezek beszerezhetők a tárhelytársaság adminisztrációs paneljén.
Töltse fel a favicon fájlokat a gyökérkönyvtárba. A gyökérkönyvtár neve általában „public_html” vagy „www”.

2. lépés: Adjon hozzá egy favicont a HTML-hez.

Az FTP-kiszolgáló ablakának megnyitásakor töltse le az „index.html” vagy „header.php” fájlt.
Ezután le kell töltenie a kódot. A letölthető kód az Ön webhelyétől függ.
Ha webhelye HTML, keresse meg a HEAD területet az index.html fájlban, és illessze be a következő kódba:

Ha webhelye WordPress, keresse meg a HEAD területet a header.php fájlban, és illessze be a következő kódot:

/favicon.ico ”/>

A böngészők ezeket a kódokat használhatják a kedvenc ikonok megkeresésére.
Tehát telepítette a favicont!

Hogyan adhatunk hozzá egy favicont a WordPresshez és más platformokhoz

Ha az erőforrás WordPress-en vagy más CMS-en alapul, akkor a favicon hozzáadása a webhelyéhez nagyon egyszerű. Általában a favicon hozzáadásának algoritmusa azonos lesz a különböző platformokon.
1. El kell mennie a helykonzolhoz.
2. Keresse meg a "Tervezés" vagy a "Megjelenés" szakaszt.

3. Menjen a "Téma beállításai" szakaszba, és ott keresse meg a "Favicon" elemet.

4. Töltse le a favicont a számítógépről.

5. Mentse és frissítse az oldalt.

Hogyan lehet összetettebb favikonokat létrehozni

Ez a cikk egyszerű és gyors módszereket tartalmaz a szinte minden böngészővel és operációs rendszerrel kompatibilis favikonok létrehozására. De ami a web tervezését és fejlesztését illeti, a tökéletességnek nincs határa. Ha meg szeretné tudni, hogyan lehet összetettebb kedvenceket készíteni, érintse meg az ikonokat az iOS kezdőképernyőihez, az ikonokat a Metro felülethez a Windows-ban, az ikonokat a Google TV-hez és még sok mást, javasoljuk, hogy ismerkedjen meg ezekkel az anyagokkal: favicon csalólap... Teljes információt tartalmaz a témáról és jó forrásokat kínál. Ez egy nagyszerű lehetőség azoknak a tervezőknek és fejlesztőknek (beleértve magam is), akik folyamatosan bővíteni kívánják ismereteiket.

A Favico.js segítségével dinamikus numerikus ikonokat hozhat létre.

Szüksége lehet egy dinamikus ikonra is, amelynek ikonja változó számmal rendelkezik. Ilyen ikonok létrehozásához azt tanácsolom, hogy használja a szolgáltatást favico.js elérhető a Githubon. Míg a dinamikus kedvencek nem kompatibilisek az összes böngészővel. De azoknak a böngészőknek, amelyek támogatják őket, ezek az ikonok érdekes és hasznos kiegészítést jelenthetnek.

Ha frissíteni szeretné ezt a cikket egy másik tippel, vagy kérdést szeretne feltenni, hagyjon megjegyzést alább!

Hogyan készítsünk favicont egy webhelyhez - tippek és szolgáltatások frissítve: 2018. február 7-én: admin