Сервисы для CSS Разработчиков #2 (Free OnLine Service)

ПОЛЕЗНЫЕ ИНСТРУМЕНТЫ ДЛЯ CSS РАЗРАБОТЧИКА

3996605_css_razrabotka11 (700x513, 312Kb)

Для тех, кто работает и интересуется CSS разработками, будет полезно взглянуть на подборку полезных инструментов для CSS.

В подборку вошли инструменты по работе с макетами, CSS Фреймворками, шрифтами, цветами, спрайтами, формами, Компоненты UI, обертка текста, анализ и отладка, сопровождение, оптимизация, форматирование, браузерозависимость, селекторы и т.д

3996605_3dGOLD129 (132x130, 17Kb)

СПРАЙТЫ

CSS Sprite Generator

Этот инструмент позволяет автоматизировать процесс создания CSS спрайтов. Просто дайте ему ZIP файл, содержащий 2 и более изображений (GIF, PNG или JPG), и он будет генерировать спрайт-изображение и соответствующие правила CSS для ориентации и отображения каждого элемента изображения.

YASC (Yet Another Sprite Creator)
Еще один генератор. Процесс создания спрайта представляет собой следующее: загружается картинка, затем визуально отмечаются необходимые области и им назначается CSS id. Когда выбраны все участки происходит генерация CSS для этих спрайтов.

SmartSprites
SmartSprites это консольная Java утилита для создания CSS спрайтов. SmartSprites орабатывает специальные директивы в CSS файле, отмечающие отдельные картинки которые должны быть превращены в спрайты. После обработки CSS файла из отмеченных картинок создается спрайт, и автоматически меняются соответствующие фрагменты файла на использования спрайта вместо одиночных картинок.

3996605_3dGOLD127 (135x130, 16Kb)

ФОРМЫ

Quick Form Builder
Генерирует XHTML /HTML -совместимые и доступные формы с CSS разметкой. Вводим имена полей, затем выбираем типа каждого поля, формат( HTML или XHTML ) и получаем готовый HTML и CSS код формы.

Wufoo

Wufoo – это бесплатный онлайновый сервис, позволяющий с легкостью создавать хорошо выглядящие, валидные CSS/XHTML формы.

3996605_3dGOLD1211 (125x125, 15Kb)

КОМПОНЕНТЫ UI

List-o-Matic
Генерирует навигационные меню ( до 2 уровней), позволяя выбрать одно из нескольких доступных оформлений.

CSS Menu Generator
Генерирует горизонтальные, вертикальные, выпадающие CSS меню.


ThemeRoller
Позволяет создавать собственные темы для jQuery UI.

3996605_3dGOLD1210 (86x136, 7Kb)

ОБЕРТКА ТЕКСТА

CSS Text Wrapper

Сервис CSS Text Wrapper позволяет легко придать тексту любую форму и вставить к себе на страницу. Линиями задаем форму. Узловые точки добавляются по нажатию на линию в том месте где необходимо добавить. Можно настроить размеры блока, выравнивание, шрифт и т.д.

The Box Office
Этот инструмент который позволит создать обтекание текста для картинок с различной неправильной формой. Просто вводите ссылку на любую картинку произвольной формы, задаете основное выравнивание изображения, цвет фона, который нужно игнорировать, высоту строки дополнительные отступы и цвет текста, а далее — идем за результатом.

3996605_3dGOLD126 (202x217, 54Kb)

АНАЛИЗ И ОТЛАДКА


W3C CSS Validation Service
Проверка CSS на валидность.

CSS Analyzer

CSS Analyser сочетает W3C CSS Validation Service и дополнительную проверку цветов на контрастность (полезен для улучшения юзабилити) и единиц измерения, используемых в исходном коде. Результатом является очень подробное описание ошибок и предупреждений, точно так же как в W3C CSS Validation Service.

Firebug
Firebug — расширение для браузера Firefox, являющееся консолью, отладчиком, и DOM-инспектором javascript, DHTML, CSS, XMLHttpRequest. Firebug показывает в консоли вызвавшую ошибку функцию, стек вызовов функций, вызвавших эту ошибку. Он предупреждает, что CSS-правило или javascript-метод/свойство, которое вы пытаетесь использовать, не существует.

3996605_3dGOLD121 (131x113, 11Kb)

СОПРОВОЖДЕНИЕ

Dust-Me Selectors
Позволяет проанализировать страницу и показать, сколько и какие стили не используются на странице сайта, а также укажет в каком файле стилей, в какой строке они прописаны.

CssCleaner
Приложение Windows для удаления неиспользуемых CSS классов.

3996605_3dGOLD125 (88x138, 9Kb)

