Logo webontwerp

Waar u op moet letten bij het ontwerpen van een logo voor een website

Logo ontwerp voor websites volgt heel andere regels dan die voor drukwerk of andere communicatie. De eisen voor logo's en signetten zijn toegenomen. Wij tonen u richtlijnen en hulpmiddelen voor het maken van uw weblogo.

Logo ontwerp voor print en web

Er is een zeer doorlaatbare grens tussen webdesign en grafisch ontwerp. Grafisch ontwerpers richten zich vaak op drukwerk, het ontwerpen van briefpapier, posters, advertenties en logo's. Webdesigners daarentegen maken websites, nieuwsbrieven, banners en, natuurlijk, logo's.

Sommigen mixen beide business areas, zij bieden design voor print en web. Het is voor de eindgebruiker niet duidelijk wie wat kan doen en wie misschien wat niet moet doen. Vervolgens maken grafisch ontwerpers die meer thuis zijn in drukwerk ontwerpen voor websites - en zetten drukwerklogo's op het web. Omgekeerd is het eerder een uitzondering dat webdesigners volledige zakelijke briefpapier ontwikkelen.

Voor iedereen met een "grafisch oog" of een grafisch ontwerpberoep zou het duidelijk moeten zijn dat een logo op een website andere eisen stelt dan een logo op briefpapier of op een bedrijfsgebouw.

Met de komst van smartphones en het mobiele internet zijn de eisen voor logo's en signets (dit zijn kleine afbeeldingen die voor logo's kunnen worden gebruikt) op het web opnieuw veranderd en specifieker - maar ook strenger - geworden. Uiteindelijk is het niet zo ingewikkeld. En toch vergt het enige ervaring en aplomb om een goed logo voor een website te ontwikkelen.

3 Richtlijnen voor het maken van een logo

Er zijn drie overkoepelende punten waarmee u rekening kunt houden bij het ontwerpen van uw logo:

  • Liggend formaat: Het logo staat linksboven, dit is wat gebruikers verwachten. Soms is het ook toegestaan in het midden van de website. Maar om kostbare ruimte te besparen en de aandacht van de gebruikers op het essentiële te vestigen, is het zinvol rekening te houden met de algemene kijkgewoonten van mensen - met een logo in liggend formaat bovenaan aan de linkerkant.
  • Duidelijke structuren: Het is essentieel om rekening te houden met de logogrootte op een smartphone of tablet. Maar ook veel desktops en laptops hebben ofwel een zeer hoge resolutie, d.w.z. veel ruimte, ofwel een vrij kleine beelddiagonaal. In beide gevallen kan het logo vrij klein lijken. Het moet echter nog steeds goed werken in kleine afmetingen.
  • Geen claims: Veel opdrachtgevers, maar ook ontwerpers, voelen de soms onweerstaanbare neiging om een claim onder het logo te plaatsen. Tekst in het beeld, met andere woorden. Dat heeft weinig zin. Het is niet alleen een kwestie van ruimte, maar ook nauwelijks leesbaar op smartphones. Om nog maar te zwijgen van het feit dat het waardevolle tekst uitsluit van Google-indexering (SEO).

Ik besef dat deze drie eenvoudige "regels" voor het maken van een goed logo voor discussie vatbaar zijn. Want natuurlijk zijn er tegenvoorbeelden te vinden of merken die min of meer hun eigen regels (willen) hebben. Maar dat zijn dan heel bijzondere, succesvolle merken - en uitzonderingen bewijzen ook hier de regel.

Maar wat maakt coole logo's? De beste manier om daar achter te komen is te kijken naar de logo's en/of uithangborden van succesvolle en grote bedrijven. De meest ingenieuze logo's die ik ken zijn die van Daimler (de Mercedes-ster), Apple (met de appel), VW, BBC of de M van McDonalds. Natuurlijk zijn er nog veel meer voorbeelden. En de meeste dateren uit een tijd dat er nog geen internet was. Logo's evolueren echter met de tijd, net als merken en bedrijven.

