30 расширений Chrome для веб-дизайнеров и разработчиков

Автор: Monica Porter
Дата создания: 17 Март 2021
Дата обновления: 17 Май 2024
Anonim
Лучшие расширения Google Chrome для дизайнеров
Видео: Лучшие расширения Google Chrome для дизайнеров

Содержание

Инструменты разработчика Chrome великолепны, но в ваш интернет-браузер можно добавить еще больше интересных функций, чтобы упростить веб-дизайн и разработку.

Конечно, есть масса других инструментов для ускорения работы, смотрите наши любимые посты об инструментах веб-дизайна. А пока вот 30 наших любимых расширений Chrome для веб-дизайнеров и разработчиков.

01. Упростите Gmail

Если вы обнаружите, что Gmail становится слишком беспорядочным для собственной пользы, поздоровайтесь с Simplify Gmail, которая сметает весь мусор и неверные решения пользовательского интерфейса, которые вкрались в него за последние несколько лет. Созданный бывшим ведущим дизайнером Gmail Майклом Леггеттом, он избавляет от отвлекающего беспорядка и дает вам более урезанную и функциональную версию.

02. Спектр


От дальтонизма в той или иной форме страдают около 200 миллионов человек во всем мире, но их питание часто не входит в список проверок доступности для дизайнеров. Однако с помощью Spectrum вы можете быстро протестировать свой сайт на предмет различных типов нарушения цветового зрения и убедиться, что все в порядке.

03. CSS Scan 2.0

Инструменты разработчика Chrome - удобный способ заглянуть под капот, чтобы увидеть, как работает сайт, но сканирование CSS 2.0 еще проще, если вам нужен CSS. Наведите указатель мыши на любой элемент, и его CSS появится во всплывающем окне, что позволит вам скопировать его правила одним щелчком мыши. Вы можете использовать его для копирования определенных элементов из тем или шаблонов, чтобы адаптировать их для собственного использования, и он отлично подходит для отладки вашего собственного кода.

04. Амино


Вот еще один отличный инструмент CSS. Amino - это живой редактор CSS, который позволяет создавать таблицы стилей в браузере и применять их к веб-сайтам в реальном времени. Это позволяет вам вносить постоянные изменения в дизайн любого сайта, который вы посещаете, и если вы вошли в Chrome с учетной записью Google, таблицы стилей будут синхронизированы, чтобы они были доступны из Chrome на всех ваших настольных устройствах.

05. Сиззи

В наши дни адаптивный веб-дизайн - это данность, и если вам нужен простой способ проверить свой дизайн в нескольких окнах просмотра, стоит взглянуть на Sizzy. Он покажет вам интерактивный вид вашей страницы, отображаемой на различных экранах устройств, и вы также можете показать и скрыть имитацию клавиатуры устройства и переключаться между портретным и альбомным режимами.

06. Палитра сайта


В следующий раз, когда вы увидите сайт, на котором хорошо используются цвета, вот простой способ воспользоваться этим. Палитра сайта извлекает основные цвета с веб-сайта и создает общую палитру, которую вы можете легко показать соавторам. Вы также можете скачать шаблон Sketch, также есть поддержка Adobe Swatch.

07. Чекбот

Убедиться, что все ссылки на вашем сайте действительно работают, - это мгновенный выигрыш в удобстве использования, а также хороший способ улучшить ваше SEO. Checkbot - это расширение Chrome, которое проверяет неработающие ссылки, повторяющиеся заголовки, цепочки переадресации, недопустимый HTML / JS / CSS и многое другое, чтобы вы могли быстро проверить свой сайт на наличие плохих ссылок и исправить их.

08. Тоби

Это общепризнанная правда, что к тому времени, как вы откроете Chrome на пару часов, он превратится в сбивающее с толку множество вкладок шириной с ваш мизинец. Тоби - отличный способ их приручить; с его помощью вы можете организовать все эти вкладки в коллекции ссылок в качестве альтернативы множеству отдельных закладок, что значительно упростит управление ими.

09. DomFlags

Значительно ускорьте процессы стилизации элементов с помощью DomFlags, действительно отличного расширения, которое позволяет создавать сочетания клавиш для элементов DOM. Это как закладки для навигации по DOM; это изменит способ работы с DevTools.

10. Highly Highlighter.

Вот интересный способ вовлечь людей в обсуждение: Highly позволяет вам делиться основными моментами из статей в Интернете, чтобы вы могли привлечь внимание к наиболее важным моментам написания.

Далее: еще 10 расширений Chrome

Обязательно к прочтению
Шрифт дня: Берлин
Узнать

Шрифт дня: Берлин

Мы в Creative Bloq большие поклонники типографики и постоянно ищем новые интересные шрифты, особенно бесплатные. Итак, если вам нужен шрифт для вашего последнего дизайна или вы просто хотите сохранить...
Как нарисовать чешую
Узнать

Как нарисовать чешую

Существует множество видов чешуек, и когда дело касается рисования, к каждой из них требуется свой подход. В этой статье я покажу вам, как нарисовать девушку-полудракона. Поскольку драконы - фантастич...
Анимированные эффекты CSS с запасными вариантами
Узнать

Анимированные эффекты CSS с запасными вариантами

Необходимые знания: Промежуточный C , базовый Java cript, продвинутый HTMLТребует: Приличный текстовый редактор, современный веб-браузерВремя проекта: Пока вы можете работать над этимФайл поддержкиЭта...