1-я Частину курсу створюємо сайт з нуля (фотошоп верстка)

Сьогодні ми будемо розбирати одну велику тему, про яку мене багато і часто питають.

Питання звучить приблизно так: "Як намалювати сайт в Фотошопі і як його потім зверстати в реально працюючий сайт?"

До недавнього часу у мене зовсім не було бажання висвітлювати дану тему, тому що вона досить велика і неоднозначна, адже для кожного нового сайту процес малювання і верстки все одно буде відрізнятися.

Але приблизно місяць тому один славний хлопець на ім'я Felix Boyeaux створив урок зі створення сайту (дизайн + верстка) з нуля.

І навіть незважаючи на те, що ми розберемо створення дизайну і верстки тільки для одного сайту, я впевнений, що ці уроки дадуть Вам корисні знання саме по принципам створення дизайну і верстки. Там насправді багато цікавих моментів.

Весь процес розбитий на дві великі частини:

1. Дизайн сайту в Фотошопі

2. Кодування сайту за допомогою HTML + CSS + jQuery

1-я Частину курсу створюємо сайт з нуля (фотошоп верстка)

Урок 1. Введення, підготовка нового документа і його розмітка

1-я Частину курсу створюємо сайт з нуля (фотошоп верстка)

Тривалість: 12 хв 36 сек | Розмір: 25 Мб

Урок 2. Створюємо верхню частину сайту

1-я Частину курсу створюємо сайт з нуля (фотошоп верстка)

Тривалість: 20 хв 9 сек | Розмір: 28,3 Мб

Урок 3. Створення шапки і логотипу

1-я Частину курсу створюємо сайт з нуля (фотошоп верстка)

Тривалість: 11 хв 22 сек | Розмір: 16,7 Мб

Урок 4. Створення області контенту

1-я Частину курсу створюємо сайт з нуля (фотошоп верстка)

Тривалість: 9 хв 54 сек | Розмір: 16 Мб

Урок 5. Працюємо над центральною частиною сайту

1-я Частину курсу створюємо сайт з нуля (фотошоп верстка)

Тривалість: 9 хв 17 сек | Розмір: 14,6 Мб

Урок 6. Створюємо блок слайдшоу

1-я Частину курсу створюємо сайт з нуля (фотошоп верстка)

Тривалість: 10 хв 26 сек | Розмір: 11,4 Мб

Урок 7. Створюємо текстовий блок навпроти слайдшоу

1-я Частину курсу створюємо сайт з нуля (фотошоп верстка)

Тривалість: 12 хв 31 сек | Розмір: 16,2 Мб

Урок 8. Малюємо навігаційні вкладки

1-я Частину курсу створюємо сайт з нуля (фотошоп верстка)

Тривалість: 16 хв 57 сек | Розмір: 27,2 Мб

Урок 9. Створюємо блок для виведення записів з блогу

1-я Частину курсу створюємо сайт з нуля (фотошоп верстка)

Тривалість: 22 хв 33 сек | Розмір: 36 Мб

Урок 10. Створюємо блок твіттера

1-я Частину курсу створюємо сайт з нуля (фотошоп верстка)

Тривалість: 16 хв 16 сек | Розмір: 26,5 Мб

Урок 11. Створюємо футер і авторські права, виправляємо помилки

1-я Частину курсу створюємо сайт з нуля (фотошоп верстка)

Тривалість: 13 хв 43 сек | Розмір: 26,4 Мб

  • Я думаю, ви вже багато раз натрапляли на ефект дражливого куточка на сайтах різних інфобізнесменов. Цей прийом добре себе зарекомендував, тому за допомогою нього ви зможете трохи збільшити свою передплатну базу або підвищити продажі.

  • Гостьові книги часто використовуються на сайтах як ефективний спосіб зворотного зв'язку з людьми, які заходять на ваш сайт. Відвідувачі можуть висловити свою думку щодо сайту, дати якусь пораду або задати питання. І в цьому уроці ми встановимо на сайт, що працює на движку джумла, компонент гостьової книги phoca guestbook.

    1-я Частину курсу створюємо сайт з нуля (фотошоп верстка)

    За рахунок отримання інформації відразу по двох каналах (зір і слух) ефективність навчання значно перевершує навчання по книгах. А домашні завдання і онлайн-тести дозволять вам постійно думати на мові, що вивчається і відразу перевіряти свої знання!

    1-я Частину курсу створюємо сайт з нуля (фотошоп верстка)

    1-я Частину курсу створюємо сайт з нуля (фотошоп верстка)

    Якщо ви давно хочете як слід вивчити HTML, то у мене для Вас є чудова новина!

    1-я Частину курсу створюємо сайт з нуля (фотошоп верстка)

    Якщо ви вже вивчили HTML і хочете рухатися далі, то наступним кроком буде вивчення технології CSS.

    1-я Частину курсу створюємо сайт з нуля (фотошоп верстка)

    Якщо ви хочете розібратися з поняттями домену і хостингу, навчитися створювати бази даних, закачувати файли сайту на сервер по FTP, створювати піддомени, налаштовувати поштові скриньки для свого сайту і стежити за його відвідуваністю, то цей курс створений спеціально для вас!

    Схожі статті