Курс «Вебмастер» в Одессе | HTML+CSS+JavaScript | Академия ШАГ

г. Одесса, ул. Садовая, 3

По вопросам
поступления:

Учебный отдел: +38 (093) 972-77-92

По вопросам оплаты:  +38 (067) 557-06-50

Разработка и продвижение
WEB-проектов

О курсе:

Начало занятий17 декабря

Возрастот 18 до 55 лет

Стоимостьот 2736 грн./мес.

Расписание занятийдва раза в неделю,
или 2 учебные пары в вечернее время

ПродолжительностьАудиторные занятия:
368 академ. часов
Самостоятельная работа:
368 академ. часов
Soft Skills:
18 академ. часов
Английский:
18 академ. часов
Итого:
772 академ. часа
Длительность: 1 год

Как известно, «если вас нет в Интернете, то вас не существует», поэтому и компании, и люди хотят быть представлены в сети. Разработка и продвижение сайтов – очень востребованные услуги. Работа для WEB-разработчика найдется всегда, причем хорошо оплачиваемая – сейчас это примерно 1500 у.е. в месяц для специалиста среднего уровня.

Наш курс «Разработка и продвижение WEB-проектов» поможет Вам стать специалистом в этой области всего за 1 год! В результате Вы сможете стать универсальным специалистом, который может с нуля создать полноценный сайт, получить на него качественный трафик (клиенты, заказы) и удержать в ТОПе поисковиков.

Вы освоите такие языки web-программирования как PHP и JavaScript, научитесь работать с базами данных MySql и web-серверами Apache. Конечно же сайт должен не только стабильно и быстро работать, но и иметь привлекательный интерфейс, поэтому мы обязательно остановимся и на WEB-дизайне.

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

Программа обучения:

Основы WEB дизайна

Интернет, Всеми́рная паутина, Веб-страница, Сайт.
  • Как устроена сеть. Принципы работы технологий клиент-сервер. Основные понятия: Доменное имя, IP-адрес, DNS, Интернет-провайдер, Сервер, URL.
  • Протоколы HTTP, HTTPS, SSH и FTP.
  • Понятие веб-сайта. Типы сайтов.
  • Почта и мессенджеры.
  • Работа с поисковыми системами.

HTML5 / CSS3

Цель предмета: Научить студента верстать сайты с использованием блочной верстки. После окончания курса студент должен уметь верстать сайты любой сложности, самостоятельно находить разные решения в трудных задачах.

Введение. Структура HTML.
  • Введение в предмет.
  • Введение в языки разметки. Язык разметки гипертекста HTML.
  • Теги HTML.
  • Основная структура HTML документа. Основные элементы и их назначение.
  • Кодировки страницы и теги
Форматирование текста при помощи HTML.
  • Классификация тегов: линейные и блочные.
  • Модель форматирования текста: заголовки и абзацы.
  • Классификация тегов: логическое и физическое форматирования.
  • Цвета в Web.
Форматирование при помощи CSS.
  • CSS – каскадные таблицы стилей.
  • Теги без форматирования
    – блочный, – линейный.
  • Аналогия HTML и CSS на примере линейных и блочных тегов
  • Использование атрибутов class и id для задания стилей
  • Использование внешних CSS файлов стилей
  • Практика: форматирование текста при помощи CSS
Списки. CSS отступы и поля.
  • Создание списков
  • Создание вложенных списков
  • Форматирование списков при помощи CSS
  • Списки определений: элементы dl, dd, dt
  • Управление отступами и полями
Графика в web-дизайне. Оптимизация графики.
  • Форматы графических файлов в Internet
  • Тег и его атрибуты (src, alt, width, height, border)
Гиперссылки. Принципы навигации web-сайта.
  • Общие сведения о гиперссылках.
  • Абсолютная и относительная адресация.
  • Создание горизонтального и вертикального меню, его форматирование. Свойство display. Преобразование ссылки в блочный элемент. Разница между block, inline и inline-block.
  • Псевдоклассы.
  • Псевдоэлементы: before и after
  • CSS свойство cursor
  • Практика: работа по разработке галереи изображений и всплывающего меню
