Полезные ресурсы для web - мастера

В этой теме собираем все, что может понадобиться для работы web мастера. Платные ресурсы - не предлагать!

Песочницы
https://jsfiddle.net
https://codepen.io/

HTML
http://www.phpform.org/ - генератор форм
http://www.w3schools.com/ - справочник с возможностью редактирования кода
https://html5css.ru/ - справочник
http://seodiz.ru/pravilnyj-doctype-html - все правильные doctype и запрещенные в них HTML теги
uncss-online.com - удаление неиспользуемых стилей + Shorthand

Программа для генерации кода сложных таблиц. Спасибо за разработку newJS

Вопросы и пожелания по программе - озвучиваем здесь.
Table_Generator_2.0.7z

Линейки для вебмастера

Экранные линейки.zip

http://www.blacksunsoftware.com/colormania.html - color mania - программа для выбора цвета на экране

ColorManiaSetup.zip

Типовые макеты
http://htmlbook.ru/samlayout/tipovye-makety
http://blog.html.it/layoutgala/
http://www.dynamicdrive.com/st... egory/C10/

CSS
http://jigsaw.w3.org/css-valid... _by_upload онлайн валидатор. Не работают стили - вам сюда
http://css3generator.com - CSS3 генератор
http://css-tricks.com/examples/ButtonMaker/ сервис для генерации кнопок на css
http://dabuttonfactory.com/ сервис для генерации кнопок на css
http://www.colorzilla.com/gradient-editor/ Сервис для генерации градиентов на css
http://border-image.com/ Сервис для создания рамок для рисунков
http://bearcss.com/ генератор css для html
http://simpreal.org.ua/csssprites онлайн генератор css спрайтов
http://www.useragentman.com/IE... ranslator/ Трансформации для IE
http://css3gen.com/box-shadow/ генератор теней
http://www.cssmatic.com/box-shadow генератор теней
http://flexbox.help/ как будет выглядеть выравнивание и расположение блоков при различных вариантах использования свойства flex
https://protocoder.ru/css/strokeTextGen обводка текста на css3
http://cssarrowplease.com/ - генератор CSS кода декоративной стрелки у блока.

http://css3pie.com/documentation/getting-started/ - для работы некоторых свойств css3 в IE, не поддерживаемых по умолчанию PIE
http://lea.verou.me/css3patterns/ - background-паттерны на CSS3
http://subtlepatterns.com - обновляемая коллекция bg-паттернов

Компрессия кода
CSS
http://www.cleancss.com
http://www.cssportal.com/css-optimize/
http://www.generateit.net/css-optimize/
http://www.homepage-performanc... -tool.html
http://www.pagecolumn.com/tool/css_compressor.htm
http://www.lotterypost.com/css-compress.aspx
http://www.codebeautifier.com/
http://www.askapache.com/onlin... press-css/
http://tools.arantius.com/css-compressor
http://www.phpinsider.com/compress_css.php
http://www.csscompressor.com/
http://www.creativyst.com/Prod/3/

JavaScript
https://jscompress.com/
https://www.toptal.com/develop... -minifier/
https://refresh-sf.com/
https://www.digitalocean.com/c... ols/minify

Расширение для Photoshop, умеющее конвертировать стили слоя в css3 код: https://css3ps.com
Понимает линейные градиенты, тени, обводки, радиусы фигур, размеры фигур, семейство шрифта и др.

Онлайн генераторы CSS3 — в обойме инструментов web-разработчика

Типографика, шрифты
Google Web Fonts - Google Web Fonts
fontello.com - Генератор иконочных шрифтов
https://grtcalculator.com/ - подбор размера шрифта, междустрочного интервала и ширины контента на основе золотого сечения
http://www.fontsquirrel.com/fo... e/cyrillic подборка кириллических шрифтов
www.blindtextgenerator.com - генератор текстов-рыб
http://www.typograf.ru/ Web типограф
http://fontstruct.com - создание шрифтов онлайн
http://www.fontsquirrel.com/fontface/generator Font-face Kit Generator - генерация наборов
http://www.font2web.com - конвертация шрифтов под web
http://www.freefontconverter.com/ - шрифт под web
http://everythingfonts.com/font-face - шрифт под web

Подборка ссылок на статьи о типографике:

Основы типографики
Типографика для веб
Типографика на Вебе

Дизайн
www.tartanmaker.com - генератор тартан bg паттернов
www.stripegenerator.com - генератор паттернов из линий
www.patterncooler.com - генератор/редактор фоновых паттернов
http://0to255.com - подбор цвета
https://paletton.com/ - подбор цветовой палитры
https://color.adobe.com/ru/create - подбор цветовой палитры
https://coolors.co - подбор цветовой палитры
http://pixlr.com/editor/ - растровый онлайн редактор
http://colorscheme.ru/ - сервис для подборки цветовых схем
http://colllor.com/ - подбор цвета тени
http://kraken.io/ онлайн оптимизация изображений
http://www.roundpic.com/ - скругление углов изображения
http://weavesilk.com - создание красивых обоев на основе одного эффекта
http://thenounproject.com - бесплатные иконки
http://www.iconsearch.ru/ - поиск иконок по ключевым словам
http://www.iconfinder.com/ - Поиск иконок по ключевым словам
http://labs.tineye.com/multicolr/ - поиск фотографий по цветовой гамме
http://www.colorsontheweb.com/colorwizard.asp - подбор гармоничных цветов
http://patterns.ava7.com/ - паттерны
https://cloudconvert.com/eps-to-svg - конвертация фотошоп файлов eps в svg
SVGO - минификация SVG , полезен после для чистки svg после редакторов вроде Illustrator или Inkscape

Генераторы прелоадеров
http://www.ajaxload.info/
http://www.loadinfo.net/
http://mentalized.net/activity-indicators/
Проверка на валидность и совместимость
http://www.responsinator.com/ - как сайт будет выглядеть на разных разрешениях экрана
https://www.browserstack.com/responsive - online mobile tester
https://chrome.google.com/webs... boaccidbal - Resolution Test для Google Chrome позволяет эмулировать изменение разрешение
монитора за счет изменения размеров окна браузера
Can I use... - в удобном виде представлено, какой функционал поддерживают разные браузеры и их версии

Проверяйте свои творения, прежде чем это сделает за вас посетитель вашего сайта
W3C Markup Validation Service
W3C CSS Validation Service
XML Validation

Разное
http://getcover.ru - генератор "рамок" браузера или телефона. примечателен кнопкой "Забацать"
http://popinbuilder.icoder.com/ - сервис для генерации popup баннеров
http://snippets.su/ - сниппеты
http://htaccess.madewithlove.be - .htaccess-тестер
www.asciiflow.com - создание ASCII таблиц
http://www.maschek.hu/imagemap/imgmap - генератор карт со сложными полигонами
http://word2cleanhtml.com/ - очистка текстов от стилей word перед вставкой в материалы
http://www.comslider.com/ - генератор каруселей
unicode-table.com - таблица символов Юникода
http://html5boilerplate.com/ - HTML/CSS/JS шаблон
Обзор онлайн-сервисов для веб-разработки и дизайна

Интересные сайты
http://www.dejurka.ru - сайт, посвященный дизайну
http://dribbble.com - в поисках вдохновения. "Твиттер" для дизайнеров
http://cvparade.com - вдохновение типографика
http://noteandpoint.com
http://bookcoverarchive.com
http://www.awwwards.com
http://www.typographyserved.com
https://tympanus.net/codrops/category/playground/