sobota, 31 grudnia 2011

Błędy indeksowania .

Niech ten post będzie przestrogą dla wszystkich osób , które nie do końca przemyślały budowę szkieletu swojej strony przed wrzuceniem jej do sieci . Omówię problem na własnym przykładzie . 

Wykonałem sobie stronkę z której można pobrać darmowe tło do tworzenia stron www . Aby ułatwić projektantom wybór , do każdego obrazka wykonałem osobną stronę zawierającą prezentację tła wykonanego z konkretnego obrazka . O tym , że setki takich obrazków oznaczają setki podstron prezentujących wykonane z nich tło pomyślałem zbyt późno , gdy Google już dawno zaindeksowało mi stronkę . Postanowiłem przerobić jej szkielet i pogrupować  owe podstrony w katalogach . W ten oto sposób podstrona o adresie tlowww.pl/czarne_tlo.html zamieniła się w podstronę o adresie tlowww.pl/grafika_1/czarne_tlo.html . Problem polegał na tym , że Google zaindeksowało obydwie podstrony , lecz pierwszej już nie znalazło i zamieściło jej adres w błędach indeksowania .

 Nie popełnij tego błędu . Zanim w ogóle zaczniesz projektować stronę www , zastanów się , co dokładnie chcesz na niej zamieścić i jak ma wyglądać jej szkielet . Jest to bardzo ważne , gdyż oszczędzi Ci nie tylko problemów z indeksowaniem , ale także z przerabianiem istniejącej treści .

piątek, 30 grudnia 2011

Dodawanie do katalogów .

Dodawanie stron do katalogów , to czynność , której nie zaniedbuje chyba żaden projektant - pozycjoner . Czynność tą zaleca nawet Google i zaleca traktować ją jako wstęp pozycjonowania . Z jednej strony  jest to łatwo dostępne źródło linków , z drugiej jednak znaczna część wpisów zostaje odrzucana . Aby tego uniknąć , należy stosować się do kilku zasad :

                  Należy czytać regulamin . Regulaminy większości katalogów są prawie identyczne . W tym przypadku jednak "prawie" robi wielką różnicę . Należy bacznie zwrócić uwagę na ilość znaków wymaganych w poszczególnych częściach opisu , oraz na uwagi dotyczące oryginalności opisu ( niektórzy moderatorzy wymagają oryginalnych opisów , a inni zadowalają się wpisami kopiowanymi z notatnika ) .

                  Wybór odpowiedniej kategorii i podkategorii . Jest to warunek konieczny podczas dodawania stron do katalogów . Złego wyboru kategorii nie nadrobi najlepszy nawet opis .
                  Odpowiedni tytuł . Wszyscy wiedzą o tym , że treść tytułu jest zarazem treścią linku prowadzącego z katalogu do naszej strony , dlatego zamieszczają tam zlepki słów kluczowych . Najlepiej , jeśli treść tytułu opisu jest jednocześnie treścią tytułu strony .

 Tak w wielkim skrócie prezentują się najczęściej popełniane błędy podczas dodawania stron do katalogów . Staraj się ich unikać a czas poświęcony na dodawanie nie będzie czasem straconym .  

niedziela, 30 października 2011

Obramowanie elementu .

W tym poście postanowiłem omówić wstawianie różnego rodzaju obramowań przy użyciu stylów . 
Obramowanie to można stosować do różnego rodzaju elementów , takich jak : obrazki , nagłówki , akapity , itp.
                         --- niezbędne informacje - wstawianie stylów---
1. Styl obramowania :
selektor{
border-style: jakiś styl ;
}
2. Styl górnego obramowania :
selektor{
border-top-style: jakiś styl ;
}
3. Styl dolnego obramowania :
selektor{
border-bottom-style: jakiś styl ;
}
Styl lewego obramowania:
selektor{
border-left-style: jakiś styl ;
}
Styl prawego obramowania:
selektor{
border-right-style: jakiś styl ;
}
Zamiast " jakiś styl " należy wpisać :
- solid - linia ciągła ,
- double - linia podwójna ,
- dashed - linia kreskowana ,
- groove - linia mająca postać wyżłobionego rowka ,
- ridge - linia mająca postać wypukłego grzbietu ,
- dotted - linia kropkowana ,
- inset - ramka ,
- outset - przycisk.
Wszystkie te wartości można ze sobą mieszać , co spowoduje uzyskanie ciekawych i oryginalnych obramowań .
                                                 Szerokość obramowania . 
