Мастер веб-дизайна

360 часов (6 месяцев)

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

цели

Веб-дизайн, как известно, одна из самых востребованных профессий в мире. И дело в том, что любой компании, в которой вы собираетесь работать или с которой вы собираетесь начать, потребуется веб-страница, на которой будут представлены ее предложения услуг или продуктов. Здесь важна работа человека, владеющего знаниями в области веб-дизайна и разработки. В этом мастер-классе, который состоит из двух модулей, студент изучит основы наиболее часто используемых языков программирования в мире (HTML5 и CSS3), а также узнает о наиболее часто используемом сегодня менеджере контента - Wordpress.

В первом модуле мы будем работать на основе программирования, в частности, с языками HTML5 и CSS3, которые означают то, что мы могли бы назвать скелетом любого веб-сайта. Правильное обучение этим языкам позволит студенту приступить к любому проекту с прочной основой. Мы работаем над структурой сайтов и правильным расположением информации для пользователя, чтобы навигация была простой, интуитивно понятной и привлекательной. Также для достижения этой желаемой эстетики выполняется вставка мультимедийного контента во всех его форматах (видео, звуки, изображения), а также адаптация веб-страниц для всех устройств, с которых сегодня есть доступ в Интернет. Это то, что мы называем веб-сайтом с адаптивным или адаптивным дизайном, который идеально адаптируется к любому устройству и размеру экрана. В последней части первого модуля учащийся знакомится с использованием простых плагинов с JavaScript / jQuery с реальными практическими примерами.

Во втором магистерском модуле студент учится управлять контентом с помощью WordPress, мощной CMS с открытым исходным кодом, которая сегодня используется на бесконечном количестве веб-страниц благодаря интуитивно понятному дизайну для администратора и широким возможностям для пользователя. Будут проведены работы по созданию и установке тем, правильной настройке платформы и установке полезных плагинов, разработке сайтов из пустых тем (а не с помощью шаблонов) и т.д., которые помогают увеличить функционал сайта. сайты и превратить любой веб-сайт, который вы можете себе представить, в реальность.

информация

• Текстовый редактор, специализирующийся на веб-технологиях: Dreamweaver / Sublime / Notepad ++ / Komodo Edit / Brackets.
• HTML5 / CSS3
• Индексирование в первую очередь для мобильных устройств. начальная загрузка
• SEO-позиционирование в сети. Доступность и удобство использования
• JavaScript
• JQuery
• Веб-дизайн WordPress
• Веб-концептуализация и набросок
• Ценовое предложение и веб-планирование
• Веб-разработка и оптимизация в WordPress

продолжительность

360 часов всего

• Лично или онлайн
• 280 часов занятий
• С понедельника по четверг (+ немного пятницы)
• 80 часов финальных проектов

график

Утренние

• 09.00 - 12.00 часов
• 12.00 - 15.00 часов

Afternoons

• 16.00 - 19.00 часов
• 19.00 - 22.00 часов

официальный

• Наша школа является одним из пяти авторизованных учебных центров Adobe в Испании . Этот факт показывает, что CEI выполнила все требования Adobe, а также является гарантией качества для всех наших студентов.
• CEI - авторизованный учебный центр Apple . Таким образом, наши студенты смогут получить профессиональную сертификацию Apple и продвинуться по карьерной лестнице в области дизайна и информационных технологий, бизнес-среды и рынков B2B.
• IBM доверяет нам и по этой причине наградила нас значком IBM Education Partner . Этот знак награждает школы, которые поддерживают и продвигают качественное обучение.
• Наша школа стала справочным центром обучения Maxon в Испании, и мы стали первой школой в Европе, которая провела обучение Maxon для R18 .

Модуль веб-дизайна с HTML5, CSS3 и Javascript

01- Веб-дизайн, HTML5 И CSS3

Введение в использование компьютерной техники

Операционные системы:

• Windows
• макинтош
• Linux

Установка и управление ПО:

• Браузеры
• Текстовые редакторы

Файловая система и папки

• Создавать файлы и папки
• Организация веб-проектов
• Абсолютные, относительные и URL-пути

Просмотр веб-страниц

Принципы сетевого администрирования

Клиент-серверная архитектура

Серверы и протоколы

• SSL сертификаты
• HTTP / HTTPS
• FTP / SFTP / FTPS

Команда клиента

Введение в маршрутизаторы и коммутаторы

DNS (домены и IP-адреса)

• Публичный IP
• Локальный IP
• Доменные имена

Хостинг, жилье и CPD

Основные принципы создания статических сайтов

• Используемые языки (HTML5 и CSS3)
• Поток выполнения кода
• Визуальная структура сайта

Принципы юзабилити и доступности

Прототипирование сайта (UX / UI)

• Пользовательский интерфейс (Marvel)
• Пользовательский опыт (InVision)

HTML5

• Теги и атрибуты
• Семантика и использование
• Стандарт и структура документа HTML5
• Комментарии
• Абзацы, заголовки и текстовые форматы
• Мультимедиа (изображения, аудио и видео)
• Ссылки и кнопки
• Списки
• рисовать
• формы
• плавающие фреймы
• Мета-теги
• Favicom

CSS3

Ссылка на CSS

Селекторы и псевдоселекторы

атрибуты

• Цвета
• Деньги
• Форматирование и преобразование текстов
• Высота, широкая
• Ребра
• Маржа
• шпатлевки
• позиции
• выравнивание
• Затененные и градиенты
• помутнение
• Трансформации
• фильтры

Псевдоклассы (active, hover, checked, first-child, last-child, nth-child)

Псевдоэлементы (после, до)

Импорт и реализация шрифтов (медиа и шрифт)

Импорт и реализация значков (шрифты и SVG)

Переменные CSS

CSS-анимация (ключевые кадры)

Индексирование в первую очередь для мобильных устройств

• Общие конструкции (поплавки)
• Простые структуры (Flexbox)
• Сложные структуры (CSS Grid)

Фреймворки и API

• Бутстрап 4
• материализовать
• Материальный дизайн

интернет

• Создать домен
• Создание веб-хостинга
• Подключение и загрузка сайта на сервер

SEO

• Свяжите Интернет с Google Search Console
• Реализация канонической ссылки

02- Веб-разработка (Front-End)

JavaScript

• Введение в интерфейсное программирование
• JavaScript. Общий синтаксис
• Включите JavaScript в HTML-документы
• JavaScript в приложениях
• JavaScript внутри HTML-кода
• JavaScript. Переменные и операторы
• Локальные переменные и глобальные переменные
• Числовые переменные
• Методы для числовых переменных
• Операторы присваивания
• Операторы увеличения и уменьшения
• Математические операторы
• Текстовые строки (строки)
• Методы для текстовых строк
• Неопределенные переменные
• NULL переменные
• Переменные NaN
• Логические операторы в JavaScript
• Операторы отношения

JQuery

• Введение в JQuery
• Шаги по использованию jQuery
• Первый скрипт с jQuery
• Основы JQuery: добавление и удаление классов CSS
• Основы JQuery: отображение и скрытие элементов страницы
• Основы JQuery: быстрые эффекты с jQuery
• Основы JQuery: обратный вызов функции jQuery
• Основы JQuery: Использование базового Ajax с jQuery
• Основы JQuery: Ajax jQuery с сообщением загрузки