Программа курса
По окончании курса "Web-дизайн от А до Я" вы получите достаточно знаний для создания хорошего полноценного сайта с элементами программирования с использованием современных систем управления сайтами (CMS) и современными Web-технологиями. Курс "Web-дизайн от А до Я" - профессиональная программа, которую преподают отличные преподаватели.
Профессия веб дизайнера очень популярна, высокооплачиваема и востребована на рынках труда. Веб дизайнеры, работающие во фрилансе не менее успешны и востребованы. Если вы хотите стать высококлассным специалистом в области web дизайна, курс ВЕБ дизайн от А до Я в нашем центре даст профессиональную подготовку.
Хороший веб-дизайнер должен многое знать и многое уметь, а именно: разработать концепцию сайта, выбрать для её реализации самый оптимальный путь, иметь безупречный вкус, уметь применять свой креатив в каждой конкретной цели, безупречно знать программирование, владеть основами колористики, приемами продвижения и раскрутки сайта. Курс WEB дизайн от А до Я от УЦ «Успех» поможет овлвдеть новой специальностью.
Работы наших выпускников
Мы предлагаем также и другие курсы по web:
Веб-дизайн — это то, с чего начинается сайт для вашего посетителя. Это — то первое впечатление, после которого посетитель решает, останется он на Вашем сайте или нет. Причем, это решение он принимает интуитивно и быстро. Поэтому от веб-дизайнера напрямую зависит, насколько эффективно он сможет представить информацию и какое число посетителей остановит свой выбор на данном сайте.
Web-дизайнер – специалист, отвечающий за структуру и "лицо" сайта. В его обязанности входят создание макета сайта, разработка навигации, создание и оптимизация всех графических элементов – от простых кнопок до интерактивных баннеров.
Общее описание курса Web-дизайн с нуля: Вы научитесь создавать хорошие макеты сайтов, разрабатывать для них удобную навигацию, создавать и оптимизировать все графические элементы сайта, изучите возможности программ для создания веб-страниц, сможете грамотно размещать информацию на сайте, научитесь работать графических пакетах Photoshop и Illustrator. Применяя знания, полученные в курсе Web-дизайна , Вы сможете сделать сайт интересным и посещаемым!
По окончании курса Web-дизайн наши слушатели будут уметь:
- Создавать веб-страницы, используя различные программы
- Грамотно размещать информацию на сайте
- Разрабатывать навигацию, использовать шаблоны
- Подбирать изображения нужного формата и размера
- Использовать gif-анимацию
- Работать с баннерами
- Создавать стильные, современные и удобные сайты!
- Пользоваться инструментами веб-дизайнера на профессиональном уровне!
- Оценивать и тестировать сайт
- Взаимодействовать с заказчиком!
Занятия проводятся в наших современных компьютерных классах, оснащенных всем необходимым оборудованием. В классах кондицинеры, вода, чай, кофе.
Посмотрите работы наших выпускников!
Модуль 1. Начало построения сайта
- Определение тематики сайта и возрастной группы. Подбор ключевых слов, названия, мета-тегов, и копирайтинг.
- Регистрация на https://accounts.google.com (gmail)
- Подбор ключевых слов для своего сайта с помощью сервиса https://adwords.google.ru/KeywordPlanner
- Анализ конкурентов
- Понятие гипертекстовых документов и web-сайтов. Классификации web-сайтов.
- Различные типы web-сайтов, их назначение и использование. Типы гипертекстовых документов (web-страниц), их различия и сходства.
- Размещение и хранение web-страницы и сайты. Понятие web-сервера и принципы его работы с пользователем.
- Подбор программного обеспечения для работы над веб-сайтом. Необходимый минимум для начала работы.
- Способы создания веб-сайтов: визуальный, работа с кодом, комбинированный.
- Разработка структуры и этапы построения web-сайта.
- Информационное наполнение и взаимосвязи основных разделов и подразделов, а также дополнительных страниц веб-сайта.
Модуль 2. Работа в графическом пакете Adobe Photoshop
- Интерфейс программы Adobe Photoshop
- Панель инструментов и палитра слоев
- Панель настроек Adobe Photoshop
- Создание простого документа и документа с монтажными областями в программе Adobe Photoshop CC 2018
- Линейки и направляющие.
- Слои и их виды
- Основы векторной графики. Работа с кривыми Кривые Безье
- Инструменты для создания и редактирования кривых Безье
- Контур и фигура в Adobe Photoshop
- Подготовка фото
Модуль 3. Знакомство с программой Adobe Illustrator
- Интерфейс программы Adobe Illustrator
- Работа с кривыми в Adobe
- Работа с растровой графикой в Adobe Illustrator
- Экспорт файлов в Adobe Illustrator
Модуль 4. Последовательная методика создания индивидуального дизайна
- Определение целей веб-сайта и его позиционирование
- Создание Технического Задания (ТЗ) на разработку веб-сайта.
- Создание дизайн-макета веб-сайта.
- Верстка сайта.
- Программирование сайта.
- Наполнение сайта информацией.
- Расположение сайта в сети Интернет
- Тестирование сайта
Модуль 5. Введение в язык разметки Интернет страниц HTML.
Язык гипертекстовой разметки HTML при помощи тегов и других элементов передаёт информацию о том, как построен текст и как он должен выводиться на экран. Язык каскадных таблиц CSS позволяет оформить веб-страницу, задав необходимые цвета, шрифты и другие элементы стиля.
- Изучение основ языка разметки HTML5 необходимых для построения сайтов и статических страниц в сети Internet.
- Введение и основные понятия . Основы разработки web-ресурсов. Модели информационной архитектуры. Принципы «юзабилити». Основные элементы web-страницы и способы их компоновки. Разработка структуры сайта и системы навигации. Обзор форматов web-графики. Стандарты HTML5 и CSS3. Стандарты разработки HTML5-документов. Meta-теги, keywords (элементы поисковой оптимизации). Методы верстки web-страниц
- WEB-сервер, web-сайт, web-страница
- Типы тегов. Теги - header, nav, section, article,aside,footer и др.
- Правила оформления HTML5-документа
- Использование комментариев.
- Создание HTML5-документа в программе Sublime Text 3
- Возможности программы Sublime Text 3: Основы работы. Управление web-сайтом. Редактирование html5-кода
Модуль 6. Таблицы и списки. Покупка домена и хостинга. Использование программы FilleZilla. Ссылки и иллюстрации
- Структурирование информации на WEB-странице при помощи списков. Типы списков
- Структурирование информации на странице при помощи списков и таблиц
- Механизмы адресации на ресурсы в Internet. Реализация механизма в языке HTML5
- Создание гиперссылок с помощью элемента A и его атрибутов. Типы ссылок
- Размещение иллюстрации на web-странице. Типы файлов иллюстраций. Элемент IMG и его атрибуты
- Распределение иллюстраций по страницам сайта: приемы и советы
Модуль 7. CSS свойства, модульная система CSS
- Понятие, область применения и принципы построения каскадных таблиц стилей (CSS).
- Использование CSS3 на веб-страницах, способы задания стилей и оформления отдельных элементов.
- Обзор инструкций CSS3 для оформления сайтов.
- Виды CSS - внутренние стили глобальные или встроенные внешние или связанные
- Определение классов и идентификаторов
- CSS-селекторы
- БЛОЧНАЯ МОДЕЛЬ. УПРАВЛЕНИЕ ТИПАМИ ЭЛЕМЕНТОВ – СВОЙСТВО DISPLAY (BLOCK, INLINE, INLINE-BLOCK…)
- Создание и управление таблицами стилей в программе Sublime Text 3
- Верстка web-страниц со стандартными элементами - шапка, навигация, содержание и подвал.
- Создание меню с помощью маркированных списков.
- Введение понятия псевдоклассов.
- Определение float для позиционирования элементов меню.
- Сознание веб страничек и связей между ними.
- Хостинг. HTML-элементы: виды, параметры.
Модуль 8. Работа с текстом. Механизмы представления текстовой информации: оформление, выравнивание, отступы и др.
- Использование CSS-свойств: Особенности отображения текста на web-странице.
- CSS-свойства, используемые для оформления текста.
- Примеры работы со шрифтами, общие способы и методы применения шрифтов, их характеристики и атрибуты.
Модуль 9. Слои в HTML
- Определение, основные свойства.
- Создание слоев в Sublime Text 3. Элементы DIV и SPAN.
- Особенности разработки элементов макетов для блочной верстки.
- Использование свойства float: выравнивание изображений, реализация эффекта таблицы.
- Псевдостили гиперссылок. Реализация эффекта ролловера средствами CSS.
Модуль 10. Способы верстки элементов web-страницы при помощи CSS. Схемы css-позиционирования. Элементы. Положения
- Содержимое и слои. Фон слоя. CSS-свойства списков.
- Особенности использования блочной модели.
- Использование фоновых изображений.
- Способы позиционирования элементов.
- Абсолютное и относительное позиционирование.
- Точное размещение блочных элементов HTML-разметки в окне браузера: размеры блока, абсолютные и относительные координаты.
- Наложение и вложение слоев, свойство z-index.
- Управление видимостью слоя и видимостью содержания слоя.
Модуль 11. Основы программирования на JavaScript
- Теоретические знания и практические навыки для эффективного использования современных клиентских Web-технологий на примере JavaScript.
- Особенности синтаксиса JavaScript, объектно-ориентированный подход в программировании на JavaScript и его основные встроенные функции.
- Создание динамических меню, закладок, аккордеонов, галерей и других элементов страниц.
Сценарии в HTML, язык JavaScript
- Внедрение сценариев в HTML документ
- Синтаксис
- Переменные и типы данных
- Написание первого сценария – таблицы умножения
- Условные операторы
- Операторы циклов
- Оператор обработки исключений
- Использование циклов
- Создание фотогаллерей
Функции и объекты JavaScript
- Описание и вызов функций
- Аргументы функций
- Возврат значений
- Область видимости переменных
- Рекурсивный вызов функций
- Использование функций
- Объекты JavaScript
- Объекты типов данных
- Массивы
- Использование объектов
Объектная модель браузера
- Объекты браузера
- Объект window
- Лабораторная работа: использование объекта window
- Объект navigator
- Объект document
Модуль 12. Начало работы с bootstrap 4
- Загрузка Bootstrap файлов
- Bootstrap Grid System
- Работа в Bootstrap Grid System
- Создание макетов с Bootstrap Grid System
- Видимость элемента в зависимости от размеров экрана устройства
- Создание Фиксированный макет с Bootstrap
- Создание макета жидкости с Bootstrap
- Создание Отзывчивый макет с Bootstrap
- Небольшое устройство (таблетка)
- Дополнительное небольшое устройство (телефон)
Дизайн и форматирование текста содержания, таблицы, формы, списка изображения и иконки в Bootstrap. Bootstrap NAV, NavBar, панели, Breadcrumbs, нумерация страниц, пейджер и прогресс баров
- Заголовки
- Параграфы
- Создание простой таблицы с Twitter Bootstrap
- Использование контекстных классов в Bootstrap таблице
- Twitter Bootstrap Список
- Создание Twitter Bootstrap Forms.
- Создание макета вертикальной формы
- Создание горизонтальной макет формы
- Статическая форма управления
- Создание Инлайн формы макета
- Twitter Bootstrap Изображения
- Twitter Bootstrap Миниатюры
- Twitter Bootstrap медиа-объектов
- Twitter Bootstrap Nav
- Создание выпадающего меню с Twitter Bootstrap Счета и таблетки
- Twitter Bootstrap NavBar
- Создание фиксированных NavBar с Twitter Bootstrap
МОДУЛЬ 13. Основы WORDPRESS. Joomla. Open Cart
WordPress является одной из самых популярных CMS по созданию блогов в Интернете, делая его легким для размещения своих идей, изображений, аудио / видео. WordPress может использоваться не только для блогов сообщения, но и для хранения статической информации, которая может быть легко модернизирована, через систему управления контентом (CMS).
Одним из главных преимуществ WordPress является использование темы и плагинов, которые могут кардинально изменить внешний вид и функциональность вашего блога на сайте. Студенты узнают, как найти и установить различные темы и плагины, а также узнают, как начать свою тему с нуля с использованием тегов шаблона на PHP.
Разработка сайта на CMS Joomla настройка системы.
Основы создания сайтов на CMS Open Cart
Модуль 14. Работа с меню и ссылками на сайте. Работа с блоками и модулями. Работа с пользователями и их правами доступа
- Создание новых и редактирование существующих меню, добавление ссылок в меню
- Добавление и управление стандартными блоками на сайте
- Создание своего блока произвольного HTML кода
- Добавление и редактирование дополнительных стандартных блоков на сайте
- Включение дополнительных стандартных модулей и их настройка
- Настройка прав доступа на сайт
- Добавление ролей для пользователей
- Создание новых пользователей
- Добавление стандартной формы обратной связи на сайт
- Создание вручную и автоматически собственных адресов страниц (алиасов)
По окончании курса Вы будете уметь:
- создавать web-страницы, содержащие все необходимые компоненты: текстовое наполнение, гиперссылки, графическое наполнение;
- самостоятельно создавать полноценный сайт путем определения иерархии взаимодействия web-страниц между собой;
- грамотно разрабатывать интерактивные формы для взаимодействия пользователя с web-сервером;
- эффективно использовать возможности каскадных таблиц стилей CSS для повышения функциональности и улучшения оформления web-сайта;
- использовать технологию фреймов;
- узнаете о новых возможностях HTML 5 и CSS 3;
Специалисты, обладающие этими знаниями и навыками, в настоящее время крайне востребованы. Большинство выпускников наших курсов делают успешную карьеру и пользуются уважением работодателей.
