Sobota, 21 maja 2022

6 niezbędnych dodatków do Firefoksa dla projektantów

23 lutego 2022

Jeśli jesteś projektantem stron internetowych (i obeznanym z technologią użytkownikiem Internetu), nie ma żadnego usprawiedliwienia dla tego, że nie używasz Firefoksa jako swojej podstawowej przeglądarki. Jeśli jeszcze nie używasz Firefoksa, musisz go pobrać już teraz. Firefox nie tylko zapewnia najwyższą jakość przeglądania Internetu, ale także oferuje nieskończoną liczbę funkcji, których nie znajdziesz w żadnej innej przeglądarce internetowej.

Ponieważ osoby trzecie mogą tworzyć dodatki do Firefoksa, pobierając najlepsze dostępne dodatki, możesz przekształcić Firefoksa w narzędzie, które radykalnie zwiększy twoją produktywność i pozwoli ci zaoszczędzić niezliczoną ilość czasu.Ponieważ do pobrania jest tak wiele różnych dodatków, wybór tych, których powinieneś używać, może być nieco przytłaczający.

Dlatego postanowiłem wykonać całą pracę za ciebie i stworzyć listę sześciu najlepszych dodatków do Firefoksa dla projektantów stron internetowych.

Web Developer

Choć nazywa się Web Developer, ten dodatek do Firefoksa jest absolutnie nieoceniony dla projektantów stron internetowych. Jeśli miałbyś pobrać i zainstalować tylko jeden dodatek do Firefoksa, to właśnie ten bym Ci polecił. Powodem jest to, że dodatek ten oferuje wiele różnych użytecznych funkcji i można go zaklasyfikować jako Szwajcarski Scyzoryk wśród dodatków do Firefoksa.

Pierwszą cechą tego dodatku, która przyda się projektantom, jest menu CSS. Funkcje tego menu obejmują możliwość wyłączenia stylów, wyświetlania CSS według typu mediów, przeglądania CSS, przeglądania informacji o stylach, dodawania własnych arkuszy stylów użytkownika lub bezpośredniej edycji CSS.

Kolejną funkcją interesującą dla projektantów jest menu Obraz. Oprócz możliwości wyświetlania atrybutów ALT, wymiarów obrazów, rozmiarów plików obrazów i ścieżek do nich, można wyłączać obrazy, znajdować uszkodzone obrazy, obrysowywać obrazy, zastępować obrazy atrybutami ALT oraz korzystać z kilku dodatkowych funkcji.

Chociaż mógłbym poświęcić kilka stron wszystkim funkcjom, jakie oferuje ten dodatek, chciałbym tylko wspomnieć o kilku innych funkcjach, które projektanci stron internetowych uznają za szczególnie przydatne. Należy do nich możliwość obrysowywania różnych elementów (od ramek po elementy na poziomie bloków), edytowania kodu HTML i pokazywania ukrytych elementów.

Firebug

Podczas gdy Web Developer jest pierwszym dodatkiem, który poleciłbym każdemu projektantowi, Firebug plasuje się na drugim miejscu pod względem przydatności dla projektantów.

Firebug pozwalana natychmiastową edycję, usuwanie błędów i monitorowanie dowolnej strony internetowej. Firebug daje Ci pełną kontrolę nad CSS, HTML i JavaScript dowolnej strony, którą wybierzesz. Co najlepsze, każda wprowadzona zmiana jest wykonywana na żywo i natychmiastowo, dzięki czemu można szybko przetestować różne zmiany i natychmiast zobaczyć ich rezultaty.

Podobnie jak większość najlepszych dodatków dla Firefoksa, Firebug wykracza poza swoją podstawową funkcjonalność i oferuje mnóstwo opcji, które ułatwiają każdemu użytkownikowi całkowite dostosowanie korzystania z tego dodatku. Niektóre z dodatkowych funkcji i opcji oferowanych przez Firebug obejmują skróty klawiszowe, możliwość kontrolowania, jak i gdzie pojawia się obszar edycji Firebug, wizualne przewodniki do edycji CSS, analizę aktywności sieciowej i konfigurowalne rejestrowanie skryptów JavaScript.

Colorzilla

Jako projektant stron internetowych nigdy nie wiesz, kiedy znajdziesz inspirację podczas surfowania po Internecie. Na przykład, przeglądając stronę internetową, możesz natknąć się na kolor, który bardzo Ci się podoba.

Jeśli chcesz szybko i sprawnie znaleźć dokładną wartość HSV i RGB dla tego narzędzia, powinieneś zainstalować dodatek ColorZilla.

