Online favicon-service. Ingebouwde WordPress-functies

(afkorting van het Engelse “favorietenpictogram” - “pictogram voor favorieten”). Het heeft meestal een standaardformaat - 16x16, 32x32, 48x48, 64x64, 128x128 - en een .ICO-extensie, hoewel sommige browsers ook .GIF- en .PNG-extensies ondersteunen.

In deze review bekijken we 15 tools waarmee u dit kunt doen bijzondere inspanning maak mooie en stijlvolle favicons. Ze zijn allemaal perfect vrij, ondanks het feit dat velen van hen functies hebben die typisch zijn voor premiumproducten.

xIconeditor

Faviconby

Favicon.cc

Favicon-generator

Genfavicon

Prowdraw

Dynamische Drive Favicon-generator

Favicomatic

Favicon

FavIcon Pro

Gratis favicon

Wat is een favicon?

Voor degenen die niet weten wat een favicon is, geven we je wat informatie waarmee je op weg kunt gaan. Een favicon is een klein pictogram van 16x16 of 32x32 pixels, meestal met een logo, de eerste letter van een merk of een karakteristieke afbeelding die het type bedrijf of het thema van de site weerspiegelt.

Waarom is een favicon belangrijk?

Het favicon voert de volgende functies uit:

Branding.

Identificatie van de site door de gebruiker (gebruiksgemak).

Geeft de site een professionele uitstraling.

Laten we de belangrijkste voordelen van het gebruik van favicons eens nader bekijken.

Merkbekendheid

Favicon is als een kleine site-identiteit. Zoals vermeld in het inleidende gedeelte, helpt een favicon de gebruiker uw site te onthouden tussen de vele sites die ze hebben bekeken. Of het nu uw browsegeschiedenis, Google-zoekresultaten of de lijst met bladwijzersites in uw browser betreft, favicons zorgen ervoor dat gebruikers uw site gemakkelijk kunnen herkennen en openen.

Vertrouwen

Gebruikers hebben de neiging om online verkopers van goederen en diensten te beoordelen op basis van hoe professioneel hun website is. Nalatigheid in de vorm van het ontbreken van een favicon (zoekmachines geven een site zonder favicon weer met een icoontje leeg document) kan gemakkelijk leiden tot verlies van vertrouwen, vooral wanneer gebruikers u vergelijken met uw concurrenten.

Herhaalbezoeken

Het is bekend dat mensen beter reageren op afbeeldingen dan op tekst. Laten we nu zeggen dat een bezoeker van uw site haast had toen hij deze voor het eerst bezocht en besloot er een bladwijzer van te maken, zodat hij later terug kon komen. Stel dat deze persoon vervolgens besluit uw site opnieuw te bezoeken en naar zijn bladwijzers gaat. Je hebt geluk als je een herkenbare favicon hebt, zoals de prominente en unieke G van Google, en gebruikers zullen je vinden. Als u geen favicon heeft, wordt u mogelijk zelfs uit uw bladwijzerlijst verwijderd.

Bespaart gebruikerstijd

Favicons besparen de gebruiker tijd die hij besteedt aan het identificeren van een site in bladwijzers, geschiedenis of andere plaatsen waar de browser een favicon plaatst voor snelle identificatie. Het maakt het leven van de gemiddelde bezoeker van uw site alleen maar eenvoudiger.

SEO-voordelen

Als uw site een favicon heeft, bent u beter zichtbaar zoekresultaten dan sites die dit niet hebben, en zullen daarom meer bezoekers kunnen trekken.

Hoe maak je een favicon?

Er zijn veel tools waarmee je binnen enkele minuten een favicon kunt maken. Als u geen ontwerpvaardigheden heeft of niet weet hoe u dit moet doen, kunt u proberen een favicon te genereren met Logaster.

Volg hiervoor de stapsgewijze instructies:

Stap 5: Maak een favicon

Nu je een logo hebt, klik je op ‘Maak een favicon met dit logo’ op de logopagina.

