Розпродаж!

HTML і CSS Професійний курс частина 2

390 грн

 Ви економите: 800 грн (67%)
 Покваптеся! Закінчується через

Відео запис курсу HTML і CSS. На цьому курсі ви навчитеся робити справжні проєкти, такі ж за рівнем складності, як в індустрії. І будете робити їх правильно, щоб після навчання видавати результат високого рівня, за який компанії готові платити.

Безпечні платежі

Захист персональних даних

100% унікальні матеріали

Гарантія найкращої ціни

Разом дешевше на 20% (кількість курсів змінюється галочками)

HTML и CSS Профессиональный курс часть 2 + HTML5, CSS3, FlexBox верстка сайтов - видеокурс + HTML5 и CSS3. Создание адаптивных сайтов - видеокурс + HTML и CSS Профессиональный курс часть 1
Ціна за всі курси: 1,248 грн

Мова викладання в курсі — російська. Незабаром буде доступна українська версія цього курсу.

Відеозаписи лекцій без зворотного зв'язку та участі викладача. Ви отримаєте доступ до матеріалів одразу після оплати.

Відео запис курсу. На цьому курсі ви навчитеся робити справжні проєкти, такі ж за рівнем складності, як в індустрії. І будете робити їх правильно, щоб після навчання видавати результат високого рівня, за який компанії готові платити.

— Актуальные стандарты качества: не нужно переучиваться после курса.
— Понимание полного цикла работы верстальщика.
— Фундаментальные и структурированные знания необходимых технологий.
— Опыт работы с дедлайнами и планирования работы.

Зміст

1. Вступ (Теоретична лекція). Системи контролю версій.

Навіщо потрібні системи контролю версій.
— Обзор возможностей и работа с Гитом.
— Работа с ветками: создание, синхронизация, слияние.
— Конфликты и их разрешение.
— Обзор Гитхаба.
— Рабочий процесс на интенсиве.
— Зависимость заданий.
— Настройки личных проектов.
— Создание мастер-репозитория.
— Структура личных проектов.

2. Методології верстки (Теоретична лекція). Прийоми створення надійної верстки.

Навіщо потрібні методології.
— Порядок в коде.
— Работа в команде.
— Недостатки технологий.

Огляд підходів до верстки.
— Классический подход.
— Независимые блоки.
— Атомарный подход.
— Компоненты и модули.

Методологія БЕМ.
— Зачем всё так усложнять.
— Как разбить интерфейс на блоки.
— Элементы и модификаторы.
— Ошибки и узкие места.

Розбір навчального проєкту з БЕМу.

3. Препроцесори й автоматизація (Практична лекція). Поглянемо на препроцесори та розберемося, чим вони допомагають у процесі верстки.

Стилі на стероїдах.
— Обзор препроцессоров.
— Фантазийный CSS.
— Новые возможности CSS.

Основні можливості.
— Сравнение Less и Sass.
— Переменные и математика.
— Вложенные селекторы.
— Операции с цветами.

Додаткові можливості.
— Подключение файлов.
— Примеси и расширения.
— Организация кода.
— Сборка стилей.

Налаштування оточення.
— Система сборки на Node.js.
— Сборщики Gulp и Grunt.
— Автоматизация сборки и вотчеры.

4 Адаптивні сітки (Практична лекція). Дізнаємося як створювати адаптивні сітки з використанням флексбоксів.

Створення сіток на флексбоксах.
— Введение во флексбокс.
— Флекс-контейнер, флекс-элементы, флекс-оси.
— Алгоритм расчёта размеров флекс-элементов.
— Выравнивание и распределение флекс-элементов вдоль осей.
— Однострочный и многострочный флекс-контейнер, управление флекс-рядами.
— Особенности флексов при создании сеток.

Адаптивні сітки.
— Принципы «перестройки сетки».
— Медиавыражения, макро- и микробрейкпоинты.
— Организация кода разных версий страницы: мобильной, планшетной и десктопной.
— «Проблема двух вьюпортов» на мобильных.
— Настройка вьюпорта.

Створюємо адаптивні сітки БЕМ-блоків навчального проєкту за допомогою флексбоксів.

5. Адаптивні декоративні елементи (Практична лекція). Розбираємося з адаптивними декоративними елементами. Робимо адаптивну верстку з гумовими сітками.

Завершуємо адаптивну верстку БЕМ-блоків навчального проєкту.

— Переход от фиксированных сеток к резиновым. Тонкости флексбокса.
— Отличие «резины» от «фикса».
— Переход от пикселей к процентам.
— Резиновые колонки с точными размерами на флексбоксе.
— flex-grow для создания «неточных» резиновых колонок.
— Флекс-контейнер внутри флекс-контейнера и резиновые по высоте элементы.
— Когда использовать резиновые сетки и насколько они дороже фиксированных.

Робимо гумово-адаптивну верстку БЕМ-блоків навчального проєкту.

6. Адаптивна графіка (Теоретична лекція). Занурюємося в адаптивну та ретинову графіку. Розбираємося з форматами та їхнім призначенням.

Графіка для екранів підвищеної чіткості.
— В чём разница между физическими и логическими пикселями.
— Что такое «ретиновая» графика.
— Приёмы ретинизации содержимого веб-страницы.