Budowa cechy tego obramowania jest bardzo podobna do cech budowy stylu obramowania . Wystarczy jedynie zamiast " style " wstawić " width " , np:
selektor{
border-width: watrość ;
} .
Identycznie jak w przypadku wyżej opisanych stylów obramowania możemy określić jego szerokość osobno dla góry , dołu , lewej i prawej krawędzi z osobna ( top , bottom , left , right )
Jako wartość należy podać :
- thin - cienkie obramowanie ,
- medium - średnie obramowanie ,
- thick - grube obramowanie ,
- można też podać konkretną wartość , np: 7px .
Podobnie też jak w przypadku stylów obramowania , można stosować atrybuty mieszane jego szerokości , co oznacza , że można stosować różne grubości dla różnych części obramowania  .
Kolor obramowania .
Jeśli zrozumiałeś już zasadę formatowania stylów na podstawie podanych wyżej przykładów , to z określaniem koloru obramowania również nie będziesz mieć problemów . 
selektor{
border-color: wartość ;
}.
Podobnie jak w przypadku wyżej wymienionych przykładów można określić osobno kolory dla wszystkich krawędzi obramowania . Jako " wartość " należy podać nazwę koloru w języku angielskim , lub podać jego kod .
Zaokrąglenie .
selektor{
border-radius: wartość ;
}
Jeśli np. chcemy zaokrąglić prawą górną krawędź obramowania , to wówczas stosujemy następujący zapis:
selektor{
border-top-right-radius: wartość ;
}
Na tej samej zasadzie możemy zaokrąglić pozostałe krawędzie .
Jako " wartość " podajemy promień zaokrąglenia w pikselach ( np: 10px ) .
 

niedziela, 16 października 2011

Serwer darmowy , czy płatny ?

Wybór serwera , to niezwykle ważna decyzja , która może zaważyć na losie naszego projektu . W internecie temat ten jest traktowany ogólnikowo . Najczęściej spotykane opinie są takie , że płatne serwery są OK , a darmowe są darmowe są " be " . Na pierwszy rzut oka opinia ta jest jak najbardziej prawidłowa , jednak temat ten zasługuje na głębszą analizę .  Jeśli chcesz wiedzieć jaki serwer wybrać , to najpierw określ cel powstania strony www .

 " Darmowe serwery " . Publikowanie strony internetowej na darmowym serwerze to nie lada wyzwanie . Serwery te są najczęściej mocno przeładowane (co źle wpływa na czas otwierania strony), a zapoznanie się z treścią strony www jest mocno utrudnione poprzez nieustannie pojawiające się reklamy . Jakby tego było mało , to nikt nam nie gwarantuje , że nasza strona nie zniknie nagle razem z całym kontem .
 Mimo wszystko serwery te mają swoje zastosowanie . Można na nich publikować strony , które mają za zadanie dostarczyć linki przydatne podczas pozycjonowania (pierwszy etap budowy zaplecza) . UWAGA ! Z większości darmowych serwerów nie wolno linkować do innych serwerów , co uniemożliwia budowę zaplecza .

 " Tanie serwery " . Sam nawet nie wiem ile ich jest . Za naprawdę niewielkie pieniądze można wykupić serwer i domenę " pl " , a nasza strona będzie wolna od systemowych reklam . Możemy również wykorzystać je do budowy zaplecza pozycjonującego nasz główny serwis , można też umieścić na nich naszą główną stronę ( jeśli nie pozycjonujemy jej na bardzo konkurencyjną frazę kluczową ) .

 " Mercedesy wśród serwerów " . Przepraszam za to określenie , lecz w pełni oddaje ono ich charakter . Najbardziej popularne w tym segmencie są " home.pl" i "nazwa.pl" . Są one baaardzo drogie , lecz wysokiej cenie towarzyszy równie wysoka jakość usług . Poza tym są one wartościowe dla Google , co ułatwia pozycjonowanie .

 Podsumowanie tego posta jest następujące : darmowe serwery nadają się tylko na kiepskiej jakości zaplecze , tanie są dobre na zaplecze lub stronę www pozycjonowaną np. na frazę " usługi transportowe Tarnów " , a jeśli chcesz wypozycjonować stronę na frazę " kredyt przez internet " i mieć serwer zapewniający wysoką jakość usług , to wybierz jeden z " mercedesów " . 

poniedziałek, 3 października 2011

Program Word , a może notatnik - ostrzeżenie .

Niech ten post będzie przestrogą dla wszystkich totalnie początkujących webmasterów , którzy dopiero przymierzają się do stworzenia swojej pierwszej strony www . Jeśli jesteś taką osobą , to masz sporo szczęścia że tu trafiłeś , gdyż - jeśli posłuchasz moich rad - pozwoli Ci to zaoszczędzić sporo czasu .
Na kursie tworzenia stron www zakupionym wraz z jakimś czasopismem znalazłem informacje , które sprawiły , że moja droga do zgłębienia tajników związanych z projektowaniem stron internetowych stała się baaardzo okrężna . Jakie to były informacje ? - przekonajcie się sami :

