Een aangepast favicon maken

Inhoudsopgave:

Anonim

Ik ga iets geeks toelaten. Ik hou echt van favicons. Ze zijn leuk. Ze zijn een geweldig hulpmiddel voor branding. En ze zijn iets eenvoudigs dat eigenaars van kleine bedrijven kunnen doen om hun sites te verfraaien en zelfs de bruikbaarheid voor gebruikers te vergroten.

Als je niet weet wat een favicon is, wil ik je wat hulp bieden:

$config[code] not found

Favicons zijn de mini- 16 × 16 pixelafbeeldingen die uw website weergeven in de adresbalk, in de lijst met bladwijzers van een gebruiker of in de browsertabbladen. Ze stellen uw bezoekers in staat om een ​​visuele verbinding te maken met uw site.

Netjes! Hoe creëer je er een?

Ontwerp je favicon:

  • Met de hand: Open uw favoriete grafische programma en ga ermee aan de slag. U wilt een nieuw bestand van 16 × 16 pixels maken en inzoomen tot het gebied werkbaar is OF een groter gebied openen, maar nog steeds een soort veelvoud van 16 × 16. Wanneer u uw favicon met de hand ontwerpt, gebruik dan iets dat uw merk nauwkeurig weergeeft - of het nu een standaardkleurenschema, uw bedrijfsinitialen, enz. Is. Wat u ook maakt, moet bestand zijn tegen de strenge beperkingen van 16 × 16 pixels.
  • Met tools: Als je een ontwerpuitdaging hebt (geen zorgen, ik ook), zijn er enkele geweldige tools waarmee zelfs mensen zoals wij fantastische favicons kunnen maken. Favicon.cc geeft je bijvoorbeeld wat structuur en laat je de jouwe direct vanaf hun site bouwen of FavIcon van Pics laat je een foto uploaden en het favicon voor je genereren. Eenvoudig!

Bewaar je favicon: Verklein het bestand tot 16 bit en sla het op als "favicon.ico" als u Photoshop of "favicon.gif" of "favicon.png" gebruikt als u iets anders gebruikt. Als je Photoshop gebruikt en je favicon wat extra wilt geven, is het aan te raden de Windows-bestandsindeling-plug-in te downloaden, zodat je deze kunt opslaan in het ICO-formaat.

Upload je favicon: Maak verbinding met uw server en upload uw favicon naar de hoofdmap van uw site. Voeg vervolgens de volgende HTML-code toe aan het kopgedeelte van uw webpagina (tussen de twee Head-tags) (kies uw bestandstype):

verversen: Als u klaar bent, ververst u uw browser en ziet u uw favicon verschijnen. Zo niet, geef het een paar minuten. Soms duurt het een klein beetje voordat alles gesynchroniseerd is.

En dat is het! Vier stappen en je hebt een geweldige favicon waarmee gebruikers jouw site kunnen herkennen in de lijst met bladwijzers of in hun browser. Best simpel, toch?

Gewoon voor de lol, hier zijn enkele van mijn favoriete favicons op het web:

  • Michigan vuurwerk
  • Jeffrey Zeldman
  • Boing Boing
  • Encyclopedia.com
  • Fool.com
  • Michael Gray's SEO-blog

Nog andere persoonlijke favorieten?

17 Opmerkingen ▼