First Code

Курсы программирования

24

практических занятий по 2 часа

3

сайта создадите в период обучения

27

дополнительных материалов и статей

100%

гарантия, верстать сайты научатся все

Ваш первый шаг

Для чего необходимо изучать HTML и CSS?

HTML

? HTML - это язык гипертекстовой разметки веб-страницы. Иными словами, все что Вы видете на любом сайте: картинки, заголовки, тексты, ссылки и т.д. Выводятся с помощью языка HTML.

CSS

? CSS - это язык для создания внешнего вида веб-страницы. Иными словами CSS служит для создания дизайна сайта. С помощью CSS задаются цвета, размеры текстов и блоков, шрифты и все что связанно с дизайном веб-сайта.

Первый шаг в веб-разработке

HTML и CSS — это базовые языки, которые необходимо знать любому веб-разработчику. Если Вы решили обучаться созданию сайтов, то HTML и CSS — это то, с чего необходимо начать, так как без базового понимания принципов HTML и CSS работать в веб-разработке практически невозможно. Особенность данных языков в том, что они очень просты в изучении и отлично подходят для новичков. Уже после обучения Вы с легкостью сможете верстать любые сайты и зарабатывать — это отличный способ войти в отрасль, испытать себя, а затем развиваться дальше.

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

Ознакомьтесь подробнее с программой курса

  • Основы HTML и CSS
  • 1 урокВиды сайтов и процесс их разработки. Основные HTML теги и атрибуты

    На первом занятии Вы узнаете:
    - какие бывают сайты;
    - все способы их разработки
    - и, самое главное, из чего они строятся (увидите сайт изнутри).

    Далее мы познакомимся и изучим все самые основные HTML теги, которые используются в верстке чаще всего (далее по ходу обучения, на других занятиях Вы узнаете обо всех HTML тегах).

    Из данного урока Вы узнаете все виды тегов, какие они бывают и в чем их ключевое отличие.

    Также мы расскажем Вам про атрибуты: какие они бывают и какова их цель.

  • 2 урокСтруктура HTML документа и все meta-теги

    Любая веб-страница имеет четкую иерархию и структуру.

    Мы подробно разберем всю структуру HTML документа и теги, которые для этого необходимы.

    Во второй половине занятия мы разберем все meta-теги, которые используются для хранения информации, предназначенной для браузеров и поисковых систем

  • 3 урокЧто такое CSS? Основные свойства CSS

    На данном занятии Вы узнаете:
    - что такое CSS;
    - для чего и как он используется;
    - научимся подключать стили, различным способами.

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

  • 4 урокСвойства CSS для текста

    При верстке сайта нам часто приходится работать с текстами, поэтому мы отобрали самые основные свойства CSS для работы с ними.

    На 4 занятии Вы научитесь задавать различный дизайн тексту.

  • 5 урокСвойста «background» и «gradient»

    Практически на любом сайте приходится работать с фоновыми объектами и закрашивать различные блоки каким-либо цветом. Для этого используется свойство background.

    Вы узнаете все возможности свойства background и научитесь делать градиент.

  • 6 урокПозиционирование блоков и модульная сетка

    После того как Вы освоите основные теги и стили, мы перейдем к очень Важно теме "Модульная сетка".

    Вы узнаете:
    - зачем она нужна;
    - в чем ее особенность;
    - как правильно ее использовать.

  • 7 урокТеги и CSS свойства для создания таблиц

    Иногда на сайте необходимо создать таблицу с ячейками и колонками (как в Excel). Для этого случая в языках HTML и CSS есть целый ряд специальных тегов и свойств, которые дают широкие возможности для создания различных таблиц.

    Вы изучите все HTML теги и CSS свойства для создания таблиц на сайте.

  • 8 урокОписание всех свойств модуля CSS Flexbox

    CSS Flexbox — это технология для создания сложных гибких макетов за счёт правильного размещения элементов на странице.

    После данного занятия Вы:
    - узнаете, как работает Flexbox;
    - изучите все свойства и возможности Flexbox;
    - научитесь использовать Flexbox на практике.

  • 9 урокПозиционирование элементов с помощью свойства «position» и приоритет элементов

    В первой половине урока мы познакомимся с очень важным CSS свойством «position» и подробно рассмотрим на практике все его значения.

  • 10 урокРабота с картинками на сайте. Редактирование картинок в Photoshop и лучшие сервисы для поиска изображений, иллюстраций и иконок

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

    Мы подобрали очень большой список сервисов по подбору самых различных изображений, которые Вы будете использовать при создании сайтов совершенно бесплатно.

    Часто после того, как Вы подобрали подходящее изображение, его необходимо отредактировать, подогнать по размеру, обрезать, вырезать задний фон и.т.д. Для этого отлично подойдет программа Photoshop. Мы покажем все основные инструменты для работы с картинками в Photoshop.

    После данного занятия Вы:
    - узнаете, виды форматов изображений;
    - узнаете, какие форматы лучше всего подходят для сайта, а какие лучше не использовать;
    - не будете задаваться вопросом, откуда взять изображения для сайта.
    - освоите базовые навыки по работе с изображениями для сайта в программе Photoshop

  • 11 урокОптимизация изображений и ленивая загрузка

    Оптимизация изображений и ленивая загрузка - прямо влияют на производительность сайта, поэтому об этом должен знать каждый современный веб-разработчик.

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

    На занятии Вы:
    - получите все необходимые сервисы для оптимизации изображений и научитесь ими пользоваться;
    - с помощью Java Script научитесь устанавливать ленивую загрузку изображений для еще большей производительности.

  • 12 урокРабота со шрифтами. Поиск, конвертирование и установка шрифтов на сайт

    Шрифты, как и изображения, играют очень важную роль при разработке сайтов. Практически для каждого современного сайта дизайнер подбирает уникальные шрифты, в зависимости от тематики сайта.

    Мы подобрали очень большой список сервисов по подбору самых различных шрифтов, которые Вы будете использовать при создании сайтов совершенно бесплатно.

    После данного занятия Вы:
    - узнаете виды форматов шрифтов, формат, который используется в том или ином браузере;
    - узнаете, какие шрифты лучше всего подходят для сайта, а какие лучше не использовать;
    - не будете задаваться вопросом: откуда взять нужный шрифт для сайта?
    - научитесь конвертировать шрифты и устанавливать их на сайт.

