Доступно

[HTML ACADEMY] Профессиональный онлайн‑курс HTML и CSS, уровень 1 [20 января — 22 марта 2020] (Обновлённый поток)

Тема в разделе "Курсы по программированию", создана пользователем pikylbkaNomer, 29 сен 2019.

Цена: 14900р.
Взнос: 248р.-98%
100%

Основной список: 138 участников

Резервный список: 26 участников

Статус обсуждения:
Комментирование ограничено.
  1. 29 сен 2019
    #1
    Топикстартер
    Топикстартер ЧКЧлен клуба

    [HTML ACADEMY] Профессиональный онлайн‑курс HTML и CSS, уровень 1 [20 января — 22 марта 2020] (Обновлённый поток)

    [​IMG]

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

    Во время курса вы будете работать как настоящие верстальщики: создадите выразительную и доступную разметку, поработаете с графическим макетом, построите сетки страниц, оформите декоративные элементы и текстовое содержание, оптимизируете код и подготовите завершённый проект к публикации. На каждом этапе вашу работу будет проверять

    [​IMG]
    [​IMG]
    [​IMG]
    [​IMG]
    [​IMG]

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


    Как проходит курс. Организационные вопросы.
    • Обзор личных проектов.
    • Как работать с наставником.
    • Критерии качества вёрстки.
    • Защита личного проекта и получение сертификата.
    Что на самом деле происходит, когда вы вводите в браузере адрес сайта и нажимаете Enter?
    • IP-адрес, сервер и веб-сервер, «виртуальные хосты».
    • Доменные имена, URL-адреса и система DNS.
    • Загрузка и «сборка» веб-страницы.
    • Особенности HTTP и HTTPS. Протоколы HTTP/1.1 и HTTP/2.
    • Приёмы оптимизации веб-страниц.
    Инструменты веб-разработчика и рабочий процесс на интенсиве.
    • Системы контроля версий.
    • Инструменты вёрстки: редакторы кода, инспекторы, полезные веб-сервисы.
    • Немного о браузерах, браузерных движках и различиях между ними.
    Введение в HTML.
    • Синтаксис HTML, типы HTML-тегов.
    • Структура простейшего HTML-документа.
    • Как работать со спецификацией HTML.
    • Обзор HTML-тегов из личных проектов.
    Качественная разметка и стили кодирования.
    • Простая, понятная, читабельная и логичная разметка: примеры и антипримеры.
    • Типовые ошибки разметки: «ссылка или кнопка», «картинка или фон» и другие.
    • Модульность разметки или использование «пространств имён».
    • Когда использовать <article>, <section> и <div>?
    • Кодгайды для разметки.
    • Алгоритмы создания разметки: «страница как документ», «страница как приложение», «дивянка».
    Создаём разметку главной страницы учебного проекта.
    Обзор основных графических редакторов и инструментов для работы с макетами: Adobe Photoshop, Sketch, Zeplin, Avocode.

    Типовые задачи верстальщика в графических редакторах.
    • Настройка интерфейса.
    • Работа со слоями, типы слоёв.
    • Получение параметров текста.
    • Измерение размеров блоков, отступов, получение информации о цвете.
    • Получение параметров сложных декоративных эффектов: тени, градиенты и прочее.
    • Экспорт графики, работа с повторяющимися паттернами.
    Обзор форматов графики в вебе.
    • Растровая графика — PNG, JPEG, GIF.
    • Векторная графика — SVG.
    • Как выбрать подходящий формат?
    • Оптимизация графики.
    Разбор графических макетов проектов.
    Интерфейсы — не картинки.
    • Какие есть слои интерфейса, кроме графики.
    • Зачем нужные интерактивные элементы.
    • Неочевидное использование интерфейсов.
    Понятие доступности.
    • Что мешает пользоваться интерфейсами.
    • Ежедневные ситуации недоступности.
    • Физиологические и ментальные особенности.
    Взаимодействие с клавиатуры.
    • Интерфейсы без указателя.
    • Зачем нужен фокус на элементах.
    • Как сделать элементы интерактивными.
    Значимые элементы.
    • Зачем семантика и как не подхватить диватоз.
    • Почему не нужно переделывать элементы.
    • Кнопки и ссылки, в чём разница?
    Лейблы элементов.
    • Кому нужны описания элементов.
    • Разбор ошибок в реальных интерфейсах.
    • Инспекторы доступности и скринридеры.
    Введение в CSS.
    • Синтаксис CSS.
    • CSS-селекторы, псевдоклассы и псевдоэлементы.
    • Наследование, каскадность и приоритеты в CSS.
    • Единицы измерения в CSS: абсолютные, относительные, для управления цветом.
    • CSS-функции и директивы.
    Практика стилизации.
    • Зачем нужна нормализация.
    • Пространства имён и независимые компоненты.
    • Стили кодирования для CSS.
    • Работа с нестандартными шрифтами.
    • Стилизация состояний интерактивных элементов.
    Начинаем стилизацию главной страницы учебного проекта.

    Задаём глобальные стили документа, описываем текстовые параметры элементов и состояния интерактивных элементов.
    Поток документа и блочная модель документа.
    • Понятие сетки и потока документа.
    • Блочные и строчные боксы и их особенности.
    • Свойства блочной модели: размеры, рамки и отступы.
    • Тонкости блочной модели: «схлопывание» и «выпадание» внешних отступов, width: 100% и width: auto, свойство box-sizing и другие.
    • Свойство display. Управление типом боксов.
    Создание сеток на флексбоксах.
    • Введение во флексбокс.
    • Флекс-контейнер, флекс-элементы, флекс-оси.
    • Алгоритм расчёта размеров флекс-элементов.
    • Выравнивание и распределение флекс-элементов вдоль осей.
    • Однострочный и многострочный флекс-контейнер, управление флекс-рядами.
    • Особенности флексбоксов при создании сеток.
    Создаём сетку главной страницы учебного проекта.
    Позиционирование.
    • Относительное позиционирование.
    • Абсолютное позиционирование: координаты, изменение точки начала координат, относительные координаты и размеры, координаты по умолчанию.
    • Фиксированное позиционирование.
    • Управление порядком слоёв.
    Приёмы создания элементов интерфейса.
    • Блочно-строчные боксы и их особенности.
    • Борьба с пробелами между блочно-строчными боксами.
    • Особенности флексбоксов при создании элементов интерфейсов.
    • Типовой приём «псевдоэлемент с абсолютным позиционированием».
    • Использование CSS-графики для создания декоративных элементов.
    Завершаем вёрстку главной страницы учебного проекта.
    Практикуемся в вёрстке элементов содержимого.
    • Сверстаем текстовую страницу учебного проекта. Подготовим универсальные стили содержания, которые будут хорошо работать при наполнении страницы из CMS.
    • Сверстаем всплывающие окна с формой входа и интерактивной картой. Разберём приёмы стилизации нестандартных элементов форм.
    • Подготовим свёрстанный учебный макет к публикации или передаче заказчику.
    Разбираем типовые случаи переполнения и способы борьбы с ними.

    Готовим проект к предзащите и защите. Разбор критериев защиты выпускных проектов.
    Язык программирования JavaScript.
    • Роль программирования в жизни верстальщика.
    • Что такое DOM и зачем нам объект document.
    • Зачем нужен объект window.
    Типовые случаи использования JavaScript.
    • Как найти любой элемент на странице.
    • Как реагировать на события, происходящие на странице.
    • Как менять CSS-стили у элементов.
    • Как использовать анимацию на странице.
    Оживляем всплывающее окно и вставляем интерактивную карту на главной странице учебного проекта.
    Совместимая вёрстка.
    • Прогрессивное улучшение.
    • Постепенная деградация.
    • Цена совместимости.
    • Независимые слои улучшения.
    Реальное тестирование.
    • Многообразие браузеров и устройств.
    • Инспекторы, эмуляторы, виртуальные машины.
    • Слабые устройства и медленные сети.
    • Минификация, сжатие, оптимизация.
    • Эмпатия, приоритеты, сначала контент.
    Корневые технологии.
    • Веб-стандарты и фантазийные велосипеды.
    • Ваниль против библиотек и фреймворков.
    • Мода, хайп, вечное и светлое.
    Развитие в профессии.
    • Как не потерять актуальность знаний.
    • Обмен знаниями, события, выступления.
    • Пограничные дисциплины.


    Во время курса вы будете работать над специально разработанными проектами «Нёрдсом», «Седоной» и «Техномартом», а на комфортном тарифе к ним добавятся более сложные проекты «Глейси» и «Девайс». Посмотрите короткие видеоразборы каждого макета и выберите тот, который вам больше нравится.
    [​IMG]



    Информация об изменении в потоке:


    Страница курса:
     
    8 пользователям это понравилось.
  2. Последние события

    1. skladchik.com
      Складчина доступна.
      3 апр 2020
    2. Tenebra
      Tenebra участвует.
      2 апр 2020
    3. Xiomy
      Xiomy участвует.
      2 апр 2020
    4. Heffer7
      Heffer7 участвует.
      2 апр 2020

    Последние важные события

    1. skladchik.com
      Складчина доступна.
      3 апр 2020
    2. skladchik.com
      Взнос составляет 124р.
      26 мар 2020
    3. skladchik.com
      Складчина активна.
      26 мар 2020
    4. skladchik.com
      Сбор взносов начинается 26.03.2020.
      21 мар 2020
  3. Обсуждение
  4. 22 янв 2020
    #2
    PsychoNN
    PsychoNN ЧКЧлен клуба
    Я так понимаю не состоялась складчина?
     
  5. 25 янв 2020
    #3
    kmurmansky
    kmurmansky ДолжникДолжник
    Какие то движения будут в этой теме или нет? Будет складчина?
     
    4 пользователям это понравилось.
  6. 21 мар 2020
    #4
    Kirk Lee Hammet
    Kirk Lee Hammet СкладчикСкладчик
    Будет сбор средств на данный поток?
     
    1 человеку нравится это.
  7. 21 мар 2020
    #5
    Stanich1
    Stanich1 ДолжникДолжник
    У этого орга всегда лучшие складчины. Думаю, после окончания курса (плюс пару дней) будет сбор и сразу раздача.
     
  8. 21 мар 2020
    #6
    Stanich1
    Stanich1 ДолжникДолжник
    Сбор взносов! Ура!!
     
  9. 31 мар 2020
    #7
    Александр857
    Александр857 ДолжникДолжник
    Дайте ссылку на скачивание.
     
  10. 2 апр 2020
    #8
    Александр857
    Александр857 ДолжникДолжник
    Здравствуйте. Когда можно скачать материал по курсу?
     
Статус обсуждения:
Комментирование ограничено.

Поделиться этой страницей