Sprawdzanie, jak strona wygląda na innej przeglądarce, w innym systemie operacyjnym czy nawet w innej rozdzielczości nigdy nie było trywialne. Stało się łatwiejsze dzięki wbudowanej w przeglądarkę Firefox funkcji pozwalającej na podgląd wyglądu strony w określonej rozdzielczości. Na przykład mobilnego wyglądu strony. Fachowa nazwa: responsive design view.
Nie zajmuję się frontendem, więc o sprawie dowiedziałem się przypadkiem. Funkcjonalność chyba nie była specjalnie nagłaśniana, w każdym razie umknęła mojej uwadze. Poza tym w obecnej, wygodnej formie dostępna jest od wersji Firefox 33.
Aby włączyć responsive design view należy wcisnąć ctrl-shift-m. Wyjście z trybu – przycisk X w lewym górnym rogu. Powinniśmy zobaczyć coś w stylu:
Źródło: https://developer.mozilla.org/en-US/docs/Tools/Responsive_Design_View
Dostępne są zdefiniowane ustawienia, ale można też definiować i zapisywać własne rozdzielczości (liczby są edytowalne, następnie enter). Można także rozszerzać okno przy pomocy łapania za krawędzie. Oczywiście nie jest to równoznaczne z przetestowaniem na innym systemie operacyjnym czy w innej przeglądarce, ale jako szybkie sprawdzenie na żywo wyglądu w mniejszej rozdzielczości – idealne i warto wiedzieć, że istnieje, zwłaszcza, gdy użytkownicy zgłaszają, że strona źle wygląda w określonej rozdzielczości. Mi się ta funkcja przeglądarki Firefox przydaje głównie do szybkiego sprawdzenia mobilnego wyglądu strony.
Więcej:
- Responsive Design View – pełny opis narzędzia (ang.)
- Responsive Web design – ogólnie o responsywnych stronach WWW (ang.)
G. Chrome ;o) ma to od dawna i też się chyba specjalnie nie chwalili (ale tu mogę być w błędzie, bo nie śledzę wieści z rynku ukierunkowanego na rozwiązania mobilne). Prawoklik, „Zbadaj element” i w oknie „narzędzi dla programistów” w górnym pasku po lewej obok ikony lupy jest ikona srajfona z opisem „Toggle device mode”. Wystarczy w nią kliknąć.
@Monter Dzięki za opis dla Chrome (ależ to schowali…). Wiem, że ma ono fajne developer tools, ale… nie korzystam z Chrome praktycznie. Z innych ciekawych – w Chrome są predefiniowane widoki dla popularniejszych mobilków.
Firefox pewnie też tylko najpewniej w postaci jakiejś wtyczki. Ale od pewnego czasu większość przydatnych rzeczy, podobnie jak w Chromie, została zintegrowana też dowiedziałem się przez przypadek, bo zdarza mi się z roztargnienia korzystać ze skrótów klawiszowych używanych w emulatorze terminala (ctrl+shift+c i ctrl+shift+v), które w nowym Firefoksie otwierają narzędzia programistyczne. 😉
Polecam chrome Camary jeśli ktoś używa Windowsa. I tak, od bardzo dawna działa w trybie deweloperskim, zwłaszcza jak podlaczymy androida (przeglądarka ma wbudowane narzędzia np adb)
Ja trochę z innej beczki- co ja paczę, „Księga z Kells”! Jeśli będziesz kiedyś w Dublinie postaraj się ją zobaczyć, robi wrażenie i ona, i cała ekspozycja, coś niewiarygodnego. Jest też film/bajka „Secret of Kells”, bardzo oryginalna.
🙂
@squirk Dzięki, że zwróciłaś uwagę. Dublin… chwilowo się nie zanosi, ale bajkę postaram się dorwać. Na wiki jest ładnie opisane i jedno, i drugie:
en.wikipedia.org/wiki/Book_of_Kells
en.wikipedia.org/wiki/The_Secret_of_Kells
Opisy nie oddaja uroku, naprawdę.
Co do samej księgi – początkowo byłam nieco zawiedziona czytając o tym, że nie jest wielkim manuskryptem – bo jest nieduża. Potem zdecydowałam się na spacer (Trinity College mam prawie w sąsiedztwie) i zobaczyłam całą wystawę, filmy o introligatorstwie, o tym, jak szyto Księgę, prezentacje minerałów z których pozyskiwano farby używane podczas tworzenia księgi, napisy na ścianach (Pangur Ban ma tam znaczące miejsce) i wsiąkłam na amen.
Film jest uroczy, nietypowy, bardzo polecam.
🙂
@squirk Domyślam się, że nie oddają. Bardziej o historii i co to w ogóle jest. TBH w ogóle nie zwróciłem uwagi jak wklejałem screenshota – ot, jakiś dywan przemknęło mi przez głowę (dobra dobra, widzę, że book, ale co ja poradzę na skojarzenia?). Jak będę w Dublinie, to nie omieszkam. Thx!
Da się to jakość obejść lub wyłączyć? Tak, aby strony ciągle działały w „pełnym” trybie? Bo wolę korzystać z przeglądarki na połowie ekranu, a część z nich włącza się w tym „mobilnym” trybie, a nie zawsze jest on lepszy na desktopie z mychą „zamiast” dotyku…
Ciągle chodzi mi o Firefoxa (oraz Waterfoxa).
@ch3mn3y Prawdopodobnie odpowiedź będzie standardowa, czyli „to zależy”. Niektóre strony mają wygląd określony w CSS i zależny od rozmiarów ekranu. Jeśli o to chodzi, to pomóc może któreś z rozszerzeń opisanych tu http://www.makeuseof.com/tag/3-firefox-plugins-test-website-resolutions/