7 niezbędnych rozszerzeń Chrome dla projektantów stron internetowych

Reklama

Jako projektant stron internetowych jakie oprogramowanie absolutnie musisz mieć na swoim komputerze? Możliwe, że to Photoshop i Illustrator. I choć są to podstawowe elementy procesu projektowania, istnieją mniejsze narzędzia, których prawdopodobnie nie potrzebujesz.

Najlepsze jest to, że nie musisz ich nawet pobierać - po prostu zainstaluj te rozszerzenia Chrome i gotowe. Od rozpoznawania czcionek na stronach po mierzenie odległości między elementami internetowymi - te rozszerzenia Chrome do projektowania stron internetowych ułatwią Ci życie.

1. Dropbox dla Gmaila

Dropbox zaczynał jako usługa hostingu plików, ale wkrótce odkrył, że jego głównymi odbiorcami są projektanci, którzy korzystają z tej usługi do dzielenia się swoją pracą z kolegami. Ponieważ pliki projektu są często zbyt duże, aby można je było załączyć do załączników wiadomości e-mail, łatwiej jest wysłać link Dropbox do pliku.

Dropbox dla Gmaila czyni ten proces jeszcze wygodniejszym. Gdy połączysz się z plikiem za pomocą przycisku Dropbox u dołu nowego okna wiadomości e-mail, odbiorca zerknie na to, co wysyłasz. Łącza do plików graficznych prześlą obrazy bezpośrednio do wiadomości e-mail, a łącza do innych typów plików wygenerują przydatny podgląd.

Zainstalować:Dropbox dla Gmaila

2. FontFace Ninja

Dzięki tysiącom dostępnych czcionek możliwości typografii są nieograniczone. Zwłaszcza jeśli potrafisz zidentyfikować piękną czcionkę, którą gdzieś widzisz i pożyczyć ją na własny projekt.

FontFace Ninja to rozszerzenie Chrome, które pomaga to zrobić. Podobnie jak narzędzia do znajdowania czcionek z obrazów WhatTheFont i 4 alternatywy wyszukiwania czcionek z obrazówChcesz znaleźć czcionki z obrazów? Istnieją narzędzia online, które mogą to dla Ciebie zrobić, w tym WhatTheFont i różne alternatywy. Czytaj więcej pomaga zidentyfikować czcionki, które widzisz online. Jedyną różnicą jest to, że FontFace Ninja odczytuje czcionki zakodowane w CSS strony, takie jak krój pisma nagłówków i tekstu podstawowego.

Po uruchomieniu FontFace Ninja wyświetli informacje o czcionce, do której ją kierujesz - i nie tylko krój pisma, ale także wagę, rozmiar, wysokość, szerokość i kolor. Aby dodać tę czcionkę do zakładek, potrzebujesz konta w serwisie siostrzanym, FontFace Dojo.

Zainstalować:FontFace Ninja

3. Kroplomierz ColorPick

Bez względu na to, jak dobre masz oko, trudno odtworzyć konkretny odcień, który widziałeś online, chyba że znasz jego wartości RGB lub HTML. Na szczęście nie musisz zgadywać, czy masz Kroplomierz ColorPick.

Lubić najlepsze aplikacje próbnika kolorów dla komputerów Mac 5 najlepszych aplikacji Color Picker dla komputerów MacChcesz znaleźć idealny kolor na komputerze Mac? Wypróbuj te aplikacje próbnika kolorów macOS, aby łatwo identyfikować, zapisywać, formatować i kopiować kolory. Czytaj więcej Kroplomierz ColorPick wyświetli wartości dla każdego koloru, na który wskazujesz. Różnica polega na tym, że zawsze znajduje się w przeglądarce i nie musisz niczego przesyłać - wystarczy kliknąć ikonę i przesunąć cel we właściwe miejsce.

Rozszerzenie odczytuje kolory z tekstu, obrazów i praktycznie wszystkiego, co możesz zobaczyć na stronie internetowej (nawet w reklamach). Po przechwyceniu koloru wyświetla się dla niego wartości HTML, RGB i HSL.

Zainstalować:Kroplomierz ColorPick

4. Wymiary

To rozszerzenie typu open source jest przydatne dla projektantów stron internetowych, zwłaszcza jeśli robisz jednorazowe występy dla małych firm. Gdy klient przekazuje Ci witrynę bez wcześniejszych plików lub dokumentacji i prosi o zaprojektowanie „takiej strony, ale z innym tekstem i obrazami”, zrozumienie układu jest uciążliwe.

Wymiary pozwala łatwo zmierzyć wysokość i szerokość dowolnego elementu na stronie, a także marginesy między nimi. Ułatwia to odtwarzanie istniejących stron i podwójne sprawdzanie własnych projektów po ich wprowadzeniu do produkcji.

