7 odborných tipů na ikoně webu určuje využití a výhody



Zajímá vás použití sady ikon pro váš web a který z nich si vybrat? Tyto odborné tipy vás mohou jen přesvědčit o tom, co již mnoho profesionálních vývojářů webu ví: je mnohem snazší prohledávat ikony z přiložené sady ikon, než najít ikony jeden po druhém a najít způsob, jak je nějak spojit.

Požádali jsme komunitu o jejich nejlepší tipy, jak používat sady ikon, a mnoho z nich souhlasí s používáním populární sady ikon Font Awesome, ale to není jediná sada ikon na trhu.

Kterou sadu ikon používáte? Dejte nám vědět v komentářích!

 Používáte pro svůj web konkrétní sadu ikon? Používáte Font Awesome pro konkrétní použití (tj. S Shopify, pro zpravodaj, ...)? Pokud ano, proč jej používáte a jaká je vaše zkušenost se sadou ikon? Už jste použili jejich CDN, zaznamenali jste nějaké zlepšení pro vaše použití?

Jeff Roscher: dodává hezký jednoduchý styl, který zákazníkům připadá moderní a přitažlivý

Používáme Font Awesome na eWorkOrders.com. Je součástí našeho marketingového webu i našeho softwaru jako služba (SAAS), což je počítačový systém řízení údržby (CMMS). Na naší marketingové stránce přidává pěkný jednoduchý styl, který potenciálním zákazníkům připadá moderní a atraktivní. Přidali jsme zajímavé hranice a události přejetí myší, aby byly interaktivnější a vzrušující. Pro naše zákazníky jsou ikony Font Awesome používány jako vizuální narážka uvnitř vstupních polí, která pomáhají určit, jaký typ dat by měl být zadán, například ikona kalendáře v poli data, obálka v poli e-mailové adresy nebo ikona telefonu v pole pro telefonní číslo. Používají se na funkčních tlačítkách, jako jsou úpravy, kopírování a tisk.

Ikony se používají k poskytování rychlých vizuálních informací o datech, jako je červená ikona vykřičníku vedle opožděného pracovního příkazu nebo když něco potřebuje pozornost. Jsou také na několika dalších místech, aby program vypadal hezčí.

Písmo Awesome bylo úžasné! Jejich CDN je rychlé a existuje mnoho možností pro každý jiný druh ikon, které jsme potřebovali. Nikdy jsme nebyli zklamáni.

Jeff je prezidentem eWorkOrders.com. eWorkOrders je snadno použitelný webový CMMS, který pomáhá zákazníkům spravovat požadavky na služby, pracovní příkazy, aktiva, preventivní údržbu a další.
Jeff je prezidentem eWorkOrders.com. eWorkOrders je snadno použitelný webový CMMS, který pomáhá zákazníkům spravovat požadavky na služby, pracovní příkazy, aktiva, preventivní údržbu a další.

Rachel Foley: cenově dostupný způsob, jak snadno přistupovat k obrovské knihovně ikon

V Map My Customerers se plně spoléháme na Font Awesome pro naši ikonografii napříč všemi marketingovými kanály a naším produktem včetně našich:

  • webová stránka
  • E-maily
  • Sociální média
  • Vlastní grafika
  • Mobilní aplikace
  • Webová aplikace

Používáme Font Awesome, protože je to cenově dostupný způsob, jak snadno přistupovat k obrovské knihovně ikon. Styl je spíše na hravé straně, která se přizpůsobuje naší značce; Navíc nám schopnost využívat různé váhy a styly ikon dává svobodu.

CDN používáme pro naše aplikace, což umožňuje velmi konzistentní dojem napříč uživatelským zážitkem. Navíc - je to velmi snadné upgradovat, když to potřebujeme. S marketingovými materiály jsme trochu flexibilnější a používáme směs CDN, našich lokálních instalačních a vektorových verzí.

FA jsme pro nás vždy spolehliví od doby, kdy jsme byli plně přijati v lednu.

Rachel je profesionálním webovým návrhářem a marketingem obsahu založeným na NYC, jehož cílem je posílit rostoucí značky B2B a dosáhnout dlouhodobého marketingového úspěchu prostřednictvím strategie SEO. V současné době je v Map My Customer, B2B obchodní softwarové společnosti, která vytváří řešení pro týmy v terénu.
Rachel je profesionálním webovým návrhářem a marketingem obsahu založeným na NYC, jehož cílem je posílit rostoucí značky B2B a dosáhnout dlouhodobého marketingového úspěchu prostřednictvím strategie SEO. V současné době je v Map My Customer, B2B obchodní softwarové společnosti, která vytváří řešení pro týmy v terénu.

Andrew Ruditser: Jak jsme vylepšili písmo Awesome, udělali jsme to také

Font Awesome is used on all our sites since the dawn of time. When we first started working with Font Awesome, it was mainly used for their Sociální média Icons. As Font Awesome upgraded, so did we. Not only are their phone icons fantastic, we enjoy the comical icons that they offer. As of recent, Font Awesome announced their version 6 icons. To us, this shows that Font Awesome cares for their users, and want to keep their system up to date with recent code.

Font Awesome nyní nabízí širokou škálu ikon, ze kterých si můžete vybrat. Tuto flexibilitu považujeme za užitečnou pro nás od fáze návrhu po fázi vývoje. Pro Font Awesome nabízí jejich platforma svým uživatelům dvě možnosti. První možnosti je bezplatná služba, která nabízí 1 588 bezplatných ikon. Druhou možností je členství v programu Pro, které nabízí 7 842 ikon. Tato společnost má také to, čemu říkáme Icon cheat sheet. Tento seznam zobrazuje všechny jejich ikony, které nabízí Font Awesome, což nás informuje, zda jsou součástí bezplatného balíčku nebo balíčku pro.