ОПТИМИЗАЦИЯ

CSS Drive CSS Compressor
CSS компрессор с опциями компрессии «Слабая», «Нормальная» и «Сверхкомпактная».

Robson CSS Compressor
Еще один хороший инструмент для компрессии CSS файлов — Robson CSS Compressor. Пока он в стадии разработки, и возможны неточности в его работе.

MinifyMe – AIR Application

Небольшое AIR-приложение, которое позволит собрать несколько css-файлов в один.

3996605_3dGOLD11 (528x503, 246Kb)

ФОРМАТИРОВАНИЕ

CleanCSS – CSS Formatter and Optimizer
Clean CSS является популярным онлайн-инструментом для форматирования и оптимизации CSS. Содержит группы настроек для баланса между оптимизацией и читабельностью. Одна из важных возможностей – это автоматическое соединение одинаковых селекторов и свойств.

Styleneat
Styleneat преобразовывает код CSS в стандартизированный, удобный для чтения формат, структурирует таким образом, что становится легко понять где какие области и как они связаны друг с другом.

CSS Toolbox
Бесплатный CSS Toolbox включает множество инструментальных средств для быстрой и эффективной разработки CSS –валидатор, форматтер, оптимизатор.

3996605_translator11 (299x299, 61Kb)

БРАУЗЕРОЗАВИСИМОСТЬ

Conditional-CSS

Парсер CSS файлов на строне сервера с проверкой на тип и версию браузера. Позволяет сформировать специальные условные комментарии для различных групп браузеров. Доступны версии на PHP, C# и С.

Litmus
Litmus обеспечивает проверку во всех основных браузерах, а также представляет отчет об ошибках, чтобы помочь вам идентифицировать и исправить любые ошибки. По завершении проверки, вы можете составить отчет о совместимости, чтобы представить его клиентам. Для бесплатного использования Litmus предлагается ограниченная версия.

Web Browser CSS Support
Подробная таблица поддержки CSS-стандарта популярными браузерами.

When Can I Use
Даёт возможность сравнить поддержку браузерами различных новейших технологий, а именно — HTML 5, CSS 3, SVG и т.д. Можно выбрать как определённые браузеры, временные периоды, статусы, так и определённые технологии.


IE7.js
IE7-js это javascript библиотека, которая исправляет множество багов в HTML и CSS для версий Internet Explorer седьмой и ниже. К примеру, она исправляет поддержку прозрачности в PNG, фиксированное позиционирование элементов и фоновых изображений (position: fixed), поддержку псевдо класса: hover для всех тэгов и др.


Modernizr
Modernizr это небольшая простая javascript-библиотека, которая поможет использовать такие технологии, как CSS3, HTML5 в браузерах которые еще не поддерживают это технологии.

3996605_3dGOLD124 (118x114, 9Kb)

СЕЛЕКТОРЫ

Sizzle javascript Selector Library
Быстрый javascript движок выбора CSS селекторов. Sizzle поддерживает практически все CSS3 селекторы – даже такие редко используемые, как экранированные селекторы (”.foo\+bar”), юникодные селекторы и т.д.

SelectORacle
Сервис дает описание на человеческом языке сложных селекторов CSS и может быть очень полезен при изучении оных.

YUI Selector Utility
YUI Selector Utility позволяет использовать синтаксис CSS3 селекторов на javascript, упрощая сбор, фильтрацию и тестирование HTML элементов.

YUI StyleSheet Utility
С помощью StyleSheet Utility на лету создавать и модифицировать CSS стили.




Серия сообщений "Теги HTML":
Часть 1 - Бесплатные библиотеки, огромный выбор.
Часть 2 - В помощь работе с HTML кодами (тегами)
...
Часть 22 - Полезные Сервисы для дизайнеров и Web Разработчиков (Free OnLine Survice)
Часть 23 - Сервисы для CSS Разработчиков #1 (Free OnLine Service)
Часть 24 - Сервисы для CSS Разработчиков #2 (Free OnLine Service)
Часть 25 - Сервисы для CSS Разработчиков #3 (Free OnLine Service)
Часть 26 - Приложения для Web Дизайнеров (Free OnLine Service)
...
Часть 42 - Латинские буквы с диакритическими знаками - Спецсимволы
Часть 43 - Греческие Алфавит - Спецсимволы
Часть 44 - Таблица HTML - Спецсимволов (просто огромная)
Рубрики:  Советы Любознательному
Дело Техники
Free Online Services
Это, для Вас - Любимые!
OnLine приложения, для дома и офиса

0 коммент.:

Отправить комментарий

 
Copyright (c) 2012 - 2014г. by MerlinWebDesigner ©