7 experttips på webbikonen anger användning och fördelar



Undrar du om att använda en ikonuppsättning för din webbplats och vilken du ska välja? Dessa experttips kan bara övertyga dig om vad många professionella webbutvecklare redan vet: det är mycket lättare att söka efter ikoner från en inkluderad ikonuppsättning än att hitta ikoner en efter en och hitta ett sätt att göra dem på något sätt konsekvent tillsammans.

Vi bad samhället om deras bästa tips om användning av ikonuppsättningar, och många av dem är överens om att använda den populära Font Awesome-ikonuppsättningen, men det är dock inte den enda ikonuppsättningen som finns tillgänglig på marknaden.

Vilken ikonuppsättning använder du? Låt oss veta i kommentarer!

 Använder du en specifik ikonuppsättning för din webbplats? Använder du Font Awesome för en specifik användning (dvs. med Shopify, för ett nyhetsbrev, ...)? Om så är fallet, varför använder du det, och vad är din upplevelse med ikonuppsättningen? Har du använt deras CDN, har du märkt någon förbättring för din användning?

Jeff Roscher: det lägger till fin enkel styling som kunderna tycker om modern och tilltalande

Vi använder Font Awesome på eWorkOrders.com. Det är en del av både vår marknadsföringswebbplats och vår programvara som en SAAS-erbjudande, ett datoriserat underhållshanteringssystem (CMMS). På vår marknadsföringssajt lägger den till en enkel och enkel styling som blivande kunder tycker är moderna och tilltalande. Vi har lagt till intressanta gränser och musöverföringsevenemang för att göra dem mer interaktiva och spännande. För våra kunder används Font Awesome-ikoner som visuell signal i inmatningsfält för att identifiera vilken typ av data som ska matas in, som en kalenderikon i ett datumfält, ett kuvert i ett e-postadressfält eller en telefonikon i ett fält för ett telefonnummer. De används på funktionella knappar, som redigera, kopiera och skriva ut.

Ikonerna används för att ge snabb visuell information om data som en röd utropsikon bredvid en försenad arbetsordning eller när något behöver uppmärksamhet. De är på några få andra platser bara för att göra programmet ser snyggare ut ..

Font Awesome har varit fantastiskt! Deras CDN är snabbt och det finns många alternativ för alla olika typer av ikoner vi har behövt. Vi har aldrig varit besvikna.

Jeff är ordförande för eWorkOrders.com. eWorkOrders är en lättanvänd webbaserad CMMS som hjälper kunder att hantera servicebegäranden, arbetsorder, tillgångar, förebyggande underhåll och mer.
Jeff är ordförande för eWorkOrders.com. eWorkOrders är en lättanvänd webbaserad CMMS som hjälper kunder att hantera servicebegäranden, arbetsorder, tillgångar, förebyggande underhåll och mer.

Rachel Foley: ett prisvärt sätt att enkelt få åtkomst till ett massivt ikonbibliotek

På Map Mina kunder litar vi helt på Font Awesome för vår ikonografi över alla marknadsföringskanaler och vår produkt inklusive vår:

  • Hemsida
  • E-post
  • Sociala media
  • Anpassad grafik
  • Mobil app
  • Webb-app

Vi använder Font Awesome eftersom det är ett prisvärt sätt att enkelt få åtkomst till ett massivt ikonbibliotek. Stilen är mer på den lekfulla sidan som överensstämmer med vårt varumärke; plus, förmågan för oss att använda olika vikter och stilar av ikoner ger oss frihet.

Vi använder CDN för våra applikationer vilket möjliggör en mycket konsekvent känsla över produktupplevelsen. Plus - det är superenkelt att uppgradera när vi behöver. Med marknadsföringsmaterial är vi lite mer flexibla och använder en blandning av CDN, våra lokala installations- och vektorversioner.

FA har alltid varit tillförlitligt för oss sedan vi antog helt i januari.

Rachel är en NYC-baserad webbdesigner och professionell innehållsmarknadsföring med en drivkraft för att förbättra växande B2B-varumärken och bygga långsiktig marknadsföring genom SEO-strategi. Hon är för närvarande på Karta över mina kunder, ett B2B-försäljningsprogramvara som skapar lösningar för fältförsäljningsteam.
Rachel är en NYC-baserad webbdesigner och professionell innehållsmarknadsföring med en drivkraft för att förbättra växande B2B-varumärken och bygga långsiktig marknadsföring genom SEO-strategi. Hon är för närvarande på Karta över mina kunder, ett B2B-försäljningsprogramvara som skapar lösningar för fältförsäljningsteam.

Andrew Ruditser: eftersom Font Awesome uppgraderades, så gjorde vi också

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 Sociala media 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 erbjuder nu ett brett utbud av ikoner att välja mellan. Vi tycker att denna flexibilitet kan vara till hjälp för oss från designfasen till vår utvecklingsfas. För Font Awesome erbjuder deras plattform två alternativ för sina användare. De första alternativen är en gratistjänst som erbjuder 1 588 gratis ikoner att välja mellan. Det andra alternativet är ett Pro-medlemskap som erbjuder 7 842 ikoner. Detta företag har också det vi kallar ett Ikon-fuskark. Denna lista visar alla deras ikoner som Font Awesome erbjuder, som informerar oss om de ingår i gratispaketet eller pro-paketet.

