Веб-дизайн Блога

  • Слайд 1
  • Слайд 2
  • Слайд 3
  • Слайд 4
  • Слайд 5
  • Слайд 6

Создание блога (27.03.2017)

Рисунок №1

Создавал этот блог во время одной из своих плановых тренировок по веб-дизайну, вёрстке и программированию сайтов.

Надеюсь, Вы понимаете, что сама тема "путешествия" меня совершенно не интересовала в данном случае.
Поэтому, ВСЕ его ссылки ведут на различные страницы моего основного ресурса, посвящённого разным способам создания сайтов.

Однако, сам дизайн сайта, его картинки, решил оставить такими, как я их сделал, занимаясь по курсу веб-дизайна.

Этот блог вполне можно использовать в качестве шаблона для создания какого угодно любого другого, изменив лишь контент. Поэтому я и решил открыть к нему общий доступ, переместив его из локального хранилища в раздел своего портфолио "Шаблоны сайтов".
Ну, а чем отличается блог от сайта, и отличается ли, желающие смогут узнать в продолжении этой заметки. Кстати, там же сможете посмотреть "живой", действующий, тестовый блог на "WordPress", где найдёте много полезной информации и видео-уроков о создании разных блогов.

Читать далее »

Метки: сайты, дизайн, веб-дизайн

Дизайн и вёрстка блога (29.03.2017)

Рисунок №2

Дизайн данного блога я сам не придумывал. Тему и дизайн-концепцию его взял из материалов обучающего курса.

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

Сначала, как и полагается по правилам, нашёл в интернете подходящие для темы блога рисунки, обработал их в фотошоп.
В дополнительных материалах курса уже имелись кое-какие заготовки, но хотелось ВСЁ сделать самому. "Подсмотрел" лишь нужные размеры.

Сам придумал, и добавил в правый блок подходящий статический баннер. Его Вы видите справа.
Мне так захотелось. Так интереснее учиться!
Кстати!  В материалах курса был исходник, НО(!) толку от него чуть. Весь дизайн "посыпался", лишь стоило мне добавить этот элемент в него. Пришлось вёрстку переделывать практически полностью.

Рисовал в программе "Фотошоп".  Хочу только заметить, что предварительная разметка страницы вспомогательными линиями, как было сказано в первом уроке курса, особого смысла не имеет, когда имеешь дело с реальным заказчиком, и дизайном реального сайта, а не учебного, как этот.

Впрочем, об удалённой работе над дизайном сайта Вы можете узнать, продолжив чтение.

Читать далее »

Метки: обучение, сайты в фотошоп, вёрстка

Программирование блога (31.03.2017)

Рисунок №3

После вёрстки HTML-шаблона блога, занялся его программированием, т.е. подключением скриптов слайдера, написанием собственных.

Вообще-то, мини-курс был посвящён "натягиванию" созданного шаблона на CMS "WordPress", но меня интересуют только сайты ручной работы, что, собственно, Вы и видите перед собой.

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

Кроме этого, добавил свечение у активных кнопок верхнего слайдера.  Думаю, так лучше.

Конечно, для программирования на любом сайте нужны знания не только самых базовых технологий интернета: HTML+CSS, но и (хотя бы основы) PHP, JavaScript и jQuery.

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

Читать далее »

Метки: javascript, jquery, php



На сайты Просто jQuery Фотошоп


Все права защищены. Copyright © 2009 - 2017 Коротеев Владимир.


Protected by Copyscape Duplicate Content Check
Яндекс.Метрика
Рейтинг@Mail.ru