Zainstalować:Wymiary

5. Inspektor wizualny

Visual Inspector to potężne narzędzie do przesyłania opinii i współpracy dla zespołów projektowych, łączące funkcje poprzednich trzech rozszerzeń i dodające jeszcze więcej.

w Sprawdzać zakładkę, możesz wybrać dowolny element na stronie, aby uzyskać pełne informacje o nim, od wymiarów po nazwę pliku. The Zabarwienie i Typografia podkarty pozwalają zobaczyć paletę kolorów i wszystkie czcionki na pierwszy rzut oka Majątek gromadzi wszystkie obrazy na stronie w jednym miejscu.

The Współpracować w zakładce możesz wyrazić opinię i porozmawiać ze swoim zespołem, a komentarz można łatwo kliknąć, klikając dowolny element na stronie.

Podobnie jak większość zaawansowanych narzędzi, Visual Inspector ma tag: musisz zapłacić od 9 USD / użytkownika / miesiąc, aby dodawać komentarze i synchronizować zmiany. Jednak jego podstawowe funkcje, takie jak sprawdzanie kolorów, czcionek i obrazów, są bezpłatne.

Zainstalować:Inspektor wizualny

6. Łatwe przechwytywanie ekranu

Od tego czasu rozszerzenie przechwytywania ekranu może wydawać się zbędne wykonanie zrzutu ekranu na komputerze Mac Jak robić zrzuty ekranu na komputerze Mac: porady, narzędzia i wskazówki, które warto znaćChcesz zrobić zrzut ekranu na komputerze Mac? Oto najlepsze skróty, wskazówki i aplikacje do zrzutów ekranu z systemu macOS. Czytaj więcej to bryza i przechwytywanie ekranu w systemie Windows Jak zrobić idealny zrzut ekranu w systemie WindowsNajlepszy sposób na zrobienie zrzutu ekranu zależy od wersji systemu Windows, na której jesteś. Pokazujemy subtelne różnice, podamy wskazówki dotyczące rozwiązywania problemów oraz najlepsze skróty klawiaturowe i narzędzia. Czytaj więcej to tylko trochę więcej kłopotów. Ale Easy Screen Capture ma sporo zalet.

Co najważniejsze, pozwala uchwycić całą stronę internetową, a nie tylko obszar widoczny na ekranie. Jest to bezcenne, gdy musisz zgłosić kilka problemów na długiej stronie, a ich zrobienie zajmie od trzech do czterech zrzutów ekranu.

Kolejną ciekawą sztuczką jest możliwość skopiowania zrzutu ekranu do schowka i wklejenia go bezpośrednio na czacie lub w wiadomości e-mail, zamiast gromadzenia bezużytecznych plików graficznych na komputerze.

Zainstalować:Łatwe przechwytywanie ekranu

7. Muzli 2

Wreszcie jest jedno kluczowe zadanie, z którym musisz sobie poradzić każdego ranka: strząsanie resztek snu i wpadanie w rytm. Muzli 2 firmy InVision będzie służyć jako poranna gazeta z wyselekcjonowanymi artykułami na temat sztuki, projektowania, UX i technologii.

Muzli zastępuje domyślną kartę Chrome i pozwala dostosować to, co tam widzisz. W zależności od zainteresowań Muzli wybierze dla Ciebie kanały, od stron internetowych od Dribble i Behance po 99designs i Creative Bloq. Mnóstwo inspiracji do przewijania podczas popijania pierwszej kawy!

Jeśli uważasz, że cała karta przeglądarki pełna treści projektowych jest zbyt intensywna, Muzli ma również wersję Lite. Nie zastąpi domyślnej karty i będziesz mieć dostęp do kanału w dowolnym momencie, klikając ikonę rozszerzenia.

Zainstalować:Muzli 2

Uzyskaj rozszerzenia Chrome do wszystkich swoich zadań projektowych

Rozszerzenia Chrome na tej liście nie pasują do Twojego oprogramowania do projektowania, ale obejmują wszystkie drobne rzeczy związane z byciem projektantem - czy to typografia komputerowa, czy współpraca z twoimi koledzy.

Gdy zdasz sobie sprawę, że Chrome Web Store jest pełen narzędzi, może być trudno przestać dodawać nowe. To się ucz jak zarządzać rozszerzeniami Chrome Jak zarządzać rozszerzeniami Chrome bez żadnego problemuWłaściwe zarządzanie rozszerzeniami Chrome może sprawić, że Twoja przeglądarka będzie jeszcze bardziej wydajna. Oto kilka podstawowych porad i wskazówek, które powinieneś wiedzieć. Czytaj więcej zanim wymkną się spod kontroli.