Адаптивна графіка.
— Тег на все случаи жизни — .  — Ретинізація контентних зображень за допомогою атрибута srcset.  — Кадрування зображень за допомогою.  — Використання сучасних форматів графіки за допомогою.  — Зображення невизначених розмірів і .

Ретинізуємо та додаємо адаптивну графіку в навчальному проєкті.

7. Векторна графіка та оптимізація (Теоретична лекція). Навчимося використовувати векторну графіку всіма можливими способами. Розберемося, як використовувати графіку оптимально.

Використання SVG.
— Плюсы и минусы векторной графики.
— Подключение SVG внешним ресурсом.
— Встраивание SVG.

SVG-спрайти.
— Зачем нужны, в каких случаях полезны.
— Варианты реализации.

Стилізація SVG.
— Что можно, а что нельзя.
— Анимация.
— Адаптивность.

Оптимізація та доступність SVG.
— Особенности экспорта из Illustrator и Sketch.
— Дожимаем и оптимизируем SVG.
— Доступность.

Оптимізація растрової графіки.
— Сжатие lossless и с потерей качества.
— Обзор формата webp и особенностей его применения

8. Занурення в автоматизацію (Практична лекція). Підготуємо збірку проєкту для його публікації.

Вирішимо для себе, що краще для автоматизації Gulp чи Grunt.

Оптимізація.
— Минификация CSS-кода.
— Оптимизация изображений.
— Сборка и минификация SVG-спрайта.

Як тримати код для розробника зручним, а для браузерів - швидким.

9. Продуктивність верстки (Теоретична лекція).Розберемося з продуктивністю верстки і спробуємо оптимізувати "вузькі місця".

Як підключати зовнішні шрифти найкраще.
— Отличается ли быстродействие сайта на десктопе от мобильного.
— Что нужно знать, когда пользуешься CSS-анимацией и плавными переходами.
— Что нужно знать о перерисовке и перекомпоновке страниц.

10. Як не загубитися на ринку праці. Працевлаштування, пошук замовлень, оцінка роботи

Яка взагалі буває робота?
— В офисе
— На фрилансе

Пошук роботи

Як оцінювати себе і проходити співбесіди

З чим їдять гріди (бонусна лекція з 13 потоку)

— Введение в гриды.
— Вёртска Барбешопа.

11. Фінал. Підсумки інтенсиву.

Чи потрібна реєстрація?

Ні, реєстрація не обов'язкова. Просто заповніть усі поля під час оформлення замовлення і ваш акаунт створиться автоматично. Дані, які ви ввели на сторінці оплати (пошта, пароль), потім можна використовувати для входу на сайт.

Як оплатити обраний курс?

Наш сайт приймає оплату за допомогою платіжної системи Way For Pay. Усі операції на нашому сайті безпечні і проходять з використанням шифрованого SSL з'єднання. Ми не збираємо і не зберігаємо ваші платіжні дані. Платіжна система повністю гарантує безпеку платежів.

Наразі доступні такі способи оплати:

  • Банківська картка (будь-яка)
  • Приват24
  • G pay
  • Apple pay
  • Каса Visa
  • Masterpass
  • Мгновенная рассрочка и оплата частями для владельцев карт ПриватБанку
  • Розстрочка для власників карток Monobank, Ощадбанк, Райффайзен, А-Банк, ОТР Банк, Глобус Банк, Sportbank

 

1. На странице курса нажмите «Купить»
2. Затем в открывшейся вкладке нажмите «Оформление заказа»
3. На странице оформления заполните все поля и нажмите «Купить»
4 Автоматично відкриється сторінка платіжної системи.
5. Виберіть спосіб оплати.
6. Введіть дані та дотримуйтесь інструкцій платіжної системи.
7. Після успішної оплати ви будете автоматично направлені на сторінку, де зможете отримати доступ до курсу. Так само вам буде надіслано лист із посиланням на курс.

Якщо жоден з перерахованих способів оплати вам не підходить, напишіть нам: info@siluette.com.ua або скористайтеся чатом у правому нижньому кутку сторінки нашого сайту. Ми обов'язково допоможемо.

Як отримати оплачені матеріали?

Для того, чтобы получить материалы — просто заполните все поля при оформлении заказа (включая поле — Создать пароль учетной записи).

Після оплати - система автоматично направить вас в особистий кабінет у розділ ①"Завантаження". Тут буде список ваших оплачених матеріалів і посилання на скачування②.

Або натисніть у правому верхньому кутку сайту пункт Мій акаунт, введіть пошту і пароль, який ви придумали, коли оформляли замовлення. У розділі Завантаження є посилання на скачування.

Скільки часу будуть доступні матеріали?

Ссылка на ваш курс будет доступна в течении 90 дней со дня оплаты. За это время вы должны скачать все материалы на свое устройство. После окончания этого срока ссылки могут стать неактивными. Это связано с нововведениями компаний, предоставляющих услуги облачного хранилища. Если вы не успели скачать купленные курсы, напишите нам на почту — info@siluette.com.ua

Відгуки

Відгуків немає, поки що.

Будьте першим, хто залишив відгук “HTML и CSS Профессиональный курс часть 2”“

Ваша e-mail адреса не оприлюднюватиметься. Обов’язкові поля позначені *