Таблицы.
  • Создание простейшей таблицы. Теги table, tr и td
  • Объединение ячеек: атрибуты colspan, rowspan
  • Теги логического структурирования таблиц: thead, tbody, tfoot. Теги логического группирования столбцов:
    colgroup, col
  • Управление рамками таблицы: атрибуты frame, rules
  • Свойство таблицы table-layout
  • Создание таблицы при помощи CSS: display: table, table-row, table-cell
  • Практика: создание сложных таблиц
Верстка web-страниц таблицами
  • Основы табличной верстки. Пример табличной верстки: ее минусы и плюсы. Тема важна, т.к. современные письма для рассылок верстаются только таблицами
  • Практика
Верстка web-страниц блоками
  • Основы верстки блоками. Правила верстки
  • Рассмотрение простейших структур страниц и элементов
  • Свойства visibility, overflow
  • Практика
Формы. Позиционирование.
  • Формы. Основные понятия
  • Свойство position
Создание страниц средствами HTML5 и CSS3.
  • Структура HTML5 документа
  • HTML5 – конкурент Flash (обзор)
  • Новые элементы форм. Плэйсхолдеры
  • Новые свойства: CSS3
  • Рассмотрение новых API для управления данными на странице
Создание адаптивной верстки.
  • Использование @media для адаптивной верстки. Примеры реализации
  • Использование viewport для правильного отображения сайта на мобильных устройствах
  • Практика

Основы Web-дизайна

Цель предмета: Научить студентов работать с PSD макетом любой сложности: вносить правки в существующие макеты, верстать страницы с использованием Photoshop. Важно понимать, что предмет не объясняет принципы создания веб-страниц в Photoshop (не учит дизайну), а лишь показывает основное мышление дизайнера и возможности Photoshop (учит правильно переводить psd в html).

Проектирование и создание веб сайтов.
  • Как создаются сайты с нуля. Этапы создания сайтов: общение с клиентом, создание технического задания, создание прототипов дизайна, создание дизайна, верстка дизайна, программирование, наполнение, seo-оптимизация и раскрутка
  • Важность каждого этапа и последовательность их выполнения
  • Трудности, возникающие на каждом из этапов
  • Примеры ТЗ
Введение в Photoshop. Выделения и заливка
  • Растровые и векторные изображения
  • Открытие и создание новых документов
  • Палитра инструментов Photoshop. Инструменты приближения и рука
  • Инструменты выделения
  • Выбор цвета. Палитра цветов. Инструмент пипетка
  • Заливки и градиенты
  • Сохранение изображения. Форматы изображений для Веб. Оптимизация изображений под Веб
Работа со слоями. Инструмент кисть. Работа с текстом.
  • Палитра слоев. Создание, удаление и дублирование слоев, эффекты наложения, прозрачность
  • Линейки и направляющие. Сетка
  • Инструмент кисть
  • Работа с текстом. Настройка величин в пикселях. Установка межстрочного интервала и отступов
  • Инструмент перемещения
Трансформация. Эффекты слоев. Маски.
  • Инструменты трансформации
  • Трансформация выделения
  • Эффекты слоев. Копирование и удаление эффектов
  • Быстрая маска. Маска слоя. Обтравочная маска
  • Работа с векторными инструментами. Растрирование векторных слоев
Самостоятельное задание на зачет.
  • Верстка сайта с использованием Photoshop.
Основы Юзабилити.
  • Основные понятия: Обучаемость, Эффективность, Запоминаемость, Ошибки, Удовлетворенность.
  • Основные проблемы сайтов: пользователь просматривает сайт на большой скорости, пользователь переходит по страницам наугад, у пользователей появляется много вопросов, плохая организация данных, нет визуальной иерархии.
  • Сравнение удобства сайта интернет-магазина и реального магазина.
  • Традиции, обычаи и условности

SEO