Смотреть все Еще 8 уроков

01.

Первый месяц обучения

12 занятий в модуле

3 занятия в ниделю по 2 часа

  • Углубленное изучение HTML и CSS
  • 1 урокФункции и переменные CSS

    В языке CSS, как и во многих языках программирования, можно использовать переменные и функции.

    После данного занятия Вы:
    - научитесь создавать и использовать переменные;
    - узнаете, в каких случаях лучше всего использовать переменные на практике;
    - узнаете все основные функции CSS и научитесь их использовать.

  • 2 урокСоздание форм

    Если Вам необходимо получить обратную связь от своих пользователей или заполнение какой-либо информации, то Вам необходима форма. К примеру: "оставить заявку", "купить", "заказать звонок", "написать письмо" и.т.д.

    На данном уроке Вы:
    - научитесь создавать формы любой сложности;
    - узнаете все поля, которые можно использовать в форме (к примеру: поле для ввода текста, поле для ввода eMail, поле для ввода пароля, и т.д.);
    - узнаете все необходимы атрибуты для настройки полей;

  • 3 урокВсе свойства технологии CSS Grid Layout

    CSS Grid Layout — это самый мощный инструмент для создания разметки, который доступен в CSS на сегодняшний день. Это двумерная система, которая может содержать строки и столбцы (в отличии от модуля Flexbox, который, в целом, является одномерной системой). Предназначение Grid Layout — полностью изменить способ проектирования пользовательских интерфейсов, дизайн которых основан на сетке.

    После данного занятия Вы:
    - узнаете как работает Grid Layout;
    - изучите все свойства и возможности Grid Layout;
    - научитесь использовать Grid Layout на практике.

  • 4 урокСвойство CSS для применения фильтров

    Фильтры в CSS необходимы для того, чтобы применять различные графические эффекты к элементу. Например: размытие, смещение цвета или возможность сделать изображение черно-белым (при этом оригинал изображения остается цветным, а на сайте отображается черно-белого цвета).

  • 5 урокТрансформация объектов и плавные переходы «transform, transition»

    В первой половине занятия мы разберем свойство Transform, которое позволяет трансформировать объекты на сайте.

    Вы научитесь:
    - перемещать объекты в пространстве;
    - масштабировать объекты;
    - поворачивать объект в двухмерном и трёхмерном пространстве;
    - осуществлять деформацию объекта;
    - задавать перспективу;

    Во второй половине занятия, на практике мы разберем все возможности CSS-свойства Transition, которое позволяет осуществлять плавные переходы.

  • 6 урокСвойство CSS для создания анимаций на сайте

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

  • 7 урокАнимация блоков при скроле (кросс-браузерные анимации)

    Вы научитесь реализовывать кросс-браузерные анимации на сайте.

    Наверняка Вы встречали сайты, где элементы появляются в тот момент, когда Вы докручиваете до них. Именно этому Вы научитесь на данном уроке.

  • 8 урокПсевдоклассы, псевдоэлементы и селекторы атрибутов

    На данном занятии Вы узнаете:
    - что такое псевдоклассы;
    - что такое псевдоселекторы;
    - как использовать селекторы атрибутов.

  • 9 урокАдаптивная верстка. Оптимизация сайта для мобильных устройств и планшетов

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

    На этом занятии Вы узнаете все об адаптивной верстке и научитесь оптимизировать сайты под любые устройства.

  • 10 урокСоздаем различные слайдеры

    На данном занятии Вы научитесь разрабатывать различные слайдеры любой сложности

  • 11 урокСервисы для проверки сайтов

    На курсе мы учим не просто создавать сайты, а создавать качественные и производительные сайты с быстрой скоростью загрузки, оптимизированные под поисковые системы и идеальной валидацией кода.

    Чтобы этого достичь, мы используем целый ряд сервисов, которые позволяют определить производительность сайта и указывают на места, которые эту производительность снижают.

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

  • 12 урокПодключение системы управления для сайта

    По окончании второго модуля (изучения HTML и CSS) Вы уже разработаете 3 сайта. На этом этапе для того, чтобы отредактировать контент на сайте (к примеру, изменить заголовок) Вам необходимо зайти в код и непосредственно в коде изменить текст заголовка.

    Чтобы упростить задачу и не открывать постоянно код сайта, необходимо подключить систему управления, которая позволит изменить контент, не прибегая к коду.

    На уроке мы расскажем и установим целых 2 системы управления сайтом, которые Вы сможете в дальнейшем использовать для своих проектов.

