Skocz do zawartości

Kontrolowanie prezentacji stron WWW - Usuwanie reklam


Rekomendowane odpowiedzi

lie.png

 

 

All rights reserved.

Copyright © Dawid Suder, 2009 - 2011

 

Kontrolowanie prezentacji stron WWW

 

Internet to źródło informacji, to miejsce wymiany poglądów i wiedzy. Tutaj także można wiele zarobić. Niezliczona liczba sklepów, firm oferuje w sieci swoje produkty. Jak i w normalnym (czyli poza komputerem) świecie istnieją tutaj także reklamy. Mają one zachęcać użytkownika do zapoznania się z ofertą danej firmy/sklepu i zrobienia zakupów. Nie są one problemem, jeśli stanowią statyczne obrazkowe lub tekstowe bloki. Jednak najwięcej osób spojrzy na wielką jaskrawą planszę z migającym napisem (niestety właśnie takie bannery reklamowe powstają najczęściej). Spojrzy... najczęściej z odrazą.

 

Jeśli masz już totalnie dość reklam na stronach i chcesz się ich pozbyć — ten tekst jest dla Ciebie, przedstawię tutaj najważniejsze sposoby radzenia sobie z niechcianymi elementami stron internetowych.

 

Spis treści

Odnośnik do komentarza
Pomoc jest darmowa, ale proszę rozważ przekazanie dotacji na utrzymanie serwisu: klik.

Co to jest reklama?

 

Reklama (z łac. reclamo, reclamare) to bezosobowa, odpłatna i adresowana do masowego odbiorcy forma przekazywania informacji rynkowych, mająca okreśłonego nadawcę. Zazwyczaj ma na celu skłonienie do nabycia lub korzystania z określonych towarów czy usług, popierania określonych spraw lub idei. Powinna budzić pragnienie posiadania przedstawianego towaru, uświadamiać koniczność jego posiadania.

 

Reklama internetowa jest nieco odmienna od wersji tradycyjnej. Przede wszystkim może być interaktywna i automatycznie dostosowywać się do klienta (np. wyświetlanie w reklamie na portalach społecznościowych imienia odbiorcy). Ma trzy główne cele: budowanie świadomości istnienia produkty/marki, dążenie do zwiększenia sprzedaży oraz zachęcenie do odwiedzin (najczęściej powtarzanych) na stronie WWW producenta.

 

Reklamy internetowe możemy podzielić na:

  1. banner (ang. sztandar, transparent) — blok graficzny, najczęściej wykonany w technologii Flash lub statyczny (zapisany wtedy jako plik JPEG lub GIF). Jest najczęściej odnośnikiem do reklamowanej strony. Zwykle ma poniżej 500 pikseli szerokości.
  2. expand banner — banner, który rozwija się (ogólnie: zwiększa rozmiar) po najechaniu na niego.
  3. button (ang. przycisk) — mała forma bannera, wielkości zazwyczaj ok. 120 na 60 pikseli, po którego kliknięciu przenosimy się na stronę reklamodawcy.
  4. antypixel — kolejna odmiana bannera, przycisk o wielkości 80 na 15 pikseli z zastosowaną najczęściej czcionką Silkscreen.
  5. pop-up — wyskakujące okienko, które wyświetla się najczęściej po wejściu na stronę. Wykonywane najczęściej w technologii javascript i Flash. Bardzo denerwujące dla odbiorcy, dlatego wiele przeglądarek posiada wbudowaną funkcję blokowania wyskakujących okienek.
  6. pop-under — forma wyskakującego okienka, które wyświetla się pod oknem przeglądarki, widoczne najczęściej po jej zamknięciu. Również blokowane.
  7. skyscraper (ang. drapacz chmur) — odmiana bannera, pionowy blok reklamowy, zazwyczaj o wymiarach 120 na 600 pikseli.
  8. mailing — chyba najbardziej denerwujące reklamy — zazwyczaj zwykły spam, czyli wiadomości e-mailowe wychwalające produkt.
  9. brand mark — blok reklamowy, wyświetlany w najwyższej warstwie otwieranego dokumentu.
  10. blogvertising — reklama na blogu.
  11. keyword advertising (linki sponsorowane) — ogłoszenia, kojarzone ze słowami kluczowymi, wyświetlane na liście odsyłaczy w wyszukiwarkach internetowych.
  12. meta ad — baner reklamowy wyświetlany w wyszukiwarce, tematycznie związana z wyszukiwaną frazą.
  13. reklama kontekstowa — reklama tematycznie związana z przeglądaną przez użytkownika stroną czy wiadomością. Przykładem jest Google AdSense — tekstowe reklamy pokazywane na wielu stronach.
  14. billboard — powierzchnia, na której umieszczane są reklamy; podobna do bannera.
  15. mapvertising — reklama w postaci logo firmy, wyświetlana na mapie; po uaktywnieniu wyświetla podstawowe informacje o reklamowanym podmiocie.
  16. expand billboard — billboard, który rozwija się po najechaniu na niego kursorem.
  17. toplayer — animacja, wyświetlana na najwyższej, przezroczystej, warstwie strony.
  18. interstitial — pełnoekranowa animacja, wyświetlana przed pełnym załadowaniem strony internetowej; bardzo denerwująca.
  19. reklama pływająca — blok reklamowy, przemieszczający się nad właściwą treścią strony, zazwyczaj z przesuwaniem jej przez użytkownika.

