IDZ DO
IDZ DO
PRZYKŁADOWY ROZDZIAŁ
PRZYKŁADOWY ROZDZIAŁ
ABC tworzenia stron
SPIS TRESCI
SPIS TRESCI
WWW. Wydanie II
KATALOG KSIĄŻEK
KATALOG KSIĄŻEK
Autor: Bartosz Danowski
ISBN: 83-246-0605-X
KATALOG ONLINE
KATALOG ONLINE
Format: B5, stron: 296
ZAMÓW DRUKOWANY KATALOG
ZAMÓW DRUKOWANY KATALOG
TWÓJ KOSZYK
TWÓJ KOSZYK
Poznaj najnowsze metody projektowania stron WWW
DODAJ DO KOSZYKA
DODAJ DO KOSZYKA
DziS posiadanie własnej witryny WWW nie jest już wyłącznie domeną przedsiębiorstw
promujących w ten sposób swoją ofertę. Coraz więcej użytkowników sieci prezentuje na
własnych stronach WWW wykonane przez siebie fotografie, relacje z wakacji, pierwsze
CENNIK I INFORMACJE
CENNIK I INFORMACJE
własnoręcznie napisane programy i wiele innych rzeczy. Firmy oferujące bezpłatnie
miejsce na strony WWW udostępniają również gotowe szablony takich stron, które
ZAMÓW INFORMACJE
ZAMÓW INFORMACJE
O NOWOSCIACH wystarczy wypełnić treScią. Jednak na pewno większą satysfakcję przyniesie
O NOWOSCIACH
samodzielne stworzenie witryny WWW.
ZAMÓW CENNIK
ZAMÓW CENNIK
ABC tworzenia stron WWW. Wydanie II to kolejne wydanie Swietnego podręcznika
przedstawiającego zagadnienia związane z projektowaniem witryn internetowych.
Dzięki tej książce, zaktualizowanej zgodnie z najnowszymi standardami sieciowymi,
CZYTELNIA
CZYTELNIA
poznasz język XHTML i najnowszą specyfikację kaskadowych arkuszy stylów.
Nauczysz się tworzyć dokumenty składające się na witrynę WWW, wstawiać do nich
FRAGMENTY KSIĄŻEK ONLINE
FRAGMENTY KSIĄŻEK ONLINE
elementy graficzne i mechanizmy nawigacyjne. Dowiesz się, jak opublikować witrynę
na serwerze internetowym, i poznasz sposoby jej optymalizacji i pozycjonowania tak,
aby była prawidłowo rozpoznawana przez najważniejsze wyszukiwarki, takie jak Google.
W książce znajdziesz również zestawienie wszystkich atrybutów stylów CSS.
" Narzędzia do tworzenia stron WWW
" Struktura dokumentu HTML
" Umieszczanie na stronie elementów graficznych
" Hiperłącza
" Formatowanie tekstu za pomocą kaskadowych arkuszy stylów
" Przygotowywanie grafiki na strony WWW
" Rejestracja domeny i publikacja strony
" Pozycjonowanie witryny w wyszukiwarkach
Wydawnictwo Helion
ul. KoSciuszki 1c
44-100 Gliwice
tel. 032 230 98 63
e-mail: helion@helion.pl
Wstęp ............................................................................. 7
1 Wprowadzenie ................................................................. 9
Niezbędne informacje o HTML, XHTML, CSS i nie tylko ............... 9
Narzędzia potrzebne do dalszej pracy ........................................... 12
Edytory tekstowe ...................................................................... 12
Edytory graficzne ..................................................................... 14
Programy do przygotowywania grafiki sieciowej ................... 14
Przeglądarki stron WWW ......................................................... 15
Polskie litery na stronie WWW ...................................................... 17
Odbiorca strony .............................................................................. 18
2 Tworzymy stronę WWW. Podstawy języka HTML ......... 21
Podstawy i struktura dokumentu .................................................. 22
Nagłówek dokumentu .............................................................. 26
Ciało dokumentu ....................................................................... 32
Komentarze ............................................................................... 33
Prezentacja tekstu .......................................................................... 34
Nagłówki ................................................................................... 34
Akapity ...................................................................................... 34
Cytaty ........................................................................................ 36
Indeks górny i dolny ................................................................. 37
Aamanie wierszy ....................................................................... 38
Wyróżnianie tekstu ................................................................... 39
Twarda spacja ........................................................................... 40
Znacznik DIV ............................................................................. 40
ABC tworzenia stron WWW
Listy ................................................................................................ 40
Lista wypunktowana ................................................................ 41
Lista numerowana .................................................................... 42
Lista definicji ............................................................................ 43
Zagnieżdżanie list ..................................................................... 43
Umieszczanie grafiki na stronie WWW ........................................ 45
Hiperłącza ....................................................................................... 49
Hiperłącza tekstowe ................................................................. 50
Hiperłącza graficzne ................................................................. 53
Mapy odsyłaczy ........................................................................ 54
Kotwice ..................................................................................... 58
Adresy względne i bezwzględne .............................................. 60
Tabele .............................................................................................. 61
Proste tabele ............................................................................. 64
Wymiarowanie tabel ................................................................ 66
Tabele niesymetryczne ............................................................. 69
Zagnieżdżanie tabel .................................................................. 71
Dodatkowe elementy tabeli ..................................................... 72
Formularze ..................................................................................... 83
Pola typu input ......................................................................... 84
Pole typu select ......................................................................... 86
Pole typu textarea .................................................................... 87
Przesyłanie treści formularza .................................................. 87
Ramki .............................................................................................. 92
3 Modyfikujemy stronę WWW CSS ...............................97
Różnice pomiędzy formatowaniem
za pomocą XHTML/HTML i CSS ................................................. 98
Umieszczanie stylów w dokumencie ............................................ 99
Jednostki miar i nazewnictwo kolorów stosowane w CSS ........ 101
Jednostki względne ................................................................ 101
Jednostki bezwzględne .......................................................... 102
Nazewnictwo kolorów używane w CSS ................................ 103
Budowa stylu ................................................................................ 105
Selektory ................................................................................. 107
Identyfikatory ......................................................................... 113
Klasy ........................................................................................ 114
Pseudoklasy ............................................................................ 116
Pseudoelementy ...................................................................... 120
Grupowanie selektorów ......................................................... 122
Dziedziczenie i kaskadowość to klucz do potęgi CSS ................. 123
Formatowanie wyglądu tekstu .................................................... 126
Wyrównanie tekstu ................................................................ 127
Pionowe wyrównanie ............................................................. 128
Wcięcie pierwszego wiersza akapitu ..................................... 129
Odstępy wiersze, wyrazy, litery ........................................ 129
Dekoracja tekstu ..................................................................... 131
Małe i duże litery .................................................................... 134
Kontrola pustej przestrzeni .................................................... 135
4
Spis treści
Formatowanie wyglądu czcionki ................................................. 136
Rodzaj czcionki ....................................................................... 136
Rozmiar ................................................................................... 138
Waga czcionki ......................................................................... 141
Styl czcionki ............................................................................ 142
Formatowanie wyglądu list ......................................................... 145
Typ listy .................................................................................. 145
Własny punktor graficzny ...................................................... 146
Pozycjonowanie listy względem punktora ............................ 147
Kolor i tło poszczególnych elementów ........................................ 148
Kolor ........................................................................................ 148
Tło ............................................................................................ 149
Powielanie i zatrzymanie tła .................................................. 150
Pozycjonowanie graficznego tła ............................................. 152
Marginesy i dopełnienie ............................................................... 153
Marginesy zewnętrzne ........................................................... 153
Marginesy wewnętrzne dopełnienie ................................. 155
Obramowanie elementów ............................................................ 157
Styl obramowania ................................................................... 158
Szerokość i kolor obramowania ............................................. 160
Pozycjonowanie elementów ......................................................... 165
Określanie pozycji ................................................................... 167
Wymiarowanie elementów .................................................... 167
Pływanie i tamowanie elementów ......................................... 170
4 Przygotowywanie grafiki na potrzeby publikacji
na stronie WWW ........................................................ 177
GIF ................................................................................................. 178
Transparentność kolor przezroczysty ............................... 180
Przeplot ................................................................................... 184
Animowany GIF ...................................................................... 185
Redukcja palety kolorów ........................................................ 189
JPG ................................................................................................ 190
PNG ............................................................................................... 193
Pozostałe formaty publikacji grafiki na stronie WWW .............. 194
Sposoby redukcji rozmiaru zdjęć i grafiki ................................... 196
Antyaliasing .................................................................................. 198
Cięcie grafiki na mniejsze elementy ............................................ 201
Mapa odsyłaczy ............................................................................ 204
Skanowanie i obróbka obrazów na potrzeby strony WWW ...... 205
Skanowanie ............................................................................. 205
Obróbka skanu ........................................................................ 208
5 Publikacja i utrzymanie strony .................................... 213
Wybór serwera hosting ........................................................... 214
Zakładanie konta .......................................................................... 216
Publikacja strony .......................................................................... 219
Rejestracja domeny ...................................................................... 222
5
ABC tworzenia stron WWW
6 Pozycjonowanie i promocja strony ..................................227
Popularne sposoby promocji strony ............................................ 228
Podpis poczty elektronicznej ................................................. 228
Grupy dyskusyjne ................................................................... 228
Listy mailingowe .................................................................... 228
Inne formy promocji ............................................................... 229
Pozycjonowanie stron w wyszukiwarkach ................................. 229
Podstawy ................................................................................. 230
Prawidłowa indeksacja strony ............................................... 232
Zdobywanie pozycji ................................................................ 238
Dodatek ..................................................................................243
Zestawienie właściwości kaskadowych arkuszy stylów ............ 243
Właściwości tekstu ................................................................. 243
Właściwości czcionki ............................................................. 246
Właściwości list ...................................................................... 248
Kolor i tło ................................................................................ 249
Marginesy ............................................................................... 251
Dopełnienie ............................................................................. 252
Obramowanie .......................................................................... 253
Wymiary elementów .............................................................. 254
Tabele ...................................................................................... 256
Pozycjonowanie elementów ................................................... 257
Efekty wizualne ...................................................................... 258
Drukowanie ............................................................................ 259
Interfejs użytkownika ............................................................ 261
Zawartość generowana i liczniki ........................................... 262
Zestawienie obsługi stylów przez przeglądarki .......................... 263
Wczytywanie arkusza w zależności
od używanej przeglądarki ......................................................... 266
Zabezpieczanie strony hasłem ..................................................... 268
Opis skryptu FormMail ................................................................ 270
Pola niezbędne do działania formularza
opartego na FormMail .......................................................... 270
Pola poszerzające działanie formularza ................................ 271
Własny licznik .............................................................................. 273
Podsumowanie ........................................................................277
Skorowidz ..............................................................................279
6
ażdy twórca strony chce, by po jej publikacji była
ona oblegana przez tłumy odwiedzających. Niestety,
w praktyce sprawa odwiedzin oraz popularności stro-
ny nie wygląda tak dobrze. Aby rozpropagować swoją
witrynę, musisz sięgnąć po wiele rozwiązań i sztuczek,
które postanowiłem opisać poniżej w zwięzłej formie.
Jeżeli interesuje Cię temat pozycjonowania
i optymalizacji stron WWW, odwiedz
moją stronę i poszukaj tam stosownych
informacji i porad. W chwili gdy czytasz
te słowa, na ukończeniu powinna być
dedykowana książka na temat
pozycjonowania stron WWW
oraz optymalizacji kodu.
ABC tworzenia stron WWW
W niniejszym podrozdziale opisałem kilka prostych i popularnych sposobów promo-
cji strony. Większość przedstawionych rozwiązań nie wymaga specjalistycznej wie-
dzy oraz dużego nakładu pracy. Dzięki temu świetnie nadają się one na start.
Podpis poczty elektronicznej
Najprostszym sposobem reklamy strony jest dodanie do wysyłanej poczty e-mail
odpowiedniej stopki lub podpisu, zawierającego adres serwisu. Jeżeli wysyłasz
dużo e-maili, to z całą pewnością w bliskiej przyszłości taka forma promocji od-
niesie skutek.
Dalej zamieściłem przykład swojej stopki, która jest częścią każdego listu wysy-
łanego z komputera.
--
Bartosz Danowski :: http://danowski.pl ::
Jak walczyć ze spam-em - http://danowski.pl/ksiazka/spam
W swoim przykładowym podpisie poza imieniem i nazwiskiem zamieściłem adres
strony internetowej oraz reklamę losowo wybranej książki.
Tworząc stopkę poczty, musisz pamiętać o tym, by nie zawierała
ona więcej niż cztery wiersze w przeciwnym razie możesz
spotkać się z krytyką takiego działania ze strony innych
użytkowników internetu.
Grupy dyskusyjne
Możliwa jest także promocja strony na grupach dyskusyjnych, w tym celu po-
wstała specjalna grupa o nazwie pl.comp.www.nowe-strony. Tam możesz bez
obaw wysyłać informacje o swojej stronie i o tym, gdzie się ona znajduje.
Poza wspomnianą grupą możesz także spróbować zareklamować stronę na innych
grupach tematycznie związanych z zawartością witryny. Jednak pamiętaj, że nie
wszędzie jest to mile widziane i zanim poślesz wiadomość, postaraj się zapoznać
z zasadami panującymi na wybranej przez Ciebie grupie dyskusyjnej.
Listy mailingowe
Promocja strony WWW czy też usług oferowanych w internecie za pomocą poczty
elektronicznej jest tak stara, jak sam internet. Decydując się na ten sposób promo-
cji strony, musisz pamiętać o kilku ważnych rzeczach.
228
Pozycjonowanie i promocja strony
Moim zdaniem najważniejszą sprawą jest grono adresatów poczty. Nie powinieneś
wysyłać poczty elektronicznej do grupy ludzi, których adresy znalazły się w bazie
danych, będącej w Twoim posiadaniu. Takie działanie zazwyczaj spotyka się
z wrogością odbiorców, często bowiem okazuje się, że ich adresy e-mail trafiły
do takiej bazy bez ich wiedzy i zgody.
Zanim zdecydujesz się rozsyłać e-maile z reklamami Twojej
strony, koniecznie zapoznaj się z książką Spam. Profilaktyka
i obrona http://danowski.pl/ksiazka/spam.
Dlatego skorzystaj z systemów do prowadzenia biuletynów informacyjnych i umoż-
liw swoim czytelnikom dopisywanie swoich adresów do Twojej bazy. Dzięki temu
unikniesz problemów związanych z posądzaniem o spamowanie.
Inne formy promocji
Do innych form promocji można zaliczyć zamieszczenie adresu strony na papierze
firmowym, wizytówkach, folderach reklamowych oraz w branżowych magazynach.
Dzięki temu o Twojej stronie dowiedzą się ludzie, którzy są zainteresowani tym,
co robisz lub co oferujesz.
Zdecydowanie najlepszym sposobem na wzrost popularności Twojej strony jest
jej optymalizacja, przygotowanie do indeksacji przez wyszukiwarki oraz zdoby-
wanie wysokich pozycji w wynikach wyszukiwania.
Porady zamieszczone poniżej potraktuj jako wstęp
do pozycjonowania stron WWW, gdyż temat ten jest na tyle
obszerny, że wymaga osobnej i grubej książki. Nie zmienia
to faktu, że niektóre rady tu zamieszczone są na tyle uniwersalne
i ponadczasowe, że ich stosowanie w niczym nie zaszkodzi,
a często przyniesie pożądany efekt w postaci dobrych miejsc
w wynikach wyszukiwania.
229
ABC tworzenia stron WWW
Podstawy
Na samym początku przeanalizuj treść swojej strony i na tej podstawie wybierz
kilka słów kluczowych. Powinny być to słowa lub frazy, które najlepiej oddają
zawartość strony i są wykorzystywane przez ludzi szukających informacji w sieci.
Aby prawidłowo wykonać to zadanie, warto wczuć się w rolę osoby szukającej,
a nie pozycjonującej stronę.
Analizując zwartość mojej strony, doszedłem do wniosku, że każda z podstron
omawiających książki korzysta z innych słów i fraz kluczowych. Dlatego jako
przykład do dalszych rozważań posłuży mi strona jednej z ostatnich książek
Nero 7. Nagrywanie płyt CD i DVD. Ćwiczenia praktyczne http://danowski.pl/
ksiazka/cwner7. Wytypowane przeze mnie słowa kluczowe wypisałem poniżej.
% Nero,
% Nagrywanie płyt,
% Nero Burning ROM,
% Wypalanie płyt,
% Płyty CD DVD,
% Kopiowanie płyt.
Mając wybrany zestaw kluczowych fraz i słów, możesz zabrać się do optymali-
zacji kodu strony. W pierwszej kolejności musisz zadbać o odpowiednie opisane
znaczników
. Poniżej zamieściłem przykład odpowiednich znaczników
wraz z wpisanym słowa kluczowymi. Pamiętaj, że oba elementy muszą znajdować
się w nagłówku strony pomiędzy znacznikami .
Zwróć uwagę, że słowa kluczowe znacznik keywords rozdzielone są przecin-
kami, a te z wyrazów, które zawierają polskie znaki profilaktycznie zostały po-
wtórzone. Postaraj się nie dodawać zbyt wielu słów kluczowych, bo wyszukiwarki
i tak nie uwzględniają wszystkich.
Drugi z przedstawionych znaczników zawiera opis strony, który przez niektóre
wyszukiwarki jest przedstawiony wraz z wynikami wyszukiwania. Opis powi-
nien być zwięzły i na temat, bo w dużej mierze od niego zależy, czy dany gość
poczuje się zachęcony do bliższego zapoznania się z Twoją stroną. Staraj się
w opisie wykorzystywać słowa kluczowe.
230
Pozycjonowanie i promocja strony
Następnym istotnym elementem jest tytuł strony. Przypomnę tylko, że jest on
tworzony za pomocą znacznika
. Dobrze zbudowany tytuł stro-
ny powinien zawierać informacje o jej zawartości oraz pozycjonowane frazy lub
słowa kluczowe. Zdecydowanie złym pomysłem jest tworzenie tytułu zawierają-
cego np. nazwę mało znanej firmy produkującej okna. Mało kto będzie szukał
producenta okien po nazwie firmy. Poniżej przedstawiłem dobrze skonstruowany
tytuł strony.
Nero nagrywanie płyt CD i DVDKolejnym istotnym elementem, który musi znalezć się w kodzie strony, jest znacz-
nik
, który informuje robota wyszukiwarki o tym, co można
indeksować na stronie. Poniżej znajduje się przykładowy wpis, pozwalający na
pełną indeksację wszystkich podstron serwisu.
Oczywiście w zależności od potrzeb wartości wpisane do atrybutu content mogą
przybierać inną postać, np.:
% 'index' strona powinna być zaindeksowana,
% 'noindex' strona nie powinna być zaindeksowana,
% 'follow' linki z tej strony powinny być zaindeksowane,
% 'nofollow' linki z tej strony nie powinny być zaindeksowane,
% 'all' równa się 'index, follow' wartość domyślna,
% 'none' równa się 'noindex, nofollow'.
Uwaga, wszystkie opisane w niniejszym podrozdziale znaczniki języka XHTML/
HTML powinny znalezć się w nagłówku każdej z podstron serwisu.
Po zmianach kodu strony przyszła pora na to, aby przyjrzeć się treści pozycjo-
nowanej strony. Poprawnie napisany tekst przeznaczony do prezentacji na stronie
WWW powinien spełniać kilka surowych kryteriów, dzięki którym będzie trafiał
do czytającego oraz wpłynie na poprawę wyników wyszukiwania.
% Tekst powinien być możliwie krótki i zwarty,
% Najważniejsze elementy powinny być umieszczone na początku tekstu,
% Wewnątrz tekstu powinny zostać umiejętnie wplecione frazy i słowa
kluczowe, które zostały wybrane do pozycjonowania,
% Tekst powinien być napisany poprawną polszczyzną i w pierwszej kolejności
kierowany do osoby czytającej, a dopiero pózniej do robotów wyszukiwarek.
231
ABC tworzenia stron WWW
% Staraj się używać w treści strony nagłówków. Pamiętaj, że nagłówek H1
może wystąpić tylko raz na stronie. W miarę możliwości nagłówki powinny
zawierać w sobie pozycjonowane frazy lub słowa kluczowe.
% Używaj znaczników odpowiedzialnych za wyróżnianie tekstu. Wyróżnienia
powinny dotyczyć pozycjonowanych fraz lub słów kluczowych. Ważne jest
jednak, aby wyróżniać z umiarem i tylko to, co faktycznie jest istotne.
Prawidłowa indeksacja strony
Po dobraniu słów kluczowych, prawidłowym opisie istotnych znaczników w kodzie
strony i optymalizacji tekstów przyszła pora na to, aby zadbać o należytą indeksa-
cję strony przez wyszukiwarki. Zanim jednak przejdziemy do konkretów, kilka
ważnych informacji na temat tego, w jaki sposób działają roboty wyszukiwarek.
W dużym uproszczeniu robot wyszukiwarki jest samodzielną przeglądarką, która
analizuje zawartość strony i wyniki swoich obserwacji przesyła do bazy danych.
Robot po wypuszczeniu z klatki zaczyna swoją wędrówkę po sieci i przemieszcza
się pomiędzy indeksowanymi stronami dzięki odnośnikom. Dlatego bardzo waż-
nym elementem jest prawidłowe połączenie wszystkich stron w serwisie. Robot
musi mieć swobodę skakania ze strony na stronę tak, by zapoznał się ze wszystkimi
częściami serwisu.
Niestety robot sieciowej wyszukiwarki w zależności od tego, z jakim serwisem
macierzystym jest powiązany, ma szereg braków i ograniczeń, które musimy brać
pod uwagę podczas tworzenia strony.
Zacznijmy od najważniejszego ograniczenia. Otóż większość robotów nie potrafi
analizować stron wykorzystujących technologię Adobe Flash (dawniej Macromedia
Flash) lub robi to nieudolnie. Efektem tych ograniczeń może być zerowa lub szcząt-
kowa indeksacja Twojej strony.
W przypadku mojej strony domowej (starej wersji) boczne menu nawigacyjne
zostało wykonane za pomocą programu Adobe Flash rysunek 6.1, co zaowo-
cowało w pierwszej fazie problemami z indeksacją strony.
Niestety, roboty indeksowały wyłącznie stronę główną oraz podstrony, do których
odnośniki znajdowały się w kolumnie aktualności i w głównej treści strony. Aącznie
w indeksie znajdowało się zaledwie kilkanaście procent całego serwisu.
Opisany powyżej problem można rozwiązać przynajmniej na trzy sposoby, które
pozwoliłem sobie szerzej opisać poniżej.
232
Pozycjonowanie i promocja strony
Rysunek 6.1. System nawigacji zbudowany w oparciu o Adobe Flash jest złym
rozwiązaniem z punktu widzenia pozycjonowania stron
Najszybszym rozwiązaniem jest dodanie drugiego, tekstowego menu nawigacyj-
nego, przeznaczonego głównie dla robotów. W przypadku mojej strony domowej
takie menu pojawiło się w stopce strony rysunek 6.2.
Rysunek 6.2. Dodatkowe tekstowe menu nawigacyjne wpływa na lepszą
indeksację strony
Drugim rozwiązaniem, które wymaga odrobinę więcej zachodu, jest stworzenie
mapy strony. W praktyce taka mapa jest wykazem odnośników do wszystkich
podstron serwisu. Rysunek 6.3 przedstawia przykładową mapę mojej strony
domowej.
Tworząc mapę strony, warto skorzystać z list wypunktowanych lub numerowa-
nych, a gotową podstronę bezwzględnie należy podpiąć na głównej strony serwisu
za pomocą tekstowego odnośnika. Na przykładowej witrynie odnośnik do mapy
strony znajdziesz w tekstowym menu nawigacyjnym, umieszczonym w stopce
rysunek 6.2.
Ostatnim i chyba najbardziej wymagającym rozwiązaniem jest zmiana systemu
nawigacji strony i zastąpienie go lepszym oraz nowocześniejszym rozwiązaniem,
jakim są kaskadowe arkusze stylów. Na rysunku 6.4 widać alternatywne menu
nawigacyjne mojej strony domowej, wykonane za pomocą CSS.
233
ABC tworzenia stron WWW
Rysunek 6.3. Mapa strony bardzo dobrze wpływa na lepszą indeksację strony
Liczące się wyszukiwarki udostępniły specjalne narzędzie
do tworzenia map strony oraz zarządzania nimi. Dzięki temu
strony mają być jeszcze lepiej i dokładniej indeksowane.
Przykładem takiego rozwiązania może być Google Sitemap
http://www.google.com/webmasters/sitemaps.
Rysunek 6.4. Za pomocą CSS można stworzyć równie atrakcyjne, a przy tym
funkcjonalne menu nawigacyjne
234
Pozycjonowanie i promocja strony
Powyższy projekt nigdy nie został wykorzystany na stronie, ponieważ zdecydo-
wałem o zmianie jej charakteru i wyglądu, o czym sam możesz się przekonać,
odwiedzając ją. Nie zmienia to faktu, że przykładowe menu jest wygodne w codzien-
nym użyciu, działa poprawnie w różnych przeglądarkach i świetnie współpracuje
z robotami wyszukiwarek.
Poniżej zamieściłem przykładowy arkusz stylów oraz kod strony WWW z pre-
zentowanym menu. Mam nadzieję, że dzięki informacjom zawartym w poprzed-
nich rozdziałach niniejszej książki poradzisz sobie z przygotowaniem podobnego
systemu nawigacji.
Kod XHTML
Arkusz stylów
ul#danowski
{
list-style: none;
margin: 0;
padding: 0;
}
#menu
{
width: 150px;
border-style: solid solid none solid;
border-color: #F4F4F4;
border-size: 1px;
border-width: 1px;
margin: 10px;
}
235
ABC tworzenia stron WWW
#menu li a
{
height: 32px;
voice-family: "\"}\"";
voice-family: inherit;
height: 24px;
text-decoration: none;
outline-style: none;
}
#menu li a:link, #menu li a:visited
{
color: #404040;
display: block;
background: url(images/menu1.gif);
padding: 8px 0 0 10px;
outline-style: none;
}
#menu li a:hover
{
color: #26370A;
background: url(images/menu1.gif) 0 -32px;
padding: 8px 0 0 10px;
}
#menu li a:active
{
color: #26370A;
background: url(images/menu1.gif) 0 -64px;
padding: 8px 0 0 10px;
}
Na rysunku 6.5 widać obrazek wykorzystany do stworzenia menu.
Rysunek 6.5. Zmyślna konstrukcja obrazka powoduje, że animacja menu jest płynna
niezależnie od posiadanego łącza
Szalenie ważnym czynnikiem poprawiającym dokładną indeksację strony jest
system wewnętrznych odnośników pomiędzy stronami. Innymi słowy, w miarę
możliwości zadbaj o to, aby poszczególne strony były powiązane między sobą.
Zwróć uwagę, że na przykładowej stronie głównej można np. znalezć odnośnik
do strony o książce omawiającej program Nero. Po otwarciu odpowiedniej pod-
strony pod opisem książki znajdziesz kilka kolejnych odnośników do innych książek
na ten sam temat rysunek 6.6.
236
Pozycjonowanie i promocja strony
Rysunek 6.6. Zadbaj o wzajemne powiązania poszczególnych stron
Tworząc system wzajemnych powiązań, staraj się wykorzystywać w odsyłaczach
słowa kluczowe wybrane do pozycjonowania strony.
Jeżeli z jakichś powodów dany odsyłacz ma nie być analizowany
przez robota wyszukiwarki, można skorzystać z atrybutu
rel="nofollow".
Ten odsyłacz nie
zostanie sprawdzony przez robotaMusisz wiedzieć, że wszystkie zmiany w wyszukiwarkach wymagają czasu i co
za tym idzie, efekty Twojej pracy mogą być widoczne dopiero po kilku tygodniach,
a w szczególnych przypadkach nawet po kilku miesiącach.
Kontrola stopnia indeksacji witryny jest możliwa za pomocą specjalnych poleceń,
które możemy wpisać w okno wyszukiwarki. Na przykład w przypadku najpo-
pularniejszej sieciowej wyszukiwarki Google, polecenie ma następującą postać:
site:http://danowski.pl
Bezpośrednio po poleceniu site: podajemy adres strony, która ma zostać spraw-
dzona. Rysunek 6.7 przedstawia przykładowe wyniki dla mojej strony domowej.
237
ABC tworzenia stron WWW
Rysunek 6.7. Wynik działania polecenia site:
W chwili wykonywania testu ilość zindeksowanych stron w bazie Google wyno-
siła 856. Biorąc pod uwagę, że cały serwis w starej wersji miał około 1000 pod-
stron, jest to wynik bardzo dobry. Pamiętaj o tym, że wyniki dla zapytania site:
nigdy nie pokazują stu procent stanu faktycznego i każdego dnia mogą być inne
to normalne.
Zdobywanie pozycji
Skoro kod strony został poprawiony a konstrukcja poszczególnych podstron zop-
tymalizowana tak, by poprawnie była analizowana i indeksowana przez roboty
wyszukiwarek, możemy zająć się zdobywaniem pozycji.
Ze względu na poglądowy charakter tego opisu skupię się tutaj wyłącznie na wyszu-
kiwarce Google. Pamiętaj jednak, że konkurencja stara się naśladować lidera rynku,
więc żadna z opisanych poniżej metod Ci nie zaszkodzi, a może jedynie pomóc.
Pod pojęciem zdobywania pozycji rozumiem to, że dla konkretnego zapytania
zadanego wyszukiwarce zwróci ona adres Twojej witryny na możliwie najwyż-
szym miejscu. Osobiście uważam, że zadowalającym rezultatem jest pierwsza
podstrona wyników.
Ostatnie miesiące utwierdziły mnie w przekonaniu, że do zdobycia wysokiej lokaty
w wynikach wyszukiwania wystarczy odpowiednia liczba odsyłaczy prowadzących
do Twojej strony z innych witryn. Odnośniki takie muszą mieć następującą postać:
238
Pozycjonowanie i promocja strony
NeroKsiążka Nerosrc= obrazki/nero.gif alt= Nero title= Nero />Szczególnie istotnym elementem odsyłacza prowadzącego do Twojej strony jest
pozycjonowana fraza lub słowo kluczowe. Na początku zdecydowałem, że pozy-
cjonować będę stronę książki o Nero, więc trudno o lepszy odnośnik.
Właściwie w tym miejscu mogę zakończyć swój wywód stwierdzeniem, że należy
zdobywać możliwie najwięcej odnośników prowadzących do swojej strony i to
wystarczy do osiągnięcia wysokiej pozycji. Niestety, prawda jest trochę inna
i dlatego zachęcam do lektury dalszej części tego podrozdziału.
Zdobywając odnośniki prowadzące do Twojej strony, musisz pamiętać o kilku
ważnych rzeczach. Pozwoliłem sobie wypisać w podpunktach najważniejsze
czynniki, jakie mają tutaj znaczenie.
% Pamiętaj, że wartość ma tylko jeden odnośnik z danej strony. Jeżeli znajomy
doda u siebie kilka odnośników do Twojej strony i każdy z nich będzie miał
inny opis, to nie wpłynie to w znacznym stopniu na uzyskane przez Ciebie
wyniki. Oczywiście każda podstrona serwisu znajomego może zawierać
odnośnik o różnej treści.
% Zadbaj o pozyskanie odnośników z innych serwisów o podobnej tematyce.
Twórcy wyszukiwarek wiedzą, że konkurencja nie współpracuje ze sobą
i ciężko pozyskać odnośniki z takich miejsc. Dlatego odsyłacze tego typu
mają dużo większą wartość i w znaczącym stopniu wpływają na Twoje
notowania.
% Unikaj złego sąsiedztwa i nie publikuj odnośników na stronach o treści
powszechnie uznanej za szkodliwą. Mam tutaj na myśli strony pornograficzne,
nazistowskie etc.
% Zabiegaj o odnośniki ze stron o wysokim współczynniku PageRank. Więcej
na temat tego elementu napisałem w dalszej części niniejszego rozdziału.
% Staraj się pozyskiwać po kilka odnośników dziennie i pamiętaj, że różne
magiczne systemy służące do zdobywania odnośników, np. LinkVault,
nic Ci nie dadzą. Zdarzają się przypadki, gdy dodawanie zbyt dużej ilości
odnośników prowadzi do problemów i np. wykluczenia strony z wyników
wyszukiwania.
% Zadbaj o to, aby informacja o Twojej stronie znalazła się w liczących się
katalogach stron WWW. Osobiście uważam, że warto zainteresować się
następującymi katalogami: http://www.webwweb.pl, http://katalog.onet.pl,
http://katalog.wp.pl oraz http://dmoz.org.
239
ABC tworzenia stron WWW
Jak widzisz, praca nad pozycją w dużej mierze polega na zdobywaniu odnośników
do Twojej strony. Dlatego uznałem, że dobrym pomysłem jest przedstawienie kilku
sposobów na to, w jaki sposób zdobywać odsyłacze.
% Prowadząc stronę o ciekawej zawartości oraz dużej popularności, nie
musisz się martwić o odsyłacze, bo Twoi goście sami będą stronę polecać
na swoich witrynach. Przykładem takiej sytuacji jest CDRinfo.pl.
% Umieść na swojej stronie dział z odnośnikami do innych i staraj się
wymieniać adresami. Przykład dobrze skonstruowanej strony
z odnośnikami możesz zobaczyć na rysunku 6.8.
Rysunek 6.8. Przykład strony z odnośnikami. Zasada jest prosta jeżeli chcesz
u mnie adres swojej strony, umieść u siebie odnośnik do mnie.
Warto podać dokładny kod, dzięki czemu masz gwarancję,
że wszystkie odwołania będą miały należytą postać
% Jeżeli dysponujesz budżetem na promocję strony, warto pomyśleć o zakupie
wartościowych odnośników. Miejscem pomocnym w dokonywaniu takich
transakcji jest strona http://forum.optymalizacja.com.
Pora na to, aby dowiedzieć się, w jaki sposób sprawdzić liczbę stron odwołujących
się do Twojej strony. Również w tym przypadku do dyspozycji mamy specjalne
zapytanie, które w połączeniu z adresem strony wpisujemy na stronie wyszuki-
warki.
link:http://helion.pl
Na rysunku 6.9 widać wyniki, jakie Google pokazało dla powyższego zapytania.
Testowa strona posiada aż 3520 odnośników z innych witryn.
240
Pozycjonowanie i promocja strony
Rysunek 6.9. Przykład działania zapytania link:
W tym miejscu pragnę zwrócić Twoją uwagę na fakt, że odnośniki z innych wi-
tryn w połączeniu z dobrze zbudowaną stroną dają piorunujące wrażenie. Przy-
kładem takiej sytuacji może być podstrona mojego serwisu poświęcona książce
o Nero. Dla zapytania o treści nero pojawia się ona na pierwszej stronie wyników
rysunek 6.10. Nieskromnie pochwalę się tym, że dla tego słowa kluczowego
konkurencja jest bardzo duża i Google ma ok. 66 milionów wyników.
Na koniec pragnę napisać kilka słów o wskazniku PageRank, o którym wcześniej
wspominałem. Otóż wskaznik ten jest jednym z elementów działania wyszuki-
warki Google i na temat jego roli powstało wiele spekulacji. Ostatnio możemy
zauważyć, że wpływ PageRank na wyniki znacznie zmalał, ale mimo to wielu
webmasterów dba o to, aby był on jak najwyższy.
PageRank przybiera wartość z przedziału od 0 do 10. Nowa strona zaczyna swoje
życie ze wskaznikiem o wartości 0, a wraz ze wzrostem popularności PageRank
rośnie. Dobrze zoptymalizowana i popularna strona powinna mieć PageRank na
poziomie 5 lub 6. Wyższe wartości tego wskaznika uzyskują tylko duże i bardzo
popularne strony. Na przykład http://www.google.com ma PageRank o wartości 10.
Za przyrost wartości PageRank odpowiada duża ilość odsyłaczy prowadzących
do Twojej strony. Dlatego jeżeli będziesz stosować się do porad zamieszczonych
w niniejszym podrozdziale, masz szansę na to, że wskaznik ten zyska większą
wartość niż domyślne 0. Pamiętaj jednak, że wartość PageRank zmienia się sto-
sunkowo rzadko i na aktualizację trzeba czekać nawet kilka miesięcy.
241
ABC tworzenia stron WWW
Rysunek 6.10. Miejsce w pierwszej dziesiątce dla popularnego słowa kluczowego
Wartość wskaznika PageRank możesz sprawdzić na kilka sposobów:
% Strona http://www.optymalizacja.com/pagerank.php
% Wtyczka dla przeglądarki Mozilla Firefox o nazwie SearchStatus
http://www.quirk.biz/searchstatus.
242
Wyszukiwarka
Podobne podstrony:
ABC tworzenia stron WWWPHP i MySQL Tworzenie stron WWW Wydanie drugie Vademecum profesjonalisty phms2vTworzenie stron WWW w praktyce Wydanie IITworzenie stron WWW Ćwiczenia praktyczne Wydanie IIIinformatyka tworzenie stron www kurs wydanie iii radoslaw sokol ebookPHP i MySQL Tworzenie stron WWW Vademecum profesjonalisty Wydanie czwarte phmsv4więcej podobnych podstron