Смотреть все Еще 8 уроков

02.

Второй месяц обучения

12 занятий в модуле

3 занятия в ниделю по 2 часа

03.

Дополнительные занятия

2 занятия в модуле

3 занятия в ниделю по 2 часа

Просмотрите программу курса

Результат за 2 месяца

Пройдя обучение Вы научитесь:

Научиться верстать сайты любой сложности

Верстать сайты любой сложности

Научиться создавать анимации на сайте

Создавать анимации на сайте, WOW эффекты и различные слайдоры

Научиться работать с веб-шрифтами и картинками

Работать с веб-шрифтами и правильно оптимизировать изображения

Научиться подключать систему управления для сайтов

Подключать систему управления для сайтов

Научиться работать с Фотошопом

Работать с Фотошопом и другими различными программами и сервисами

Научиться адаптировать сайты

Адаптировать сайты под мобильные устройства и планшеты

Научиться оптимизировать сайты

Оптимизировать сайты под поисковые системы

Научиться создавать адаптивную модульную сетку

Создавать адаптивную модульную сетку для сайтов

Научиться находить клиентов

Находить клиентов на разработку сайтов и вести проекты

Хотите научиться верстать сайты? Пройдя наш курс, Вы легко сможете верстать сайты любой сложности для себя и на заказ

Линия

запишитесь на курс до 30 января и получите первое бесплатное занятие

object
object

Только практика

Вы будете создавать сайты уже на курсе

01

Первый сайт (Landing Page) Вы создадите с преподавателем на курсе в период обучения

Просмотреть макет  →
Обучение созданию сайтов с помощью HTML и CSS
02

Второй сайт Вы создадите самостоятельно, при выполнении домашних заданий, под руководствои преподавателя

Просмотреть макет  →
03

Третий сайт (одноэкранник-слайдер) Вы разработаете во втором модуле при изучении разработки различных слайдеров

Просмотреть макет  →

Хотите создать первые 3 сайта для своего портфолио?

Запишитесь на курс и Вы не только создадите свои первые проекты и освоите новую профуссию «Верстальщик сайтов», но и погрузитесь в увлекательный процесс создания сайтов

