Hogyan tervezz, hozz létre és tölts fel egy WordPress Favicon-t?

Vagy laikusan mondva „Hogyan változtasd meg a weboldalad kis ikonját”

Ismered azt a kis szürke négyzetet, amit a böngésződ sávjában látsz, amikor a WordPress weboldaladon vagy?

Igen… ez az. Ez a WordPress favicon, más néven a WordPress böngésző ikonja. És bármennyire is szeretem a WordPress-t, ez egy egyértelmű árulkodó jel, hogy az oldalad egy WordPress oldal – arról nem is beszélve, hogy kihagysz egy nagyszerű lehetőséget arra, hogy profi módon nézz ki, és használd következetesen a szuperjó brandingedet.

Ebben a bejegyzésben mindent megtudhatsz a faviconokról (más néven böngésző ikonokról) a WordPress-en, beleértve azt is, hogy mi az a favicon egyébként?! Tervezési tippeket, hogy a faviconod kitűnjön a tömegből, a használandó fájltípust, és hogyan hozd létre és exportáld a faviconodat 3 egyszerű lépésben.

De mindenekelőtt…

Mi az a Favicon vagy böngésző ikon?

A favicon más néven böngésző ikon, és ez az a kis ikon, amely a böngészőablak tetején található minden egyes megnyitott lapon, és segít az oldaladnak kitűnni a többi közül. Ez egy nagyszerű módja annak, hogy megerősítsd a branded és egy szuper módja annak, hogy a WordPress weboldalad professzionálisabbnak tűnjön és kiemelkedjen a navigációs sávban!

Mitől lesz jó egy Favicon?

Sokszor látom, hogy az emberek rosszul tervezik a Faviconokat – még a nagy szervezetek (és webdesignerek – hoppá!) is néha olyan Faviconokat választanak, amelyek nem néznek ki túl jól.

1. A faviconod legyen egyszerű (a favicon teljesen apró, így minden részlet elveszik). Kerüld az összetett dizájnt, a mintákat vagy a teljes szavakat tartalmazó logókat – ezek elvesznek, amikor az emberek a faviconodra néznek.
2. A faviconodnak összhangban kell lennie a márkáddal – egy kiegészítő jel (a logód kis része) vagy egy egyszerű ikon a márkád színeiben jó választás a favicon tervezéséhez.
3. A faviconodnak ki kell tűnnie! Vedd figyelembe mind a sötét, mind a világos témájú böngészőket. A sötét témájú faviconok (például a fekete betűk könnyen eltűnnek a sötét témájú böngészőkben, amelyeket egyre gyakrabban használnak, mivel az emberek igyekeznek védeni a szemüket a számítógép vakító fényétől. Hasonlóképpen a világos favikonok elmosódhatnak a háttérben egy világos böngésző témáján. Én inkább egy lekerekített szélű kört vagy négyzetet használok, amely sötét és világos elemeket is tartalmaz, így mindkettőben jobban fog látszani, mint például két sötét betű egy átlátszó háttéren, amelyek eltűnnének egy sötét böngésző hátterén.

Nézd meg ezeket a böngésző ikonokat a fenti sötét témájú böngészőmben – melyik jelenik meg a legjobban? Melyiknek van a legnagyobb vizuális hatása? Használd ezt segítségül a faviconod megtervezéséhez.

Hogyan tervezz egy Favicon-t a WordPress weboldaladhoz 3 egyszerű lépésben

Sokféle program közül választhatsz, amivel gyorsan készíthetsz egy favicon-t a WordPress weboldaladra. Én például az Adobe programcsomagot – különösen az Adobe Illustratort – szeretem erre a célra. De használhatod a Canva-t is – még az ingyenes verzió is elég lesz a favicon elkészítéséhez.

1. Döntsd el, hogy szeretnél e egyszínű hátteret (ahogy fentebb említettem, én a lekerekített szélű kör vagy négyzet rajongója vagyok). Használd ehhez a márkád egyik színét.
2. Először a részleteket dolgozd ki. Azt javaslom, hogy egy kiegészítő jelet vagy a weboldalad kezdőbetűit, vagy akár a logódat, ha az elég egyszerű. Figyelj arra, hogy ez olyan színű legyen, amely kellő kontrasztot alkot az általad választott háttérszínnel.
3. Nagyítsd ki a Faviconodat, hogy „valódi méretben” is láthasd, és ellenőrizd, hogy kitűnik e. Ha kell, módosítsd. Ezután exportáld PNG formátumban, átlátszó háttérrel, hogy ne maradjon egy csúnya fehér négyzet mögötte!

Milyen fájltípust érdemes használni a WordPress Faviconhoz?

A favicon fájltípusa fontos. Nem tudod, mire gondolok, amikor fájltípust mondok? Ebben a begyejzésben megnézheted.

A WordPress elfogadja a PNG, JPEG, GIF vagy ICO fájlokat a faviconodhoz. Ne feledd, hogy a PNG fájlok nem jelennek meg az Internet Explorerben. Nincs ICO formátumú képed? Itt megtudhatod, hogyan konvertálhatsz egy képet ICO-fájlba.

Milyen méretű legyen a WordPress Favicon?

A favicon optimális mérete 512 x 512 pixel, négyzet alakú. Ennél kisebb nem lehet.

Hogyan változtathatod meg a Faviconodat azaz hogyan változtathatod meg a kis ikont a weboldaladon?

Létrehoztál egy gyönyörű, egyszerű WordPress favicon-t. Méretezted és a megfelelő fájltípusba mentetted, készen a feltöltésre. Már majdnem kész vagy. Megmutatom, hogyan adhatod hozzá kétféle módon a faviconodat a WordPress weboldaladhoz.

Az 1. verzió:

1. Admin felületen a bal oldali menüben válaszd ki a Megjelenés / Testreszabás menüpontot
2. Az új oldalon ismét a bal oldali menüben válaszd a Honlap azonosítás menüpontot
3. Töltsd fel a böngésző ikonját (más néven favicon)

A 2. verzió:

1. Admin felületen a bal oldali menüben válaszd ki a Beállítások / Általános menüpontot
2. A Honlap ikon részen töltsd fel a böngésző ikonját (más néven favicon)

Gratulálok, hozzáadtad a WordPress Faviconodat, máris úgy nézel ki, mint egy profi!