Интеллигентный торрент-трекер
canvas not supported
Нас вместе: 4 315 097

HTML Academy | Интенсивный онлайн-курс «Базовый HTML и CSS» (2017) PCRec


 
 
RSS
Начать новую тему   Ответить на тему    Торрент-трекер NNM-Club -> Обучающие видеоматериалы -> Дизайн
Автор Сообщение
depict ®

Online
Стаж: 7 лет
Сообщений: 32
Ratio: 9,254
Поблагодарили: 743
100%
pirates.png
HTML Academy | Интенсивный онлайн-курс «Базовый HTML и CSS» (2017) PCRec
Автор (режиссер): HTML Academy
Жанр: Веб-дизайн, HTML, CSS

Описание:
HTML Academy — стандарт в обучении фронтендеров. Наша задача — сделать из любого новичка полноценного и востребованного специалиста, готового работать в веб-индустрии.

Интенсив «Базовый HTML и CSS» это профессиональный курс, построенный на базе платформы HTML Academy. Вести его будут практикующие преподаватели с десятилетним опытом веб-разработки.

Курс подойдёт для тех, кто делает свои первые шаги и тех, кто считает себя начинающим верстальщиком. Также, если ваши знания не систематизированы, он подойдёт и вам.

Продолжительность: 25:51:07
Качество видео: PCRec

Видео: AVC/H.264, 1920x1080, ~627 Kbps
Аудио: AAC, 2 ch, 235 Kbps
1. Вводная

Вводная лекция про роль и место верстальщика в мире веб-технологий.

1. Что на самом деле происходит, когда вы вводите в браузере адрес сайта и нажимаете Enter?
—IP-адрес, сервер и веб-сервер, «виртуалхосты».
—Доменные имена, URL-aдреса и система DNS.
—Загрузка и «сборка» веб-страницы, TCP/IP, HTTP.
—Приёмы оптимизации веб-страниц.

2. Инструменты веб-разработчика и рабочий процесс на интенсиве.
—Системы контроля версий. Git и GitHub.
—Инструменты вёрстки: редакторы кода, инспекторы, полезные веб-сервисы.
—Немного о браузерах, браузерных движках и различиях между ними.

2. Разметка

Создадим HTML-разметку страниц учебного и личного проектов. Попрактикуемся использовать подходящие теги, задавать имена классов, оценивать сложность разметки.

1. Введение в HTML и CSS.
—Синтаксис HTML.
—Структура простейшего HTML-документа.
—Синтаксис CSS. Базовые CSS-селекторы.
—Наследование, каскадность и приоритеты в CSS.

2. Качественная разметка и стили кодирования.
—Простая, понятная, читабельная и логичная разметка: примеры и антипримеры.
—Типовые ошибки разметки: «ссылка или кнопка», «картинка или фон» и другие.
—Модульность разметки или использование «пространств имён».
—Когда использовать <article>, <section> и <div>?
—Зачем нужен стиль кодирования? Обзор популярных стайлгайдов.

3. Создаём разметку главной страницы учебного проекта.

3. Фотошоп для верстальщика

Разберём всё необходимое для работы верстальщика в фотошопе. Подготовим графику для проектов.

1. Типовые задачи верстальщика в фотошопе.
—Настройка интерфейса фотошопа.
—Работа со слоями, типы слоёв.
—Получение параметров текста.
—Измерение размеров блоков, отступов, получение информации о цвете.
—Получение параметров сложных декоративных эффектов: тени и прочее.
—Экспорт графики, работа с повторяющимися паттернами.

2. Обзор форматов графики в вебе.
—PNG, JPEG, SVG, GIF.
—Как выбрать подходящий формат?

3. Разбор графических макетов проектов.

4. Сетки

Разберёмся с блочной моделью документа. Создадим сетки страниц учебного и личного проектов.

