Cамоучитель по созданию сайтов

Адрес в Интернете

Начнем с конца
Адрес в Интернете
Где найти сервер для публикации
Как отправить материалы серверу
Доменные имена

Регистрация имен
Как написать вебстраницу
Простой текст загруженный в броузер

Теги HTML
Простейшая страничка текст и заголовок
Страничка отформатированная с помощью тега
Та же страничка в форматированием текста узком окне броузера



Обзор программ для просмотра вебстраниц
Различия между броузерами
Броузер Internet Explorer
Броузер Netscape Navigator

Другие свойства просмотра
Простейшие средства создания вебстраниц
Код HTML в текстовом редакторе Блокнот

Вебредактор TextPad
Вебредактор Arachnophilia
Вебредакторы типа WYSIWYG
Редактор Star Office

Netscape Composer
Создание вебстраниц при помощи программы Allaire Homesite/Cold Fusion
Работа с файлами

Работа с проектами
Схема сайта
Прочие вкладки
Панель редактирования
Автоматизация ввода
Диалоговые окна редактирования тегов

Создание графических карт ссылок
Предварительный просмотр страницы
Как создают вебстраницы
От автора

Самое главное на любой вебстранице — гиперссылки
Применение внутренних гиперссылок
Гиперссылки в пределах сайта
Внешние гиперссылки
Применение гиперссылок для связей с удаленными серверами
Как создать списки на вебстранице
Маркированные и нумерованные списки

Применение маркированного и нумерованного списков
Применение вложенных списков
Использование списка терминов
Создание таблиц

Таблица, созданная простейшими средствами
Формирование структуры таблицы
Основные атрибуты таблицы
Таблица из одной ячейки
Применение атрибута
Кроме того, имеется еще атрибут

Окрашивание рамки таблицы
Таблица из двух ячеек
Пример таблицы с “недостающей” ячейкой
Пример таблицы с пустой ячейкой

Управление шириной столбцов
Объединение ячеек
Пример объединения ячеек таблицы

Анализ примера
Основные средства языка HTML
Простейшее форматирование текста

Управление выравниванием текста
Иллюстрация применения атрибута ALIGN
Оформление абзацев
Оформление заголовков
Горизонтальная линейка
Применение заголовочных стилей

Управление шрифтом
Применение зачеркнутого текста
Цветовое оформление
Дополнительные варианты оформления

Отображение исходного кода программ в броузере
Графические форматы Интернета
Формат GIF
Страничка с круглой фотографией
Общий вид программы WWW Gif Animator

Формат JPEG
Графические элементы оформления вебстраниц
Линейки и буквицы
Графические маркеры
Оформление кнопок
Подготовка рисунков в программе Xara Webstyle
Выбор шаблона

Настройка параметров рисунка
Выбор способа сохранения
Подготовка рисунков в программе Adobe Photoshop
Основное окно программы Adobe Photoshop
Пример 1 Создание градиентного фона
Инструменты программы Adobe Photoshop
Создание нового изображения в программе Photoshop

Пример 2 Подготовка круглой фотографии
Исходная
Очистка
Фотография ненужных областей

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

Пример 4 Совмещение изображений
Первая исходная фотография для монтажа
Вторая исходная фотография для монтажа
Обтравка изображения по контуру

Двухслойное изображение в программе Photoshop
Эффект зеркального отражения одного из слоев
Список слоев в программе Photoshop
Числовые преобразования в программе Photoshop

Перемещение слоя
Изменение масштаба
Перемещение слоя за рамки кадра

Удаление “лишней” тени из слоя
Окно настройки эффектов применительно к слою изображения
Наложение тени на слой если потребуется Перед вторым изображения
Законченная композиция после кадрирования

Пример 5 Украшение изображения мелкими деталями
Пример 6 Заливка и заполнение объектов текстурами
Исходный снимок
Результат заливки

Пример 7 Наложение текста
Ввод текста в программе Adobe Photoshop
Наложение текста на фотографию

Придание тексту рельефности
Надпись с наклоном
Заключение
Перемещение выделенной области в одном слое

Графика на вебстранице
Основные способы применения графики
Фоновое изображение
Фоновый рисунок

Не самое удачное применение фонового рисунка
Графические иллюстрации
Пример странички с фоновым рисунком и иллюстрацией

Изображениекарта
Изображение компьютера из которого мы будем делать
Страничка с графической картой ссылок

