Главная

Регистрация

Вход

Четверг, 09.05.2024, 17:24
Приветствую Вас ГостьRSS
 Меню сайта
  • Главная страница
  • Обратная связь
  • Карта сайта
  • Форум
  • Правила сайта
  •  Разделы
  • Программы • Coфт
  • Музыка MP3 • Flac
  • Фильмы • Видео
  • Клипы • Ролики
  • Игры на ПК
  • Обои для рабочего стола
  • Cкринсейверы
  • Юмор • Приколы
  • Книги • Чтиво
  • Все для мобилы
  •  Аудиокниги
  • Разное
  • Журналы
  • Видеоуроки
  • Все для Photoshop
  •  Статистика
    Яндекс.Метрика
    Главная » Статьи » Разделы сайта » Видеоуроки

    Адаптивная вёрстка на HTML5 и CSS3 (2016) PCRec

    Адаптивная вёрстка на HTML5 и CSS3 (2016) PCRec

    Современные сайты и веб-разработку уже невозможно представить без HTML5 и CSS3, как ни крути.

    Любой проект, любой заказчик требуют валидной, кроссбраузерной и современной вёрстки на HTML5 и СSS3, и обязятельно адаптированную под мобильные устройства.

    Если вы будете уметь верстать на HTML5 и CSS3 и адаптировать проект под мобильные устройства, то можно смело поднимать стоимость часа своей работы.

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

    Cодержание:

    Вводная часть

    0. Вводное видео
    О курсе и как его использовать

    1. HTML5. Семантическая разметка
    О новых тегах: header, nav, section, aside, article и т.д.

    2. HTML5. Медиа объекты
    Вставка видео и аудио без дополнительных плееров + атрибуты.

    3. HTML5. Формы
    Работа с формами в HTML5 + новые типы полей.

    4. HTML5. Другие возможности
    Примеры реализации других возможностей на HTML5

    5. CSS3. Новые свойства в CSS3
    Линейные градиенты, раудисы, прозрачность, тени, трансформация, анимация.

    Практическая часть

    1. Макет и PSD исходник
    Знакомство с PSD исходником и набросок будущего макета

    2. Вёрстка шапки
    Расчёт адпаптивных размеров и вёрстка шапки + формула расчёта EM и %

    3. Вёрстка блока "Услуги"
    Планирование этапа, подготовка изображений и вёрстка блока.

    4. Вёрстка блока "Портфолио"
    Планирование, двойные классы и вёрстка.

    5. Блок "Портфолио": hover эффекты
    Создание hover эффекта при наведении на элементы на CSS3.

    6. Вёрстка блока "О нас"
    Вёрстка хитрого блока с позиционированием и псевдо-классами.

    7. Вёрстка блока "Наша команда"
    Подготовка и вёрстка блока + создание CSS спрайтов

    8. Вёрстка блока "Партнёры"
    Вёрстка блока и вставка карусели изображений на JQuery

    9. Вставка карты Яндекса
    Вставка интерактивной карты Яндекса во всю ширину.

    10. Вёрстка формы обратной связи
    Планирование этапа, создание формы с новыми типами полей.

    11. Блок с копирайтами
    Вёрстка блока копирайтов, расширение CSS спрайта, вставка даты на PHP

    12. Улучшение и доработка
    Добавление функции плавной прокрутки к блокам и кнопки "Наверх" (3 варианта)

    13. Улучшение и доработка ч.2
    Валидация полей в форме обратной связи (через JS) + защита от СПАМ ботов

    14. Адаптация под мобильные устройства
    Адаптация под экраны планшетов и мобильников + работа с FireBug

    15. Адаптация под мобильные устройства ч.2
    Вторая часть видео по адаптации.

    16. PHP обработчик формы
    Создание скрипта-обработчика на PHP, для формы обратной связи.

    17. Умная форма обратной связи
    Подключение скрипта для формы обратной связи с передачей UTM меток и записью в CSV файл.

    18. Перенос на хостинг и валидация
    Перенос лендинга на хостинг по FTP, проверка, ускорение и установка цели в Яндекс.Метрике.

    Информация о видео
    Название: Адаптивная вёрстка на HTML5 и CSS3 
    Автор: Олег Касьянов
    Год выхода: 2016
    Жанр: Видеокурс
    Язык: Русский
    Выпущено: Россия
    Продолжительность: ~5 часов

    Файл
    Формат: MP4 (+ доп.материалы)
    Видео: AVC, 1280x720, ~392 Kbps
    Аудио: AAC, 126 Kbps, 48.0 KHz
    Размер файла: 2.27 Gb

      


    Скачать Адаптивная вёрстка на HTML5 и CSS3 (2016) Видеокурс



    Поделись с друзьями:


    Категория: Видеоуроки | Добавил: colt (31.10.2016)
    Просмотров: 395 | Теги: на HTML5 и CSS3, Адаптивная вёрстка, Олег Касьянов | Рейтинг: 0.0/0

    Похожие материалы:
    Всего комментариев: 0
    Добавлять комментарии могут только зарегистрированные пользователи.
    Регистрация | Вход
    Поиск ♦ Search
    Форма входа
    Гость

    Группа:
    Гости
    Время: 17:24
    Ты здесь: -й день
    Новые файлы
    Copyright MyCorp © 2024
    Создать бесплатный сайт с uCoz