För att lägga till erbjuder Font Awesome också ett alternativ att dra sin kod från deras CDN. Vi rekommenderar starkt att deras väg. Deras CDN har en snabb responstid, och vi har liten eller ingen Lag mellan vår webbplats och deras plattform.

Andrew Ruditser, Lead Technology Coordinator
Andrew Ruditser, Lead Technology Coordinator

Jeff Romero: det gör sidan snabbare mycket snabbare

Vi utvecklar anpassade webbplatser på Wordpress för små till medelstora företagskunder. Vi har historiskt använt bilder för att representera olika ikoner på våra webbplatser, allt från sociala medieprofiler till telefon- och e-postikoner. Processen att använda en bild för ikoner kräver att du hittar en enhetlig uppsättning ikoner, laddar upp dem och ändrar sedan storlek på dem för att se till att de passar webbplatsen.

Även om det är en liten bildfil är det lite av en process att få en konsekvent uppsättning ikoner och få dem att matcha webbplatsens mall. Nu kan vi använda Font Awesome och dess Wordpress-plugin ersätta ikoner med en konsekvent uppsättning medier som helt enkelt kräver kopiering / klistra in en rad HTML. Ännu bättre kan ikonerna ändras med en liten mängd CSS (med egenskapen fontstorlek). Ikonerna visar bättre än en bildbaserad ikon och de är tydligt synliga på mobila enheter. Slutligen, eftersom det är en HTML-linje snarare än en bildfil, gör det sidans hastighet mycket snabbare.

Jeff Romero är medstifter av Octiv Digital, en digital marknadsföringsbyrå som är specialiserad på lokal och företags SEO strategi, betala per klick reklamhantering, webbdesign / utveckling och marknadsföringsanalystjänster.
Jeff Romero är medstifter av Octiv Digital, en digital marknadsföringsbyrå som är specialiserad på lokal och företags SEO strategi, betala per klick reklamhantering, webbdesign / utveckling och marknadsföringsanalystjänster.

Vance: särskilt bra när du inte har en designer i ditt team

Som webbutvecklare använder jag Font Awesome som en snabb lösning för många fina ikoner. Med det sagt är Font Awesome särskilt bra när du inte har en designer i ditt utvecklingsteam. Det är praktiskt att utveckla Wordpress-plugins eftersom utvecklare kan bädda in dem i sina plugins med Font Awesome CDN: er på nolltid.

Min erfarenhet med Font Awesome är bra hittills. Men det betyder inte att det inte har några nackdelar. En av de uppenbara nackdelarna är sidhastighetshastigheten (prestanda). Eftersom det är en snabb lösning måste du bädda in en hel uppsättning ikoner även om du bara använder några få ikoner. Det kan minska webbplatsens laddningshastighet och PSI-poäng.

Vance, webbutvecklare och webbägare.
Vance, webbutvecklare och webbägare.

Sunny Ashley: enkelt, rent och omedelbart igenkännbart för nya besökare

Vi använder Font Awesome-ikoner i vår sidfot. Specifikt använder vi ikonerna Facebook, Twitter och LinkedIn för att hänvisa till våra sociala mediekanaler. De är enkla, rena och omedelbart igenkännliga för nya besökare. Som andra användare av Font Awesome vet, var de också mycket snabba och enkla att konfigurera.

Sunny Ashley, grundare och VD för Autoshopinvoice. Autoshopinvoice tillhandahåller butikshanteringsprogram för oberoende bilverkstäder och garage.
Sunny Ashley, grundare och VD för Autoshopinvoice. Autoshopinvoice tillhandahåller butikshanteringsprogram för oberoende bilverkstäder och garage.

Burak Özdemir: Fjäderikoner orsakar inte en överdriven DOM-storlek

Feather Icons är en samling läsbara, visuellt behagliga open source-ikoner designade och underhållna av Cole Bemis. Från och med juni 2020 finns det mer än 280 ikoner tillgängliga. Alla ikoner som tillhandahålls av fjäderikonerna är MIT-licenserade och kan laddas ner separat som SVG-filer. Du kan anpassa ikonstorleken, ikonens streckfärg och slagbredden på Feather Ikonens webbplats innan du laddar ner dem.

Feather Icons kan vara ett utmärkt val för din webbplats eller projekt om du är en utvecklare eller vet hur du hanterar några grundläggande front-end-uppgifter. Eftersom dessa lätta ikoner också kan återges med ett modulärt JavaScript-bibliotek, orsakar de inte en överdriven DOM-storlek, ett mätvärde som kan skada prestandan på webbsidan. Med Feather Icons kan du alltså sänka sidhastighetshastigheten mer jämfört med andra paket som finns tillgängliga på marknaden. Den enda nackdelen med att använda denna ikonuppsättning är att du inte hittar de flesta märkesikonerna.

Fjäderikoner
Burak Özdemir är en webbutvecklare från Turkiet. Han är specialiserad på att skapa webbaserade applikationer.
Burak Özdemir är en webbutvecklare från Turkiet. Han är specialiserad på att skapa webbaserade applikationer.

Michel Pinson
Om författaren - Michel Pinson
Michel Pinson är en reseentusiast och innehållsskapare. Sammanslagande passion för utbildning och utforskning är han kommit till att dela kunskap och inspirera andra genom att fängsla utbildningsinnehåll. Att föra världen närmare varandra genom att stärka individer med global expertis och en känsla av vandringslust.




kommentarer (0)

Lämna en kommentar