2017-06-08 Pozycjonowanie 0 Opinie
optymalizacja logo strony

Optymalizacja logo strony krok po kroku

Logo to jedna z najważniejszych wizytówek strony firmowej, bloga, czy sklepu internetowego. Logo jest elementem, który znajduje się zazwyczaj bardzo wysoko w kodzie źródła strony internetowej. Roboty Google przywiązują uwagę do tych miejsc, co jest ważne z punktu widzenia SEO. Optymalizacja wybranych elementów strony wymaga zazwyczaj jednorazowej pracy, która często pozwala uzyskać korzyści na długie lata. Skuteczne pozycjonowanie stron internetowych to suma wielu czynników, które decydują o pozycji strony w SERP. Być może optymalizacja logo zaważy o pozycji Twojej strony w wynikach wyszukiwania i przeskoczysz konkurencję. Opracowałem wideo poradnik zawierający proste instrukcje, które szerzej opisują zagadnienia związane z przygotowaniem logo do optymalizacji.

Jak optymalizować logo?

Najpopularniejszym błędem jest osadzenie logo, jako tło w kodzie CSS. W efekcie logo staje się elementem nieklikalnym, psującym użyteczność strony.

Logo strony powinno być plikiem graficznym osadzonym wewnątrz odnośnika kierującego do strony głównej. Należy to zrobić w kodzie HTML, wykorzystując znacznik linku i znacznik grafiki.

Zobacz wideo poradnik

Optymalizacja logo.

Krok 1 – Umieszczenie kodu logo na stronie

Na popularnych systemach, takich jak WordPress kod logo znajduje się w pliku header.php szablonu strony.

Wyjściowa struktura kodu HTML logo powinna wyglądać następująco:

<a href="https://projektmarketing.pl">
	<img src="logo.png" width="240" height="67" />
</a>

Do znacznika obrazka warto dodać atrybuty width i height, definiujące odpowiednio szerokość i wysokość grafiki. Efektem działań jest krótsze renderowanie strony internetowej w przeglądarce.

Popularnym błędem jest wczytywanie logo zbyt dużych rozmiarów oraz wykorzystywanie atrybutów width i height do skalowania, pomniejszania obrazków. Szybkość witryny jest czynnikiem wpływającym na pozycjonowanie stron.

Krok 2 – Dodawanie atrybutu title do linku

Atrybut title dodawany do odnośników powoduje wyświetlenie tekstu po najechaniu na link. Warto wykorzystać ten atrybut do przedstawienia firmy i nasycenia wybranych słów kluczowych.

<a href="https://projektmarketing.pl" title="Projekt Marketing - Agencja SEO SEM">
	<img src="logo.png" width="240" height="67" />
</a>

Krok 3 – Nazewnictwo pliku graficznego

Nazewnictwo plików graficznych i dokumentów PDF jest istotne z punktu widzenia SEO.

Nadanie odpowiednich nazw dla grafik jest ważne dla robotów indeksujących, które mogą mieć problemy z interpretacją zawartości grafik. Nazwa logo – 1.png nie wnosi żadnej wartości dla robota Google, który skanuje nazwy grafik i załączników na stronie.

Wskazówki dla nazewnictwa plików i grafik:

  • nazwa pliku powinna być krótka i zawierać słowo kluczowe, np: projekt-marketing-pozycjonowanie-optymalizacja.png.
  • każde słowo powinno zostać rozdzielone „-” (myślnikiem).
  • dla typowo polskich znaków: ą, ć, ę, ł, ń, ó, ś, ź, ż, stosować odpowiednio: a, c, e, l, n, o, s, z, z.
<a href="https://projektmarketing.pl" title="Projekt Marketing - Agencja SEO SEM">
	<img src="projekt-marketing-pozycjonowanie-optymalizacja.png" width="240" height="67" />
</a>

Krok 4 – Kompresja grafiki

Kompresja obrazków na stronie pozwoli zmniejszyć rozmiar pliku, nie tracąc jakości.

Darmowy program online do kompresji grafik – https://compressor.io.

Program umożliwia kompresję stratną i bezstratną. Warto spróbować kompresji stratnej, wówczas należy sprawdzić czy jakość obrazu została zachowana.

Pierwotną grafikę należy nadpisać na serwerze skompresowaną grafiką logo.

Krok 5 – Dodawanie atrybutu ALT do grafiki

Atrybut ALT powinien zawierać słowo kluczowe, tekst opisujący grafikę. Dodanie do każdej grafiki atrybutu ALT pozwoli zwiększyć jej widoczność w trakcie przeglądania obrazów w wyszukiwarce Google. W efekcie zwiększy się ruch na stronie pochodzący wyszukiwania grafik.

<a href="https://projektmarketing.pl" title="Projekt Marketing - Agencja SEO SEM">
	<img src="logo-projekt-marketing-pozycjonowanie-optymalizacja.png" alt="Projekt Marketing - optymalizacja i pozycjonowanie stron" width="240" height="67" />
</a>

Krok 6 – Dodawanie atrybutu title do grafiki

Atrybut title dodawany do grafiki logo jest dodatkowym nośnikiem informacji, który powinien nawiązywać do zawartości obrazka.

<a href="https://projektmarketing.pl" title="Projekt Marketing - Agencja SEO SEM">
	<img src="logo-projekt-marketing-pozycjonowanie-optymalizacja.png" alt="Projekt Marketing - optymalizacja i pozycjonowanie stron" title="Projekt Marketing - Optymalizacja i pozycjonowanie stron" width="240" height="67" />
</a>

Krok 7 – Wdrożenie mikroformatów logo

Mikroformaty pozwalają precyzyjnie opisać poszczególne elementy na stronie w sposób zrozumiały dla botów Google. Logo bez mikroformatów będzie traktowane przez roboty sieciowe jako link i obrazek, natomiast po wdrożeniu mikroformatów będą informować boty, że napotkały logo strony.


<div itemtype="http://schema.org/Organization" itemscope="">
	<a href="https://projektmarketing.pl" title="Projekt Marketing - Agencja SEO SEM" itemprop="url">
		<img src="logo-projekt-marketing-pozycjonowanie-optymalizacja.png" alt="Projekt Marketing - optymalizacja i pozycjonowanie stron" title="Projekt Marketing - Optymalizacja i pozycjonowanie stron" width="240" height="67" itemprop="logo" />
	</a>
</div>

Na koniec należy sprawdzić, czy mikroformaty logo zostały poprawnie wdrożone – [Link] do darmowego narzędzia Google.

Mam też do Ciebie ogromną prośbę. Jeżeli uznasz, że poradnik o optymalizacji logo okazał się wartościowy i pomocny, to udostępnij go swoim znajomym lub podlinkuj. Gdziekolwiek… Niech inni ludzie też na tym skorzystają.

Optymalizacja logo strony krok po kroku
5 (100%) 3 votes

duplikacja treści

Unikalne artykuły o MARKETINGU I SEO Prosto na Twój najlepszy adres e-mail.

Dodaj komentarz

Twój adres email nie zostanie opublikowany. Pola, których wypełnienie jest wymagane, są oznaczone symbolem *