DodatekColorZilla zawiera kroplomierz online, dzięki któremu można łatwo uzyskać dokładną wartość danego koloru.Oprócz eyedroppera online, ColorZilla oferuje kilka dodatkowych funkcji, które przydadzą się większości projektantów stron internetowych, takich jak analizator kolorów DOM i przeglądarka palet online. Analizator kolorów DOM pozwala zlokalizować elementy na stronie, które odpowiadają danemu kolorowi, oraz znaleźć reguły CSS, które określają dany kolor, natomiast przeglądarka palet online umożliwia tworzenie zakładek i udostępnianie palet kolorów, które Ci się podobają.

FireShot

Choć Twój system operacyjny bez wątpienia ma wbudowaną funkcję przechwytywania ekranu, nie oznacza to, że domyślna funkcja przechwytywania ekranu ma wszystkie możliwości, których możesz potrzebować.

Na przykład, czy domyślna funkcja przechwytywania ekranu systemu operacyjnego może przechwycić fragmenty strony internetowej, które znajdują się poza oknem przeglądarki?

W większości przypadków odpowiedź na to pytanie będzie przecząca. Na szczęście istnieje dodatek do Firefoksa, który oferuje taką możliwość, a także wiele innych przydatnych funkcji.

FireShot to zaawansowany dodatek do Firefoksa służący do przechwytywania ekranu. Oprócz możliwości przechwytywania całej strony internetowej (nawet jeśli jej fragmenty nie są widoczne ze względu na ograniczenia okna przeglądarki), FireShot pozwala także na dodawanie adnotacji bezpośrednio do zrzutów ekranu.

Program FireShot udostępnia kilka opcji obsługi zrzutów ekranu. Można je nie tylko zapisywać w różnych formatach plików, ale także zapisywać na komputerze, wysyłać pocztą elektroniczną lub zapisywać na bezpłatnym serwerze hostingowym FireShot. Dzięki szerokiemu zakresowi funkcji dodatek ten zyskał ponad sto pięćdziesiąt tysięcy aktywnych użytkowników i okazał się nieoceniony dla projektantów stron internetowych i innych osób zawodowo zajmujących się Internetem.

Walidator CSS / Walidator HTML

Jako projektant chcesz mieć pewność, że cała twoja ciężka praca będzie łatwo dostępna dla odwiedzających i odpowiednio wyświetlana. Jednym z najprostszych sposobów na zapewnienie realizacji obu tych zadań jest walidacja całego kodu.

Chociaż są to dwa oddzielne dodatki, zarówno Walidator CSS, jak i Walidator HTML powinny być zainstalowane w przeglądarce każdego projektanta stron internetowych. Po zainstalowaniu dodatków Walidator CSS jest dostępny z menu Narzędzia, a Walidator HTML - z paska stanu Firefoksa.

Każdy z dodatków waliduje kod w oparciu o odpowiednie standardy W3C.Podczas gdy Walidator CSS po prostu przeprowadza standardową walidację kodu, Walidator HTML oferuje pewne dodatkowe funkcje.

Podczas używania Walidatora HTML można wybrać walidację bezpośrednio w przeglądarce (gdzie wszelkie błędy są wyświetlane jako ikona na pasku stanu), pokazywanie źródła z wyjaśnieniem błędów po walidacji lub walidację z proponowanymi rozwiązaniami błędów.

Zmiana rozmiaru okna przeglądarki

Dla kogoś, kto tworzy projekty dla Internetu, jednym z najbardziej frustrujących problemów, z jakimi niewątpliwie się stykasz, jest próba tworzenia projektów, które działają na ekranach o różnych rozmiarach.

Ponieważ nie wiesz, czy odwiedzający będzie oglądał Twoją pracę w rozdzielczości 640×480, 800×600, 1024×768, 1280×1024 czy 1600×1200, Twoim obowiązkiem jest tworzenie projektów, które działają we wszystkich tych rozdzielczościach.

Chociaż istnieje wiele sposobów wyświetlania swoich prac w różnych rozdzielczościach, przekonałem się, że najbardziej efektywnym sposobem realizacji tego zadania jest dodatek Browser Window Resizer. Po pobraniu i zainstalowaniu tego dodatku będziesz mógł natychmiast zmienić rozmiar okna przeglądarki na dowolny ze standardowych rozmiarów rozdzielczości wymienionych powyżej.

Pozwoli Ci to sprawdzić, czy Twój projekt będzie dobrze wyglądał dla odwiedzających, którzy nie korzystają z tej samej rozdzielczości co Ty.Najlepsze w tym dodatku jest to, że jeśli używasz go w połączeniu z innymi dodatkami z tej listy (zwłaszcza z Firebug), gdy zauważysz, że coś nie wyświetla się poprawnie, możesz natychmiast wprowadzić poprawki do swojego kodu i sprawdzić, czy to rozwiąże problem, a wszystko to bez opuszczania bieżącego okna przeglądarki.

Znasz jakieś inne dobre rozszerzenia dla projektantów? Nie krępuj się komentować i zostaw nam swoją opinię.