Z tych dodatków do Chrome korzystam na co dzień, jestem pewien że znajdziecie dla nich zastosowanie.
Potrzebuję zrzutu ekranu całej strony, kawałka reklamy, elementu nawigacji… Full Page Screenshot
Po co mi to?
Począwszy od wskazania poprawek, aż po przekazywanie informacji klientowi czy po prostu do szybkiego podesłania komuś memów (mem z kotem). Robisz wycinek strony, lub zrzut jej całości, szybko opisujesz czego potrzebujesz i każda ze stron wie o czym rozmawia. Przy poprawkach możesz pisać, możesz opisywać ale najlepiej jak po prostu pokażesz.
Jak tego używać?
W bardzo prosty sposób, po zainstalowaniu wtyczki przy pasku adresu strony pojawia się jej ikona. Po kliknięciu widzisz to co na powyższym zrzucie (złapanym tą właśnie wtyczką), pierwszy przycisk zrzuca całą stronę (nawet z problematycznymi elementami iframe, o których nas poinformuje przy próbie wykonania zrzutu). „Capture Page Snippet” robi jedynie wycinek z danej strony.
Mam sporą listę adresów do przejrzenia, muszę skopiować sporo linków z Chrome-a… OpenList
Po co mi to?
Masz masę stron do sprawdzenia, blogów do otwarcia, danych do zassania/scrapeowania (o fajnych wtyczkach i narzędziach do scrapeowania danych zrobię osobny wpis) więc zamiast przeklikiwać się przez zakładki i z maniakalnym uporem żonglować pomiędzy „ctrl c” i „ctrl v” po prostu wklejasz je tutaj i otwierasz wszystkie naraz. W sytuacji w której masz już otwartą sporą ilość stron możesz bezproblemowo zadziałać w drugą stronę, skopiować ich całą listę.
Jak tego używać?
W banalnie prosty sposób, po prostu wklejasz wszystkie strony w formie listy, klikasz open… i modlisz się by Chrome nie wysadził pamięci Twojego komputera. W drugą stronę gdy masz już otwarte kilka zakładek po prostu otwierasz i kopiujesz zawartość.
Nad czym mógłbym popracować, co mogę przyspieszyć na stronie… Full Stack Otimization Live Test
Po co mi to?
Masz stronę która jest względnie zooptymalizowana, działa szybko, jednak są jeszcze elementy którym warto by się przyjrzeć, ta wtyczka właśnie może zadziałać jak drogowskaz propozycji. Dostajesz pełną listę, która oczywiście nie powinna być w całości brana pod uwagę ale można tu znaleźć elementy, którym warto się przyjrzeć na stronie internetowej.
Jak tego używać?
Po zainstalowaniu warto odznaczyć opcję która domyślnie „mieli” każdą otwartą stronę, bo może to powodować nieoczekiwane błędy i pętle na bardziej złożonych serwisach (jak np. facebook). Po zmianie tego ustawienia wtyczka zawsze spyta czy ma przeładować i w pełni przeanalizować aktywną zakładkę… i tyle.
Jaki CMS napędza stronę? Jakiej wersji php używa? Jakich fontów używa strona… WhatRuns
Po co mi to?
Bo potrzebujesz szybkiego rozeznania do oferty dla klienta, bo musisz bez dostępu do panelu dowiedzieć się co napędza daną stronę, co już zostało zintegrowane i wpięte w backendzie… lub po prostu nie chce Ci się grzebać w kodzie. W przejrzysty sposób dostajesz komplet informacji np. o wersji php strony, modułach analitycznych i wielu innych.
Jak tego używać?
Wystarczy zainstalować, włączyć samą wtyczkę i tyle. Przy wizycie na którejkolwiek ze stron klikasz w ikonę dodatku i tak jak na powyższym obrazku dostajesz zestawienie danych (na zrzucie zenbox.pl).
Chcę sprawdzić jak strona działa w różnych warunkach, w konkretnych rozdzielczościach… Web Developer
Po co mi to?
Bo nie wiesz czy wszystko działa tak jak powinno na różnych ekranach (możesz wyświetlić stronę na komplecie viewportów predefiniowanych przez użytkownika w opcjach), wprowadzić szybkie zmiany w css (bez mozolnego przeszukiwania całego kodu), bo chcesz wyłączyć ciasteczka, odpiąć chwilowo analitykę. Najbardziej rozbudowana z przedstawionych tu wtyczek, z największą ilością opcji i konfiguracji.
Jak tego używać?
W przypadku tej wtyczki każda zakładka to inne funkcje i naprawdę spora ilość możliwości. W „Disable” możemy wyłączyć na stronach JavaScript, powiadomienia, wtyczki lub popupy, w zakładce ciasteczek tak jak się domyślacie dostajecie trochę łatwiejszy dostęp do edytowania/usuwania/modyfikowania ciastek.
Zakładka „CSS” daje wam możliwość wygodnego edytowania styli ze wskazaniem konkretnych plików z podziałem na zakładki co pozawala na bardzo szybkie kopiuj/wklej i wrzucenie kodu do źródła. W kolejnej, tj. „Forms” możecie bawić się formularzami i wszystkimi danymi które podajemy z poziomu frontendu.
W opcjach obrazów możecie dowolnie usuwać, wyłączać, podmieniać zarówno atrybuty, alty jak i same obrazy. Kolejna to najczęściej przeze mnie używana zakładka, tj. „Information” w niej możemy np. pokazać źródło wszystkich linków na stronie, zobaczyć niewidoczne elementy, divy i inne.
Zakładka „Outline” to jak sama nazwa wskazuje zakładka w której możemy zobaczyć wszystkie bloki i elementy strony w formie ramek. Dalej mamy „Resize” czyli druga najczęściej przeze mnie używana opcja. To właśnie w niej możemy pobawić się z responsywnością strony internetowej. Zakładka „Tools” to narzędzia do np. walidacji linków, kodu css etc. Ostatnie to opcje samej wtyczki.
Personalny faworyt i bonus dla posiadaczy czytników Kindle, zacznijcie wysyłać sobie artykuły z internetu prosto na czytnik… Send to Kindle for Google Chrome
Po co mi to?
Bo widzisz w internecie masę artykułów na których przeczytanie nie masz w danej chwili czasu. Gdy chcesz coś zostawić sobie na sobotni poranek kiedy będziesz leżeć pod kołdrą z ciepłą kawą na stoliku.
Jak tego używać?
Instalujesz sam moduł, konfigurujesz (parujesz ze swoim kontem na amazonie) i to w zasadzie tyle, dalej już tylko klikasz preview & send żeby upewnić się że dana strona w miarę dobrze wygląda w wersji czysto tekstowej (czasem strona ma osobną funkcję generowania wersji do drukowania, warto skorzystać).