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

Вы здесь:

Главная
Статьи по дизайну
29 Расширения Chrome для веб-дизайнеров…

Статьи по дизайну

<pre>29 Расширения Chrome для веб-дизайнеров и разработчиков

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

Содержание статьи

1 01. Sizzy
2 02. Палитра сайта
3 03. Checkbot
4 04. Тоби
5 05. DomFlags
6 06. Highly Highlighter
7 07. Booom
8 08. CSS-Shack
9 09. Marmoset
10 10. iMacros для Chrome

01. Sizzy

Сайт Sizzy «class =» lazy-image lazy-image-loading lazyload optional-image «onerror =» this.parentNode.replaceChild (window.missingImage (), this) " data-normal = "https://vanilla.futurecdn.net/creativebloq/media/img/missing-image.svg" src = "https://cdn.mos.cms.futurecdn.net/XUhTNZbBzh6LVgwt9QRMHm-320-80. jpg "data-data-original-mos =" https://cdn.mos.cms.futurecdn.net/XUhTNZbBzh6LVgwt9QRMHm.jpg "data-pin-media =" https://cdn.mos.cms.futurecdn.net/ XUhTNZbBzh6LVgwt9QRMHm.jpg "</p><figcaption>
<div class=

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

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

Сайт палитры сайта "class =" lazy-image lazy-image-loading lazyload optional-image "onerror =" this.parentNode.replaceChild (window.missingImage (), this ) "data-normal =" https://vanilla.futurecdn.net/creativebloq/media/img/missing-image.svg "src =" https://cdn.mos.cms.futurecdn.net/pVho5JkL3d3FwPVKadPdHm-320- 80.jpg "data-data-original-mos =" https://cdn.mos.cms.futurecdn.net/pVho5JkL3d3FwPVKadPdHm.jpg "data-pin-media =" https: //cdn.mos.cms.futurecdn. net / pVho5JkL3d3FwPVKadPdHm.jpg "/> </p><figcaption>
<div class=

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

03. Checkbot

Сайт checkbot «class =» lazy-image lazy-image-loading lazyload optional-image «onerror =» this.parentNode.replaceChild (window.missingImage (), this) " data-normal = "https://vanilla.futurecdn.net/creativebloq/media/img/missing-image.svg" src = "https://cdn.mos.cms.futurecdn.net/5yfk9MXkjjfCZzBn67RbHm-320-80. jpg "data-data-original-mos =" https://cdn.mos.cms.futurecdn.net/5yfk9MXkjjfCZzBn67RbHm.jpg "data-pin-media =" https://cdn.mos.cms.futurecdn.net/ </p><figcaption>
<div class=

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

04. Тоби

Тоби сайт "class =" lazy-image lazy-image-loading lazyload optional-image "onerror =" this.parentNode.replaceChild (window.missingImage (), this) " data-normal = "https://vanilla.futurecdn.net/creativebloq/media/img/missing-image.svg" src = "https://cdn.mos.cms.futurecdn.net/iFcj3LH6XhKHgzdy4WuXHm-320-80. jpg "data-data-original-mos =" https://cdn.mos.cms.futurecdn.net/iFcj3LH6XhKHgzdy4WuXHm.jpg "data-pin-media =" https://cdn.mos.cms.futurecdn.net/ iFcj3LH6XhKHgzdy4WuXHm.jpg "</p><figcaption>
<div class=

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

05. DomFlags

Высокий сайт «class =» lazy-image lazy-ima ge-load lazyload optional-image "onerror =" this.parentNode.replaceChild (window.missingImage (), this) "data-normal =" https://vanilla.futurecdn.net/creativebloq/media/img/missing-image .svg "src =" https://cdn.mos.cms.futurecdn.net/TrHaxR5qPv33WirFkfygE9-320-80.jpg "data-data-original-mos =" https://cdn.mos.cms.futurecdn.net /TrHaxR5qPv33WirFkfygE9.jpg "data-pin-media =" https://cdn.mos.cms.futurecdn.net/TrHaxR5qPv33WirFkfygE9.jpg "/> </p><figcaption>
<p> Высоко, новый способ участия в промышленности разговор </p>
</figcaption></figure>
<p> Вот интересный способ привлечь людей к обсуждению: высоко позволяет поделиться основными моментами статей в Интернете, чтобы вы могли привлечь внимание к самым значительным фрагментам написания. </p>
<h3 id= — Получить лучший опыт Дриблинга с Booom

Это мощное расширение Chrome позволяет создавать проекты, а затем экспортировать их в файл CSS для использования на вашем сайте. Он поддерживает слои и содержит множество инструментов, из которых вы привыкли в своем обычном фоторедакторе.

09. Marmoset

10. iMacros для Chrome

Расширение iMacros Chrome позволяет вы записываете действия и сохраняете их

Как веб-разработчик, вам может потребоваться проверить свои веб-страницы. Повторение одних и тех же действий снова и снова может быть утомительным процессом. iMacros — это удобное расширение Chrome, которое позволяет записывать ваши действия и сохранять их, поэтому вам нужно только сделать их один раз. После этого вы можете тестировать свои страницы снова и снова, повторяя действие одним нажатием кнопки.

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

Category: Статьи по дизайну19.07.2018

Теги: Chrome вебдизайнеров для и разработчиков Расширения

Пожалуйста, поставьте рейтинг статье:

(Пока оценок нет)

Загрузка...