Stap 6. Selecteer het gewenste favicon-ontwerp

Net als bij het logo zal Logaster enkele tientallen prachtige en gebruiksklare favicons genereren. Kies je favoriete ontwerp. In het voorbeeld kunt u zien hoe uw favicon er op de site uit zal zien.

Als u de favicon wilt wijzigen, kunt u dit doen door het logo te bewerken, net zoals favicons worden gemaakt op basis van het logo-ontwerp. Dus als u bijvoorbeeld een andere faviconkleur wilt, moet u teruggaan naar de logopagina, de kleur wijzigen en vervolgens de favicon opnieuw maken.

Inspiratie voor favicons vind je op de volgende sites:

Stap 7. Download de favicon

Je kunt de favicon afzonderlijk kopen voor $ 9,99 of een Design Pack kopen dat niet alleen de favicon bevat, maar ook het logo, visitekaartje, envelop en briefpapier. Hier leest u hoe u een Design Pack kunt kopen.

Na betaling kun je de favicon downloaden in ico- en png-formaat.

Waar kan ik een favicon gebruiken?

Je kunt favicon gebruiken:

Op de website;

Mobiele apparaten. De gebruiker kan een favicon toevoegen startscherm uw apparaat (zoiets als een bladwijzer) - Android, IOS, Windows Phone enz;

Programma's en applicaties voor pc/Mac.

Hoe installeer ik een favicon op een website?

Nadat u de favicon heeft ontvangen, duurt het installeren op de server slechts enkele minuten en wordt in twee fasen voltooid. Om dit te doen heeft u toegang nodig tot de hoofdmap van uw site en een teksteditor om de HTML-code van de site te wijzigen.

Stap 1. U moet het favicon.ico-bestand naar de server uploaden. Om dit te doen, moet u downloaden en installeren ftp-client bijvoorbeeld FileZilla. Voer vervolgens uw gebruikersnaam en wachtwoord in en download het bestand. Meer gedetailleerde instructies hoe je een favicon-bestand uploadt, lees je hier.

Stap 2. Nu moet u de HTML-pagina van uw site bewerken, zodat browsers uw faviconafbeelding kunnen vinden. Bij open raam FTP, zoek en download het index.html- of header.php-bestand van de server.

Open het index.html-bestand in teksteditor- Kladblok, Kladblok++, Sublieme tekst.

Als uw site pure HTML bevat, plakt u speciale code naar het HEAD-gebied van het index.html-bestand.

De code kan worden gekopieerd op de faviconpagina op de Logaster-website.

Als u WordPress gebruikt, plakt u de onderstaande code in het HEAD-gebied van uw header.php-bestand.

Zodra je dit hebt gedaan, download je het bestand terug naar waar je het vandaan hebt. Klaar! Laad uw sitepagina opnieuw om de favicon te zien.

Meerderheid moderne browsers zijn slim genoeg en weten hoe ze een favicon-bestand kunnen vinden, zelfs zonder dergelijke code, maar alleen als de favicon een afbeelding van 16x16 pixels heeft, de naam favicon.ico is en wordt opgeslagen in hoofdmap jouw site.

We hopen dat dit artikel je wat heeft gegeven nuttige informatie, waarmee u een favicon kunt maken die uw website succesvoller en aantrekkelijker maakt.

Favicon -(kort voor woorden "Favoriete icoon") is een klein beeldformaat 16x16 pixels, die een bezoeker van uw site zal zien. Het verschijnt naast de site-URL in de adresbalk van de browser. Bovendien wordt dit pictogram weergegeven naast de naam van uw site in de lijst met geopende tabbladen, bladwijzers en zoekresultaten, waardoor gebruikers uw site gemakkelijker tussen andere sites kunnen vinden.

Standaard als pictogrammen site wordt een browserpictogram weergegeven. Om de site anders te maken dan de rest en niet te verdwalen in talloze grijze tabbladen, geopend door de gebruiker, moet je je eigen originele favicon maken.