Определение стилей в специальной таблице
Стили элементов
Стили классов
Внешние стилевые таблицы
Обзор других возможностей стилевых таблиц

Размещение блоков текста
Как можно организовывать загрузку разделов
Добавим на страничку блок гиперссылок
Добавление фонового рисунка
Позиционирование блока гиперссылок
Оформление текста

Декоративное оформление текста

Оформление заголовка

Применение стилей к основной части странички
Оформление заголовка
Наложение элементов вебстраницы

Оформление вебстраницы с использованием стилей
Оформление с помощью атрибута STYLE
Замена тегов на стилевое описание
Длинный эпиграф при таком оформлении становится не похожим на эпиграф
Выравнивание эпиграфа с помощью вложенных блоков
Выравнивание подписи под эпиграфом
Абзацный отступ
Программы для сжатия звуковых фрагментов
Чтение дорожек компактдиска

Запись звука от внешнего источника
Панель индикации Windows
Окно системного микшера Windows

Окно записи в программе Sound Forge
Индикация перегрузки
Сжатие звука

Запись в формате МРЗ
Основное окно программы Fraunhofer МРЗ Producer Professional
Запись формата TwinVQ

Маленькие хитрости
Устранение постоянной составляющей
Обычный синусоидальный сигнал
Управление амплитудой

Нейтрализация шумов
Устранение выделяющейся спектральной полосы
Две спектрограммы обычной звукозаписи и звукозаписи с сильно выделяющейся частотной полосой
Использование звука на вебстранице
Добавление звукового оформления
Фоновая музыка

Звуковые объекты
Звуковые гиперссылки
Форматы звуковых файлов
Сжатие звуковых файлов
Формат RealAudio
Формат МРЗ

Формат TwinVQ
Как писать собственные функции
Описание функции

Усложненный пример
Расчет факториалов и запрос к пользователю
Указание языка сценариев
Динамическое изменение внешнего вида страницы
Доступ к элементам HTML по номеру
Доступ к элементам HTML по имени

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

Другие возможности языка JavaScript
Дополнительные операторы JavaScript
Встроенные функции JavaScript

Динамические вебстраницы на основе JavaScript
Простейшие примеры
Запись информации в вебдокумент
Простейшее использование JavaScript

Изменение строки состояния
Интерпретация языка JavaScript
Учет версии броузера

Использование условной переадресации и временной задержки
Запрос сведений у читателя
Генерация таблицы “на лету”
Страница управляемая при помощи мыши
Реакция на наведение
Динамическое управление позиционированием элементов

Исходная позиция для расстановки плашек
Изменение порядка следования позиционированных элементов
Реакция на перемещение мыши
Реакция на отпускание кнопки
Реализация технологии draganddrop пользователь может перетаскивать плашки с помощью мыши
Динамическое отображение текста вебстраницы

Имитация гиперссылок
Щелчок на “гиперссылке” изменяет текст в нижней части страницы
Та же страница после щелчка на “гиперссылке”
Произвольный выбор текста
На этой странице изначально не видно ни одного из рассказов
Использование других свойств при работе с текстом

Добавление дополнительных надписей
Через минуту после появления текста рассказа возникает красная надпись “Ну что нравится?”
Динамическое изменение графических элементов вебстраницы
Подготовка графических кнопок
Страница графически оформленных гиперссылок
Управление “подсветкой” кнопок

На этой странице графические гиперссылки подсвечиваются при наведении на них указателя мыши
Предварительная загрузка графических объектов
Вебстраницы реагирующие на действия пользователя
Ввод данных пользователем в формы HTML
Получение информации от пользователя
Поля для ввода текста
Списки
Простейшая форма HTML
Прокручиваемый список

Переключатели
Флажки
Форма с элементами управления
Группы элементов формы

Логическое объединение элементов формы
Другие элементы формы
Управление расположением элементов вебстраницы с помощью таблиц

Создание ячеек таблицы
Размещение элементов на вебстранице и навигация по сайту
Использование структуры фреймов
Формирование набора фреймов
Вложенные наборы фреймов
Навигация между фреймами
Пример простейшего серверного сценария

Дополнительные возможности формирования вебстраниц
Пример использования элемента управления Tabular Data
Текстовая база данных
Элемент управления для работы с базой данных
Динамическое формирование таблицы
Фильтрация таблицы

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