Odnośnik do komentarza

Programy do blokowania reklam

 

Wszystkie przedstawione programy są darmowe.

 

Ad Muncher

 

Świetny programik blokujący reklamy w większości przeglądarek oraz Pando, SopCast, ICQ, Morpheus, Kazaa, PalTalk, iMesh, Bearshare, LimeWire, Yahoo! Music Jukebox, TVAnts i innych, jak zapewnia autor.

 

Strona domowa programu

 

DOWNLOAD

 

AdBlock Plus

 

Świetny dodatek automatycznie usuwający większość reklam. Umożliwia ręczne stosowanie filtrów: tworzenie reguł (usuwać) i wyjątków (nie usuwać). Polska instrukcja tworzenia filtrów jest dostępna TUTAJ. Funkcjonuje z następującymi przeglądarkami i programami: Mozilla Firefox, Mozilla Thunderbird, Mozilla Fennec, Arora, SeaMonkey, K-Meleon, Songbird, eMusic Remote, Prism. Program, jako chyba jedyny z darmowych, ukrywa linki sponsorowane w wyszukiwarkach.

 

Strona domowa programu

 

DOWNLOAD

 

AdBlock Plus for Google Chrome

 

Wersja powyższego rozszerzenia dla Google Chrome.

 

Strona domowa programu

 

DOWNLOAD

 

AdBlock IE

 

Wzorowany na AdBlocku przeznaczony dla IE 8 programik blokujący reklamy.

 

Strona domowa programu

 

DOWNLOAD

 

AdKiller Daemon

 

Aplikacja blokująca wyskakujące okienka w IE, Netscape i Operze.

 

Strona domowa programu padła.

 

DOWNLOAD

 

AdSTOP

 

Program do blokowania reklam w przeglądarkach i Gadu-Gadu.

 

Strona domowa programu

 

DOWNLOAD

 

AdSweep

 

Kolejny program, wzorowany na AdBlocku, służący do usuwania reklam. Działa z Google Chrome, Operą, Safari, Firefoxem.

 

Strona domowa programu i download

 

AKiller

 

Programik blokujący wyskakujące okienka, działa z większością przeglądarek.

 

Strona domowa programu

 

DOWNLOAD

 

IE AdBlock

 

Dodatek do Internet Explorer 6 i 7 blokujący reklamy, oparty na darmowym Adblock Plus.

 

Strona domowa programu

 

DOWNLOAD

 

IE7Pro

 

Wtyczka do Internet Explorer w wersjach 6 - 8 zawierająca wiele funkcji i dodatków, m. in. blokowanie reklam i flasha, gesty myszy, Greasemonkey. Dodatek przemyca reklamowy mechanizm OpenCandy, czego można się pozbyć poprzez uruchomienie instalatora z linii poleceń z parametrzem /NOCANDY.

 

Strona domowa programu

 

DOWNLOAD

 

Mute Flash

 

Wtyczka do Mozilli Firefox i pokrewnych mająca za zadanie wyciszenie filmików wykonanych w technologii Flash. Działa tylko pod XP.

 

DOWNLOAD

 

Opera AdBlock

 

Zestaw filtrów reklam dla Opery. Blokowanie odbywa się za pomocą pliku urlfilter.ini, który można samodzielnie edytować. W sieci są dostępne gotowe filtry blokujące, np. TUTAJ.

 

Opis na OperaWiki

 

Pop-down

 

Jeszcze jedna aplikacja do blokowania pop-up. Współpracuje z IE.

 

Strona domowa programu

 

DOWNLOAD

 

Popup Free

 

Kolejny programik dla IE przeznaczony do blokowania wyskakujących okienek.

 

Strona domowa programu

 

DOWNLOAD

 

Privoxy

 

