Должна сказать, что уроки эти вышли в 2005 году, многие сведения устарели, хотя основ еще никто не отменял. Прочитав эти уроки, вы освоите азбуку html. Если вы не хотите вникать во все тонкости сайтостроения, то может быть, будет проще использовать готовые движки для сайта типа WordPress, Joomla, MODX, Drupal и многие другие.
С чего начать
Подготовка к великому походу в мир веба. Узнайте, какие инструменты нужны дикарю, чтобы построить свою первую цифровую пещеру.
От автора
История создания «Диких уроков». Почему старый добрый HTML — это фундамент, на котором стоят даже самые современные замки в интернете.
Введение
Что такое веб-страница и как браузеры читают наши мысли? Простое введение в анатомию сайтов для начинающих первооткрывателей.
Первая страничка
Ваш первый костер в цифровом лесу! Учимся создавать простейший HTML-файл и выводить заветную надпись «Привет, мир!».
Тема сайта
О чем будет ваша пещера? Учимся выбирать направление, придумывать структуру и планировать будущее великое поселение.
Графика сайта
Как украсить стены пещеры? Основы работы с изображениями в HTML: вставляем первые картинки и приручаем атрибут src.
Текст
Искусство наскальной надписи. Учимся управлять заголовками, абзацами и переносами строк, чтобы ваш текст был читаемым и красивым.
Bgcolor и Background
Красим стены и клеим шкуры! Узнайте, как задать цвет фона страницы или наложить на неё красивую текстуру в классическом HTML.
Фон своими руками
Секреты оформления заднего плана. Как сделать так, чтобы фон подчеркивал уют вашей пещеры и не мешал гостям читать легенды.
Фон (Облачные фильтры)
Продвинутые приемы работы с фоном. Сочетание цветов и текстур для создания неповторимого стиля «дикого» сайта.
Фотоальбом
Строим первую галерею трофеев. Как аккуратно расставить фотографии в пещере, чтобы каждый охотник мог ими полюбоваться.
Слайд-шоу
Магия смены кадров. Учимся создавать простую презентацию картинок, чтобы ваши приключения ожили на глазах у посетителей.
Ссылки
Прокладываем тропы к соседям. Всё о теге : как создавать переходы между страницами и не заблудиться в цифровых джунглях.
Золушка
Сказка о превращении гадкого утенка в прекрасную леди. Все дело в пиджаке!
Списки
Пересчитываем добычу. Учимся создавать маркированные и нумерованные списки: от простого перечня ягод до иерархии племени.
Текст + Графика
Гармония в пещере. Как красиво обтекать картинки текстом и подружить изображения с буквами с помощью атрибутов.
Сотворение мира и фреймов
Пещера с перегородками. Изучаем технологию фреймов: как разделить окно браузера на несколько независимых жилых зон.
Решение квартирного вопроса
Навигация в многослойном мире. Учимся открывать ссылки в нужных окнах (target) и управлять сложной структурой фреймов.
Наш маленький бизнес
Лавка старьевщика. Банки, склянки и рваные ботинки
Старинный архив
Реставрация старых фотографий
Фотоальбом во фреймах
Удобная галерея в классическом стиле. Используем фреймы для создания каталога, где меню всегда под рукой, а фото меняются в центре.
Заключительное (но не загробное) слово о фреймах
Почему вожди против фреймов? Разбираем минусы технологии: проблемы с индексацией, закладками и навигацией в поисковиках.
Таблицы
Каменный фундамент верстки. Учимся строить таблицы: строки, ячейки и первые сетки для размещения контента.
Три таблицы
Магия объединения. Как использовать colspan и rowspan, чтобы создавать сложные ячейки для больших трофеев и длинных заголовков.
Всеобщий психоз (вложенные таблицы)
Дизайн внутри ячеек. Оформляем таблицы: рамки, отступы, цвета фона и выравнивание содержимого для идеального порядка.
Растровая графика (gif)
Ожившие картинки. Всё о формате GIF: прозрачность, сжатие и секреты создания легких изображений для вашего сайта.
Кнопочки, кнопочки...
Мастерская спецэффектов. Создаем красивую графическую кнопку в формате GIF, на которую так и хочется нажать дубиной.
Анимация без анимации
Первый шаг в JavaScript. Учимся менять одну картинку на другую при наведении курсора (эффект ролловера).
Немного об ImageReady
Знакомство с легендарным инструментом. Как подготовить графику к вебу и разрезать её на кусочки для быстрой загрузки.
Рисунок в каждом слое
Вороне где-то бог послал кусочек сыра... Секреты анимации
Анимация для ленивых
Продвинутая оптимизация. Как добиться идеального баланса между красотой картинки и весом файла для вашего сайта.
Карты изображений
Секретные тропы на одной шкуре. Узнайте, как сделать разные части одной картинки кликабельными ссылками (тег map).
Карты изображений в "Image Ready"
Инструментарий Image Ready для карт. Быстрая разметка активных зон любой формы: круги, квадраты и многоугольники.
Какофония звуков
Голос вашей пещеры. Как добавить фоновую музыку или звуковые эффекты на сайт, чтобы погрузить гостя в атмосферу древности.
Формы
Приемная вождя. Создаем анкеты, поля ввода и кнопки, чтобы собирать послания от посетителей и отправлять их духам сервера.
От малого до великого всего лишь один стиль!
Великая магия преображения. Переходим от оформления тегами к каскадным таблицам стилей. Один приказ для всех пещер!
Единицы измерений
Локти, пиксели или проценты? Разбираемся в мерах длины: когда использовать жесткие px, а когда гибкие % и em.
Свойства шрифтов
Почерк шамана. Учимся менять размер, жирность и семейство шрифтов, чтобы придать тексту уникальный характер.
Свойства текста
Искусство каллиграфии. Выравнивание, красные строки, межстрочные интервалы и подчеркивания — наводим порядок в буквах.
Селекторы
Боевой клич CSS. Как выбирать нужные теги и классы, чтобы применять к ним магию стилей выборочно и точно.
Селекторы по ID
Уникальные имена ID. Учимся использовать идентификаторы для оформления неповторимых элементов, таких как трон вождя или шапка сайта.
Background (позиции)
Застывшая скала и живые узоры. Магия background: фиксированные фоны, повторение текстур и позиционирование рисунков.
Красота без границ - не красота!
Возводим ограды! Всё о рамках (border): сплошные, пунктирные, двойные и объемные линии для выделения ваших блоков.
Поля и отступы
Личное пространство контента. Изучаем Margin и Padding: как сделать так, чтобы блоки не толкались, а текст не царапался о рамку.
Сайт в CSS
Модульное строительство. Собираем полноценный макет сайта на блоках (DIV) без использования тяжелых и старых таблиц.
Meta-теги
Шепот для поисковых духов. Учимся прописывать невидимые заклинания, чтобы Яндекс и Google узнали о сокровищах вашей пещеры.
Включения на стороне сервера (SSI)
Магические вклейки. Используем Server Side Includes, чтобы менять меню сразу на всех страницах, обновляя лишь один файл.
Раскрутка сайта
Авторитет в цифровом лесу. Что такое индекс цитирования и как сделать так, чтобы другие племена чаще ссылались на вашу пещеру.
Свой домен
Золотое имя на скале. Как выбрать и зарегистрировать собственное имя в зоне .RU и почему это важно для настоящего вождя.
Счетчики посещений
Дикая бухгалтерия. Устанавливаем магический камень учета, чтобы точно знать, сколько гостей заглянуло в вашу пещеру за день.
Покорение мира
Покорение мира начинается здесь! Как заявить о себе во всех лесных реестрах и привлечь первых посетителей со всего света.
Как заработать в Интернете
Как принести мамонта в дом? Современные способы получения золота в интернете: от фриланса и рекламы до партнерских программ.