ЧУДО "САИКТ"

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

HTML+CSS
Язык разметки HTML
 

HTML - это основа основ. Это азы, мимо которых не может пройти ни один начинающий web-дизайнер.

HTML не является языком программирования, это язык разметки веб-страниц. Проще говоря, именно HTML отвечает за то, что кнопочка "Записаться на курс" на нашем сайте находится именно там, где вы ее видите, а не в другом месте.

Вместе с тем, язык HTML очень очень прост в изучении, а практиковаться в нем - одно удовольствие.


Мы будем изучать:

  • Общие понятия о браузерах. Структура HTML-документа. Структура сайта
  • HTML. История, версии
  • HTML. Инструментарий разработчика
  • HTML. Структура web-документа. Понятие «тег»
  • HTML. Использование цветов. Режимы RGB и CMYK
  • HTML. Теги текста, заголовков, списков, параграфов
  • HTML. Понятие «атрибут» (свойство) тега. Обязательные и необязательные атрибуты
  • HTML. Изображение в документе
  • HTML. Гиперссылки, ссылки на файл, на email. Ссылки на внутреннюю часть документа («якоря»)
  • HTML. Карты
  • HTML. Таблицы. Табличная верстка. Вложенные таблицы
  • HTML. Тег <div>. Блочная верстка
  • HTML. Резиновая и жесткая верстка
  • HTML. Линии, рамки, специфические теги, спецсимволы
  • HTML. Вставка видео, аудио, flash в html
  • HTML. Формы
  • HTML. Метагеги, их назначение и применение
  • HTML5
Язык CSS
 

Именно CSS отвечает за то, что кнопочка "Записаться на курс", что слева от вас, имеет приятный оранжевый цвет. А попробуйте навести на нее курсор. Видите, как изменился шрифт на кнопке? Это тоже работа CSS.

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


Мы будем изучать:

  • CSS. Каскадные таблицы стилей и их применение. Подключение к html-документу
  • CSS. Единицы измерения
  • CSS. Стили ссылок, текста, списков, таблиц, изображений, рамок
  • CSS. Использование цветов. Система RGB
  • CSS. Позиционирование элементов
  • CSS. Классы. Идентификаторы. Контекстные селекторы
  • CSS. Псевдоэлементы
  • CSS. Псевдоклассы
  • CSS. Поля и отступы
  • CSS. Блочная верстка. Команда float
  • CSS. Резиновая и жесткая верстка
  • CSS. Трюки и эффекты с использованием CSS
  • CSS. CSS и различные браузеры
  • CSS3. Фон и градиенты. Прозрачность, закругление углов, слои, тень и другие эффекты
  • Практика: создание выпадающего списка на CSS
  • Практика: создание фотогалереи на CSS
  • Практика: верстка сайта
               
Дизайн сайта
Bootstrap
 

Фреймворк Bootstrap существенно упрощает создание стильных сайтов благодаря множеству встроенных шаблонов для оформления шрифтов, форм, блоков, ссылок и других элементов web-сайтов.


Мы будем изучать:
  • Введение в Bootstrap. Поддержка браузеров и мобильных устройств. Загрузка и установка фреймворка
  • Bootstrap. Модульная сетка
  • Bootstrap. Использование базового CSS (абзацы, списки, таблицы, формы, кнопки и пр.)
  • Bootstrap. Основные компоненты (панели, метки, навигация, "хлебные крошки" и пр.)
  • Bootstrap. Компоненты (пагинация, переключатели, группы кнопок и пр.)
  • Bootstrap. Плагины (тултипы, всплывающие окна и пр.)
  • Bootstrap. Оптимизация
  • Bootstrap. Темы и шаблоны
  • Практика (на собственном сайте)
  • Bootstrap и Javascript
Создание "админки" для сайта
Современные CMS
 

Человек всегда стремится облегчить себе жизнь. Это касается и сайтостроения. Сегодня в интернете масса ресурсов, создатели которых не потрудились изучить ни html, ни css. Они воспользовались системой, которая предоставила им, по сути, конструктор ("движок") для сайта. Это так называемые CMS - системы управления контентом.

Заметим, что мы против создания сайтов без навыков верстки в html и css по той простой причине, что сайты всегда нуждаются в обслуживании, а здесь уж без соответствующих знаний просто не обойтись. Но мы не можем и пройти мимо знакомства с современными CMS. Для этого мы включили изучение некоторых движков в этот курс.


Мы будем изучать:

  • Обзор современных CMS. Коммерческие, бесплатные и студийные CMS. Рейтинг CMS
  • CMS Wordpress - возможности, достоинства, недостатки, перспективы
  • CMS Joomla! - возможности, достоинства, недостатки, перспективы
  • Создание сайта на CMS (по выбору)
Основы web-программирования
Основы Javascript
 

C изучения Javascript начинается знакомство с web-программированием, и этот несложный язык позволяет нам научиться оперировать понятиями «переменная» и «массив», «функция» и «методы», в общем, всем арсеналом программистской лексики.

Javascript интересен тем, что реагирует на действия пользователя. Да вот и пример: вы читаете этот текст именно благодаря действию Javascript. Кликните на ссылку «Основы Javascript», она откроет подпункты, кликните снова - они скроются.

И это только самое малое. На Javascript делают красивые выпадающие меню, фотогалереи и другие интерактивные элементы веб-сайтов.


Мы будем изучать:

  • Основы объектно-ориентированного программирования на JavaScript
  • JavaScript. Объектная модель документа (DOM)
  • JavaScript. Синтаксис языка
  • JavaScript. Переменные и операторы
  • JavaScript. Понятия "объект" и "метод" (с примерами из реальной жизни)
  • JavaScript. Методы объекта window
  • JavaScript. Массивы
  • JavaScript. Условный оператор (логические выражения)
  • JavaScript. Циклы
  • JavaScript. Отлов ошибок и комментарии
  • JavaScript. Функции
  • JavaScript. Объекты и свойства объектов
  • JavaScript. Методы
  • Взаимодействие JavaScript и CSS
  • JavaScript. Дата и время. Таймеры
  • JavaScript. События
  • JavaScript. Изменение DOM (создание, добавление, изменение и удаление узлов)
  • Практика: создание выпадающего меню на JavaScript
  • Практика: создание фотогалереи на JavaScript
  • Практика: анимация на JavaScript
Экзамен
Яндекс.Метрика IT-курсы для взрослых