Jedną z metod na wykonanie strony internetowej jest wykonanie jej w programie Word .
Teza jak najbardziej prawdziwa - co więcej nie trzeba uczyć się żadnych języków projektowania -, jednak ma bardzo poważne wady . Po pierwsze Microsoft wprowadził własny system kodowania czcionki , co sprawia , że właściciele komputerów wyposażonych w inne systemy operacyjne , zamiast polskich liter typu "ą" , czy "ż" , zobaczą jakieś hieroglify . Po drugie strony www wykonane w ten sposób są obarczone ciężkim kodowaniem , co znacznie wydłuża czas ich ładowania . Po trzecie kończąc prace nad stroną , należy ją zapisać jako " strona sieci Web przefiltrowana " . Zabieg ten ma na celu ograniczyć pojemność strony i niestety w znaczący sposób wpływa na jej wygląd , o czym jesteśmy informowani poprzez systemowy komunikat . Żaden jednak komunikat nie jest w stanie przygotować nas na to , jak strasznie zostanie zmasakrowana nasza grafika .

 Do wykonania strony www wystarczy notatnik . Tego też próbowałem i stanowczo odradzam . W notatniku wszystko wygląda tak samo . Bez względu na to czy jest to tag czy fragment tekstu , dla oka ludzkiego wygląda to tak samo . Wszystko wygląda tak samo , a przecież czasami wystarczy brak jednej z liter w sekcji head , aby nasza strona internetowa w ogóle się nie wyświetliła .
Jeśli ktoś się uprze może próbować tego typu zabiegów . Trzeba tylko pamiętać o tym , aby po wpisaniu każdego tagu sprawdzać efekty swojej pracy . Trzeba też bezwzględnie pamiętać o tym , aby zainstalować na swoim komputerze klawiaturę iso-8859-2 . Sama deklaracja w sekcji head nie wystarczy . Aby była dobrze wyświetlona polska czcionka , musisz to zainstalować .
Zupełnie inaczej sprawa wygląda z edytorami tekstu . Wyróżniają one tagi innym kolorem , oraz "domykają" je automatycznie .  W sieci jest dostępnych wiele darmowych edytorów , jednak są one przestarzałe i nie reagują na wpisywanie zdeprecjonowanych znaczników . O co chodzi - już wyjaśniam . O ile w HTML dopuszczalne było formatowanie tekstu i grafiki wewnątrz kodu , o tyle w XHTML jest to niemożliwe i trzeba korzystać ze stylów , w związku z czym część tagów takich jak "font" , czy "align" została zdeprecjonowana . Oznacza to , że na razie wyszukiwarki je odczytują , ale niedługo przestaną zwracać na nie uwagę . Poza tym darmowe edytory są najczęściej w języku angielskim i trudno do nich dostać spolszczenie .
Inaczej sprawa wygląda z płatnymi edytorami . Wśród nich zdecydowanie prym wiedzie Pajączek , którego i ja używam . Jest on bardzo intuicyjny w obsłudze , przekreśla zdeprecjonowane znaczniki kodu HTML , po wpisaniu znaczników podpowiada jakie atrybuty można do nich użyć , a poza tym ma mocno rozbudowany system pomocy , oraz zawiera w sobie kursy projektowania stron www we wszystkich możliwych językach .

 

sobota, 24 września 2011

Zewnętrzny arkusz stylów .

Najczęściej stosowanym przez webmasterów i najbardziej lubianym przez wyszukiwarki ( mam na myśli pozycjonowanie ) sposobem na wykonanie strony internetowej jest połączenie XHTML i CSS ( kaskadowe arkusze stylów ) . Webmasterzy lubią to połączenie dlatego , że w znaczący sposób ułatwia i przyśpiesza ono formatowanie zawartości strony www , a wyszukiwarki lubią go za to , że ogranicza pojemność strony internetowej , przez co ich roboty szybciej się z nimi zapoznają .  O ile w języku HTML występowały jeszcze tagi formatujące stronę ( np: font-size ) , o tyle w XHTML całość formatowania została przeniesiona na style.

Wstawianie stylów .
Style osadzane w stronie internetowej w sekcji body :
Styl lokalny , np: <selektor style="cecha: wartość ; cecha2: wartość ;/>  
Rozciąganie stylów - stosuje się tu element <span style="............"></span> . Tagiem span możemy objąć kilka elementów znajdujących się w jednej linii ( np: zmienić czcionkę kilku wyrazów ) . Element ten świetnie nadaje się do wstawiania stylów .  
Element blokowy - <div style="..............></div> . Element sen ma wiele wspólnego z elementem span , lecz w odróżnieniu od niego obejmuje większy fragment dokumentu i może zawierać w sobie także inne bloki .
Wewnętrzny arkusz stylów . 
<style type="text/css">
/* <![CDATA[ */
selektor { cecha: wartość; cecha2: wartość2... }
selektor2 { cecha: wartość; cecha2: wartość2... }
(...)
/* ]]> */
</style>
 Arkusz ren jest osadzany w sekcji head dokumentu . Należy go stosować wtedy , gdy na stronie www wielokrotnie występują elementy , które chcemy formatować ( np: nagłówki , czy akapity ) .
 Zewnętrzny arkusz stylów .
