HTML-верстка: с нуля до первого макета

HTML-верстка: с нуля до первого макета

Пришлем демо-версию вам на почту

Вы освоите инструменты HTML-верстки и научитесь разрабатывать сайты с нуля
формат записи:видео
длительность:25 часов 40 минут
объем:8,5 Гб
год:2016
сайт:показать

Купить полную версию

всего 1 399 руб

Старая цена: 11 900 руб

Скидка: 88%

Выгода: 10 501 руб

в корзину оформить

Максимально эффективно вместе

О курсе «HTML-верстка: с нуля до первого макета»

Программа курса




1. Введение



1.1 Базовая HTML-разметка

Клиент-серверные взаимодействия, история HTML. Инструменты разработчика. Работа с FTP клиентом. Структура страницы. Cинтаксис HTML. Понятие тега. Атрибуты.

1.2 Знакомство с CSS

Знакомство с CSS. Базовые принципы CSS. Основы синтаксисом. Подлючением CSS к HTML документу.



2. Основы HTML-разметки



2.1 Блочные и инлайновые элементы

Блочные элементы. Инлайновые элементы. CSS свойство display и управление поведением элемента при отрисовке свойство float и «плавающие» элементы. Другие виды поведения элементов.

2.2 Семантическая разметка документа

Основные теги для работы с текстом, оформление списков, работа со ссылками и изображениями, работа с таблицы, контейнеры (div).

2.3 Управление блоками в потоке

Основные способы поведения элемента в документе, display: none, display: inline, display: block, display: inline-block, display: list-item, table*, когда и как применять теми или иный способы.

2.4 Позиционирование блоков

«Плавающие» элементы и свойство float. Позиционирование. Блоков. static. Relative. Absolute. Fixed. Когда и как применять те или иный способы позиционирования.



3. Знакомство с CSS



3.1 CSS селекторы

Cелекторы тегов,идентификаторы и классы. Контекстные селекторы. Cоседи. Дети. Псевдокласс. Наследование и каскад. Приоритеты

3.2 Стили текста и оформления

Единицы измерения (размер, цвет). Шрифт: цвет, размер, межстрочное расстояние и т.д. Фон: цвет, изображение. Маркеры списка. Рамка. Обводка.

3.3 Стили позиционирования, отступы и размеры блоков

Размер блока. Поля (padding). Отступ (margin). Положение на странице. Алгоритм расчета ширины и высоты элементы.



4. Вёрстка сайта



4.1 Сетки

Построение сетки с использованием float. Построение сетки с использование display: inline-block. Плюсы и минусы каждого из подходов, и когда какой применять. Практика применения позиционирования. Отступы. Решение типовых задач, блок фиксированной ширины по центру. Подвал который всегда внизу. Фиксированная шапка. Две колонки фиксированной ширины. Три колонки фиксированной ширины. 4 и более колонок фиксированной ширины и в %. Выносные элементы (уши).

4.2 Процесс верстки сайта

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

4.3 Профессиональное оформление кода

Критерии оценки вёрстки (качественная, некачественная), соглашения по оформлению кода в HTML, CSS, JavaScript, принцип именования переменных, классов, методов. Специфика работы профессионалов.

4.4 Возможности JavaScript

Что такое JavaScript. Область применяется JavaScript. Взаимодействие JavaScript с HTML документом. Демонстрация примеров.



5. Детальное приближения результата верстки к макету



5.1 Работа с Adobe Photoshop, вёрстка в точном соответствии с макетом

Типовые задачи, которые выполняет верстальщик в Photoshop, работа со слоями. Нарезка, сохранение фрагментов. Единицы измерения в верстке и в макете. Замер расстояний и цветов в Photoshop.

5.2 Особенности подготовки изображений для верстки

Форматы изображений. Приемы оптимизации. Настройка полезных макросов в PS.

Несколько отзывов об Инфокупоне

Ольга  23.07.2017

Купила тренинг "Секреты королевы" Алекса Мэй" в полном восторге, "Уверенность королевы" Юлии Печерской, "Фейсбилдинг" от Бони - супер программы. Здесь все честно. Довольна "Инфокупон" теперь мой любимый магазин!!! Как всегда маленькая просьба: курс "Манипуляции и антиманипуляции" Юлечки Печерской можно?

Ирина  21.07.2017

Отличный сервис. Много разнообразных тренингов по цене гораздо ниже, чем я приобретала. Жаль - не знала раньше, хорошо - что знаю теперь )))
Ушла изучать "приобретенные знания" )))

Владислав Вадимович  06.07.2017

Этот сайт замечательный , масса хорошего контента и грамотное оформление . Так держать !

Alexander  04.07.2017

Офигенные ребята,очень выгодно и работают оперативно

Смотреть все отзывы

Партнеры Инфокупона
payment methods

© 2012—2017 infokupon.com. Записи тренингов со скидкой до 95%.