30 полезных сервисов для веб-разработчика

    Решил собрать сервисы, которые могут быть полезны веб-разработчикам и дизайнерам. Буду рад, если кто-то найдет для себя полезный сервис. Осторожно, под катом куча картинок!


    Blind Text Generator — генератор текста-рыбы


    Random User Generator — генератор случайных пользователей


    User Inter Faces — генератор аватарок для вашего проекта.


    CSS3Ps — конвертер из PSD в CSS


    Prepros — компиляция, сжатие, оптимизация и еще куча всего — все возможности смотрите на сайте


    Webflow — drag & drop редактор для создания респонсивных сайтов


    html2pdf — конвертер веб-страниц в PDF-формат


    Less2CSS — конвертер из Less в CSS


    Trackduck — рецензирование веб-страниц (полезно для фрилансеров)


    NinjaMock — неплохой инструмент для прототипирования


    Moqups — еще один инструмент для прототипирования


    Sache — коллекция Sass и Compass расширений


    Web Developer Checklist — проверьте все пункты чек-листа перед запуском своего проекта


    Live Tools — 4 инструмента: генератор кнопок, форм, лент на чистом CSS, а также редактор иконок


    Glyphter — создание своего иконочного шрифта


    Pics.IO — онлайн фоторедактор


    Safarizator — вставка вашего дизайн-макета в окно браузера Safari


    PlaceIt — еще один сервис для генерации превью ваших работ


    TinyPNG — сжатие изображений в формате PNG


    BrowserShots — тестируем сайт в самых различных браузерах


    Golden Ratio Typography Calculator — расчет оптимального размера шрифта на основе золотого сечения


    CSS Arrow please — генерация блока со стрелкой (тултипа) на чистом CSS


    Lavish — генератор цветовых схем для Bootstrap на основе пользовательского изображения


    Favicon Generator — генератор кросплатформенной favicon


    HTML5 Please — статистика по поддержке фич HTML5 в различных браузерах


    Pictaculous — генератор цветовой схемы на основе загруженного изображения


    JSON Generator — генератор большого объема нужных данных в json-формате


    Codio — онлайн-IDE для полноценной разработки любых проектов, связанных с веб-технологиями


    CSS Hexagon Generator генератор CSS-шестиугольника


    StyleStats — исчерпывающая статистика о CSS-файле
    Метки:
    Поделиться публикацией
    Комментарии 48
    • 0
      StyleStats — Вот это реально то, чего так не хватало. Спасибо!
      • +7
        Зря ты это написал первым комментарием. Теперь туда не зайти
        • –1
          мда, хабраэффект, однако
        • 0
          Интересно как simplicity считается
        • +31
          генератор CSS-шестиугольника

          Даешь отдельный сайт для каждой фигуры! Да и генерацию эффектов можно на отдельные поддомены вынести: image-bg.csshexagon.com, shadow.csshexagon.com, border.csshexagon.com. А то недостаточно Unix-way.
          • +2
            вот вам синий прямоугольник: www.a-blue-box.com/
            • +1
              Простите, я бы хотел изменить его размеры (не нравится процентная привязка к размеру окна браузера). Не подскажете сайт? И заодно сайт, где цвет прямоугольника был бы #0099ff. А то этот какой-то слишком угрюмый.
              • +1
                • +1
                  Ну что вы мне рассказываете? Я хочу отдельный сайт! А не эти ваши детские поделки. Это уже не модно.
          • +14
            Вы бы хоть уточнили что это подборка для frontend разработчиков.
            • +14
              Из всего могу отметить только 2-3 сервиса, остальное в общем то мусор который в реальный проект пользы не принесет и у которого есть куда более удобные аналоги типо плагинов для фотошопа csshat pnghat или использование gulp/grunt для сборки или оптимизации и тд
              • +2
                Вот бы обзор сервисов типа, trackduck.com и marqueed.com. А то в том что уже есть на хабре половина сервисов померло.
                • 0
                  Несколько месяцев назад мы публиковали небольшой материал про TrackDuck, скоро будет еще несколько, так как с тех пор много чего изменилось и добавилось. Также, если вам не хватает нашего бесплатного плана, могу предложить воспользоваться 50% скидкой на все планы (для активации просто перейдите по ссылке, будет работать до 10 июня)
                • +3
                  Для получения css из psd удобный сервис от adobe Project Parfait
                  • +1
                    Было бы здорово разделить представленные сервисы по категориям, а то смешались люди и кони.
                    • +1
                      Это просто авторская отсылка к Маяковскому. «Каждый из нас по-своему лошадь» и все такое.
                    • +1
                      Спасибо, нашел для себя несколько полезностей.
                      Видимо вскоре домохозяйки будут респонсивы генерить с рецептами курицы и хостить (с телефона), чтоб с подружками поделиться…
                      • +4
                        90% уже были описаны на хабре
                        • 0
                          Лучшая похвала автору — добавил пост в избранное. Действительно полезные ресурсы и сервисы. Особенно json генератор понравился
                          • 0
                            Хороший набор, спасибо. Возьму в копилочку
                            • +2
                              Оформление поста в виде кучи скриншотов и пар «название-ссылка + краткое» — ужас, информативность поста стремится к нулю на квадратный метр полезной площади.
                              Лучше добавьте чуть более подробные описания, а скриншоты сайтов можно и под спойлеры.
                              • +4
                                Вместо первого использую Яндекс.Весну :)
                                • 0
                                  Может подскажите, есть ли сервис типа «JSON Generator — генератор большого объема нужных данных в json-формате», но наоборот.

                                  Т.е. копирую JSON, а сервис его парсит в код.
                                • 0
                                  Спасибо, подборка отличная, часть сервисов была незнакома.
                                  • 0
                                    Наконец-то я снова попал на генератор случайных пользователей! Не мог вспомнить, как его искать.
                                  • 0
                                    За html2pdf особенное спасибо! Скажите, а не попадался ли вам сервис html2jpg?
                                    • +1
                                      Пожалуйста. Нет, не попадался :) Думаю, достаточно Print Screen'ом обойтись, если страница не сильно длинная
                                      • +1
                                        А если длинная — есть плагины в браузере, которые снимут нам всю страницу. Иногда есть косяки у таких плагинов (снимок может получиться не такой какой ожидаешь), но в большинстве своем они работают нормально.
                                        • 0
                                          а если длинная, то есть плагины, например, для FF FireShot
                                          • 0
                                            мда… надо почаще страницу обновлять…
                                          • 0
                                            нужно целиком старницу. Нашел вроде — image.online-convert.com/convert-to-jpg
                                        • +1
                                          А может кто-нибудь подскажет, есть ли сервис (или приложение) которому можно скормить шаблоны и стилевые таблицы для выяснения, какие селекторы не используются?
                                          Иногда приходится поддерживать разработанные разными людьми сайты, и там такой бардак в CSS, что жуть. А проверять каждый селектор задолбаешься. :(
                                        • 0
                                          Это какая-то личная коллекция или рерайт какой-то существующей подборки?
                                          • 0
                                            Веду свой паблик ВК о веб-разработке, здесь собрал все сервисы, которые публиковал в нем.
                                        • +1
                                          Как альтернатива Random User Generator — randomprofile.com/ — больше настроек, данные более правдоподобные.
                                          • 0
                                            Альтернатива сафаризатору: framer.coalla.ru
                                            • 0
                                              Хорошая подборка! Часть из сервисов реально упростят жизнь и сэкономят время!
                                              • 0
                                                Также пользуюсь:

                                                1. Советы google по оптимизации сайта
                                                Пример для Хабра
                                                developers.google.com/speed/pagespeed/insights/?hl=ru&utm_source=blogspot&utm_campaign=mobile_ux&url=http%3A%2F%2Fhabrahabr.ru%2F&tab=desktop

                                                2. Платный сервис по отслеживанию изменений на всех страницах сайта neowatcher.com

                                                • 0

                                                  Только полноправные пользователи могут оставлять комментарии. Войдите, пожалуйста.