77 способов сделать жизнь веб-дизайнера легче

Инструменты по работе с цветом

Выбор цветовой гаммы- непростое дело. В этом вам помогут следующие полезные инструменты:

• Color Schemer Gallery
• COLOURlovers
• Website Color Picker
• I Like Your Colors

Полезная статья на английском: Find the Perfect Colors for Your Website.

Готовые меню для сайта на основе CSS

Навигация сайта на основе CSS (Каскадных Таблиц Стилей) сейчас очень популярна. К тому же вам не надо создавать все эффекты с нуля. Существует множество уже готовых эффектных меню. Вы можете сразу установить эти меню на свой сайт или блог либо немного отредактировать их, чтобы они более гармонично вписались в ваш дизайн.

• Listamatic
• Exploding Boy
• Alvit.de
• Dynamic Drive
• Коллекция CSS меню vandelaydesign.com

Фотографии для вашего сайта

Эффектные фотографии могут преобразить внешний вид вашего сайта. Вы можете найти множество бесплатных изображений на интернете.

• Stock.Xchng - бесплатные фотографии.
• Stock Expert - платные фотографии.
• iStockphoto - платные фотографии.
• Big Stock Photo - платные фотографии.

Иконки

• IconFinder.net - Поисковая система по иконкам.
• 31 источник бесплатных и эффектных иконок

Заготовки для шаблонов WordPress

Если вы сами создаете шаблоны для WordPress, то вы сможете сэкономить себе массу времени, загрузив эти заготовки для шаблонов (от Tomorrow’s Laundry).

Шаблоны сайтов на основе CSS

Вы сможете также сэкономить массу времени, если начнете свой дизайн сайта не с нуля, а с использования шаблона сайта на основе CSS. Многие дизайнеры использовали в своих сайтах подобные шаблоны.

• Layout-O-Matic - Сервис позволяет создать собственные шаблоны сайтов на основе CSS.
• CSS Creator - генератор CSS шаблонов.
• Layout Gala - Коллекция шаблонов для сайтов.
• Open Designs - Бесплатные шаблоны.
• Open Source Templates - Еще масса бесплатных шаблонов сайтов.

Сервис по проверке неработающих ссылок

Неработающие ссылки отрицательно влияют на посетителей. Для быстрой и регулярной проверки неработающих ссылок воспользуйтесь этими сервисами:

• DeadLinks.com
• Online Link Validation Tool

Проверка сайта в разных браузерах

Проверка того, как сайт отображается в разных браузерах- это неотъемлемая часть создания дизайна сайта. Проверить, как выглядит тот или иной сайт в разных браузерах, вы можете с помощью этих сервисов:

🔥 Кстати! Я провожу платный курс по продвижению англоязычных сайтов SEO Шаолинь seoshaolin.com. Для читателей блога я делаю хорошую скидку. По прокомоду "блог" тариф Про стоит не 50, а 40 тыс. рублей. Тариф Лайт не 25, а 20 тыс. рублей. Тариф Команда не 75, а 60 тыс. рублей. Пишите мне в Telegram @mikeshakin.

• Browser Shots
• Browsercam
• NetMechanic

Также можете ознакомиться с этой статьей (на английском): Effectively Testing Your Website in Multiple Browsers.

Валидаторы

Валидность кода Вашего сайта можно проверить с помощью этих полезных сервисов:

• HTML
• CSS
• RSS and Atom
• RSS, Atom, and KML

Скрипты

Нет необходимости придумывать колесо. Сэкономьте время, используя готовые и успешно работающие скрипты:

• JavaFile
• PHP Freaks
• DynamicDrive
• The JavaScript Source
• PowerfulScripts
• DHTMLGoodies.com
• PHP Open Source Scripts

Генератор фавиконок

Фавиконки (маленькие изображения с логотипом сайта в адресной строке браузера, а также слева от названия сайта в результатах поисковиков) становятся все более популярны. Используя эти сервисы можно легко и быстро создать свой фавикон:

• Dynamic Drive
• Favicon from Pictures
• FaviconGenerator.com
• Favicons with text instead of images
• Graphics Guru

Шрифты

Шрифты очень важны в дизайне. Вот подборка прекрасных сайтов со множеством шрифтов:

• 80 Beautiful Typefaces for Professional Design (Smashing Magazine)
• dafont.com
• Urban Fonts
• 1001 Free Fonts

Web 2.0 Инструменты

Большинство современных web 2.0 и социальных медиа сайтов имеют схожие элементы дизайна. Попробуйте эти сайты для создания современного и эффектного дизайна:

• Генератор полосок
• Web 2.0 Бэджики
• Еще Web 2.0 Бэджики
• Web 2.0 Иконки
• Web 2.0 генератор логотипов
  

Генераторы кнопок

Кнопки повсюду. Они легко и просто создаются с помощью этих инструментов:

• Dynamic Drive
• Kalsey.com
• Lucazappa.com
• Blog Flux
• Yugatech.com
• MyCoolButton
• Buttonator
  

Генератор градиентов

Градиент- неотъемлемая часть стиля web 2.0. С этими инструментами вы сможете создать любой градиент в несколько кликов:

• Dynamic Drive
• 4u2ges.com

Круглые углы

Блоки меню с круглыми углами теперь может создать каждый:

• CSS Rounded Box Generator
• Spiffy Corners

Картинки комментариев и цитат на основе CSS

Картинки комментариев и цитат придадут вашему дизайну индивидуальность:

• WillMayo.com
• CSS Play

Иструменты CSS

Если вы хотите очистить, оптимизировать и уменьшить размер кода своего файла CSS, то эти инструменты как раз для вас:

• CSS Tidy - CSS оптимизатор и парсер.
• Clean CSS - CSS оптимизатор.
• CSS Optimizer
• CSS Analyzer - к тому же валидатор.
• CSS Mate - онлайн редактор CSS.
• CSS Compressor - компрессор CSS.

DHTML Меню для сайта

Xtreeme DHTML Menu Studio платный инструмент для быстрого создания динамических меню для сайта.

Полезное

• Web Host Uploader
  - Простой инструмент, позволяющий загружать обновления на сайт одним кликом. Избавляет от необходимости загружать новые файлы по FTP вручную.
• Веб Стандарты от Max Design.
• Firebug Адд-он для браузера Firefox - Работайте с кодами CSS, HTML и JavaScript на любой странице любого сайта.
• Web Developer Firefox Адд-он - Тулбар для браузера Mozilla Firefox с массой полезных опций для веб-дизайнера.

Источник

Перевод с английского: Глобатор

Подпишитесь на рассылку блога с полезными материалами по SEO

Shakin sidebar