weblogos logo ontwerp
Logo ontwerp is diverser dan ooit.

Idealiter zijn er logo's die zijn aangepast voor de verschillende outputformaten. De favoriete logo's die zojuist werden genoemd, zijn daar ook lichtende voorbeelden van. Zij werken overal en zijn aangepast aan de respectieve media met hun specifieke vereisten. Logisch: een briefhoofd heeft iets anders nodig dan een neonbord op een huis, en een website heeft andere voorwaarden dan een visitekaartje.

Signet & woordmerk op het net

Deze post is geen complete workshop over hoe je een perfect logo maakt. Er is zeker meer aan de hand dan het lezen van een blogbericht. Maar het zou u moeten helpen om de kwestie met het logo op uw website beter te begrijpen - en er daardoor succesvollere oplossingen voor te vinden.

Even een korte samenvatting: Wat is een logo? Wikipedia zegt:

"Een logo is een grafisch teken dat een specifiek onderwerp vertegenwoordigt. Dit kan een bedrijf, een organisatie, een individu of een product zijn."

Tot nu toe gaat alles goed. Een logo kan een woordmerk zijn, zoals Coca Cola, Google of Acer. Het kan een zegel zijn, zoals in het geval van Playboy, Shell en Mercedes. Meestal bestaan logo's echter uit een woordmerk en een zegel. In de bovenstaande voorbeelden van signetten is er altijd een variant met en zonder het woordmerk.

Dit geldt bijvoorbeeld ook voor McDonalds, met de kenmerkende M die iedereen kent. Het McDonalds logo is beschikbaar met de naam en met de claim (I'm lovin' it), maar de M is er altijd. Op de website van McDonalds hebben ze het, om de hierboven genoemde redenen, zo opgelost dat je deze M alleen linksboven in de navigatie vindt - en de navigatie schuift naar binnen als je scrollt. Alleen de M is er nog steeds op een bepaald punt. Ik vind dit slim en ruimtebesparend, omdat het belangrijkste altijd zichtbaar is: het zegel, de "M".

Laten we eens kijken naar het logo op de website van het WWF, om een voorbeeld te nemen uit de meer politiek correcte wereld. De beroemde pandabeer, die ook op zichzelf zou kunnen staan, is geplaatst boven de letters WWF, de afkorting van het Wereld Natuur Fonds. Ik vind de website best geslaagd (TYPO3, trouwens), maar ze verzuimen de hoofdnavigatie vast te leggen. Dit is slim opgelost. Het neemt een beetje ruimte in, maar bevat al het essentiële.

Dankzij de Mega Menu-technologie toont het tweede niveau van de navigatie alles wat er op de website te zien is. Als je het megamenu opent door er met de muis over te gaan, blijft alleen de panda zichtbaar. Het is een verticaal logo, maar de uitvoering is vlekkeloos. Dit logo stamt ook uit een tijd dat er nog geen websites waren. Ik ben er zeker van dat het WWF vandaag een ander logo zou laten maken - één in liggend formaat.

"*" geeft verplichte velden aan

Toestemming*
Dit veld dient ter validatie en mag niet worden gewijzigd.

Voorbeelden met logo in liggend formaat

Raidboxes is een interessant voorbeeld van logo ontwerp. Een woordmarkering, in liggend formaat natuurlijk - anders kun je het niet lezen. Ik noem dit logo geslaagd. Omdat het een hoge herkenningswaarde heeft, wat de essentie is van een goed logo. Bovendien werkt het ook in klein formaat op mobiele toestellen. Dit geldt voor veel sites op het moderne internet, zoals Google, Facebook, Amazon, Microsoft, YouTube en nog veel meer.

Raidboxes logo logo ontwerp
Het logo van Raidboxes: Logo ontwerp