Вы будете создавать сайты уже на курсе

Первое занятие бесплатно

Оцените все преимущества нашего курса бесплатно

Пройдя первое занятие, Вы познакомитесь с преподавателем и форматом обучения, а также погрузитесь в увлекательный процесс создания сайтов и узнаете все преимущества данной профессии

Бесплатное занятие HTML и CSS

Осталось 5 мест

Количество мест ограниченно

Запишитесь на первое бесплатное занятие прямо сейчас

    Формат обучения

    Просмотрите, как будет проходить Ваше обучение

    Онлайн курс HTML и CSS
    1

    Перед каждым занятием Вы получаете ссылку на онлайн конференцию, где преподаватель курса подробно расскрывает тему определенного занятия

    Обучение HTML и CSS
    2

    Вы проходите практические занятия и пошагово повторяете все за преподавателем, общаетесь с ним и задаваете ему интересующие Вас вопросы по ходу занятия

    Домашнее задание
    3

    После каждого занятия Вы получите домашнее задание, которое поможет закрепить пройденный материал

    Преподаватель курса
    4

    Преподаватель проверяет Ваше задание и дает обратную связь: указывает на ошибки, дает советы, отвечает на вопросы

    Сайты на HTML и CSS
    5

    В итоге Вы освоите новую профессию «Верстальщик сайтов» и разработаете 3 сайта для своего портфолио или бизнеса. Далее мы проведем анализ сайтов и дадим обратную связь и советы по дальнейшему развитию

    Курс будет полезен каждому

    Для кого отлично подойдет данный курс?

    Курс HTML и CSS для новичков

    Новичкам

    Тем, кто только решил освоить разрабатку сайтов, но не знает с чего начать

    Курс HTML и CSS для предпринимателей

    Предпринимателям и стартаперам

    Которые хотят самостоятельно разрабатывать и продвигать сайты для своего бизнеса

    Курс HTML и CSS для начинающих разработчиков

    Начинающим разработчикам

    Которые хотят повысить свою квалификацию и знать все об HTML и CSS

    Курс для тех кто хочет освоить IT профессию

    Кто хочет сменить профессию и ворваться в IT

    Курс отлично подойдет всем, кто хочет с нуля обучится новой профессии

    Если Вы узнали себя, давайте познакомимся. Запишитесь на первое бесплатное занятие прямо сейчас!

    Line
    Записаться на занятие

    количество мест ограниченно,
    осталось 5 из 7 мест

    Стоимость обучения

    Успейте приобрести курс по специальной цене

    Первое занятие
    бесплатно

    0 Бесплатно

    check занятия проходят в любое удобное для Вас время

    check индивидуальное и групповое обучение с преподавателем

    check живое участие в онлайн формате

    check практическое занятие

    Количество мест ограниченно.
    Осталось 4 из 7 мест

    Групповые
    занятия

    14000

    check-turquoise занятия проходят в фиксированное время (дневное или вечернее обучение)

    check-turquoise обучение в мини группах от 3 до 7 человек

    check-turquoise живое участие в онлайн формате

    check-turquoise 3 сайта создадите в период обучения

    Индивидуальные
    занятия

    24500

    check занятия проходят в любое удобное для Вас время

    check индивидуальное обучение с преподавателем

    check индивидуальные разботы домашних заданий

    check живое участие в онлайн формате

    check 3 сайта создадите в период обучения

    Удобная
    рассрочка 0%

    от7000в месяц

    Оплачивайте постепенно, отдельно за каждый модуль по мере прохождения курса. Курс состоит из 2 модулей

    Стоимость курса HTML и CSS
    Купить курс HTML и CSS

    Стоимость обучения

    Стоимость курса будет повышаеться каждые сутки

    • Групповые занятия
    • Индивидульные занятия
    Цена сегодня: 14000 руб.


    Акция закончилась
    Цена сегодня: 24500 руб.


    Акция закончилась

    Успейте забронировать место по сегодняшней цене

      Вопрос-ответ

      Ответы на часто задаваемые вопросы

      Контакты школы программирования

      Остались еще вопросы?

      Позвоните нам или закажите обратный звонок, мы свяжемся с Вами в течение 3 минут

      +7-(952)-570-58-51

      Заказать звонок