Na co należy zwrócić uwagę przy projektowaniu logo dla strony internetowej

Mark Max Henckel Aktualizacja w dniu 21.10.2020 r.
9 Min.
Logo Webdesign
Ostatnia aktualizacja w dniu 21.10.2020 r.

Logotypy dla stron internetowych podlegają zupełnie innym zasadom niż te dotyczące druku lub innej komunikacji. Wymagania dotyczące logotypów i sygnetów wzrosły. Pokazujemy Ci wytyczne i narzędzia do tworzenia Twojego logo internetowego.

Pomiędzy projektowaniem stron internetowych a projektowaniem graficznym istnieje bardzo przenikliwa granica. Graficy często skupiają się na druku, projektowaniu sprzętu biznesowego, plakatów, reklam i logotypów. Projektanci stron internetowych natomiast projektują strony internetowe, newslettery, banery i oczywiście logo. Niektóre z nich mieszają oba obszary działalności, oferują projektowanie dla druku i stron internetowych. Przez co klient końcowy nie może zobaczyć, kto co może, a może nie powinien tego robić. Graficy, którzy są bardziej w domu w druku, następnie tworzą projekty stron internetowych - i umieścić drukowane logo w sieci. Z drugiej strony, jest to raczej wyjątek, że projektanci stron internetowych opracowują całe układy biznesowe.

Dla każdego, kto ma "oko grafika" lub wykonuje zawód grafika, powinno mieć sens, że logo na stronie internetowej ma inne wymagania niż logo na papierze firmowym lub na budynku firmy. Wraz z pojawieniem się smartfonów i mobilnego Internetu zmieniły się wymagania dotyczące logo i sygnetów (są to małe elementy graficzne, które mogą być wykorzystane w logo) w sieci i stały się one bardziej konkretne - ale również bardziej rygorystyczne. W końcu to nie wszystko jest takie skomplikowane. A jednak opracowanie dobrego logo dla strony internetowej wymaga dużego doświadczenia i umiejętności.

Trzy wytyczne dotyczące tworzenia logo internetowego

Istnieją trzy główne punkty, które można uwzględnić podczas projektowania logo:

  1. Format krajobrazowy: logo pojawia się w lewym górnym rogu, zgodnie z oczekiwaniami użytkowników. Czasami jest to również dozwolone w środku strony. Aby jednak zaoszczędzić cenną przestrzeń i skupić uwagę użytkownika na tym, co najważniejsze, warto wziąć pod uwagę ogólne przyzwyczajenia użytkowników - logo w formacie pejzażowym u góry po lewej stronie.
  2. Przejrzyste struktury: Bardzo ważne jest, aby wziąć pod uwagę rozmiar logo na smartfonie lub tablecie. Ale także wiele komputerów stacjonarnych i laptopów ma albo bardzo wysoką rozdzielczość, czyli dużo miejsca, albo raczej małą przekątną obrazu. W obu przypadkach logo może być dość małe. Ale i tak musi działać dobrze nawet w małych rozmiarach.
  3. Żadnych roszczeń: Wielu klientów, ale także projektantów odczuwa czasem nieodpartą skłonność do umieszczania reklamacji pod logo. Tekst na zdjęciu. To nie ma sensu. Nie tylko jest to kwestia przestrzeni, ale także jest ona trudna do odczytania na smartfonach. Pomijając fakt, że oznacza to, iż cenny tekst jest Google Indexing (SEO) jest wykluczony.

Jest dla mnie jasne, że te trzy proste "zasady" tworzenia logo mogą być omówione. Ponieważ oczywiście można znaleźć kilka przeciwnych przykładów lub marek, które mniej więcej mają (chcą) swoje własne zasady. Ale są to wówczas bardzo szczególne, odnoszące sukcesy marki - i tu również wyjątki potwierdzają regułę.