Hetzelfde kunnen we zeggen over de WordPress.org zeg. Er zijn specificaties voor de presentatie van het WordPress logo die voor iedereen zichtbaar zijn: een stijlgids. Het logo heeft de W als een zegel en het woordmerk in liggend formaat, maar ook aan de rand. Op de website is het rechtopstaande logo uiteraard weggelaten. Om goede redenen wordt het logo met zegel niet alleen liggend getoond, maar ook relatief groot boven de navigatie. Ook hier is het menu niet vast, wat geen afbreuk doet aan de bruikbaarheid van de website.

Onze Raidboxes herlancering

Nieuw logo, nieuwe website, nieuwe kleuren - zelfde naam. We vieren onze herlancering op Raidboxes ! Samen met ons partnerbureau 360Vier hebben we onze huisstijl heroverwogen en onze website een nieuw likje verf gegeven.

Voorbeelden van websites met WordPress

Een andere fascinerende website die als voorbeeld voor ons dient, is VOGUE America. Ik vind de uitvoering consistent en passend bij het merk. Maar nogal zwak in de vaste navigatie na het scrollen. Het grote logotype in het midden verdwijnt namelijk en verschijnt in Klein linksboven, waar wij het verwachten. Dit is een algemene uitdaging met woordmerken die op de website moeten worden verkleind. De randen "rafelen" en worden wazig.

Hetzelfde verschijnsel kan worden waargenomen bij SPIEGEL Online (SPON). Voor beide kan het excuus zijn dat de logo's vóór het internettijdperk zijn gemaakt. We zien hetzelfde als met VOGUE bij het Amerikaanse TIME magazine, dat op WordPress draait.

Het ziet er een beetje anders uit bij open NASA, ook aangedreven door WordPress en ook met een logotype. Echter, omgeven door een mooi grafisch element. Dit logo - dit keer binnen een vaste navigatie - is groot genoeg om het element van een baan nog herkenbaar weer te geven. Ik vind het geslaagd, hoewel je hier ook het rafelen van de letters ziet. Daarom ben ik geen fan van zuivere woordmerken, ik geef de voorkeur aan signetten met afkortingen.

BBC AMERICA is ook een WordPress website. Ze heeft schitterend werk geleverd met zowel het ontwerp als het logo. Ja, ik ben een BBC fan. Maar ik vind het logo ook ingenieus en gedenkwaardig - als een geslaagd voorbeeld van logo-ontwerp in liggend formaat. Overigens doet deze website het ook zonder een vaste navigatie na het scrollen - hier staat de inhoud op de voorgrond.

Een goed logo voor het web maken (laten maken)

Nu kunt u dus heel duidelijk zien dat logo's geen toverij zijn en soms heel eenvoudig. Ze ontlenen hun genialiteit aan de eenvoud en de consistentie om een onafhankelijk merk te weerspiegelen. Een goed logo is dus heel gemakkelijk te maken, maar niet gemakkelijk te bedenken of te vinden.

Grafisch ontwerp of niet: u kunt een goed logo voor uzelf en uw klanten maken met uw grafisch getrainde oog en een paar eenvoudige regels. De gemakkelijkste manier zou natuurlijk zijn om een grafisch ontwerper in te huren. Dit is de veiligste en gegarandeerd meest kwalitatieve manier - uitzonderingen bewijzen de regel. Maar het is ook de duurste optie.

Op het net, we hebben het geraden, zijn er portalen die deze diensten overzee uitbesteden. Op die manier kunt u goed grafisch ontwerp kopen in landen met lagere uurlonen en hoge kwaliteit. Bijvoorbeeld uit Oekraïne, India, Indonesië, Zuid-Amerika, maar ook uit de VS, enz. De nadelen zijn de juridische situatie in geval van geschillen. De nadelen zijn de rechtspositie in geval van geschillen, de communicatie en dus soms ook de coördinatie.

Aangezien ik zelf een grafisch oog heb en zoveel mogelijk zelf wil doen, heb ik voor mijn logo op PUBLISHING ON THE NET een andere weg gekozen. Ik zocht en vond een signet bij Envato. Ik dacht dat het me zou lukken om er een logotype voor te maken. Omdat de zegel die ik mooi vond de verkeerde inhoud had. Een logo moet absoluut passen bij het onderwerp en het karakter van uw bedrijf.

