#radiobells_script_hash

Премиум-шаблон сайта-портфолио

  • В данном курсе мы будем создавать сайт-портфолио для фотографа.
  • Фотограф — это, в некоторой степени, художник. И, как и художник, фотограф видит мир по-своему, под своим творческим углом смотрит на все вокруг и видит мир несколько по-иному, не так как большинство людей. Поэтому и сайт, который мы будем создавать для портфолио фотографа, будет необычным.
  • Сайт-портфолио будет включать в себя шесть шаблонов страниц отличающихся друг от друга по дизайну.
  • В качестве центрального элемента, объединяющего все страницы, выступает красивая яркая фотография, которая является тянущимся фоном для всей страницы.
  • На страницах сайта контент располагается в две колонки, в три колонки.
  • На одной из страниц область основного контента разбивается еще на две колонки.
  • На главной странице сайта присутствует карусель изображений.
  • На страницах портфолио будет установлена симпатичная галерея-слайдер фотографий.
  • Изучив и посмотрев, как создается такой сайт, можно отметить для себя массу полезных вещей, усовершенствовать свои знания и действительно многому научится.
  • Вы усовершенствуете свою верстку, овладеете новыми техниками и приемами верстки.
  • Установите на WordPress нестандартный, и, казалось бы, совсем не WordPress-овский сайт.
  • В итоге сайт получится красивый, нестандартный, интересный, с обширным функционалом.
  • И работать над созданием такого сайта, поверьте, одно удовольствие!

В итоге мы получим верстку:

  • Кроссбраузерную

    Верстка будет отображаться одинаково хорошо во всех браузерах

  • Легко масштабируемую

    Страницы не будут «рассыпаться» при добавлении новых блоков контента

  • Блочную

    При верстки страниц не используется ни одной таблицы

Изучив этот блок курса вы узнаете:

  • Как максимально эффективно исследовать PSD-макет сайта
  • Как определить подходящую разметку страницы
  • Как вставить сложное фоновое изображение на всю страницу
  • Как работать с несколькими фонами и градиентами
  • Как спроектировать общую структуру для различных по дизайну страниц
  • Узнаете тонкости поведения плавающих блоков и свойства float
  • Как определить и вырезать необходимые изображения
  • Как пользоваться псевдоклассами
  • Как эффективно использовать псевдоклассы
  • Как эффективно работать с отступами
  • Как установить галерею на сайт и что для этого необходимо
  • Как разобраться со всеми подключаемыми файлами и скриптами
  • Как грамотно организовать структуру галереи и назначить нужные пути к файлам скриптов
  • Как добавить в галерею свои собственные стили
  • Как описать навигацию, не используя лишние теги
  • Как предусмотреть все возможные поведения сайта при его наполнении и избежать возможных проблем
  • Как предусмотреть и описать все возможные элементы, которые могут быть на сайте, но которых нет в макете
  • Как, используя Firebug, найти нужные стили и изменить их

А теперь смотрим уроки этого видео-курса:

01. Введение. смотреть видео
02. Установка основного фона. смотреть видео
03. HTML разметка шапки сайта. смотреть видео
04. CSS стили шапки сайта. смотреть видео
05. Установка карусели. смотреть видео
06. Замена дизайна карусели. смотреть видео
07. HTML разметка блоков контента. смотреть видео
08. CSS стили блоков контента. смотреть видео
09. HTML разметка футера. смотреть видео
10. CSS стили футера. смотреть видео
11. Назначение стилей для IE. смотреть видео
12. Вёрстка страницы выставок. смотреть видео
13. Вёрстка страницы о фотографе. смотреть видео
14. HTML разметка страницы контактов. смотреть видео
15. CSS стили страницы контактов. смотреть видео
16. Вёрстка страницы портфолио. смотреть видео
17. Установка галереи. смотреть видео
18. Замена дизайна галереи. смотреть видео
19. Заключение. смотреть видео
20. Анализ структуры темы. смотреть видео
21. Перенос шаблона в папку темы. смотреть видео
22. Создание меню. смотреть видео
23. Работа со слайдером карусель. смотреть видео
24. Вывод записей на главной странице. смотреть видео
25. Добавление поддержки миниатюры. смотреть видео
26. Реализация виджетов футера. смотреть видео
27. Создание шаблона отдельной страницы часть 1. смотреть видео
28. Создание шаблона отдельной страницы часть 2. смотреть видео
29. Написание шаблона стандартной рубрики. смотреть видео
30. Реализация шаблона рубрики выставок. смотреть видео
31. Добавление шаблона записи. смотреть видео
32. Создание функционала галереи. смотреть видео
33. Добавление мета-данных рубрики выставки. смотреть видео
34. Создание страницы контактов часть 1. смотреть видео
35. Создание страницы контактов часть 2. смотреть видео
36. Завершение создания темы. смотреть видео
37. Адаптриуем главную страницу под планшет часть 1. смотреть видео
38. Адаптриуем главную страницу под планшет часть 2. смотреть видео
39. Адаптируем внутреннюю страницу под планшет. смотреть видео
40. Адаптируем страницы портфолио и выставки. смотреть видео
41. Устанавливаем адаптивное меню. смотреть видео
42. Адаптируем сайт под смартфон. смотреть видео
43. Адаптируем страницу контактов. смотреть видео
44. Заключение. смотреть видео

 

Спасибо что дочитали статью до конца, и если вам понравился или не понравился материал, прошу оставить отзыв для улучшения качества материала. Оставляйте свои комментарии и делитесь с друзьями. А также если Вы желаете получать новые статьи и материалы нашего блога подписывайтесь на обновления нашего сайта. Получить новую информацию.

 
Для получения новостей введите свой e-mail:


Наверх