Создаем сайт с нуля (Фотошоп+верстка) [2009, RUS]

Ответить на тему
 
Автор Сообщение

user ®

Стаж: 8 лет 7 месяцев

Сообщений: 20007

Пост Пост: #1 от 17-Июл-2012 09:57

[Цитировать]

Создаем сайт с нуля (Фотошоп+верстка)
Год выпуска: 2009
Сайт производителя: http://www.evgeniypopov.com/
Автор: Евгений Попов
Тип раздаваемого материала: Видеоурок
Язык: Русский
Описание: Как нарисовать сайт в фотошопе и как его потом сверстать в реально работающий сайт?
Один славный парень по имени Felix Boyeaux создал урок по созданию сайта (дизайн+верстка) с нуля:
http://net.tutsplus.com/tutorials/design-tutorials/design-and-code-a-slick-website-from-scratch-–-part-i/
Просмотрев данный урок, я подумал, почему бы не записать видео по нему, тем более что сам я не дизайнер и у меня вряд ли получится создать такой же красивый сайт как у него.
И даже не смотря на то, что мы разберем создание дизайна и верстки только для одного сайта, я уверен, что эти уроки дадут Вам полезные знания именно по принципам создания дизайна и верстки. Там на самом деле много интересных моментов...
... Честно говоря, я был удивлен тем, насколько популярной оказалась тема создания сайта в Фотошопе с последующей его версткой.
Еще недавно мне казалось, что в наше время все больше людей предпочитают создавать сайты с помощью CMS-систем, но как оказалось, любителей сделать сайт самостоятельно тоже немало!
Поэтому вторую часть курса я постарался сделать максимально подробной. Но не забывайте, что невозможно на примере верстки одного сайта научить человека сверстать любой сайт.
Самое главное в тех уроках, которые я для Вас подготовил в этом выпуске - понять сам принцип верстки сайта из PSD-макета. А уже на основе этих принципов, с помощью практики Вы сможете научиться верстать сайты и из любых других PSD-файлов.
Содержание

Часть 1 - Дизайн сайта в Photosop

Урок 1. Введение, подготовка нового документа и его разметка
Урок 2. Создаем верхнюю часть сайта
Урок 3. Создание шапки и логотипа
Урок 4. Создание области контента
Урок 5. Работаем над центральной частью сайта
Урок 6. Создаем блок слайдшоу
Урок 7. Создаем текстовый блок напротив слайдшоу
Урок 8. Рисуем навигационные вкладки
Урок 9. Создаем блок для вывода записей с блога
Урок 10. Создаем блок твиттера
Урок 11. Создаем футер и копирайты, исправляем ошибки

Часть 2 - Кодирование сайта с помощью HTML+CSS+jQuery

Урок 1. Подготовка к работе.
Урок 2. Разбиваем макет на блоки и кодируем верхнюю панель.
Урок 3. Пишем HTML код шапки сайта.
Урок 4. HTML-код для навигационной панели.
Урок 5. Создаем основу центрального блока.
Урок 6. Пишем HTML-код для блоков "блог" и "твиттер".
Урок 7. Создаем второстепенные таблицы стилей CSS.
Урок 8. Создаем основную таблицу стилей и подключаем к ней второстепенные.
Урок 9. Готовим изображения для кодирования верхней панели.
Урок 10. Работаем с CSS-кодом верхней панели.
Урок 11. Пишем CSS-код шапки сайта.
Урок 12. Переходим к CSS-правилам для блока с основным контентом.
Урок 13. Создаем основу центрального блока.
Урок 14. С помощью CSS приводим блок слайдшоу и сообщения к нужному виду.
Урок 15. Готовим спрайт для навигационного меню.
Урок 16. Кодируем навигацию на основе спрайта.
Урок 17. Пишем CSS-код для модуля блога.
Урок 18. Пишем CSS-код для модуля твиттера.
Урок 19. Кодируем футер.
Урок 20. Javascript, jQuery, Cufon.
Урок 21. Включаем слайдшоу с помощью jQuery cycle plugin.
Урок 22. Выравниваем фоновые изображения по центру.
Формат видео: Flash

Скриншоты

Скачать

Скачать торрент!

Как скачивать? · Что такое торрент? · Рейтинг и ограничения

Сайт не распространяет и не хранит электронные версии произведений, а лишь предоставляет доступ к создаваемому пользователями каталогу ссылок на торрент-файлы, которые содержат только списки хеш-сумм

[Профиль] [ЛС]
Показать сообщения:    
Ответить на тему

Текущее время: Сегодня 18:57

Часовой пояс: GMT + 4



Вы не можете начинать темы
Вы не можете отвечать на сообщения
Вы не можете редактировать свои сообщения
Вы не можете удалять свои сообщения
Вы не можете голосовать в опросах
Вы не можете прикреплять файлы к сообщениям
Вы не можете скачивать файлы