Основы оптимизации. Внутренняя оптимизация.
  • Введение. Способы поисковой оптимизации: белая, серая, черная
  • Основные понятия: типы Интернет-ресурсов, целевая аудитория
  • Структура и организация индексов в поисковых системах
  • Основы внутренней поисковой оптимизации
  • Улучшение структуры сайта
  • Особенности индексации сайта
  • Инструменты для оптимизации сайта
  • Задание на анализ сайта
Внешняя оптимизация. Анализ сайта.
  • Продвижение сайта, основные шаги: регистрация сайта в поисковиках, регистрация сайта в каталогах, покупка ссылок, контекст
  • Белые и черные каталоги. Особенности и хитрости при работе с ними
  • Управление поведенческими факторами как фактором ранжирования
  • Контекстная реклама
  • Продвижение сайта в социальных сетях
  • Email-рассылки, использование собственной базы писем
  • Установка на сайте счетчиков от Google и Яндекс
  • Этапы создания продающего сайта, выбор CMS

JavaScript

Программа разбита на две части: основы программирования на EcmaScript и клиентский JavaScript. Первая часть направлена для подготовки студента к пониманию программирования, вторая на решение основных задач JavaScript.

Основы программирования. EcmaScript.

Цель предмета: Научить студентов составлять алгоритмы и решать задачи по программированию на EcmaScript. После окончания курса студент должен уметь решать стандартные задачи по программированию используя условия, циклы, вложенные циклы, массивы, функции.

Введение в программирование. Основные понятия EcmaScript. Переменные. Операторы.
  • Основные понятияИстория EcmaScript. Что такое JavaScript. Зачем нужен JavaScript.
  • Синтаксис EcmaScript
  • Встраивание JavaScript в HTML код
  • Комментарии
  • Переменные
  • Операторы
  • Арифметические операторы
  • Строковые операторы
  • Побитовые операторы
  • Логические операторы
  • Операторы сравнения
  • Операторы инкремента и декремента
  • Операторы присвоения. Сокращенные формы операторов присвоения
  • Условный оператор (тернарный)
  • Приоритеты операторов. Последовательность выполнения операторов
  • Преобразование типов данных
  • Вспомогательные функции: parseInt, parseFloat, isNaN, isFinite
Условный оператор if..else. Вложенный условный оператор. Оператор выбора switch.
  • Понятие блок-схемы алгоритма
  • Оператор if..else.
  • Вложенный условный оператор.
  • Примеры сложных задач с использованием условного оператора
  • Оператор выбора switch
Циклы do..while, while, for. Вложенные циклы.
  • Циклы
  • Вложенные циклы
Массивы, как тип хранения информации.
  • Массивы
  • Стандартные задачи на массивы: сумма, поиск и др.
  • Алгоритм сортировки массивов
  • Понятие двумерных и многомерных массивов
Функции.
  • Функции
  • Аргументы функций
  • Возвращаемые значения
  • Функция, как переменная. Анонимные функции
  • Рекурсия
Объекты.
  • Объекты
  • Конструкторы объектов
  • Массивы и строки, как объекты
  • Прототипы
  • Замыкания в EcmaScript. Области видимости динамически созданных методов. Скрытие кода в функции-обертке. Оператор with для расширения области видимости объекта
Дата и время. Математические функции. Регулярные выражения. Обработка исключений.
  • Дата и время
  • Математические функции
  • Регулярные выражения
  • Исключения

Клиентский JavaScript

Цель предмета: Научить студентов работать с HTML документом средствами JavaScript.

Обязательные инструменты: Сайт http://javascript.ru/, Веб-испектор.

Введение в клиентский JavaScript. Структура документа DOM.
  • Совместимость в клиентском JavaScript. Кроссбраузерность.
  • DOM — структура документа
  • Глобальные элементы в дереве DOM
  • Поиск элементов в дереве DOM
  • Навигация по документу
  • Манипуляции с узлами: создание, удаление и перемещение