<link rel="Stylesheet" type="text/css" href="nazwa_arkusza.css" /> 
Zewnętrzny arkusz to największa zaleta stylów . Pozwala on na formatowanie przy użyciu jednego dokumentu nieograniczonej liczby podstron naszego serwisu . Wyobraź sobie stronę internetową składającą się z kilkudziesięciu podstron . O ile większą pojemność miałaby ona , gdyby trzeba było formatować każdą podstronę z osobna ? Właśnie dlatego jest to najczęściej stosowane rozwiązanie .

poniedziałek, 19 września 2011

Problemy ze wstawieniem grafiki na stronę .

Gdy po raz pierwszy usiłowałem wstawić obrazek na swoją stronę internetową , wpisałem w pajączku kod , który znalazłem w zakupionym przeze mnie kursie HTML . Wyglądał on następująco:  <img src="nazwa obrazka . rozszerzenie ( np: jpg )" alt=" tekst zastępczy "/> .
" Nic prostszego " - pomyślałem - i po wpisaniu go w edytor natychmiast usiłowałem sprawdzić co z tego wyszło . Ku mojemu zdziwieniu na ekranie komputera pojawił się tylko tekst zastępczy . 
Myśląc , że podczas wykonywania zapisu popełniłem jakiś błąd , wielokrotnie sprawdziłem każdą literę kodu i nic . Wszystko się zgadzało , a obrazka jak nie było tak nie ma . Próbowałem także znaleźć rozwiązanie tego problemu w internecie , jednak na wszystkich blogach i forach znajdowałem dokładnie ten sam zapis .
Dopiero po jakimś czasie udało mi się ustalić , że dzieje się tak dlatego , że kod strony internetowej jest zapisany w innym katalogu niż obrazek i aby przeglądarka mogla ów obrazek odnaleźć , należy zrobić ścieżkę dostępu .
Najczęściej bywa tak , że kod strony zapisany jest  w katalogu " Dokumenty " , a grafika w katalogu " Obrazy " . Jeśli jest tak u Ciebie . to wpisz kod z następującą ścieżką :
 <img src="../pictures/obrazek.jpg" alt="tekst zastępczy"/>
Musisz wiedzieć o jeszcze jednej ważnej rzeczy . Podczas publikowania strony internetowej w sieci , zamieszcza się zarówno kod jak i grafikę w jednym katalogu . Fakt ten sprawia , że zaznaczona na zielono ścieżka ma swoje zastosowanie jedynie na Twoim komputerze . Po przetestowaniu działania strony , tuż przed jej opublikowaniem , należy ją bezwzględnie usunąć .
Oto inne przykłady ścieżek :
-jeśli nasz kod ( strona www) i obrazek znajdują się w jednym katalogu , lecz obrazek jest zamieszczony w jakimś podkatalogu :
 katalog/obrazek.jpg ,
 - sytuacja odwrotna w stosunku do poprzedniej - obrazek jest w katalogu głównym , a strona w podkatalogu :
../obrazek.jpg.
Mam nadzieję , że zawarte tu informacje pomogą Ci rozwiązać Twój problem . Jeśli nie , to opisz mi go w komentarzu , a na pewno coś wymyślimy .

niedziela, 18 września 2011

Cel powstania tego bloga .

Witam serdecznie .
Mam na imię Tomek , mam 27 lat , od dłuższego czasu interesuję się tworzeniem stron internetowych i podobnie jak zdecydowana większość osób która się tym zajmuje nie jestem profesjonalnym informatykiem . Fakt ten sprawił , że z wieloma zagadnieniami związanymi z projektowaniem stron www miałem kolosalne problemy , a moja droga prowadząca do opanowania tego tematu była bardzo trudna i wyboista .
To właśnie z myślą o ludziach takich jak ja powstał ten blog .
Jeśli zatem jesteś osobą która dopiero rozpoczyna swoją przygodę z projektowaniem stron internetowych , to koniecznie dodaj adres tej strony www do swoich zakładek , gdyż zawarte tu informacje w znaczący sposób przyczynią się do skrócenia twojej męki związanej z opanowaniem tej na pozór łatwej sztuki ( z tą męką to trochę przesadziłem he he he ) .
Blog  ten będzie regularnie uzupełniany , dlatego zachęcam Cię , abyś od czasu do czasu w wolnej chwili zapoznał(a) się z jego treścią , a na pewno znajdziesz tu interesujące Cię informacje .