В данной теме я предлагаю собрать эдакую "копилку" веб-мастера, т.е. сайты, сервисы и инструменты, с которые веб-дизайнерам и веб-программистам часто приходят на помощь в их нелегком деле.
+сайты
-- сайты-справочники;
-- сайты с уроками и готовыми решениями на js, html, css и т.д.;
-- сайты с клиапартом, иконками, готовыми psd;
-- сайты для вдохновения;
+генераторы и инструменты для создания отдельных элементов
-- генераторы css3;
-- html-генераторы;
-- html- и css-шпаргалки;
+сервисы, связанные с колористикой
-- сервисы, позволяющие подобрать цвета для сайта;
+он-лайн площадки для написания html, js;
+IDE для веб-разработки, html-редакторы;
+Плагины к браузерам
+...
Если Вы что-то такое есть у Вас в закладках или висит ярлыком на рабочем столе - не стесняйтесь, расскажите об этом всем, описав кратенько для чего это надо и как этим пользоваться! Возможно, немало начинающих веб-дизайнеров будут Вам благодарны.
Я начну пополнять нашу копилку, с моей собственной
1. ТОП10 сайтов, которые пригодятся начинающему или не очень веб-разработчику:
1. http://htmlbook.ru
Один из подробнейших справочников по css и html на русском языке с самоучителем по тем же технологиям.
Рядом с ним стоит поставить справочник и учебник по javascript: http://javascript.ru/
2. http://habrahabr.ru/
Крупнейшая айтишная социальная сеть. Если Вы хотите следить за совершенствованием веб-технологий добавьте ссылку на Хабр в Ваш rss-reader .
3. http://ruseller.com/
Для тех, кто не дружит с английским языком - этот сайт будет незаменимой палочкой-выручалочкой. Публикуется очень много переводных статей, касающихся различных css-приемов и js-решений.
4. http://css-tricks.com/
Самый популярный англоязычный сайт с туториалами по css. Очень много видео-уроков и готовых решений.
5. http://www.cssplay.co.uk/
Один из крупнейших англоязычных сайтов, посвященных css. Можно найти очень много готовых интересных и необычных css-решений.
6. http://css-live.ru/
Молодой сайт, посвященный верстке и веб-разработке. Можно найти различные статьи, уроки, трюки и приемы на русском языке. А так же поучаствовать в работе сайта
7. http://net.tutsplus.com/
Очень много уроков и статей по веб-технологиям. На английском языке.
8. http://www.impressivewebs.com/
Уроки, статьи и готовые решения на английском.
9. http://www.cssreflex.com/
Статьи и уроки по веб-дизайну.
10. http://cssdeck.com/
Множество готовых css-решений, зачастую очень неординарных и необычных. Использовать для вдохновения
2. Справочники и самоучители по javascript
1. http://javascript.ru/manual[html]<sup class="thanks">Спасибо, Deff</sup>[/html]
Справочник по javascript.
2. http://jquery-docs.ru/Selectors/ и http://jquery.page2page.ru/tags/ifr.html[html]<sup class="thanks">Спасибо, Deff</sup>[/html]
Русская документация по jQuery
3. http://slyweb.ru/jquerymain/
Еще одно руководство по jQuery на русском языке.
3. Помощь в работе с css3 и html5
1. http://caniuse.com/ и http://www.browsersupport.net/
Эти сайт поможет Вам проверить, как то или иное свойство поддерживается различными браузерами.
2. http://www.css3shapes.com/
Шпаргалка по созданию различных геометрических фигур с помощью css3
3. http://cssarrowplease.com/
Инструмент для быстрого создания тултипов
4. http://www.colorzilla.com [html]<sup class="thanks">Спасибо, Eri</sup>[/html]
Advanced Colorful Goodies. Дополнения для Хрома и Фаерфокса с возможностью использования расширенной пипетки для цветов в браузера. Так же очень удобный сервис создания градиентов для использования в css.
4. Категория "Под рукой"
1. http://hakim.se/experiments/html5/sketch/
Хотите нарисовать какой-то набросок, но нет ничего под рукой? Тогда Вам сюда
5. Тестирование и оптимизация сайтов
1. http://site-perf.com/ [html]<sup class="thanks">Спасибо, Deff</sup>[/html]
Тест загрузки Сайтов
6. Колористика
1. http://colorschemedesigner.com [html]<sup class="thanks">Спасибо, Eri</sup>[/html]
Дизайнер цветовых схем. Для тех, у кого проблемы с подбором цветов для дизайна. Данный инструмент поможет создать цветовую схему используя два, три или четыре сочетающихся цвета по художественным правилам.
2. http://www.colourlovers.com [html]<sup class="thanks">Спасибо, Eri</sup>[/html]
Любители цветов. В этом сообществе можно найти готовые цветовые решения для дизайнов, фоны и проч.
3. http://www.colorzilla.com [html]<sup class="thanks">Спасибо, Eri</sup>[/html]
Advanced Colorful Goodies. Дополнения для Хрома и Фаерфокса с возможностью использования расширенной пипетки для цветов в браузера. Так же очень удобный сервис создания градиентов для использования в css.
7. Плагины к браузерам
Mozilla Firefox
Firebug - плагин, реализующий инструменты для веб-разработки для Mozilla Firefox. Кроме того, позволяет использовать дополнительные расширения, такие как YSlow или Pixel Perfect.
YSlow - плагин, позволяющий измерять скорость загрузки страницы и ее отдельных компонентов, вес страницы и ее содержимого, а так же вести более тонкий анализ и оптимизацию сайта. Ставится к плагину Firebug.
Pixel Perfect - плагин, значительно упрощающий верстку. Позволяет "подложить" под страницу изображение-макет. Ставится к плагину Firebug.
Fireshot - незаменимый плагин. Позволяет в один клик сделать скриншот, опубликовать его в сети, отредактировать, распечатать, послать по почте и т.д. Может делать скриншоты видимой части сайта, всей страницы или определенной области.
Html Validator - инструмент "в фоне" проверяющий валидность страниц.
Web Developer - дополнительная панель для Firefox, включающая множество инструментов для проверки кода и отображения страницы в разных режимах (при разных разрешения, при отключенном яваскрипте, при отключенных изображениях и т.д.)
Colorzilla - дополнения для Firefox с возможностью использования расширенной пипетки для цветов в браузера.
Google Chrome
Colorzilla - дополнения для Хрома с возможностью использования расширенной пипетки для цветов в браузера.