Ale co sprawia, że logo odnosi sukcesy? Najlepszym sposobem, aby się o tym przekonać, jest przyjrzenie się logotypom i/lub sygnetom odnoszących sukcesy i dużych firm. Najbardziej błyskotliwe loga, jakie znam, to te z Daimler (gwiazda Mercedesa), Apple (z jabłkiem), VW, BBC czy M z McDonaldsa. Oczywiście jest jeszcze wiele innych przykładów. A większość z nich pochodzi z czasów, gdy nie było internetu. Logotypy jednak ewoluują z czasem, podobnie jak marki i firmy.

weblogos

Idealnie byłoby, gdyby istniały loga dostosowane do różnych formatów wyjściowych. Błyszczą na tym również ulubione logotypy, które właśnie wymieniono. Pracują one wszędzie i są dostosowane do odpowiednich mediów z ich specyficznymi wymaganiami. Logicznie: papier firmowy potrzebuje czegoś innego niż neon na domu, a strona internetowa ma inne warunki niż wizytówka.

Sygnet i znak słowny na sieci

Ten artykuł nie jest kompletnym warsztatem do stworzenia idealnego logo. To z pewnością więcej niż czytanie postu na blogu. Powinno to jednak pomóc w lepszym zrozumieniu kwestii logo na Twojej stronie internetowej - i w znalezieniu bardziej udanych rozwiązań.

Tylko krótkie podsumowanie: Co to jest logo? Mówi Wikipedia:

"Logo to znak graficzny, który reprezentuje konkretny temat. To może być firma, organizacja, osoba prywatna lub produkt".

Jak na razie, dobrze. Logo może być znakiem słownym, takim jak COCA COLA, GOOGLE lub ACER. To może być znak jak PLAYBOY, SHELL i MERCEDES. Najczęściej jednak logo składa się ze znaku słownego i sygnetu. W przykładach wyżej wymienionych sygnetów zawsze istnieje wariant z i bez znaku słownego.

Dotyczy to również, na przykład, McDonaldsa z charakterystycznym M, które wszyscy znają. Logo McDonaldsa istnieje z napisem imieniem i twierdzeniem (I'm lovin'it), ale M jest zawsze tam. W sprawie Strona internetowa McDonaldsa Z wyżej wymienionych powodów został on rozwiązany w taki sposób, że w lewym górnym rogu nawigacji znajduje się tylko to M - a nawigacja cofa się podczas przewijania. Tylko M jest tam jeszcze kiedyś. Uważam, że to sprytne i oszczędzające miejsce, ponieważ najważniejsza rzecz jest zawsze widoczna: sygnet, "M".

Spójrzmy na logo na Strona internetowa WWF by wziąć przykład z bardziej politycznie poprawnego obszaru. Nad literą WWF, skrótem od World Wildlife Fund, umieszczono słynnego niedźwiedzia pandy, który również może stać samodzielnie. Myślę, że strona jest dość udana (TYPO3, nawiasem mówiąc), ale nie ma tu miejsca na główną nawigację. To jest sprytnie rozwiązane. Potrzebuje trochę przestrzeni, ale zawiera wszystkie niezbędne rzeczy.

Dzięki technologii mega-menu, nawigacja na drugim poziomie pokazuje wszystko, co można zobaczyć na stronie. W przypadku wywołania mega menu za pomocą kursora myszy, widoczna jest tylko panda. Chociaż jest to logo pionowe, jego realizacja jest bardzo dobra. Logo to pochodzi również z czasów, gdy nie istniały żadne strony internetowe. Jestem pewien, że WWF miałby inne logo stworzone dzisiaj - takie w krajobrazowym formacie.

Przykłady z logo w formacie krajobrazowym na stronie internetowej

RAIDBOXES jest oczywiście przykładem. Znak słowny, oczywiście w formacie krajobrazowym - inaczej nie można go odczytać. Nazywam to logo sukcesem. Ponieważ ma on wysoką wartość rozpoznawczą, która jest istotą dobrego logo. Ponadto w Klein pracuje on również na urządzeniach przenośnych. Dotyczy to wielu stron współczesnego Internetu, takich jak Google, Facebook, Amazon, Microsoft, YouTube i wielu innych.

RAIDBOXES  Logo
Logo RAIDBOXES