Hoewel velen moderne webbrowsers ondersteuning favicons in GIF-formaat, PNG of andere populaire bestandsformaten zijn allemaal Internetversies Explorer vereist nog steeds pictogrammen als bestanden ICO (Microsoft-formaat). In dit formaat begrijpt elke browser uw pictogram.

Waarom heb je een favicon nodig?

Een favicon is nodig zodat uw site zich op de een of andere manier onderscheidt van de massa op de pagina met zoekresultaten en opvalt bij velen geopende tabbladen in de browser. Een goed icoon is als een logo van uw site, dat herkenbaar is, een bepaalde houding creëert en een speciaal niveau van vertrouwen oproept.

Uiteraard kan een favicon de aandacht van de gebruiker trekken en zal hij de titellink naar uw artikel lezen. Kop, gecombineerd met een goed fragment en prachtig icoon, verhoogt de klikfrequentie en daarmee het verkeer naar de bron.

Ik zou meteen willen opmerken dat voor sites met het label "GS" het pictogram zelf de indruk van de bron niet kan verbeteren. Maar het is als een vergadering over kleding. Een prachtige favicon zal zeker de eerste indruk wekken van een site die uitnodigt om te bezoeken.

Hoe maak je een favicon aan?

Je kunt natuurlijk proberen een kant-en-klaar favicon.ico-bestand te vinden op de website www.iconfinder.com, maar ik denk dat velen graag zelf iets willen maken. Het is tenslotte de favicon die uw site in de zoekresultaten zal benadrukken. Je weet nu hoe je dit moet doen. Dus laten we aan de slag gaan.

Logaster is een online service voor het maken van logo's en elementen bedrijfsidentiteit. Daarin ontvangt u automatisch, met slechts een paar klikken, een pictogram voor de site in ICO- en PNG-formaat.

Maar houd er rekening mee dat er geen is automatische generator logo's kunnen de menselijke creativiteit niet vervangen.

Zeker, grote bedrijven dergelijke hulpmiddelen zullen niet worden gebruikt. Ze zullen een dure ontwerper vinden die een professioneel logo voor hen kan maken. Maar voor kleine bedrijven en particuliere ondernemers kan een dergelijk instrument van pas komen.

Hoe werkt het proces van het maken van een pictogram in Logaster?

1. Om er zeker van te zijn dat uw favicon bij uw logo past, wordt u gevraagd eerst een logo te maken (het is gratis).
2. Schrijf een naam en eventueel een slogan, geef het soort activiteit aan en Logaster zal zelfstandig vele logo-opties voor u voorbereiden.
3. Kies een geschikt logo, u kunt dit later wijzigen.

Dit is wat ik kreeg

Nu kunt u op de knop “Logo downloaden” klikken. IN gratis versie het zal erop zitten watermerk Logaster.com

Het logo kan worden gekocht. Daarna kunt u downloaden in het geselecteerde formaat (PNG, JPEG, PDF, SVG) en grootte (1024 px, 5000 px).

Laten we nu verder gaan met het maken van een favicon.

1. Kies opnieuw de gewenste optie.
2. Je kunt de vorm veranderen om hem vierkant te maken, met afgeronde hoeken, rond of helemaal niet in een specifieke vorm passen.
3. Voeg eventueel toe gekleurde lijn door op het gereedschap "Lijn" te klikken.
4. Klik op de knop "Opslaan".

Zo is de favicon geworden. In principe ziet het er goed uit.

Hoe u een favicon aan uw website toevoegt

1. Koop en activeer de favicon.
2. Download het.
3. Pak het gedownloade bestand uit in hoofdmap jouw site.
4. Plak de volgende code op alle pagina's van de site in de tag :

Designpakket met korting

Daarnaast kunt u de gehele huisstijlset aanschaffen. Hier is één optie.

Gerelateerd artikel: De knop Bestand toevoegen en nog veel meer werkt niet in WordPress

Plugin voor het maken van favicons

Bestaat enorm bedrag verschillende programma's om favicons te maken. Kortom, ze zijn primitief, waardoor je pictogrammen kunt maken met 16 kleuren.