1. Поток документа и блочная модель документа.
—Понятие сетки и потока документа.
—Блочные и строчные элементы и их особенности.
—Свойства блочной модели: размеры, рамки и отступы.
—Тонкости блочной модели: «схлопывание» и «выпадание» внешних отступов, width: 100% и width: auto, свойство box-sizing и другие.

2. Как управлять потоком и строить сетки?
—Свойство display. Управление типом элементов.
—Свойство float и его особенности.
—Построение сеток на «плавающих» элементах.
—Блочно-строчные элементы и их особенности, борьба с пробелами между блочно-строчными элементами.
—Построение сеток на блочно-строчных элементах.

3. Создаём сетку главной страницы учебного проекта, экспериментируем с «карточными» элементами интерфейса на блочно-строчных элементах.

5. Знакомство с флексбоксами

1. Теория: введение во флексбоксы.
2. Практика: сетка Барбершопа на флексбоксах.

6. Декоративные элементы

Познакомимся с приёмами создания декоративных элементов. Завершим вёрстку главных страниц учебного и личного проектов.

1. Позиционирование.
—Относительное позиционирование.
—Абсолютное позиционирование: координаты, изменение точки начала координат, относительные координаты и размеры, координаты по умолчанию.
—Фиксированное позиционирование.
—Управление порядком слоёв.

2. Другие важные приёмы.
—Псевдоэлементы.
—Спрайты.
—normalize.css.
—Подключение нестандартных шрифтов.

3. Завершаем вёрстку главной страницы учебного проекта.

7. Оформление контента

Завершим вёрстку внутренних страниц и подготовим проекты к публикации. Начнём готовиться к защите личного проекта.

1. Практикуемся в вёрстке элементов содержимого.
—Сверстаем текстовую страницу учебного проекта. Подготовим универсальные стили содержания, которые будут хорошо работать и при наполнении страницы из CMS.
—Сверстаем всплывающие окна с формой входа и интерактивной картой. Разберём приёмы стилизации нестандартных элементов форм.
—Подготовим свёрстанный учебный макет к публикации или передаче заказчику.

2. Разбираем типовые случаи переполнения и способы борьбы с ними.

3. Готовим проект к защите. Подробный разбор критериев защиты выпускных проектов.

8. Введение в JavaScript

Познакомимся с JavaScript, узнаем что такое Vanilla JS и оживим некоторые блоки вёрстки.

1. Язык программирования JavaScript.
—Роль программирования в жизни верстальщика.
—Что такое DOM и зачем нам объект document.
—Зачем нужен объект window.

2. Типовые случаи использования JavaScript.
—Как найти любой элемент на странице.
—Как реагировать на события, происходящие на странице.
—Как менять CSS-стили у элементов.
—Как использовать анимацию на странице.

3. Оживляем всплывающее окно и вставляем интерактивную карту на главной странице учебного проекта.

9. Прогрессивное улучшение

Узнаем, как использовать новые возможности HTML и CSS, не ломая работоспособность вёрстки.

1. Знакомство с прогрессивным улучшением и постепенной деградацией.
—«Житейские» примеры двух подходов.
—Этапы прогрессивного улучшения.
—Влияет ли прогрессивное улучшение на скорость и эффективность разработки?
—Как добавлять улучшения независимыми и цельными слоями.
—Прогрессивное улучшение и прокси-браузеры — друзья навсегда.

2. Вносим изменения в вёрстку учебного проекта с учётом прогрессивного улучшения.

3. Немного о минификации стилей и скриптов.

10. Доступность интерфейсов

11. Финал
Скриншоты:


Время раздачи: 24/7 (круглосуточно) (до появления первых 3-5 скачавших)
[NNM-Club.name]_[HTML Academy] Intensivnyiy onlayn-kurs «Bazovyiy HTML i CSS» (2017).torrent
 Торрент:   Зарегистрирован
 
Зарегистрируйтесь и скачайте торрент!
39,5 KB