События в JavaScript. Обработчики событий.
  • Запись кода в строке адреса через “javascript:”
  • События в JavaScript
  • Задание событий
  • События мыши и клавиатуры
  • События форм
  • События загрузки load
  • Краткий обзор объекта Event
  • Всплывающие события
  • Стандартные события
Глобальный объект window. Cookie.
  • Объект window
  • Методы alert, confirm, prompt
  • Методы setInterval, setTimeout, clearInterval, clearTimeout
  • Объект Location
  • Объект History
  • Объект Navigator
  • Работа с Cookie
Экзамен.
  • Тест по JavaScript
  • Сложное задание на клиентский JavaScript

Итоговая курсовая работа по front-end

jQuery

Введение. Поиск по селекторам, фильтрация и обход элементов.
  • Введение и общая информация
  • Селекторы
  • Фильтрация и обход элементов
События. Эффекты и анимация.
  • События
  • Эффекты и анимация
Атрибуты и CSS. Манипуляция с элементами и деревом DOM.
  • Атрибуты и CSS. Размеры и классы
  • Манипуляция с элементами
  • Задания на дом: фильтрация ячеек таблицы, поиск в таблице по словам, валидация формы при отправке, редактируемые строки таблицы, сортировка строк в таблице, вкладки текстовых областей на странице, переход по ссылке, при нажатии на блок

AJAX.

Ajax. Работа с AJAX.
  • Задания: всплывающие окна, загруженные из файлов; создание таблицы, загруженной из файла json.
Плагины. Создание собственного плагина. Функции ядра.
  • Плагины для jQuery
  • Создание собственного плагина
  • Функции ядра
Экзамен.
  • Создание собственного плагина.

Введение в Unix

Цель предмета: Показать основные возможности Unix-оподобных систем, так же научить студента работать с консолью для выполнения несложных работ для настройки и/или работы с сайтом (хостингом) под управлением Unix-оподобных систем.

Введение. История. Основные файлы и папки Unix.
  • Введение
  • История, версии и основные характеристики ОС UNIX
  • Пользователи и группы
  • Файлы и каталоги
Файловая и логическая системы. Процессы.
  • Структура и свойства файловых систем
  • Управление файловой системой
  • Управление процессами
Работа с текстовыми файлами. Командный интерпретатор.
  • Средства обработки текста
  • Командный интерпретатор
Полезные утилиты.
  • Основные утилиты

PHP.

