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

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

Jako projektant stron internetowych, jakie oprogramowanie koniecznie musisz mieć na swoim komputerze? Są szanse, że to Photoshop i Illustrator. I chociaż są to podstawowe elementy procesu projektowania, istnieją mniejsze narzędzia, o których prawdopodobnie nie wiesz, że są potrzebne.





Najlepsze jest to, że nie musisz ich nawet pobierać — po prostu zainstaluj te rozszerzenia Chrome i gotowe. Od identyfikacji czcionek na stronach po mierzenie odległości między elementami sieci, 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 usługi, aby dzielić się swoją pracą ze współpracownikami. Ponieważ pliki projektów są często zbyt duże, aby można je było zamieścić w wiadomościach e-mail, łatwiej jest wysłać łącze Dropbox do pliku.





Dropbox dla Gmaila sprawia, że ​​proces jest jeszcze wygodniejszy. Gdy łączysz się z plikiem za pomocą przycisku Dropbox u dołu nowego okna wiadomości e-mail, odbiorca otrzymuje podgląd tego, co wysyłasz. Linki do plików graficznych prześlą obrazy bezpośrednio do wiadomości e-mail, a linki 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 typograficzne są nieograniczone. Zwłaszcza jeśli potrafisz zidentyfikować piękną czcionkę, którą gdzieś widzisz i pożyczyć ją do własnego projektu.

FontFace Ninja to rozszerzenie do Chrome, które pomoże Ci to zrobić. Podobnie jak narzędzia do wyszukiwania czcionek z obrazów pomaga zidentyfikować czcionki, które widzisz w Internecie. Jedyną różnicą jest to, że FontFace Ninja odczytuje czcionki zakodowane w CSS strony, takie jak krój nagłówków i tekst podstawowy.





Gdy uruchomisz FontFace Ninja, wyświetli on informacje o czcionce, do której 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 siostrzanej usłudze, FontFace Dojo .

Zainstalować: FontFace Ninja





3. Kroplomierz ColorPick

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

Lubić najlepsze aplikacje do wybierania kolorów dla komputerów Mac , zakraplacz ColorPick pokaże wartości dla dowolnego wskazanego koloru. Różnica polega na tym, że jest ona zawsze dostępna w Twojej 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 prawie wszystkiego, co możesz zobaczyć na stronie internetowej (nawet z reklam). Po przechwyceniu koloru wyświetla dla niego wartości HTML, RGB i HSL.

Zainstalować: Kroplomierz ColorPick

4. Wymiary

To rozszerzenie o otwartym kodzie źródłowym jest znaleziskiem dla projektantów stron internetowych, zwłaszcza jeśli robisz jednorazowe koncerty dla małych firm. Kiedy klient przekazuje Ci witrynę bez żadnych wcześniejszych plików lub dokumentacji i prosi o zaprojektowanie „takiej strony, ale z innym tekstem i obrazami”, ustalenie układu jest kłopotliwe.

jak ustawić iPhone'a 6s plus w trybie odzyskiwania?

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

Zainstalować: Wymiary

5. Inspektor wizualny

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

w Sprawdzać możesz wybrać dowolny element na stronie, aby uzyskać pełną informację o nim, od wymiarów po nazwę pliku. ten Zabarwienie oraz Typografia zakładki podrzędne pozwalają zobaczyć paletę kolorów i wszystkie czcionki na pierwszy rzut oka, podczas gdy Aktywa gromadzi wszystkie obrazy na stronie w jednym miejscu.

ten Współpracować to zakładka, na której możesz przekazywać opinie i dyskutować ze swoim zespołem, a także łatwo zostawić komentarz, klikając dowolny element na stronie.

jak zrobić drzewo genealogiczne w dokumentach google

Podobnie jak większość zaawansowanych narzędzi, Visual Inspector jest dostarczany z ceną: musisz zapłacić od 9 USD za użytkownika miesięcznie, aby dodać komentarze i zsynchronizować zmiany. Jednak jego podstawowe funkcje, takie jak sprawdzanie kolorów, czcionek i obrazów, są bezpłatne.

Zainstalować: Inspektor wizualny

6. Łatwe przechwytywanie ekranu

Rozszerzenie do przechwytywania ekranu może wydawać się zbędne, ponieważ zrobienie zrzutu ekranu na komputerze Mac to pestka, a przechwytywanie ekranu w systemie Windows 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. To bezcenne, gdy musisz zgłosić kilka problemów na długiej stronie, a uchwycenie ich wszystkich wymagałoby od trzech do czterech zrzutów ekranu.

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

Zainstalować: Łatwe przechwytywanie ekranu

7. Lodowaty 2

Wreszcie, jest jedno kluczowe zadanie, z którym musisz sobie radzić każdego ranka: otrząsanie się z resztek snu i wejście w rytm. Muzli 2 od InVision posłuży jako poranna gazeta z wyselekcjonowanymi artykułami na temat sztuki, designu, UX i technologii.

Muzli zastępuje domyślną kartę Chrome i pozwala dostosować to, co tam widzisz. W zależności od Twoich zainteresowań, Muzli wybierze dla Ciebie kanały, z witrynami 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 wypełniona treściami projektowymi jest zbyt intensywna, Muzli ma również wersję Lite. Nie zastąpi ona karty domyślnej i będziesz mieć dostęp do kanału w dowolnym momencie, klikając ikonę rozszerzenia.

Zainstalować: Lodowaty 2

Pobierz rozszerzenia Chrome do wszystkich swoich zadań projektowych

Rozszerzenia Chrome na tej liście nie pasują do Twojego oprogramowania do projektowania, ale obejmują wszystkie drobiazgi związane z byciem projektantem — niezależnie od tego, czy chodzi o inteligencję typograficzną, czy współpracę z kolegami.

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 zanim wymkną się spod kontroli.

Udział Udział Ćwierkać E-mail Czy warto uaktualnić do systemu Windows 11?

Windows został przeprojektowany. Ale czy to wystarczy, aby przekonać Cię do przejścia z Windows 10 na Windows 11?

Czytaj dalej
Powiązane tematy
  • Internet
  • Twórczy
  • Google Chrome
  • Projektowanie stron
  • Rozszerzenia przeglądarki
O autorze Alicja Kotlarenko(28 opublikowanych artykułów)

Alice jest autorką technologii, która ma słabość do technologii Apple. Od jakiegoś czasu pisze o Macu i iPhonie i jest zafascynowana sposobami, w jakie technologia zmienia kreatywność, kulturę i podróże.

Więcej od Alice Kotlyarenko

Zapisz się do naszego newslettera

Dołącz do naszego newslettera, aby otrzymywać porady techniczne, recenzje, bezpłatne e-booki i ekskluzywne oferty!

Kliknij tutaj, aby zasubskrybować