Складіть свій перший бізнес-сайт (HTML, CSS та JavaScript + AI)

Description

Складіть та опублікуйте простий бізнес-сайт за допомогою HTML, CSS, JavaScript та допомоги AI для розміщення та копіювання — без необхідності у фреймворках. Рівень: початківець · Ідеально для: власників МСП та співробітників з маркетингу 6-тижнева онлайн-програма · 10 живих сесій · Часовий пояс Європа/Лондон Що ви досягнете Структуруйте доступні сторінки із семантичним HTML. Стилізуйте адаптивні макети з сучасним CSS (flexbox і grid). Додайте легку інтерактивність за допомогою ванільного JavaScript. Використовуйте AI для створення контенту та CSS, зберігаючи при цьому контроль якості. Розгорніть статичний сайт на хостинговій платформі та поясніть, як працюють оновлення. Що ми покриваємо Основи фронтенду Основи структури та доступності HTML5 CSS змінні, flexbox і grid Адаптивні точки перериву та мобільність JavaScript DOM та події (вступ) Створення бізнес-сайту Розділи героя, послуг, відгуків та контактів Форми, валідація та конфіденційність встраивань Основи продуктивності та оптимізації зображень AI в робочому процесі Генерація чорнового тексту, який ви редагуєте для точності Пропозиції CSS, які ви тестуєте в DevTools Уникання недоступного або роздутої розмітки AI Структура курсу Фаза 1 — Структура HTML (Тиждень 1 · 2 живі сесії) Створіть скелет багатосекційної маркетингової сторінки. Семантичні теги: header, nav, main, section, footer Заголовки, списки, посилання та зображення з alt текстом Форми та етикетки для контактних блоків Завдання: Нестилізований HTML каркас для вашої бізнес-сторінки. Фаза 2 — CSS макет і брендинг (Тиждень 2 · 2 живі сесії) Застосуйте типографіку, колір та адаптивний макет. CSS скидання / нормалізація та користувацькі властивості Flexbox для навігації та рядків карт Grid для секцій функцій Завдання: Стилізований макет для настільних комп'ютерів + мобільних пристроїв. Фаза 3 — Компоненти та полірованість (Тиждень 3 · 2 живі сесії) Кнопки, картки та системи послідовного відстані. Стан кнопок і кільця фокусування Шаблони карток та використання значків Темний режим за бажанням (prefers-color-scheme) Завдання: Бібліотека компонентного стилю на одній сторінці. Фаза 4 — Інтерактивність JavaScript (Тиждень 4 · 2 живі сесії) Мобільне меню, плавне прокручування та проста валідація форм. querySelector та слухачі подій Переключення класів для навігації та FAQ Валідація на стороні клієнта перед надсиланням Завдання: Інтерактивна навігація + FAQ на вашій сторінці. Фаза 5 — Основи контенту та SEO (Тиждень 5 · 2 живі сесії) Мета-теги, Open Graph та зручна для читання структура тексту. Заголовок, опис та канонічні теги Ієрархія заголовків та внутрішні посилання Робочий процес редагування тексту за допомогою AI Завдання: Список перевірки SEO, застосований до вашого сайту. Фаза 6 — Публікація та обслуговування (Тиждень 6 · 2 живі сесії) Розгорнення статичних файлів та план безпечних звичок оновлення. Варіанти статичного хостингу (Netlify / подібні) Огляд власного домену та HTTPS Робочий процес оновлення та резервування Завдання: Живий URL для вашого завершеного сайту. Попередні вимоги Комфортне використання браузера та текстового редактора. Попереднє кодування не потрібне. Доставка Ви можете використовувати свій реальний бізнес-брендинг, якщо це бажано (стокові зображення повинні бути ліцензовані). Фреймворки (React, Vue) не входять до обсягу — цей курс зосереджений на основах. Повна інформація про курс: https://nlcrc.co.uk/courses-web-fundamentals-ai Бронювання та запити: nlcrc.co.uk · 020 3393 0948