Примагнититься
 Зарегистрирован:   13 Авг 2017 20:35:21
 Размер:   10,6 GB  (
 Рейтинг:   5 (Голосов: 25)
 Поблагодарили:   75
 Проверка:   Внимание! Оформление не проверено модератором!
Как cкачать  ·  Как раздать  ·  Правильно оформить  ·  Поднять ратио!  
depict ®

Online
Стаж: 7 лет
Сообщений: 32
Ratio: 9,254
Поблагодарили: 743
100%
pirates.png
Отличия от старой версии этого курса за 2016год (12 поток).
В программу были добавлены новые разделы:
1. 5 раздел: Флексбокс;
2. 10 раздел : Доступность интерфейсов.
nexus85
Стаж: 6 лет 1 мес.
Сообщений: 58
Ratio: 11,168
100%
Откуда: NY
ussr.gif
Спасибо за материал! Есть ли у вас Продвинутый HTML и CSS - 2017?

_________________
Время, как выяснилось, самая большая ценность во вселенной.
Time is the single most valuable commodity in the universe.
depict ®

Online
Стаж: 7 лет
Сообщений: 32
Ratio: 9,254
Поблагодарили: 743
100%
pirates.png
nexus85 писал(а): Перейти к сообщению
Есть ли у вас Продвинутый HTML и CSS - 2017?

Если бы был, то выложил бы сразу! :подмигивание:
Nanoc​hka70​7​
Стаж: 1 год 6 мес.
Сообщений: 1
Ratio: 0,676
0%
Спасибо за раздачу
Tyrovski
Стаж: 6 лет 4 мес.
Сообщений: 52
Ratio: 0,432
100%
Спасибо за материал.) Сразу увидел из нового - на flexbox верстают, раньше на флоатах верстали.
Просьба у кого есть выложить Продвинутый по JavaScript, совсем тут нет. И свежий Базовый JavaScript.
depict ®

Online
Стаж: 7 лет
Сообщений: 32
Ratio: 9,254
Поблагодарили: 743
100%
pirates.png
Tyrovski писал(а): Перейти к сообщению
Просьба у кого есть выложить Продвинутый по JavaScript, совсем тут нет.

У продвинутого интенсива по JS будет только 2 поток (26 сентября — 8 ноября 2017).
jkiddd
Стаж: 4 года 3 мес.
Сообщений: 3
Ratio: 13,332
0%
А где можно будет код взять???? там только макеты
depict ®

Online
Стаж: 7 лет
Сообщений: 32
Ratio: 9,254
Поблагодарили: 743
100%
pirates.png
jkiddd писал(а): Перейти к сообщению
А где можно будет код взять???? там только макеты

Так-то самим нужно верстать.)
А вообще студенты часто свои учебные проекты на github выкладывают.
Tyrovski
Стаж: 6 лет 4 мес.
Сообщений: 52
Ratio: 0,432
100%
jkiddd писал(а): Перейти к сообщению
А где можно будет код взять???? там только макеты

Так код с интенсивов на GitHub выложен, по-моему все находится
Wildssoft
Стаж: 3 года 4 мес.
Сообщений: 56
Ratio: 53,113
Раздал: 3,813 TB
100%
Откуда: Кохтл​а-Ярв​е​
estonia.gif
скачаю заценю.кто скачал и попробовал покажите результаты=)
Stanleygoo
Стаж: 5 лет 5 мес.
Сообщений: 17
Ratio: 6,759
16.78%
Большое спасибо!
PacoO​ffici​al01​
Стаж: 4 года 6 мес.
Сообщений: 75
Ratio: 1,309
48.75%
russia.gif
Спасибо, нужно глянуть, хоть уже всё это знаю, и даже больше, но вредно точно не будет.

А есть Продвинутый HTML и CSS 2017 ?
Показать сообщения:   
Начать новую тему   Ответить на тему    Торрент-трекер NNM-Club -> Обучающие видеоматериалы -> Дизайн Часовой пояс: GMT + 3
Страница 1 из 1