U kunt rechtstreeks in Photoshop een favicon maken. Hiervoor heeft u een plug-in nodig die u kunt downloaden van www.telegraphics.com.au. Kopieer het bestand om het te installeren ICOFormat.8bi naar map c:\ Programmabestanden\Adobe\Adobe Photoshop CS2\Plug-Ins\Bestandsindelingen\.

Een plug-in gebruiken ICOFormat.8bi, kunt u afbeeldingen opslaan als “.ico-bestanden”.

Hoe de ICO (Windows Icon) Format-plug-in te installeren

1. 64-bits Windows (Vista/Windows 7):
   • Start opnieuw op voordat u installeert;
   • Plaats de plugin in de map C:\Program Files\Adobe\Photoshop\Plug-Ins\File Formats, maar ik heb een andere structuur, ik heb dit bestand hier opgeslagen: C:\Program Files\Adobe\Adobe Photoshop CS6 (64 Bit)\ Plug-ins.
   • Als je op een 64-bits versie draait Windows-systeem en lanceren de 64-bits versie van Photoshop CS4 of CS5, download de 64-bits versie van de plug-in en plaats het in de map Plug-Ins die overeenkomt met 64-bit Photoshop (d.w.z. die in "Program Files" en niet "Program Files (x86)").
2. Verplaats de plug-in naar de map "Bestandsindelingen" in de map Photoshop Plugins:
   • Voor Windows (32-bits), ICOFormat.8bi
   • Voor Windows (64-bits), ICOFormat64.8bi
   • Voor Mac OS X, ICOFormat.plug-in(merk op dat er aparte versies beschikbaar zijn voor CS2, CS3/4 en CS5)
   • Voor Mac OS X/Klassiek, icoformaat
   • Voor 68K MacOS, icoformaat(68K)
3. Als u Corel PSP Photo X2 gebruikt, plaatst u de plug-in in C:\Program Files\Corel\Corel Paint Shop Pro Photo X2\Languages\EN\PlugIns
4. Sluit Photoshop af en start deze opnieuw als deze al actief is.

Er is ook een onlinedienst www.convertico.com. ConvertICO is gratis online-converter ICO-bestanden/PNG. Het werkt snel en is gemakkelijk te gebruiken. Het wordt gebruikt om bureaubladpictogrammen, applicatiepictogrammen en favicons voor websites te converteren.

Hoe maak je favicon.ico zelf?

1. Photoshop openen.
2. Maak een document van 32x32 pixels.
3. Voeg een slim object van de voltooide afbeelding uit Illustrator in.
4. Gebruik de opdracht "Opslaan als" om de favicon op te slaan in .ICO*-indeling.
5. Upload de resulterende favicon naar de hoofdmap van de site en verbind deze via een WordPress-thema, of registreer deze handmatig in de sitesjabloon. Over het aansluiten van favicon heb ik al eerder geschreven.

*Als je geen speciale plug-in hebt geïnstalleerd ICO-formaat (Windows-pictogram)., u kunt het downloaden van www.telegraphics.com.au/sw/. Er is voor Mac, Windows 32, 64-bit met ondersteuning voor iedereen Photoshop-versies, inclusief CS6.

favicon-weergave

Naar uw site liet een favicon zien, het kan eenvoudig in de root van de site worden geplaatst. De browser en zoekmachines bepalen zelf dat u een favicon.ico-bestand heeft en geven dit automatisch weer. Deze methode is het eenvoudigste en werkt in 95% van de gevallen. Maar je kunt de favicon ook expliciet koppelen.

Favicon-generator - helpt u bij het converteren en bewerken van elke afbeelding, zodat deze in een favicon voor de site verandert. Vandaag is een artikel over de beste favicongenerator voor websites van vandaag.