To samo możemy zrobić za pośrednictwem strony wordpress.org Powiedz. Jest dla wszystkich zrozumiałe specyfikacje do wyświetlania WordPress logo: przewodnik po stylu. Logo ma literę W jako sygnet i znak słowny w formacie krajobrazowym, ale również na krawędzi. Na stronie internetowej logo pionowe oczywiście nie jest używane. Z ważnych powodów logo z sygnetem jest nie tylko przedstawione w formacie krajobrazowym, ale także stosunkowo duże nad nawigacją. Tutaj również menu nie jest stałe, które Użyteczność strona nie przerywa.

Przykłady ze stron z WordPress

Inną fascynującą stroną internetową, która służy nam za przykład jest VOGUE America. Wdrożenie uważam za spójne i odpowiednie dla marki. Ale raczej słaba w stałej nawigacji po przewinięciu. Ponieważ duży logotyp na środku znika i pojawia się w małym na górze po lewej stronie, gdzie się go spodziewamy. Jest to ogólne wyzwanie z oznaczeniami słownymi, które muszą być skalowane na stronie internetowej. Krawędzie "strzępią się" i stają się niewyraźne. Na stronie MIRROR Online (SPON) to samo zjawisko można zaobserwować. Dla obu z nich wymówką może być to, że logo zostało stworzone przed erą Internetu. To samo co z VOGUE widzimy z Amerykaninem Magazyn TIMEktóry się poddajeWordPress .

Sytuacja jest nieco inna w przypadku otwarta NASA także z WordPress jazdy i z logotypem. Ale otoczony drobnym elementem graficznym. Logo to - tym razem w ramach stałego systemu nawigacji - jest na tyle duże, że pokazuje element orbity wciąż rozpoznawalny. Myślę, że jest to udane, choć widać tu też strzępy listów. Dlatego nie jestem przyjacielem czystych znaków słownych, wolę sygnety ze skrótami.

BBC AMERYKA to również WordPress strona. Świetnie rozwiązała projekt i logo. Tak, jestem fanem BBC. Ale uważam też, że logo jest genialne i zapadające w pamięć - jako udane przykłady logo w formacie krajobrazowym. Nawiasem mówiąc, strona ta nie posiada również stałej nawigacji po przewinięciu - treść znajduje się tutaj na pierwszym planie.

Stwórzcie dobre logo dla sieci (niech będzie)

Teraz widać bardzo wyraźnie, że logotypy nie są czarnoksięskie, a czasami bardzo proste. Ich pomysłowość wynika z prostoty i konsekwencji odzwierciedlania niezależnej marki. Dobre logo jest więc bardzo łatwe do stworzenia, ale nie jest łatwe do wymyślenia lub trudne do znalezienia.

Projektowanie graficzne czy nie: Przy pomocy wyszkolonego graficznie oka i kilku prostych zasad możesz stworzyć dobre logo dla Ciebie i Twoich klientów. Oczywiście: Najprostszym sposobem byłoby zatrudnienie grafika. Jest to najbezpieczniejszy i gwarantowany sposób, a także sposób najwyższej jakości - wyjątki potwierdzają regułę. Ale jest to również najdroższa opcja. Podejrzewamy, że w sieci znajdują się portale, które zlecają te usługi za granicą. Możesz więc kupić dobry projekt graficzny w krajach o niższej stawce godzinowej przy zachowaniu wysokiej jakości. Na przykład z Ukrainy, Indii, Indonezji, Ameryki Południowej, ale także z USA, itp. Wadą jest sytuacja prawna w przypadku sporów, komunikat, a zatem czasami również koordynacja.

Ponieważ sam mam oko do grafiki i chcę zrobić jak najwięcej samemu, zaprojektowałem moje logo na PUBLIKOWANIE W SIECI poszedł inną drogą. Szukałem i znalazłem znak na Envato. Pomyślałem, że będę w stanie zbudować dla niego logotyp. Bo sygnet, który mi się podobał, miał niewłaściwą treść. Logo musi być dopasowane do obiektu i charakteru firmy. Znalazłem więc znak @, którego chciałem użyć, ale z "P" w kręgu @. Początkowo próbowałem tego sam - ale mam zbyt małe doświadczenie z wektorami w Illustratorze. Zapytałem więc dewelopera znaku przez Envato, czy mógłby to zrobić za mnie - i za jaką cenę. Było to możliwe, a koszt był całkowicie rozsądny. Teraz mam to "P" ze znakiem słownym w formacie krajobrazowym:

Logo online Przykład
Logo PUBLISHINGU NA SIECIE

Narzędzia do badań

Dokładnie tak postępuję dla moich klientów. Jeśli projekt logo jest pożądany, proponuję najpierw wybrać sygnet, który pasuje do pomysłu biznesowego i nazwy. Nie używam tylko Envato lub Elementy Envato. Patrzę też na Google w poszukiwaniu logotypów, albo na Ikonfinder, iStockPhoto i innych dostawców małej grafiki. Następnie pokazuję je klientowi, razem z nim wybieram jedno lub dwa i buduję logo w formacie krajobrazowym.

Ważne: Zwróć uwagę na prawa autorskie, Twoje logo nie może znajdować się zbyt blisko żadnego z istniejących. Nawet jeśli kupujesz sygnety, musisz sprawdzić licencję: Czy jest ona ważna dla celów zawodowych bez żadnych ograniczeń czasowych i przestrzennych? A także do użytku jako logo?

Dobre logo jest proste i w miarę możliwości wyraża pomysł na biznes. Pracują na stronie internetowej, ponieważ są one w formacie krajobrazowym. Można je wyświetlać w kolorze czarno-białym. I mogą być umieszczone na papierze firmowym lub wizytówce - nieco zmodyfikowane i dostosowane, być może z reklamacją pod spodem.

Podsumowanie

Stworzenie dobrego logo jest stosunkowo proste. Potrzebujesz jasnej koncepcji i bardzo dobrego pomysłu. Inspirację zapewniają inne odnoszące sukcesy marki i strony internetowe. Rozmowa z kolegami i przyjaciółmi może również pomóc w stworzeniu prostego, genialnego pomysłu. Ale spójrzmy prawdzie w oczy: to nie musi być genialne, odpowiednie może być wystarczające, dobre byłoby więcej niż wystarczające. Logotypów lub sygnetów można szukać na platformach graficznych.

Oczywiście, mniej lub bardziej abstrakcyjne znaki powinny mieć coś wspólnego z zawodem, który reprezentują. Tam też mogą być zabawne kombinacje. Albo jednak konsekwentne derywacje, na przykład gdy myślimy o słynnym jabłku z APPLE. Kto by pomyślał, żeby wziąć jabłko z brakującym kęsem. Ale ten mały zabawny "wichrzyciel" czyni to logo tak genialnym.

Mam nadzieję, że masz teraz kilka wskazówek, aby stworzyć kolejne wspaniałe logo dla World Wide Web. Życzę ci powodzenia i dużo zabawy.

Zdjęcia: Jeff Sheldon, Rohan Vijay.

Masz pytania dotyczące projektowania logo dla stron internetowych? Proszę skorzystać z funkcji komentarza. Chcesz być informowany o nowych wkładach w projektowanie stron internetowych i marketing online? Następnie podążaj za nami dalej Twitter, Facebook albo o naszym Newsletter.

Mark Max Henckel - Web designer z Hamburga. Wyszkolony projektant mediów (druk), pracujący jako projektant stron internetowych od 2000 roku. Najpierw w mobile.de, od 2003 r. na własny rachunek. Od 2005 roku bloger na różne tematy na różnych blogach własnych. Jako freelancer w latach 2007 i 2008 w SPIEGEL ONLINE brał udział w uruchomieniu eintages.de na styku programowania i redakcji. Później w Kanale Jakości Marketera SPIEGEL (Spiegel QC/Spiegel Media). Freelancer dla libri.de i różnych agencji graficznych i informatycznych. Od 2008 roku specjalizuje się w WordPress .

Artykuły pokrewne

Komentarze do tego artykułu

Napisz komentarz

Twój adres e-mail nie zostanie opublikowany. Wymagane pola oznaczone są * Zaznaczone.