Всем нам нужны те или иные онлайн инструменты при создании сайта или в процессе написания статьи, этакий чемоданчик специалиста, но некоторые вебмастера используют исключительно приложения, хотя если вы работаете одновременно в разных операционных системах, не всегда удается найти кроссплатформенные приложения или аналоги с одинаковой функциональностью. В этой подборке не будет инструментов для продвижения сайта — это тема для отдельной статьи, которую я обязательно напишу в ближайшее время. Эти инструменты, созданы в помощь вебмастеру, и мне давно хотелось поделиться ими со своими читателями и подписчиками блога. Итак, вот этот список:
Сервисы по работе с текстом:
Переводчик Google — ну куда без него? Язык англов мне немного знаком, но всегда встречается незнакомая фраза или выражение, да и как быть вебмастеру без качественного онлайн переводчика, если большинство актуальных рецептов распространяются именно в буржунете!
Транслит Яндекс онлайн — этим сервисом я пользуюсь для транслитерации в урлах. Есть и другие, поддерживающие разные стандарты ГОСТ и ISO, но так как я продвигаю свои сайты, прежде всего, под ПС Яндекс, мне этот сервис ближе других. Удобнее вставить фразу без учета пробелов и регистра букв — «Сервисы для вебмастера», а на выходе получить правильный урл — «servisy-dlya-vebmastera».
Перевод русских букв в английские — давнишний блог какого-то фотографа, на котором присутствует качественный сервис транслитерации. Интересен только тем, что работает очень стабильно на протяжении многих лет, хорошее время отклика сайта, всегда под рукой, всегда доступен, в отличии от многих более известных альтернатив.
Подсчет количества символов — любой вебмастер или блоггер, который работает с контентом нуждается в сервисе подсчета количества символов, иначе как узнать, что твоя статья меньше 1k, или наоборот уже «привет простынный фильтр»)
Оптимизатор текста — вот этим сервисом я пользуюсь достаточно редко, потому что давно уже научился определять эти значения «на глаз» исходя из опыта, профессионального чутья. Внутренняя оптимизация текста понятие неточное, так как включает в себя много погрешностей «что русскому хорошо, то немцу — смерть». Но иногда можно свериться с показаниями автоматического оптимизатора, который позволяет определить плотность ключевых слов и фраз в тексте.
Синонимизация текста — откровенная гадость) Синонимайзер, для тех кто любит уникализировать таким образом чужой контент, вместо глубокого рерайта, верный помощник автора ГС! Хуже этого способа получения «уникального контента» может быть только использование генератора текста. Но этот сервис один из лучших представителей жанра, может пригодиться при создании контента для социальных сетей.
Спецсимволы HTML — просто список спецсимволов на популярном сайте Влада Мержевича. Надо сказать, что все это есть в арсенале любой IDE.
Сервисы по работе со шрифтами:
Google Fonts — знаменитый сервис по подбору шрифтов из набора Google для интеграции с вашим сайтом. В представлении не нуждается!
Typetester — этот занимательный сервис для вебмастеров и дизайнеров позволяет визуально сравнить блоки параграфов с текстом, с различными настройками отображения текста, соответствующими CSS, и само собой с различными шрифтами. Все это отображается в виде нескольких колонок.
WhatTheFont — сервис позволяет узнать, какой именно шрифт использовался в тексте на изображении. Справляется со своей задачей в большинстве случаев. Бывает очень полезен, если вы работаете с дизайном сайта без PSD макета, или просто не возможно определить шрифт на картинке. Ну не вставлять же картинку с текстом в шаблон сайта в XXI веке, вместо настройки CSS стилей для него!
PX to EM — конвертация из абсолютной единицы измерения (px) в относительную (em).
Сервисы определения и тестирования:
Built With — наверное самый известный сервис по определению CMS сайта. Если вам понравился какой-либо сайт, всегда интересно узнать на каких технологиях он создавался. Тут больше нечего добавить.
Сервис определения CMS — аналогичный отечественный сервис, только менее популярный. Можно использовать если предыдущий сервис не справился, а узнать систему все-таки хотелось бы. Редко способен определить то, на что не способен Built With. Тут надо сказать, что определить CMS можно и по исходному коду страницы сайта, так как используются типичные для какой-либо конкретной CMS пути до файлов темы, но для этого потребуется профессиональный кругозор.
Responsinator — отличный сервис для тестирования респонсивного дизайна сайта, иными словами, через него можно проверить как тестируемый сайт выглядит на разных устройствах с разным разрешением экрана. Очень наглядный сервис!
Check Browser Compatibility — а вот этот потрясающий сервис пригодиться для кроссбраузерного тестирования сайта. Вводим адрес домена и на выходе получаем скриншоты сайта в представлении разных версий самых популярных браузеров под разные операционные системы. Да, облик вашего сайта в Firefox под Windows, вполне может отличаться от облика в том же Firefox, но уже под OS X, это нормальное явление для браузеров в целом(
PageSpeed Insights — общеизвестный сервис из набора продуктов от Google для разработчиков. Способен проверить «скоростные» характеристики вашего и любого другого сайта. В дополнительных комментариях не нуждается, все очень наглядно.
Проверка скорости сайта — аналог предыдущего из набора сервисов отечественного портала для вебмастеров PR-CY. Использует данные Google. Понятия не имею, что этот сервис делал в моих закладках)
Pingdom Website Speed Test — еще один аналогичный сервис, но с интересной особенностью. В отличии от PageSpeed Insights, где на выходе мы получаем только общие рекомендации, этот сервис представляет данные в виде графика, в котором можно наглядно разобрать какие именно файлы и на сколько замедляют загрузку сайта, будь то файл стилей или просто фоновое изображение. Сразу видно, как сильно «тормозят» виджеты социальных сетей.
GIDZipTest — простой тест домена на предмет наличия и некоторых характеристик gzip компрессии.
Сервисы по работе с цветом и изображениями:
RGBaZR — онлайн конвертер между несколькими основными способами представления цветов в вебе, а конкретно между HEX, RGB и ARGB.
Icons4Android — просто набор иконок, разбитых на категории. Примечателен тем, что иконок действительно очень много, хоть и представлены они только в одном цвете и стиле.
TinyPNG — очень грамотный сервис, с эффективными алгоритмами оптимизации .png или .jpg изображений. По эффективности может конкурировать даже с популярными десктопными приложениями. Ограничение: только 20 картинок за один прием, не больше 5 MB каждая.
Online Photo Editor — он же «онлайн фотошоп». Многоязыковой сервис, в том числе и на русском языке, разработчики которого безвозмездно разрешают встраивать его в любую веб-страницу, что и породило сотни «онлайн фотошопов» в выдаче ПС по соответствующему запросу.
Скачать видео с YouTube — тут все ясно из названия. Немного не в тему абзаца получилось, но больше мне просто некуда вставить описание этого сервиса. Управляться с ним очень просто, вставляем ссылку на понравившееся видео в приметное поле на этом сайте, нажимаем ENTER и скачиваем видео на жесткий диск своего компьютера.
Сервисы по работе с CSS
Ultimate CSS Gradient Generator — генератор кроссбраузерного градиента, незаменимый инструмент для современного верстальщика. Помогает быстро и без особых вгрызаний в CSS3 создать правильные стили для градиента любой сложности.
Box Shadow CSS Generator — тут можно обойтись без комментариев, предназначение понятно из названия!
Генератор CSS3 border-radius — генератор кроссбраузерного border-radius для CSS3. Лучше и удобней этого сервиса я просто не встречал! Подставляем значения и смотрим как изменяется геометрическая фигура в центре сайта.
Browserhacks — авторы этого сайта поставили перед собой цель собрать в одном месте все известные CSS хаки для различных версий всех популярных браузеров. Мне кажется, им это удалось. Большего справочника по хакам я просто нигде не видел, больше не нужно искать в Интернете и получать не всегда верные подсказки по актуальным CSS и JS хакам. Добавим к этому еще и Media Query хаки!
Online CSS Compression Tool — один из немногих ресурсов, который действительно помог мне с компрессией некоторых CSS файлов, которые совсем не подвергаются правкам, а следовательно первые кандидаты на ручную компрессию. Отработал качественно и без ошибок! Сервис естественно не актуален для тех разработчиков, кто практикует автоматическую компрессию всех CSS и JS файлов для своих веб-проектов.
Ну вот и все! Надо сказать, внушительный получился список