Модуль 1. Основы

Курс научит вас создавать по-настоящему хорошие сайты. Так чем же отличается хороший сайт от плохого обычного?

• Хорошим сайтом удобно управлять
• Хороший сайт удобен и приятен для посетителя
• Хороший сайт не тормозит
• Хороший сайт хорошо индексируется без всяких раскручиваний
• Хороший сайт нужен всем

1. Знакомство с HTML.
   • Сайт. Что такое гипертекст.
     Гиперте́кст — термин, введённый Тедом Нельсоном в 1965 году для обозначения текста «ветвящегося или выполняющего действия по запросу». Сайт состоит из одного или более гипертекстовых документов.
   • Редактор блокнот - лучший инструмент для написания гипертекста.
     Для написания хорошего гипертекста не нужно специальных редакторов, тут чем проще, тем лучше.
   • Структура HTML.
     Гипертекст, это обычный текст в который включены теги - команды, которые указывают на свойство участка текста который они обособляют как скобки. Как правило есть открывающий и закрывающий тег. открывающий тег - слово из латинских букв, а закрывающий, это то же слово, только перед ним слеш. теги заключаются в треугольные скобки.
   • Создание первого гипертекстового документа.
     Любой гипертекстовый документ начинается тегом HTML и заканчивается /HTML. У него есть шапка HEAD и тело BODY. В Шапке заголовок TITLE, а в теле текст который будет виден посетителям сайта.
     
   Задание на дом: Придумать тематику будущего сайта, подготовить немного информации для заполнения.
2. Таблицы, деление текста на блоки
   • Заполнение сайта контентом
   • Изучение табличной разметки

     Элемент <table> служит контейнером для элементов, определяющих содержимое таблицы. Любая таблица состоит из строк и ячеек, которые задаются с помощью тегов <tr> и <td>. Внутри <table> допустимо использовать следующие элементы: <caption>, <col>, <colgroup>, <tbody>, <td>, <tfoot>, <th>, <thead> и <tr>.

   • Объединяем ячейки, как и зачем это делается
   • Рисуем своюю первую таблицу
   Задание на дом: Придумать компоновку сайта, где навигация, где тело
3. Списки
   • Компонуем страничку с помощью таблицы
   • Нумерованный список
   • Вложенные списки
   • Навигация с использованием списка
   Задание на дом:
4. Графика, Вставляем картинку на сайт
   • как подготовить изображение для сайта, размеры, сжатие
   • код для вставки картинки, путь к файлу
   • позиционирование относительно текста, обтекание
   • размер изображения на странице - абсолютный и относительный
5. Оформление и выделение текста
   • болд или италик, как сделать и как не переборщить
   • зачем нужно оформлять текст
   • повышаем читаемость текста за счет оформления
   • выравнивание, отступы.
6. Знакомство с CSS
   • зачем это нужно
   • увеличиваем эстетику с уменьшением объема
   • управление глобальными свойствами
   • выносим стили в отдельный файл
7. Простейшая анимация при помощи CSS
   • меню с живыми кнопками
   • красиво и без графини
   • трансформации: прозрачность, поворот
   • css + графика = ?
   Задание на дом: Придумать оформление меню
8. Интерактив при помощи JavaScript
   • Создание интернет-опроса
   • Визуальные эффекты
   • Фотогалерея
   • Всплывающее окно
   Задание на дом: Придумать интересную тему для опроса
9. Делаем красивое меню
   • желания и возможности, всегда ли совпадают, неизбежные? жертвы
   • каждый делает индивидуальное меню
   • основные ошибки
   • рекомендации и предостережения
10. Хостинг
    • таблетки от жадности... да побольше, побольше
    • чем отличается домен от хостинга, с чем их едят
    • основные понятия
    • конкретные примеры связки домен-хостинг
    Задание на дом: Придумать имя будущего сайта
11. Регистрируем домен на бесплатном хостинге
    • все хорошие имена заняты?
    • ftp. зачем нужен, как пользоваться.
    • обмен ссылками
    • абсолютный и относительный путь.
12. Выкладываем в Интернет
    • Загрузка страниц в сеть интернет.
    • Регистрация в поисковых системах.
    • Установка счетчика посещений.
    • Анонс модуля "Продвинутый".