15 CSS-сервисов, экономящих ваше время
CSS – существенный компонент современного веб-дизайна. Но писать весь CSS-код для каждого проекта с нуля так утомительно, к тому же это занимает слишком много времени. В статье представлены 15 очень разных сервисов для работы с CSS: здесь и генераторы шаблонов и форм и утилиты для сжатия кода… Словом, есть все, чтобы уже в вашем следующем веб-дизайне написание CSS заняло совсем немного времени, а код стал грамотней и чище и загружался быстрее.
CSS Typeset - удобный сервис, который позволяет протестировать, как будут выглядеть ваши тексты с различными фонтами и CSS-настройками. Понравившиеся фрагменты CSS можно быстро перенести к себе.
TypeTester - этот сервис чем-то похож на предыдущий, но здесь вы сможете еще сравнить сразу несколько различных стилей для текстов и выбрать из них наиболее подходящий. Здесь также можно выставить базовый размер шрифта и работать в единицах em.
CSS Frame Generator формирует для заданного вами HTML-кода пустую CSS-заготовку. Потом к ней можно добавить свои стили, это сэкономит вам много времени. Да и работа остается только действительно креативная: ведь все формальности сервис берет на себя.
С помощью CSS Grid Builder можно быстро создать полноценную стандартную раскладку (layout) вашей веб-страницы на основе CSS. Сервис использует CSS-фреймворк YUI Grids, где поддерживается более тысячи различных вариантов раскладок – на все вкусы.
YAML Builder - другой сервис построения раскладок (лэйаутов), который использует для их построения Фреймворк YAML.
Spiffy Corners позволяет строить ваши любимые закругленные уголки, не применяя вообще никаких картинок. Всего за несколько кликов вы создаете прекрасно оформленные прямоугольные области для своей веб-странички.
JotForm значительно упрощает создание HTML-форм. Используя визуальный драг-энд-дроп интерфейс можно быстро создать формы. Есть заранее приготовленные шаблоны для форм регистрации, форм обратной связи, что позволяет делать такие формы почти мгновенно.
Kotatsu дает вам возможность легко и быстро создать HTML-таблицу и прописывать соответствующий CSS-код строкам, столбцам и ячейкам этой таблицы.
CSS Sprite Generator экономит ваше время очень здорово. Просто «скормите» ему zip-файл со всеми картинками, которые вы хотите превратить в CSS-спрайт, и он не только создаст для вас единую картинку-спрайт, содержащую все нужные вам изображения, но и создаст все необходимые CSS-стили, которые вы сможете скопировать себе на страницу, чтобы все эти спрайты применять.
W3C CSS validator - возможно, самый известный из CSS-валидаторов. Он экономит ваше время тем, что показывает различные ошибки в вашем CSS-коде. Так что вы можете создавать более качественные страницы, а в дальнейшем они не потребуют дополнительной отладки.
С помощью сервиса FormatCSS вы можете менять оформление CSS-кода. Достаточно выгрузить ему свой CSS-код, задать нужные опции и можно получить код, отформатированный именно так, как вам нужно. Например, можно развернуть компактный код в читаемую форму с размещением каждого свойства на отдельной строчке или наоборот.
Dust-Me Selectors - расширение FireFox, Которое анализирует открытую сейчас веб-страницу со стороны как HTML, так и CSS, и отыскивает определения стилей, которые нигде не используются. Как говорится, меньше сора – меньше и вздора.
CSS Optimizer - сервис для оптимизации размера CSS-файлов. Он удаляет из кода все пробелы, что существенно уменьшает размер файла. Как их вернуть на место при необходимости, мы с вами уже говорили чуть выше.
CSS Redundancy Checker находит лишние стили, которые больше не используются на ваших веб-страницах. Так что вы можете удалить такие определения и этим тоже уменьшить размер файла CSS.
CSSTidy - это CSS-оптимизатор с открытым кодом. При работе он чистит лишние пробелы, применяет более экономные обозначения цветов, удаляет в определениях последнюю точку с запятой и оптимизирует директивы для margin и padding.
Источник: WebDeveloperPlus