Dus vond ik een @ teken dat ik wilde gebruiken, maar met een "P" in de @ cirkel. Eerst probeerde ik het zelf te doen - maar ik heb te weinig ervaring met vectoren in Illustrator. Dus zonder verdere omhaal vroeg ik de ontwikkelaar van het bord via Envato of hij het voor mij kon doen - en tegen welke prijs. Het was mogelijk en de kosten waren absoluut redelijk. Nu heb ik deze "P" met het woordmerk in liggend formaat:

Online Logo Voorbeeld
Het logo van PUBLIZIEREN IM NETZ

Logo ontwerp: Onderzoeksinstrumenten

Dit is precies hoe ik te werk ga voor mijn cliënten. Als een logo gewenst is, stel ik voor eerst een signet te kiezen dat past bij het bedrijfsidee en de naam. Ik gebruik niet alleen Envato of Envato Elements. Ik zoek ook naar logo's op Google, of op Iconfinder, iStockPhoto en andere aanbieders van kleine afbeeldingen. Dan laat ik ze aan de klant zien, kies er samen met hem een of twee uit en bouw een logo in liggend formaat.

Let op de auteurswet, uw logo mag niet te dicht bij een bestaand logo staan. Zelfs als u signets koopt, moet u de vergunning (laten) controleren: is zij geldig voor uw beroepsdoel, zonder beperkingen in tijd en ruimte? En ook voor gebruik als logo?

Goede logo's zijn eenvoudig en geven zoveel mogelijk uitdrukking aan het bedrijfsidee. Ze werken op de website omdat ze in liggend formaat zijn. Ze kunnen in zwart-wit worden weergegeven. En ze kunnen worden weergegeven op een briefhoofd of visitekaartje - enigszins gewijzigd en aangepast, misschien met een claim eronder.

Samenvatting: Logo ontwerp voor websites

Het maken van een goed logo is relatief eenvoudig. Je hebt een duidelijk concept en een uitstekend idee nodig. U kunt inspiratie opdoen bij andere succesvolle merken en websites. Praten met je collega's en vrienden kan je ook helpen om op dat ene simpele, briljante idee te komen. Maar laten we eerlijk zijn: het hoeft niet briljant te zijn, adequaat kan genoeg zijn, goed zou al meer dan genoeg zijn. U kunt zoeken naar logo's of signetten op grafische platforms.

Natuurlijk moeten de min of meer abstracte tekens iets te maken hebben met het beroep dat ze vertegenwoordigen. Maar er kunnen hier ook grappige combinaties zijn. Of consistente afleidingen, bijvoorbeeld als we denken aan de beroemde appel van Apple. Wie had ooit gedacht een appel te nemen waar een hap van ontbrak. Maar deze kleine grappige "onderbreker" is wat dit logo zo ingenieus maakt.

Ik hoop dat je nu wat aanwijzingen hebt om een geweldig volgend logo voor het World Wide Web te maken. Ik wens je veel geluk en veel plezier.

Uw vragen over logo ontwerp

Heb je vragen over logo ontwerp voor websites? Voel je vrij om de commentaarfunctie te gebruiken. Wil je op de hoogte blijven van nieuwe artikelen over webdesign en WordPress? Volg ons dan op Twitter, Facebook of via onze nieuwsbrief.

Vond je het artikel leuk?

Met jouw beoordeling help je ons om onze inhoud nog verder te verbeteren.

Eén reactie op"Waarop moet je letten bij het ontwerpen van logo's voor websites".

  1. Interessant artikel. Ik wil hier nog aan toevoegen dat bij een verticaal georienteerd logo een verticaal menu aan de linkerzijde een goede oplossing is.

Laat een reactie achter

Je e-mailadres wordt niet gepubliceerd.