Курсы web-дизайн: создание сайта «с нуля»

Web-дизайн: создание web-сайтов
  • Количество ак. часов: 32, занятий: 8
  • Базовая цена: 9000 руб.
  • Стоимость курса со скидкой: 8100 руб.
  • Этот курс прошли уже 5095 человек

По окончании обучения по курсу повышения квалификации вы получите Удостоверение учебного центра ГЦДПО

Записывайтесь сегодня, до открытия ближайшей группы остается 20 дней
  • assignment_lateЛицензия на образовательную деятельность

    Лицензия № 037133 от 16.02.2016 г. на право оказывать образовательные услуги по реализации образовательных программ по видам образования, по уровням образования, по профессиям, специальностям, направлениям подготовки (для профессионального образования) по подвидам дополнительного образования, указанным в приложении настоящей лицензии.

  • assignment_turned_inУчитываем требования профстандартов

    В учебном центре ГЦДПО содержание образовательных учебных программ учитывает: профессиональные стандарты; квалификационные требования, указанные в квалификационных справочниках по соответствующим должностям, профессиям и специальностям; квалификационные требования к профессиональным знаниям и навыкам, необходимым для исполнения должностных обязанностей, которые устанавливаются в соответствии с Федеральными законами и нормативными правовыми актами Российской Федерации.

  • schoolДокументы по окончании обучения

    Лицам, успешно освоившим дополнительную профессиональную программу и прошедшим итоговую аттестацию, учебный центр ГЦДПО выдает удостоверение о повышении квалификации или диплом о профессиональной переподготовке.

    Федеральный закон от 29.12.2012 N 273-ФЗ (ред. от 07.03.2018) "Об образовании в Российской Федерации". Статья 76. Дополнительное профессиональное образование.

Расписание и цены

Ближайшая группа
Время занятий
Цена
Скидка
Дни занятий
Тип группы обучения
Место / ФИО преподавателя
18:30 - 21:30
9000
0%
ВТ, ЧТ
Вечерняя
м. Белорусская - Семенов А.Б.
15:30 - 18:30
8100
10%
ПН, СР, ПТ
Дневная
м. Белорусская - Семенов А.Б.
13:00 - 16:00
9000
0%
СБ, ВС
Выходного дня
м. Белорусская - Семенов А.Б.
12:30 - 15:30
8100
10%
Интенсив
Дневная
м. Белорусская - Семенов А.Б.
18:30 - 21:30
9000
0%
ПН, СР, ПТ
Вечерняя
м. Белорусская - Семенов А.Б.
12:30 - 15:30
8100
10%
Интенсив
Дневная
м. Белорусская - Семенов А.Б.
10:00 - 13:00
9000
0%
СБ, ВС
Выходного дня
м. Белорусская - Семенов А.Б.
18:30 - 21:30
9000
0%
ПН, СР, ПТ
Вечерняя
м. Белорусская - Семенов А.Б.
12:30 - 15:30
8100
10%
Интенсив
Дневная
м. Белорусская - Семенов А.Б.
13:00 - 16:00
9000
0%
СБ, ВС
Выходного дня
м. Белорусская - Семенов А.Б.
15:30 - 18:30
8100
10%
Интенсив
Дневная
м. Белорусская - Семенов А.Б.

Описание курса

Учебный курс web-дизайна – обучение слушателей, чьи профессиональные интересы касаются области разработки и создания web-сайтов.

Цель курса:

  • научить самостоятельно создавать «с нуля» веб сайты на HTML и CSS, размещать их на реальных серверах под определенными доменными именами (адресами web-сайтов).

Специфика обучения web-дизайнеров

В рамках курса:

  • изучаются языки HTML (язык разметки гипертекста) и CSS (каскадные таблицы стилей), различные виды верстки web-страниц;
  • даются основные навыки работы в программах Adobe Dreamweaver, Adobe Photoshop и с локальным сервером Denwer;
  • демонстрируется практика работы с реальным сервером, взаимодействие с хостингом и выбор доменного имени.

Требования к начальной подготовке:

  • Учебная программа курса рассчитана на широкий круг слушателей, владеющих элементарными навыками работы с ПК.
  • Желательны навыки работы в программе Adobe Photoshop

«Городской Центр Дополнительного Профессионального Образования» предлагает вам выбрать удобное время обучения web-дизайну.

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

Учебная программа курса

Содержание образовательной (учебной) программы

 «Web - дизайн»

 

Занятие 1. Основы сайт строения. Методы и технологии создания современных сайтов. Основы HTML. Этапы создания сайта целиком и стартовой (главной страницы). Использование программ Adobe Dreamweaver и Adobe Photoshop при создании сайта.