Oprogramowanie serwera pośredniczącego dla protokołów HTTP i SSL. Umożliwia blokowanie reklam, ciasteczek, niechcianej zawartości, interntowego spyware, modyfikację nagłówków HTTP. Działa w systemach: Linux, Windows, Solaris, NetBSD, FreeBSD, OpenBSD, OS/2, Mac OS X, AmigaOS.

 

Strona domowa programu

 

DOWNLOAD

 

Proxomitron

 

Świetny programik do blokowania niechcianej zawartości.

 

Strona domowa programu

 

DOWNLOAD

Odnośnik do komentarza

Blokowanie serwerów z reklamami

 

Na wielu serwerach przechowywane są tylko materiały reklamowe. Są one często wykorzystywane przez firmy świadczące usługi reklamowe w sieci, a także prowadzące statystyki odwiedzin witryn, np. stat24.pl. Do skryptu zliczającego ilość odwiedzin (dla darmowych statystyk) dodane są bardzo często polecenia, których celem jest wyświetlanie reklam. Można je blokować przy pomocy pliku HOSTS. Więcej informacji TUTAJ.

Odnośnik do komentarza

Blokowanie za pomocą Kaskadowych arkuszy stylów

 

Pozostała jeszcze jedna bardzo ważna możliwość ingerencji w wygląd witryny internetowej — są nią arkusze stylów CSS. Dzięki nim możemy zaprojektować cudzą witrynę praktycznie od podstaw.

 

Ostatnio pojawiło się wiele materiałów, jak usunąć niektóre dodane na siłę funkcjonalności wielu witryn, zwłaszcza tzw. "śledzika" na portalu Nasza Klasa, którego tutaj usuniemy. Jednak prace te mają w większości dużą wadę, podają gotowe rozwiązanie, bez informowania użytkownika o działaniu hacka. Tutaj posuniemy się o krok dalej — prawda, że ciekawie by było precyzyjnie kontrolować zawartość strony wedle własnego uznania? Usuwać to, co uważamy za zbędne! A więc do dzieła.

 

Co to jest CSS?

 

Stosunkowo niedawno (czyli w latach 90-tych) powstała świetna metoda pozwalająca na oddzielenie zasad prezentacji od czystego tekstu strony, napisanego w HTML-u. Metoda ta to CSS — Kaskadowe arkusze stylów.

 

Technologia ta wprowadza dwie wielkie zmiany:

  • po pierwsze, nie trzeba formatować stron przy pomocy kodu HTML, i tak już przeciążonego,
  • po drugie, pozwala zwykłemu użytkownikowi dowolnie przekształcać czyjeś strony. Tym właśnie się tutaj zajmiemy.
By osiągnąć wprawę w "czyszczeniu" stron internetowych z niepotrzebnych naszym zdaniem elementów, musimy zapoznać się z przedstawioną w linku — KLIK — tabelką selektorów CSS...

 

...ale zaraz! Co to jest selektor. Arkusze stylów CSS składają się z definicji odnoszących się do właściwych im elementów strony.

 

selektor {

właściwość: wartość;

}

 

Tak wygląda podstawowy model jednej reguły stylu. Reguły dotyczące jednego selektora muszą znaleźć się pomiędzy nawiasami klamrowymi { i }. Każda para właściwość (za wyjątkiem ostatniej przed nawiasem zamykającym) - wartość musi kończyć się średnikiem ;. a po każdej nazwie właściwości występuje dwukropek :. Spacja po dwukropku nie jest wymagana, lecz wypływa pozytywnie na czytelność arkusza.

 

Definicja selektora, sposoby działania reguł zostały przedstawione dokładniej TUTAJ.

 

Przykładowo, by określić, że każdy akapit w dokumencie musi być wyświetlany czerwoną czcionką należy utworzyć regułę...

 

p {

color: red;

}

 

...a w celu pokolorowania tekstu na niebiesko każdego akapitu znajdującego się w bloku o identyfikatorze main_body stosujemy

 

#main_body p {

color: blue;

}

 

Reguły te, choć podobne, nie dają identycznych wyników. Pierwszy zapis dotyczy wszystkich akapitów na stronie, dla których nie zdefiniowano dokładniejszych reguł gdzie indziej. (więcej o kaskadowości CSS TUTAJ) Tak więc, jeśli zastosujemy obie reguły na raz, wszystkie akapity, za wyjątkiem tych znajdujących się w elemencie o identyfikatorze main_body, będą zawierały czerwony tekst.

 

Gdzie umieszczać reguły?

 

Podane formuły CSS można stosować w każdej przeglądarce dopuszczającej możliwość zastosowania własnego arkusza stylów lub edycję arkusza przeglądarki. Reguły zapisuje się w zwykłym pliku tekstowym jakaś_tam_nazwa.css Ważne jest rozszerzenie .css, którego nie może zabraknąć.

 