Chcete-li přidat, Font Awesome také nabízí možnost vytáhnout jejich kód z jejich CDN. Důrazně doporučujeme jít jejich cestou. Jejich CDN má rychlou odezvu a mezi naším webem a jejich platformou máme málo k žádnému „Lagu“.

Andrew Ruditser, vedoucí technologický koordinátor
Andrew Ruditser, vedoucí technologický koordinátor

Jeff Romero: zrychluje rychlost stránky

Na Wordpress vyvíjíme vlastní webové stránky pro malé a střední firmy. Historicky jsme používali obrázky k reprezentaci různých ikon na našich webových stránkách, od profilů sociálních médií po telefonní a e-mailové ikony. Proces použití obrázku pro ikony vyžaduje nalezení konzistentní sady ikon, jejich nahrání a změnu jejich velikosti, aby se zajistilo, že se vejdou na web.

Přestože se jedná o malý obrazový soubor, je to trochu proces, jak získat konzistentní sadu ikon a nechat je, aby odpovídaly šabloně webu. Nyní, pomocí Font Awesome a jeho Wordpress pluginu, můžeme nahradit ikony konzistentní sadou médií, která jednoduše vyžaduje zkopírování / vložení řádku HTML. Ještě lépe je možné změnit velikost ikon pomocí malého množství CSS (pomocí vlastnosti font-size). Ikony se zobrazují lépe než ikony založené na obrázcích a jsou jasně viditelné na mobilních zařízeních. A konečně, protože se jedná spíše o řádek HTML než obrazový soubor, je rychlost stránky mnohem rychlejší.

Jeff Romero je spoluzakladatelem společnosti Octiv Digital, digitální marketingové agentury, která se specializuje na místní a podnikovou strategii SEO, správu reklamy s platbami za kliknutí, webdesign / vývoj a marketingové analytické služby.
Jeff Romero je spoluzakladatelem společnosti Octiv Digital, digitální marketingové agentury, která se specializuje na místní a podnikovou strategii SEO, správu reklamy s platbami za kliknutí, webdesign / vývoj a marketingové analytické služby.

Vance: zvláště dobré, když ve svém týmu nemáte návrháře

Jako webový vývojář používám Font Awesome jako rychlé řešení pro spoustu pěkných ikon. Jak již bylo řečeno, Font Awesome je zvláště dobrý, když ve vývojovém týmu nemáte návrháře. Je to užitečné pro vývoj pluginů Wordpress, protože vývojáři je mohli vložit do svých pluginů pomocí CDN Font Awesome v žádném okamžiku.

Moje zkušenost s Fontem Awesome je zatím dobrá. To však neznamená, že to nemá žádné nevýhody. Jednou ze zjevných nevýhod je rychlost načítání stránky (výkon). Protože se jedná o rychlé řešení, musíte vložit celou sadu ikon, i když stačí použít několik ikon. To by mohlo snížit rychlost načítání webových stránek a skóre Google Page Speed ​​(PSI).

Vance, vývojář webu a majitel webu.
Vance, vývojář webu a majitel webu.

Sunny Ashley: jednoduché, čisté a okamžitě rozpoznatelné pro nové návštěvníky

V zápatí našeho webu používáme ikony Font Awesome. Konkrétně používáme ikony Facebook, Twitter a LinkedIn pro odkazování na naše kanály sociálních médií. Pro nové návštěvníky jsou jednoduché, čisté a okamžitě rozpoznatelné. Jak ostatní uživatelé písma Awesome vědí, byli také velmi rychlí a snadno konfigurovatelní.

Sunny Ashley, zakladatel a generální ředitel společnosti Autoshopinvoice. Autoshopinvoice poskytuje software pro správu obchodů pro nezávislé autoservisy a garáže.
Sunny Ashley, zakladatel a generální ředitel společnosti Autoshopinvoice. Autoshopinvoice poskytuje software pro správu obchodů pro nezávislé autoservisy a garáže.

Burak Özdemir: Ikony peří nezpůsobují nadměrnou velikost DOM

Feather Icons je kolekce čitelných, vizuálně příjemných ikon s otevřeným zdrojovým kódem navržených a udržovaných Cole Bemisem. V červnu 2020 je k dispozici více než 280 ikon. Všechny ikony poskytované ikonami Feather jsou licencovány MIT a lze je stáhnout samostatně jako soubory SVG. Velikost ikony, barvu tahu ikony a šířku tahu můžete upravit na webu Feather Icon před jejich stažením.

Ikony peří mohou být skvělou volbou pro váš web nebo projekt, pokud jste vývojář nebo víte, jak zvládnout některé základní front-end úkoly. Protože tyto lehké ikony lze vykreslit také pomocí modulární knihovny JavaScript, nezpůsobují nadměrnou velikost DOM, metriku, která může poškodit výkon vaší webové stránky. S použitím ikon Feather Icons tedy můžete snížit rychlost načítání stránky ve srovnání s jinými balíčky dostupnými na trhu. Jedinou nevýhodou použití této sady ikon je, že nemůžete najít většinu ikon značky.

Ikony peří
Burak Özdemir je webový vývojář z Turecka. Specializuje se na vytváření webových aplikací.
Burak Özdemir je webový vývojář z Turecka. Specializuje se na vytváření webových aplikací.

Michel Pinson
O autorovi - Michel Pinson
Michel Pinson je cestovní nadšenec a tvůrce obsahu. Sloučení vášeň pro vzdělávání a průzkum je zapojen ke sdílení znalostí a inspiruje ostatní prostřednictvím podmanivého vzdělávacího obsahu. Přiblížení světa zmocněním jednotlivců s globální odborností a pocitem putování.




Komentáře (0)

Zanechat komentář