Перечень основных вопросов, подлежащих изучению:

-       общие сведения о технологии создания сайтов;

-       язык разметки HTML как основа создания любого сайта;

-       теговая модель языка HTML;

-       основные теги языка HTML;

-       базовые теги для создания пустой web-страницы;

-       определение будущего проекта web-сайта в программе Adobe Dreamweaver и знакомство с интерфейсом программы;

-       настройка программе Adobe Dreamweaver под текущий проект;

-       создание первой web-страницы в программе Adobe Dreamweaver и сохранение ее в проекте;

-       создание описательных meta-тегов страницы, описание и назначение данных тегов;

-       понятие DOCTYPE;

-       структура HTML – основные теги html, head, title, body, синтаксис языка;

-       основные теги для создания теста на web-странице h1-h1(теги заголовков);

-       р (абзац), создание страницы с текстовым содержанием.

 

Занятие 2. Основы поэтапного создания web-страницы. Правила форматирования текста с использованием текстовых тегов. Оформление текста с использованием атрибутов тегов. Введение в CSS (каскадные стилевые инструкции).

Перечень основных вопросов, подлежащих изучению:

-       использование тегов h1-h6 для создания заголовков текстового содержания;

-       использование тегов p для создания абзацев текста;

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

-       оформление текста с помощью атрибутов тегов и тега font, понятие выравнивания текста, цвета текста и гарнитуры шрифтов;

-       определение технологии CSS как основного инструмента при стилизации и разметки страницы, принцип работы и взаимодействия CSS и HTML документов;

-       создание первого CSS документа и соединение его c HTML страницей, понятие селектора тега, создание селекторов тегов для стилевого оформления текстового содержимого web-страницы;

-       основные стили, свойственные текстовому содержимому (выравнивание-text-align, цвет-color, гарнитура шрифта-font-family, внешние и внутренние отступы-margin и padding, границы текстовой области-border и фон-background);

-       принципы создания web-страницы с текстовым содержанием;

-       теги ul, ol, li – для оформления маркированного и нумерованного списка

-       теги специальных возможностей br, pre, strong, em, hr;

-       тег span, его назначение и возможности в стилевом оформлении текста.

 

Занятие 3. Вставка изображений в web-страницу. Типы графических файлов подлежащих вставке в web-страницу. Оптимизация изображений для web-страницы с использованием программы Adobe Photoshop.

Перечень основных вопросов, подлежащих изучению:

-       типы графических файлов подлежащих вставке на web-страницу (jpg, png, gif) понятие размера и разрешения фотографии;

-       основные принципы оптимизации изображения для web в программе Adobe Photoshop, обрезка изображения, установка необходимого разрешения и установка размера в зависимости от ширины web-страницы;

-       сохранение изображения с использованием специальной функции программы Adobe Photoshop – сохранить для web и устройств непосредственно в папке проекта;

-       вставка изображения на страницу с использованием тега вставки изображений img, атрибуты специальных возможностей данного тега: ширина(width), высота(height), альтернативный текст(alt), описание изображения(title);

-       стили CSS для корректного отображения и позиционирования изображения на web-странице: обтекание(float), отступы(margin), границы(border), округления (border-radius);

-       использование изображения в качестве фона web-страницы;

-       создание страницы с текстовым содержанием и вставкой изображений с обтеканием текста справа и слева.

 

Занятие 4.  Верстка страницы. Создание каркаса страницы с использованием тега DIV 

Перечень основных вопросов, подлежащих изучению:

-       виды верстки страницы – блочная, табличная, гибридная, преимущества и недостатки каждой из версток;

-       создание каркаса страницы с использованием тега div;

-       тег div как контейнер для удобного и эффективного позиционирования с присвоением имени каждому контейнеру div через идентификатор id;

-       техника применения селектора идентификатора для тега div для удобного и адаптивного позиционирования элементов web-страницы;

-       основные свойства, сообщаемые через селекторы идентификаторов для тегов div непосредственно тегам div с соответствующими идентификаторами:

-       ширина (width), высота (height), выравнивание (margin), фон (background), границы (border), обтекания (float), абсолютное (absolut) и относительное (relativ) позиционирование (position), понятие слойности (z-index);

-       понятие очистки обтекания(clear) при блочной верстке.

 

Занятие 5. Практическое занятие № 1.

Содержание  занятия:

-       создание схемы (эскиза) каркаса web-страницы;

-       реализация данного эскиза в web-страницу.

1) Создание HTML страницы, CSS документ и соединение его с HTML документом, с использованием технологичных возможностей программы Adobe Dreamweaver.

2) Определение основных контейнеров DIV для элементов web-страницы:

шапки сайта, навигационного меню, левой колонки сайта, контентной части сайта и подвала (футера) сайта.

3) Определение в стилевом документе основных позиционных и стилевых свойств web-страницы (ширина (width), высота (height), выравнивание (margin), фон (background), границы (border), обтекание (float), абсолютное (absolut) и относительное (relativ) позиционирование (position), понятие слойности (z-index), понятие очистки обтекания (clear) при блочной верстке).

4) Проверка свойств и качества готового каркаса web-страницы по адаптивным характеристикам к электронным устройствам и мониторам.

5) Создание графического элемента – шапки сайта, с использованием программы Adobe Photoshop. Вставка шапки сайта в каркас подготовленной web-страницы.

 

Занятие 6. Гиперссылки. Создание навигационного меню.

Перечень основных вопросов, подлежащих изучению:

-       понятие гиперссылки, абсолютная и относительная гиперссылка;

-       тег ссылки a, атрибуты ссылки: href, title, target;

-       создание ссылки на web-странице, создание ссылки навигационного меню, создание всех ссылок навигационного меню с использованием технологичных возможностей программы Adobe Dreamweaver;

-       оформление ссылок горизонтального навигационного меню с помощью каскадных стилевых инструкций CSS;

-       оформление ссылок вертикального навигационного меню с помощью каскадных стилевых инструкций CSS;

-       создание дублирующего меню для подвала (футера) сайта;

-       изображение как ссылка, создание интерактивных графических элементов (кнопок) на web-станице;

-       карты-изображения позволяющие привязывать ссылки к разным областям одного изображения;

-       ссылка на адрес электронной почты;

-       ссылка на якорь;

-       создание страниц сайта, согласно подготовленному навигационному меню.

 

Занятие 7. Виды контента страниц сайта (статический сайт, в виде вывода табличных данных, интерактивные формы).

Перечень основных вопросов, подлежащих изучению:

-       создание контента для статичных (основных страниц), создание текста с встроенными изображениями для соответствующих страниц сайта;

-       теги для создания таблиц table, tr, td;

-       создание таблицы для вывода табличных данных на web-странице;

-       оформление таблицы с помощью соответствующих атрибутов тегов и с помощью каскадных стилевых инструкций CSS;

-       атрибуты colspan и rowspan для объединения строк и рядов таблицы;

-       варианты стилевого оформления страниц;

-       использование таблиц для создания каркаса web-страницы (табличная верстка);

-       оформление страницы «Контакты» с использованием форм и полей для создания формы обратной связи, теги form, input, textarea, select и атрибуты action, method, name, type;

-       принцип работы формы обратной связи и полей;

-       создание простой и защищенной формы обратной связи с использованием технологии spry средствами программы Adobe Dreamweaver.

 

Занятие 8. Практическое занятие № 2.

Содержание занятия:

-       окончательное оформление многостраничного сайта и подготовка его к публикации в сети интернет;

-       публикация сайта в сети интернет.

1) визуальный и синтаксический анализ сайта, проверка всех страниц и функционирования навигационных меню сайта, соответствие каждой из страниц сайта наименованию пункта меню и тематике содержания;

2) выбор хостинга (свободное доменное имя, регистрация на хостинге, выбор тарифного плана);

3) настройка хостинга – проверка серверных служб, создание связки домен-каталог сайта;

4) просмотр протоколов связи с сервером–http (HyperText Transfer Protocol-«протокол передачи гипертекста») и ftp(File Transfer Protocol-протокол передачи файлов);

5) создание соединения по ftp протоколу с сервером;

6) копирование файлов сайта на сервер;

7) проверка работоспособности сайта в режиме реального размещения на сервере;

8) регистрация сайта в поисковой системе Яндекс, первичные настройки индексирования;

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

Рекомендуем к изучению вместе с этим курсом

Преподаватели курса

Записаться на курс по телефону (495) 150-31-41 - до 21:00

Остались вопросы по обучению? Звоните! Наши менеджеры с радостью проконсультируют вас и расскажут о наших скидках и спецпредложениях.

Поделитесь с друзьями и коллегами в социальных сетях! Учитесь вместе!

Отзывы


Отзывы
Слушатель: Павликов Иван Александрович
Отзыв о работе менеджеров :
Все отлично, мне все нравится.
Отзыв о работе преподавателя :
Отличный преподаватель, веселый отзывчивый!
Отзыв и пожелания по курсу :
У меня нет пожеланий, все отлично!
Слушатель:
Оплата обучения

Свяжитесь с нами по телефону +7 (495) 150-31-41 сразу после оплаты. Спасибо!

Форма обучения*

Цена: рублей














Предварительная запись на курс