В посте ссылаемся на расширения для Chrome, потому что это самый популярный браузер. Но у них есть свои версии или аналоги для других браузеров.
1. Определить шрифт
🧑💻 Мы часто используем инструменты, которые определяют шрифт на сайте пользователя. Это помогает быстро разобраться в проблеме со шрифтом. Ещё это расширение пригодится, если вы вдруг увидели симпатичный шрифт на сайте и хотите узнать его название.
Обычно мы пользуемся расширениями WhatFont и FontFace Ninja, они быстро показывают, какой шрифт используется в конкретном тексте на странице.
2. Определить цвет элемента на странице
Часто необходимо скопировать цвет элемента на странице, как в инструменте Eyedropper в фотошопе. Для этого есть много расширений, но мы рекомендуем ColorZilla.
3. Проверить отображение на других устройствах
📱 Здесь стоит отметить, что, во-первых, мобильную версию сайта максимально точно покажет только мобильное устройство. Во-вторых, есть встроенные в браузер инструменты разработчика, которые тоже показывают отображение сайта на различных устройствах. Для этого нужно нажать Alt + Cmd + i, а затем Cmd + Shift + M и задать параметры окна. Для Windows замените Cmd на Ctrl.
Но есть и расширения, в которых очень удобно смотреть мобильную версию, мы пользуемся Emmet Review. Ещё можно использовать Window Resizer или I love adaptive.
4. Длинный скриншот сайта
Full Page Screen Capture делает фотографию всего окна браузера за один клик. Пару секунд во время создания скриншота сам процесс отображается в стиле игры Pac-Man.
5. Скринкаст сайта
😉 Скринсайты сайтов, например, для рубрики #madeontilda в Инстаграм, записываем с помощью стандартного приложения QuickTime Player на Mac. Для Windows можно использовать программу OBS studio.