Tegenwoordig is het moeilijk om je een website voor te stellen die geen favicon heeft. Een favicon is een pictogram dat zich in de adresbalk van de browser of in de venstertitel (afhankelijk van de browser) bevindt en dat de geopende site/tabblad onderscheidt van vele andere. Aanvankelijk werden deze pictogrammen in IE ontwikkeld om een ​​site in de bladwijzerlijst van de browser te markeren (in IE werden deze bladwijzers Favorieten genoemd), vandaar de naam Favicon - favorietenpictogram.

Maar een favicon met je eigen handen maken is niet zo eenvoudig. Het moet een ICO-formaat hebben, waarvoor speciale software nodig is om iets waardevols en aanzienlijke vaardigheden te kunnen doen. Om het leven gemakkelijker te maken, is het daarom beter om te gebruiken onlinegenerator favicon.

Er zijn veel diensten waarmee je favicons kunt genereren uit afbeeldingen (dit kan een logo of een speciaal ontworpen illustratie zijn). Maar de meesten van hen hebben problemen met transparantie.

Transparantieproblemen met de favicongeneratorservice

Voor de duidelijkheid presenteren we de illustratie ‘Hoe verschillende favicon-generatoren transparantie en verkleining van de afbeeldingsgrootte verwerken.’

In deze vergelijking hebben we de resultaten gebruikt die zijn verkregen van de diensten favicon.cc en favicon-generator.org. Eerlijk gezegd gebruikten we tot voor kort zelf de service favicon.cc, maar onlangs werd een uitstekende vervanger gevonden: favicongenerator nr. 1.

De beste favicon-generator - www.xiconeditor.com

Net als favicon.cc heeft deze favicon-generator zijn eigen ingebouwde online pictogrameditor, maar het voordeel is dat wel geweldig werk met transparantie.

Het is overduidelijk dat er een verschil is in de kwaliteit van de transparantie (blijkbaar zit het verschil in de kwaliteit van het veranderen van de grootte van de geladen afbeelding).

Bovendien heeft xiconeditor.com nog een ander voordeel: geweldig systeem favicon preview, waarmee u het resultaat in verschillende gedaanten kunt bekijken zonder de gegenereerde favicon te downloaden. Hun preview is veel informatiever dan favicon.cc.

Vandaag zullen we het opnieuw hebben over foto's voor de blog, dat wil zeggen over het projectpictogram, genaamd favicon. Laten we bespreken wat een favicon is, hoe u deze kunt maken en deze aan onze site kunt koppelen. En ook: welke maat moet het zijn? dit beeld en waarom ieder van jullie het gewoon zou moeten installeren. Zelfs dit pictogram kan immers het verkeer naar uw blog beïnvloeden.

Wat is een favicon?

Het concept van favicon is vrij eenvoudig en bestaat uit twee woorden in het Latijn (in feite, zoals al het andere op internet) - het favorietenpictogram. Dit kan op zijn beurt worden vertaald als pictogram of badge. De betekenis kan als volgt zijn; favoriet pictogram of favoriet. Waarom deze naam? Ja, het is eenvoudig: favorieten zijn slechts de naam van bladwijzers in de browser, dus de naam kan worden geïnterpreteerd als een afbeelding voor een bladwijzer of browsertabblad. Het viel je immers op dat wanneer je een site opent of aan je bladwijzers toevoegt, we niet alleen de naam zien, maar ook de afbeelding ervan, die een favicon wordt genoemd. Ik hoop dat ik heb kunnen uitleggen wat voor dier dit is?

Waarom heb je een favicon nodig?

Nou, alles is hier zo simpel als een gestoomde raap; een favicon is nodig om een ​​internetproject te individualiseren. Dat is er nog één onderscheidend kenmerk je blog zal deze afbeelding hebben, en dat niet alleen handiger in gebruik uw site in de browser, maar ook wanneer de juiste aanpak verhoogt het aantal bezoekers van uw project.

Ten eerste kan het handig zijn in een browser, waarom? Als ik bijvoorbeeld een aantal tabbladen open heb, kan ik navigeren via het pictogram van de site die ik nodig heb op dit moment. Dat wil zeggen, het is handig voor mensen zoals ik.