Internet Explorer

 

Uruchom przeglądarkę. Następnie przejdź do Narzędzia —> Opcje internetowe —> Dostępność (prawy dolny róg). W okienku zaptaszkuj "Formatuj dokumenty używając mojego arkusza stylów". Potem przeglądaj i podajemy utworzony wcześniej przez nas plik.

 

Opera

 

Odpal przeglądarkę, potem Narzędzia —> Preferencje —> Zaawansowane, klikamy "Zawartość", następnie "Opcje stylów". Na dole okienka kliknij Wybierz, wskaż plik ze stylami.

 

Firefox

 

W Firefoxie reguły można umieścić w dwóch miejscach:

 

Dla wszystkich profili

 

Ta metoda pozwala na utworzenie reguł CSS, które będą stosowane we wszystkich profilach przeglądarki.

 

Przejdź do katalogu, gdzie jest zainstalowany Firefox, potem res, znajdujdź plik html.css, który otwierz notatnikiem i dopisz na końcu stworzone reguły CSS. Tak wygląda u mnie ścieżka dostępu do katalogu: C:\Program Files\Mozilla Firefox\res

 

Dla jednego profilu

 

Jeżeli chcemy utworzyć reguły stosowane tylko w jednym profilu możemy wykorzystać do tego plik userContent.css. Jest to zwykły plik tekstowy znajdujący się w katalogu profilu przeglądarki Firefox. U każdego ścieżka dostępu do pliku wygląda inaczej. Oto moja:

 

C:\Users\DawidS28\AppData\Roaming\Mozilla\Firefox\Profiles\txhboewp.default\chrome — Vista i 7

 

C:\Documents and Settings\DawidS28\AppData\Mozilla\Firefox\Profiles\ks6nbcxb.default\chrome — XP i starsze.

 

Możemy tutaj wyróżnić kilka fragmentów:

  • C:\ — nasza partycja systemowa.
  • Users\ lub Documents and Settings\ — katalog użytkowników. W systemach Vista i 7 jest to C:\Users\, w XP i starszych — C:\Documents and Settings\.
  • DawidS28\ — folder naszych plików, ustawień, pulpitu itd. Przyjmuje nazwę taką, jak nasza nazwa usera.
  • AppData\ lub AppData\Roaming\ — folder danych aplikacji. Odpowiednio: dla XP oraz dla Visty i 7.
  • Mozilla\Firefox\Profiles\txhboewp.default\chrome — ścieżka dostępu do katalogu chrome w naszym profilu w przeglądarce. Nazwa profilu składa się z ośmiu losowych znaków, kropki i nazwy profilu; w profilu domyślnym nazwę zastępuje default.
Na szczęście, w praktycznym zastosowaniu jest to zdecydowanie łatwiejsze. Wszystko, co znajduje się do AppData (włącznie) możemy zastąpić zmienną środowiskową %AppData%. Wtedy ścieżka dostępu będzie wyglądać następująco:

 

%AppData%\Mozilla\Firefox\Profiles\txhboewp.default\chrome

 

Jeśli plik userContent.css nie znajduje się w wymienionej lokalizacji należy go utworzyć.

 

Safari

 

Kliknij koło zębate w prawym górnym rogu, Preferencje —> Zaawansowane, następnie opcja Arkusz stylów: "Nic nie jest zaznaczone" i zaznacz "Inne…", wskaż plik ze stylami.

 

Google Chrome

 

Ścieżka różna, w zależności od wersji systemu operacyjnego (patrz Mozilla Firefox):

 

C:\Users\DawidS28\AppData\Local\Google\Chrome\User Data\Default\User StyleSheets — Vista i 7

 

C:\Documents and Settings\DawidS28\AppData\Google\Chrome\User Data\Default\User StyleSheets — XP i starsze.

 

Reguły można umieszczać w pliku Custom.css — efekty są widoczne od razu po zapisaniu pliku, nie jest wymagane restartowanie przeglądarki, wystarczy odświeżyć stronę.

 

Więcej informacji o User CSS znajdziesz TUTAJ.

 

Przejdźmy do praktyki

 

Teraz możemy zająć się praktycznym zastosowaniem CSS. Jeśli jesteś zainteresowany tą technologią, polecam skorzystanie z darmowego kursu tworzenia stron internetowych. W sieci jest ich dostępnych bardzo wiele. Podam adresy dwóch przykładowych:

 

http://htmlhelp.shl.pl/

http://kurshtml.boo.pl/

 

Ale zajmijmy się wreszcie obiecaną ingerencją w strony WWW.

 