Установка и настройка сервера. Основные конструкции языка.
  • Введение в PHP. Отличия серверного web-программирования от клиентского. Область приминения. Информационные ресурсы, документация. Понятия «Клиент» и «Сервер»
  • Установка и настройка web-сервера Apache под Windows.
  • Синтаксис PHP. PHP и HTML. Прямое и обратное встраивание
  • Вывод данных Вывод для отладки
  • Уровни ошибок PHP
  • Установка директивы error_reporting файла php.ini
  • Комментарии в PHP скриптах (/* */, //, #).
  • Переменные в PHP
  • Константы в PHP
  • Операторы в PHP
  • Управляющие конструкции языка PHP
Строки, массивы и функции.
  • Числа и даты
  • Строки в PHP
  • Массивы в PHP. Особенности строения массивов
  • Пользовательские функции в PHP
  • Поддержка регулярных выражений в PHP
  • Создание библиотек функций
Интерфейс CGI и HTTP. Работа с формами.
  • Архитектура «клиент-сервер». Принципы CGI и протокол HTTP. Просмотр запросов и ответов в инспекторе браузера
  • Статусы HTTP ответов
  • Заголовки HTTP
  • Суперглобальный массив $_SERVER. Переменные окружения
  • Обработка параметров запросов. Суперглобальные массивы $_GET, $_POST, $_COOKIE, $_REQUEST
  • Элементы HTML форм. Методы передачи данных GET и POST. Передача данных в другие скрипты (action)
  • Форма и её обработчик в одном сценарии
Файловая система
  • Работа с файлами средствами PHP
  • Функции для работы с директориями
  • Загрузка файлов через форму. Cуперглобальный массив $_FILES. Множественная загрузка
  • Организация базы данных в файлах
Сохранение пользовательской информации
  • Механизм COOKIE
  • Механизм сессий
  • Задание на работу с сессиями: авторизация и создание счетчика посещений
Введение в объектно-ориентированное программирование в PHP.
  • Классы в PHP
  • Псевдо-переменная $this доступна в том случае, если метод был вызван в контексте объекта. Псевдо-константа self
  • Статические свойства и методы
  • Объявление констант внутри классов при помощи ключевого слова const
  • Конструкторы и деструкторы
  • Задание на создание класса для работы с текстовыми файлами
Наследование и инкапсуляцияв PHP
  • Наследование
  • Инкапсуляция
  • Предотвращение переопределения классов — финальные классы (final)
  • Абстрактные классы и методы (abstract)
  • Принадлежность к классу instanceof
  • Интерфейсы объектов interface, implements
  • Магические методы
  • Клонирование объектов
  • Функции для работы с классами
  • Ошибки и исключения
  • Практика использования классов
Паттерны проектирования. Singletone, MVC
  • Понятие паттерна проектирования. Основные принципы
  • Singletone
  • MVC
  • Практика создания сайта, используя MVC
Дополнительные функции
  • Работа с XML
  • Функции для работы с JSON
  • Почтовые возможности PHP. Функция mailto()
  • Работа с HTTP
  • Буферизация вывода
Экзамен
  • Задание на создание сайта, парсера или игры

Теория баз данных. MySQL.

Понятие базы данных.
  • Понятие базы данных: База данных, Система управления базами данных, SQL, СУБД MySQL
  • Виды связей: один к одному, один ко многим, многие ко многим
  • Структуры баз данных: Иерархическая структура базы данных, Сетевая структура базы данных, Реляционная структура базы данных, Объектно-ориентированные и гибридные базы данных
  • Принципы реляционной базы данных
  • Виды ключей: Первичный ключ (РК — primary key), Внешний ключ (FK — foreign key)
  • Примеры использования (показать, как рисуются связи)
  • Концептуальная модель базы данных
  • Преобразование концептуальной модели в реляционную
Создание базы данных и таблиц
  • Работа с MySQL
  • Основные запросы
  • Создание таблиц MySQL
  • Вставка данных
  • Выборка данных
Объединение запросов
  • Выборка данных из нескольких таблиц
  • Группировка данных и функции агрегации
Редактирование, обновление и удаление данных.
  • Изменение структуры таблицы
  • Изменение данных строк
  • Работа с MySQL через PHP

CMS Drupal

Введение в CMS. Установка CMS Drupal.
  • Понятие CMS. Важность изучения CMS
  • Разница между CMS и Framework. Плюсы и минусы: простота, скорость разработки, защищенность, админпанель, скорость работы
  • Типы CMS: бесплатные и платные. Плюсы и минусы: поддержка, функционал, интернет сообщество, защищенность, цена
  • Популярные CMS: Drupal, WordPress, Joomla, Битрикс
Установка друпала. Быстрый экскурс. Установка модулей.
  • Установка Drupal
  • Админпанель Drupal — быстрый экскурс. Основные вкладки, за что они отвечают: панель управдения, содержимое, структура, оформление, пользователи, модули, конфигурация, отчеты
  • Модульность Drupal. Обзор списка модулей ядра
  • Установка и настройка тем
  • Drush
Сущности друпала. Работа с пользователями. Работа с материалами.
  • Сущности Drupal: users, node, fields, taxonomy, block
  • Работа с пользователями
  • Работа с материалами
  • Дополнительные модули полей: date, link, email, field_group, yamaps, multiupload_filefield_widget, multiupload_imagefield_widget
Дополнительная настройка материалов.
  • Таксономия
  • Ссылка на материал
  • Отображение картинок
  • Синонимы путей
  • Редактор CKEditor
  • Практика создания блога
Дополнительные страницы. Выборка из базы данных.
  • Модуль Views
  • Практика создания новостного сайта
Блоки и меню.
  • Регионы и блоки
  • Меню
  • Создание бэкапа сайта
  • Практика создания новостного сайта (создание блоков)
Создание собственной темы оформления.
  • Официальная документация по созданию тем
  • Разбор файла mytheme.info
  • Обзор файлов темы: template.php, logo.png, screenshot.png, favicon.ico
  • Шаблоны темизации
  • Функции ядра drupal
  • Представление html в виде массивов, функция theme и render
  • Практика создания собственной темы
Файл template.php и препроцессоры.
  • Установка модуля devel. Команда dsm
  • Создание собственных функций в template.php
  • Темизация материалов шаблон node.tpl.php
  • Функция препроцессор template_preprocess_node
  • Функция препроцессор template_preprocess_page
  • Функция препроцессор template_preprocess_html
  • Практика создания собственной темы (шаблонизация материалов)
Создание собственного модуля. Хуки.
  • Создание собственного модуля. Разбор файла mymodule.info. Файл mymodule.module
  • Понятие HOOK. Принцип взаимодействия между модулями
  • Предзагрузчик hook_init
  • Примеры хуков для работы с материалами и пользователями
  • Создание страниц при помощи hook_menu
  • Пример создания модуля, который считает количество посещений по каждой странице текущего пользователя и выводит на странице с использованием массива $_SESSION
  • Работа с базой данных и Drupal db API
  • Работа с материалами и пользователями
  • Практика создания модуля, который считает количество посещений по каждой странице текущего пользователя и выводит на странице с использованием базы данных
Создание форм.
  • Функция генерации форм drupal_get_form
  • Создание собственных форм
  • Сохранение переменных в БД: varaible_get, variable_set
  • Переопределение форм
  • Практика создания формы-опросника, которая собирает статистические данные и выводит результат на отдельной странице
Темизация. Работа с AJAX.
  • Использование AJAX в формах
  • Создание собственных шаблонов через hook_theme
Экзамен.
  • Создание собственного модуля или темы.

Итоговая курсовая работа по back-end

Итоговая практическая работа по курсу

Программа психологических тренингов для IT-специалистов
  • «Знакомство – искусство первой коммуникации»
  • «Целеполагание. Тайм-менеджмент. Мотивация»
  • «Team Building»
  • «Искусство коммуникаций»
  • «Трудоустройство»
Факультатив по разговорному английскому языку для IT-специалистов
  • Развитие разговорных навыков
  • Тренировка восприятия английской речи на слух
  • Преодоление языкового барьера
  • Изучение устойчивых выражений
  • Обсуждение социальных тем

Вы научитесь:

  • Верстать WEB-страницы с использованием технологий HTML5/CCS3 + JavaScript;
  • Создавать сайты и порталы при помощи CMS;
  • Создавать темы для CMS;
  • Размещать сайт в интернете
  • Выполнять базовую настройку WEB-сервера для работы сайта;
  • Заниматься WEB-разработкой на PHP/MySQL;
  • Заниматься доработкой WEB-проектов на PHP/MySQL;
  • Принципы SEO и продвижения сайта в поисковых системах;
  • Способы SEO раскрутки проектов;
  • Программирование с использованием языка программирования Java Script и библиотеки jQuery.

Записаться

Имя*
Телефон*
E-mail*

О курсе:

Начало занятий17 декабря

Возрастот 18 до 55 лет

Стоимостьот 2736 грн./мес.

Расписание занятийдва раза в неделю,
или 2 учебные пары в вечернее время

ПродолжительностьАудиторные занятия:
368 академ. часов
Самостоятельная работа:
368 академ. часов
Soft Skills:
18 академ. часов
Английский:
18 академ. часов
Итого:
772 академ. часа
Длительность: 1 год

Кирилл Лобода
Базовые знания:
Уверенный пользователь ПК или успешное завершение курса Пользователь ПК

А хотите ознакомиться с набором демонстрационных электронных уроков полустационара?


Да
Нет

Заполните пожалуйста форму


Введите sms-код для подтверждения


Получите книгу: «Как воспитывать ребенка. Советы известных людей»


Да
Нет