Ten tweede kan deze foto meer bezoekers naar uw bron trekken via de Yandex-zoekmachine als deze pakkend is en onder andere opvalt, maar zonder fanatisme. Dankzij het feit dat Yandex een favicon op de eerste negen pagina's van de zoekresultaten invoegt, zal jouw blog anders zijn dan andere. Juist om deze reden Het is de moeite waard om na te denken over het koppelen van een favicon aan uw project. Zo zien de eerste zoekpagina's eruit.

Maak een favicon zal niet moeilijk zijn, want er zijn een groot aantal generatoren op het netwerk die van gewone afbeeldingen een favicon kunnen maken en je de mogelijkheid geven om deze zelf helemaal opnieuw te tekenen. Je kunt ook een afbeelding maken met Photoshop en vervolgens generatoren gebruiken om deze naar het gewenste formaat te converteren.

De verschillen tussen gewone afbeeldingen en iconen zijn klein, maar ze bestaan. Het beeld moet eenvoudig (complex) zijn grafische elementen zal moeilijk te zien zijn), 16x16 pixels groot en altijd in ico-formaat. Je kunt er uiteraard ook gebruik van maken png-formaten of gif, maar dergelijke afbeeldingen worden dus niet in alle browsers weergegeven beste optie- gebruik het ico-formaat.

Ik zie het nut niet in om je elke stap te vertellen hoe je dit pictogram kunt maken, omdat iedereen er mee overweg kan. Het belangrijkste is om rekening te houden met de vereisten voor afbeeldingen en alles zal lukken. Kortom, download of teken een afbeelding en maak een favicon met behulp van online generatoren. Online generatoren kun je vinden door het in te typen Google-zoekopdracht of Yandex - favicon. Of hier is een link naar een service waarmee je helemaal opnieuw kunt tekenen of een favicon kunt maken van een voltooide afbeelding: http://favicon.ru/

Hoe sluit ik een favicon aan voor een website?

Oké, het pictogram is klaar. Hoe zorg ik ervoor dat de browsers starten? toon favicon voor de site?

Nadat u de service heeft gebruikt, downloadt u het kant-en-klare pictogram voor uw blog naar uw computer. En upload de afbeelding met behulp van een FTP-client naar de hoofdmap van de blog (public_html/site/your_file_in_ico_format) of naar een andere map. Maar het is het beste om naar de hoofdmap te gaan, het is gewoon eenvoudiger bij het compileren van het pad naar het bestand.

Het bestand is dus geüpload, wat nu? Nu kunt u controleren of u twijfelt of het bestand is geüpload naar de hoofdmap: uw_site/favicon.ico. Als het bestand wordt gedownload naar de hoofdmap, dan wordt het op dit adres weergegeven. Vervolgens moet u voor elke pagina van de bron tussen de tags schrijven En de volgende code:

En als het pictogram zich in een andere map bevindt, zou het er zo uit moeten zien:

Deze code wordt voor veel internetbronnen als algemeen geaccepteerd beschouwd en werkt op elke engine. Maar je kunt het voor verschillende motoren anders schrijven. Voor WordPress zou deze code er bijvoorbeeld als volgt uitzien:

/favicon.ico" />

Alleen bij deze optie moet het pictogram in de map met de sjabloon staan. Bijvoorbeeld (public_html/site/wp-content/themes/uw-thema/favicon.ico).

Na deze stappen favicon voor de site zal beginnen te werken en u kunt het zien in uw browsertabbladen. Maar in de Yandex-zoekresultaten wordt het bestand niet onmiddellijk weergegeven; u moet eerst wachten tot de Yandex-robot het pictogram indexeert en pas daarna zal het in de zoekresultaten verschijnen, en dan alleen op voorwaarde dat uw blog is ingeschakeld. een van de eerste negen pagina's van de zoekresultaten.

Dat is alles. Als er iets niet duidelijk is, vraag het ons, dan zoeken we het uit. Tot ziens!