Większość obecnie dostępnych stron internetowych jest zbudowana przy wykorzystaniu wielu zagnieżdżonych w sobie pojemników, tzw. div-ów. Zazwyczaj każdemu takiemu elementowi jest nadany identyfikator (w HTML określa się go w atrybucie id). Dzięki tym nazwom możemy łatwo określać, którym fragmentem strony chcemy się zająć.

 

W celu wyłączenia tak znienawidzonego przez większość "śledzika" tworzymy kod

 

#sledzik_box {

display: none !important;

}

 

Zastosowany tutaj styl określa wyłączenia wyświetlania danego elementu (display: none;), w tym przypadku śledzika (element określa zapis #sledzik_box). Zapis !important określa regułę jako ważną i dlatego bezwzględnie zostanie ona zastosowana. Nie wiesz, co oznacza zastosowany tutaj krzyżyk przed nazwą elementu? Odsyłam do linka we fragmencie poświęconym selektorom.

 

Co dalej?

 

Masz zamiar pousuwać jeszcze więcej? Wystarczy wykorzystać do tego przedstawiony wyżej zapis, zmień jedynie selektor na odpowiadający wybranemu elementowi.

 

Świetnie, tylko skąd wziąć nazwy identyfikatorów elementów? Jest wiele możliwości. Najprostszą wydaje się szukanie div-ów w kodzie źródłowym strony, jednak jest to nudne i czasochłonne. Bardziej przyjaznym rozwiązaniem jest zainstalowanie specjalnej wtyczki, np. FireBug (dla Firefoxa), DragonFly (Opera), View Selection Source (Google Chrome) lub IE Developer Toolbar. Umożliwiają one przeglądanie struktury dokumentu z jednoczesnym oznaczeniem, gdzie dokładnie na stronie internetowej się on znajduje.

 

Na koniec chciałbym ostrzec przed pewnym dosyć częstym działaniem użytkowników. Jeśli stworzymy regułę, która będzie blokowała element o ID page będzie się on odnosił do każdego elementu o tym identyfikatorze, także na stronach, na których nie chcieliśmy nic zmieniać. Dlatego dobrym działaniem jest użycie wielu selektorów jednoznacznie informujących przeglądarkę, gdzie szukać danego obiektu. Zminimalizuje to możliwość nieplanowanych ingerencji w inne, niż "czyszczona", strony WWW.
Odnośnik do komentarza

Blokowanie elementów na wybranej stronie

 

Reguła @-moz-document

 

Przed chwilą pisałem, że przy pomocy arkusza CSS można blokować tylko elementy wszystkich witryn, bez możliwości dostosowywania arkusza do danej strony. To nie do końca prawda. Takie działanie umożliwia Kaskadowy arkusz stylów CSS w przeglądarce Mozilla Firefox (wersje 1,5+) z regułą @-moz-document.

 

Budowa reguły jest następująca...

 

@-moz-document

 

/* określenie adresu, do którego ma się odnosić dana reguła */

 

{

 

selektor {

właściwość: wartość;

właściwość: wartość;

}

 

}

 

Jako określenie adresu można wstawić jeden z trzech parametrów:

  • url(http://www.przyklad.pl/) — określa, że dana reguła ma się odnosić tylko do tego adresu; w tym przypadku oznacza to stronę główną przyklad.pl, ale tylko wtedy, gdy nie wpiszemy w przeglądarce przyklad.pl/index.html
  • url-prefix(http://www.przyklad.pl/przyklad/) — odnosi się do każdej strony, której URL zaczyna się od http://www.przyklad.pl/przyklad/; jeśli pominiemy przyklad/ reguła będzie działać dla strony głównej i każdej podstrony witryny przyklad.pl
  • domain(przyklad.pl) — dotyczy każdej strony w domenie przyklad.pl oraz wszystkich witryn, których adres kończy się na .przyklad.pl, np. pomoc.przyklad.pl
Budowa stylów wewnątrz reguły jest taka sama, jak w normalnych arkuszach CSS.

 

Przykładowo, jeśli chcielibyśmy się pozbyć paska z logo na każdej stronie serwisu, należy utworzyć regułę...

 

@-moz-document

 

url-prefix(http://www.fixitpc.pl/)

 

{

 

#branding {

display: none !important;

}

 

}

 

Niestety, podane wyżej metody działają tylko w Mozilli Firefox (kolejny argument za tym, by przesiąść się na Liska). Selektory URL są dostępne w specyfikacji CSS 3.0, ale implementacja tego rozwiązania w przeglądarkach jest na niskim poziomie. Więcej TUTAJ.

 

I teraz mała uwaga. Przy parametrze url oraz url-prefix adres strony http://www.przyklad.pl nie jest równoznaczny adresowi http://przyklad.pl. Tak więc reguła dla https://www.fixitpc.pl nie będzie działać, ponieważ pełny adres strony to http://www.fixitpc.pl.

 

Dodatki dla przeglądarek

 

URIid

 

W starszych wersjach przeglądarki Mozilla Firefox (starsze od 1.5) możliwe jest zastosowanie dodatku www.google.pl to...

 

body#www-google-pl {

background-color: #FF0000 !important;

}

 

Dodatek ten nie jest już rozwijany, co skutkuje jego niezgodnością z nowszymi wersjami przeglądarki (FF +1.5).

 

Stylish

 

Stylish to dodatek dla Mozilli Firefox i Google Chrome, umożliwiający blokowanie poszczególnych elementów na stronie WWW poprzez JavaScript (dla Firefoxa i Chrome) lub CSS (dla Firefoxa) — wykorzystywana jest regułka @-moz-document. Więcej informacji na stronie userscripts.org.

 

Remove It Permanently

 

RIP — banalnie proste rozszerzenie pod Firefoxa, które umożliwia blokowanie elementów z menu kontekstowego. Programik umożliwia podgląd działań w czasie rzeczywistym.

 

Personalized Web

 

Personalized Web — bardzo dobry dodatek dla Google Chrome do modyfikowania poszczególnych stron WWW.

 

Chrome Stylist

 

Google Stylist — ciekawe rozwiązanie dla przeglądarki giganta z Mountain View, uruchamiane z ikonki na pasku adresu. Zintegrowane z http://userstyles.org.

Odnośnik do komentarza

Blokowanie elementów — JavaScript

 

Wraz z powstaniem technologi LiveScript, przekształconej później JavaScript, i zaimplementowaniem jej w przeglądarkach internetowych umożliwione zostało ożywienie statycznych stron internetowych poprzez skrypty wykonywane po stronie klienta (kod PHP wykonuje się na serwerze). JS oferuje bardzo wiele możliwości, np. tworzenie systemów uwierzytelniania, aplikacji internetowych, formularzy, ingerencję w prezentację witryny i wiele innych... Jednym z najlepszych przykładów zastosowania JavaScriptu jest serwis Maps Google.

 

Zastosowanie poniżej opisanych metod kontrolowania prezentacji stron WWW wymaga oczywiście znajomości JavaScript. Poniżej podaję odnośniki do dwóch internetowych kursów tego języka:

 

http://www.poradnik-webmastera.com/kursy/javascript/

http://webmade.org/kursy-online/kurs-javascript.php

 

Google Chrome

 

Zyskująca ostatnio wysoką popularność darmowa przeglądarka Google Chrome umożliwia proste tworzenie dodatków do programu. Rozszerzenia można tworzyć przy wykorzystaniu technologii HTML, CSS i JavaScript. Pozwalają one m. in. na modyfikowanie stron WWW czy poszerzanie funkcjonalności przeglądarki.

 

Pełen opis tworzenia rozszerzeń (w języku angielskim) jest dostępny na oficjalnej stronie Google — KLIK.

 

Przeglądarka Google umożliwia stosowanie dodatku Stylish.

 

Mozilla Firefox

 

Najpopularniejsza w Polsce przeglądarka (49% użytkowników — stan na 27 VI 2010 r.) także umożliwia, w języku JavaScript, tworzenie skryptów użytkownika. Zapewnia to dodatek Greasemonkey. Pełen opis programu dostępny jest na stronie http://www.greasespot.net/.

 

Opera

 

Norweska przeglądarka udostępniła niedawno technologię User JavaScript pozwalającą na modyfikowanie prezentacji witryn, dodawanie do nich własnych elementów, zmianę i dezaktywowanie skryptów wykorzystywanych na stronach internetowych. Opera zapewnia także podstawową obsługę skryptów Greasemonkey.

 

Więcej informacji dostępnych jest na oficjalnej stronie Opery — KLIK. Gotowy skrypt przeznaczony do modyfikacji elementów na wybranych stronach jest dostępny TUTAJ.

 

Na naszym forum jest dostępna praca o UserJS autorstwa maggrega — KLIK

 

Internet Explorer

 

Do przeglądarki Microsoftu powstał dodatek Trixie oparty na Greasemonkey. Stosowanie skryptów użytkownika umożliwiją także wielofunkcyjny IE7Pro oraz Greasemonkey 4 IE.

Odnośnik do komentarza

Skrypty Greasemonkey

 

Greasemonkey to darmowe rozszerzenie dla przeglądarki Mozilla Firefox oparte na języku JavaScript. Pozwala ono na ingerencję w stronę internetową przez użytkownika i zmianę wyglądu, a także dodawanie lub usuwanie funkcji na tej stronie. Strona domowa dodatku znajduje się TUTAJ. Mechanizm, dzięki wielkiej popularności, został zaimplementowany także w Operze (natywna podstawowa obsługa), Internet Explorerze (dodatki: Trixie, IE7Pro, Greasemonkey 4 IE) i Google Chrome (natywna obsługa).

 

Skrypty możemy uruchamiać z lokalnego komputera z menu Plik —> Otwórz plik... oraz ze stron zawierających skrypty, np. http://userscripts.org/. Własne modyfikacje dodaje się z menu Narzędzia —> Greasemonkey —> Nowy skrypt. Z informacji podanych w wyświetlonym oknie dialogowym tworzony jest nagłówek z metadanymi skryptu.

 

gm_nowy_skrypt.png

 

Pole Nazwa zostaje zapisana w regule @name, Lokalizacja — w @namespace, przedostatnie i ostatnie pole tekstowe — odpowiednio w @include i @exclude.

 

Skrypty tworzymy według następującego schematu:

 

// ==UserScript==
// @name           Nazwa skryptu
// @description    Opis skryptu
// @include        Strona, na której ma działać skrypt, można stosować symbol *
// @exclude        Strona, na której ma NIE działać skrypt, można stosować symbol *
// @namespace      Strona ze skryptem
// @require        Pliki .js wymagane do działania skryptu
// @resource       Zasoby, np. adresy obrazków wymagane do działania skryptu 
// @homepage       Strona domowa autora skryptu  //
// @version        Wersja skryptu                //
// @author         Autor skryptu                 // nieoficjalne,
// @icon           Ikona skryptu                 // często
// @copyright      Prawa autorskie               // wykorzystywane
// @attribution    Współautorstwo                //
// @contributor    Podziękowania                 //
// ==/UserScript== 

/* Kod skryptu */

 

W sekcji metadanych, ograniczanej przez // ==UserScript== i // ==/UserScript== , wystarczy podać tylko regułę @include, reszta jest opcjonalna. Pełny opis bloku metadanych jest dostępny TUTAJ oraz TUTAJ.

 

W miejscu komentarza /* Kod skryptu */ należy wstawić skrypt w języku JavaScript. Często korzysta się z funkcji anonimowej:

 

// ==UserScript==
// @name          Przykładowy skrypt
// @description   To jest przykładowy skrypt
// @include       http://www.przyklad.pl/*
// ==/UserScript==

(function()
{
       // Tutaj coś się wykonuje.
})();

 

Przykładowy skrypt, służący do wyłączania focusu ustawionego na wyszukiwarkę na stronie Onetu, przedstawiony został poniżej:

 

// Copyright (c) 2011 fixitpc.pl
// This script is licensed under the MIT license.  See
// http://opensource.org/licenses/mit-license.php for more details.
// ==UserScript==
// @name          Onet Szukajka
// @homepage      https://www.fixitpc.pl
// @description   Wyłącza focus onetowej szukajki.
// @include       http://www.onet.pl/*
// ==/UserScript==

(function()
{
       var szukajka = document.getElementById("q1");
       szukajka.blur();
})();

 

Skrypt został dokładnie opisany TUTAJ.

 

Dokładny opis dodatku Greasemonkey jest dostępny na stronach:

http://github.com/Martii/greasemonkey/wiki/

http://wiki.greasespot.net/Main_Page

Odnośnik do komentarza
  • 1 miesiąc temu...

Tracking Protection

 

W przeglądarce Internet Explorer 9 Microsoft umieścił mechanizm umożliwiający proste i skuteczne blokowanie reklam przy pomocy Tracking Protection List. Są to listy reguł, które można samemu tworzyć i modyfikować lub pobrać gotowe.

 

Więcej o mechanizmie ochrony przed śledzeniem:

http://webhosting.pl/Internet.Explorer.9.Tracking.Protection.Microsoft.utrudni.zycie.reklamowego.biznesu

http://ie.microsoft.com/testdrive/Browser/TrackingProtectionLists/Default.html

http://blogs.msdn.com/b/ie/archive/2010/12/07/ie9-and-privacy-introducing-tracking-protection-v8.aspx

 

Reguły umieszczane są poprzez Narzędzia —> Ochrona przed śledzeniem.

 

Gotowe listy TPL można znaleźć między innymi:

Fanboy Adblock List for Internet Explorer 9

EasyList (oparte na Adblock Plus)

Internet Explorer Gallery Tracking Protection Lists

Odnośnik do komentarza
  • 6 miesięcy temu...

Blokowanie skryptów uniemożliwiających przeglądanie strony

 

Od kilku lat temat zablokowania użytkownikom wyłączającym reklamy dostępu do stron WWW wywołuje duże kontrowersje. Powstało wiele skryptów mających na celu uniemożliwienie korzystania z danej strony osobom, które używają programów blokujących niechcianą zawartość reklamową. Oczywiście, możemy to obejść. Metod jest kilka.

 

Pierwsza z nich, najbardziej oczywista, to wykorzystanie programu blokującego niechcianą zawartość (np. AdBlock Plus) do zablokowania skryptów odpowiedzialnych za wykrywanie blokad użytkownika. Wymaga to znalezienia problematycznej zawartości i nałożenie na nią filtru. Strona powinna się wtedy normalnie uruchomić. Opis stosowania filtrów Adblock Plus jest dostępny TUTAJ. Rozwiązanie to — dla użytkownika nieznającego JavaScript — może być problematyczne: proponuję wtedy, metodą prób i błędów, blokowanie poszczególnych skryptów na danej stronie, aż do znalezienia właściwego.

 

adblock.png

 

Tworzenie filtrów przy pomocy programu AdBlock Plus. Przedstawione na zdjęciu filtry są przykładem — elementy te nie stanowią reklam.

 

Drugi sposób to zastosowanie programu przeznaczonego do blokowania skryptów na stronach WWW, chociażby świetnego dodatku NoScript dla Mozilli Firefox. Aplikacja ta ma możliwość blokowania wszystkich lub wybranych skryptów na dowolnie dobranych witrynach. Szczegółowy opis NoScript jest dostępny TUTAJ.

 

Niekiedy zdarza się jednak, że skrypt ma na celu rozpoznanie nie programu blokującego reklamy czy ustawień z pliku HOSTS, a samą przeglądarkę użytkownika. Niedawno szerokim echem odbiła się w sieci sprawa Danny'ego Carltona, który w ramach protestu przeciwko rozszerzeniu AdBlock Plus zablokował wszystkim użytkownikom Firefoksa dostęp do swojego bloga, dostępnego pod adresem http://jacklewis.net (proszę traktować to jako antyreklamę). Wejście z Mozilli Firefox na w/w stronę skutkuje automatycznym przekierowaniem do serwisu "Yahoo!". Zablokowanie wszystkich skryptów na stronie doprowadzi do wyświetlenia komunikatu "Strona do poprawnego działania wymaga JavaScript". Problematyczną instrukcję (w tym przypadku jest to http://jacklewis.net/weblog/functions_a.js) można oczywiście wyłączyć przy pomocy AdBlock Plus, można też skorzystać z rozszerzenia IE Tab (do pobrania STĄD) dla Firefoxa, które powoduje uruchomienie strony przy pomocy silnika renderującego Trident, wykorzystywanego m. in. w przeglądarce Internet Explorer. Skrypt zidentyfikuje wtedy przeglądarkę jako IE i umożliwi dostęp do zawartości witryny.

 

Metod na obejście blokad jest wiele: można wymienić tutaj zmianę podawanego identyfikatora przeglądarki Mozilla Firefox, opisaną dokładniej TUTAJ (parametr general.useragent.override).

 

Obszerny materiał mojego autorstwa o ID przeglądarek jest dostępny na forum: KLIK.
Odnośnik do komentarza
  • 5 miesięcy temu...

Kilka zdjęć na zakończenie

Jeśli po przeczytaniu tego tekstu masz wątpliwości, czy warto usuwać reklamy, spójrz na zdjęcia poniżej. Oto efekty działania AdBlock Plus w Firefox 3.6.3 i wpisów MVPS Hosts File. Po lewej stronie znajduje się nienaruszona witryna, obok — „wyczyszczona” strona.

Na początek „koledzy po fachu” — IDG.



idgbefore.jpg idgafter.jpg

...i jeszcze CHIP z naszej branży, który ostatnio nieco przedobrzył
 

chipbefore.jpg chipafter.jpg

Niestety, nie widać reklam w „pełnym wdzięku”, gdyż przez pewien czas wyświetlał się jeszcze denerwujący pływający filmik, powiększający się po najechaniu.

Ostatnia gazeta.pl
 

gazetabefore.jpg gazetaafter.jpg

Widać różnicę?

Odnośnik do komentarza
  • Ostatnio przeglądający   0 użytkowników

    • Brak zarejestrowanych użytkowników przeglądających tę stronę.
×
×
  • Dodaj nową pozycję...