› Tag › kody zewnętrzne › 2 wyników

Kody szpiegujące – optymalizacja strony

Ciągnąc dalej temat kodów wychodzących / kodów szpiegujących, nie można pominąć chyba najważniejszej kwestii czyli optymalizacji kodu.

Jeszcze jakiś czas temu, powiedzmy przed dwoma laty, projektowanie stron internetowych sprowadzało się jedynie do poprawności wizualnej, opcjonalnie standaryzacją kodu wg W3C, kilka dni spędzonych nad kursem HTML-a, podstawowe informacje o CSS, i własna strona internetowa nie stanowiła już większego problemu.

 

Jednak dziś, aby móc dopisać do swoich osiągnięć kolejną witrynę www, należy nico bardziej się wysilić, oprócz oprawy graficznej godnej XXI wieku, niebanalnych stylów CSS, fruwających bajerów JavaScript czy w końcu całych systemów CMS, musimy zadbać o to aby nasza strona była “dobrze zoptymalizowana” – przyjazna zarówno użytkownikowi jak i botom wyszukiwarek, tak aby użytkownik miał możliwość szybkiego i bezproblemowego dotarcia do strony.

 

Dziś skupimy się na powiązaniu optymalizacji strony z kodami zewnętrznymi.

Każdy kod wychodzący z naszej witryny to kolejny tzw “obiekt”, który przeglądarka musi pobrać, aby wyświetlić stronę użytkownikowi. W przypadku obiektów wewnętrznych, czyli: stylów CSS, kodów JS, obrazków, które są na serwerze razem ze stroną, przeglądarka pobiera je wszystkie hurtem, czyli w 1 sesji, co sprawia, że pobierają się dość szybko i bezproblemowo.

W przypadku obiektów wychodzących, przeglądarka jest zmuszona nawiązać całkiem nowe połączenie z serwerem, na którym dany obiekt się znajduje, pobrać go, dołączyć do strony i dopiero zabrać się za pobieranie dalszej części witryny. Jest to więc kolejne zbędne połączenie jakie wykonuje przeglądarka.

 

Kody szpiegujące – obiekty wychodzące, o tyle są niebezpieczne dla optymalizacji, że nigdy nie wiadomo ile dokładnie czasu będą się ładować.

Przykładów nie trzeba wcale długo szukać, wystarczy przeglądnąć kilka najpopularniejszych stron. Dość łatwo zauważymy, że jakaś strona ładuje się długo.. Jest to właśnie przyczyna kodów szpiegujących.

 

Podsumowując: im mniej wychodzących obiektów na naszej stronie, tym szybciej ona będzie się ładować naszym użytkownikom, oraz automatycznie tym większą popularność będzie miała nasza strona. Nie zapominajmy, że użytkownicy lubią szybkie strony!

 

Szybkość wczytywania strony – kody szpiegujące

Szybkość uruchamiania strony Szybkość uruchamiania strony

Tym razem skupimy się na kodach zewnętrznych, które tak chętnie i bez żadnych zastanowień umieszczamy na swojej stronie internetowej czy blogu.

Na początek definicja kody szpiegujące. Są to kody, które po umieszczeniu w kodzie strony, uruchamiają się wraz z wejściem każdego użytkownika na witrynę, wykonują określone operacje (pobierają wszystkie możliwe informacje o użytkowniku, przetwarzają je oraz wyrzucają jakiś rezultat swojej pracy w postaci obrazka z licznikiem odwiedzin, lub też działają całkowicie “w tle”).

Przykłady:

1. Najbardziej oczywistym przykłądem jest gigant Google, którego produkty: Google analytics, Google adsense, Google apps, są niezwykle chętnie aprobowane przez webmasterów.

2. Systemy statystyk internetowych: stat4u, stat24, itp.

3. Darmowe licnziki online, komponenty jako “iframe” (np. nowy kod playerka youtube), oraz wszelkiego rodzaju skrypty “javascript” .

4. Reklamy

 

Zalety?

Chyba oczywiste 😉 Szybki, ładny i przejrzysty panel do zarządzania wszystkimi witrynami oraz aktualny podgląd na liczbę użytkowników.. Zarabianie na reklamach.. Nowe usługi: poczta w domenie.. Można wymieniać i wymieniać…

 

Wady?

W tym artykule skupimy się na jednej z wielu wad posiadania kodów zewnętrznych – zmniejszenie wydajności witryny!

Każdy kod zewnętrzny (uruchamiany z zewnętrznego serwera) musi się uruchomić w przeglądarce użytkownika. Jest to o tyle ważne, bo czas wczytywania strony (od strony użytkownika, który odwiedza stronę/blog) wydłuża się dodatkowo o kolejne nadmiarowe części sekundy. Efekt tego jest następujący:

Użytkownik wchodzi na stronę i po załadowaniu się treści, które go najbardziej interesują, w jego pasku postępu uruchamiania danej strony, pojawiają się dziwne adresy, które czasami nawet kilka sekund uniemożliwiają prawidłowe przeglądanie witryny. Dopiero gdy wszystkie kody zewnętrzne się załadują, przeglądarka pozwala na wykonanie się załadowanego javascript, na co reakcja przeglądarki jest najczęściej zauważalna w postaci chwilowego “zacięcia sie”, po czym dopiero można przeglądać stronę www.

Od połowy roku 2011 największa wyszukiwarka internetowa – Google wprowadziła w swój algorytm promowanie stron “szybkich” czyli takich, których czas uruchamiania jest mniejszy od 2sekund (80% witryn). Zakładając, że przeciętny kod szpiegujący (reklama, statystyki odwiedzin) wczytują się w najlepszym przypadku około sekundy, już na samym starcie połowę dopuszczalnego limitu mamy z głowy.. Wystarczą skromne statystyki odwiedzin, kilka reklam i nasza strona wędruje do rankingu internetowych “zamulaczy”..

 

Jak się przed tym uchronić?

Wyjściem może być np. instalacja systemu statystyk ruchu na wewnętrznym serwerze, tak aby serwer przyjmujący ruch generował nam statystyki odwiedzin (chcąc nie chcąc i tak to robi 😉 więc kwestia jest tylko w dostępnie do tych treści). Kolejnym wartym przemyślenia faktem jest rezygnacja ze “Standardowych” reklam zaśmiecających witrynę i drażniących chyba wszystkich użytkowników, w skłonienie się w stronę niestandardowych form pozyskiwania kapitału, np. sms, konta VIP, płatne subskrypcje, promocja gadżetów reklamowych, czy coraz bardziej popularne “dotacje dla autora”. Zobacz jak zarabiać na stronie oraz jak reklamować stronę

 

W kolejnych artykułach będziemy omawiać wpływ kodów szpiegujących na kontrolę ruchu w sieci oraz cenzurowanie internetu za pomocą kodów szpiegujących!

Gorąco zachęcamy do subskrypcji bloga – RSS, oraz odwiedzin.

Kurs css

  • Kurs CSS dla niecierpliwych [cz 1/2]

    Co to jest CSS, po co go używać, jak go używać.. CSS - stylizowanie różnych elementów HTML, inaczej mówiąc: wizualizowanie/nadawanie odpowiedniego wyglądu strony www. Zaczynając kurs…

  • Kurs CSS dla niecierpliwych [cz 2/2]

    Kontynuacja przyspieszonego kursu dla niecierpliwych. Część 1/2 - Kurs CSS dla niecierpliwych 1/2 Zakładam, że znasz lub zapoznałeś/aś się już wstępnie z podstawami HTML, wiesz do czego…