DreamWeaver шаг за шагом


Шаг 15


Ну вот и настало время для последнего, решительного шага :) Сам не знаю почему, но на душе моей стало гораздо легче. Теперь вы знаете про DreamWeaver почти столько же сколько о нем знаю я. Правда я работаю в нем все реже и реже. Единственный сайт, который я по-прежнему делаю только в DW - это "Дизайн и графика". Почему? Просто чтобы экономить свое рабочее время.

Довольно трепаться - приступим.

Внимательно прошелся по всем предыдущим описаниям, и тем описаниям, что лежат в советах по DreamWeaver. И пришел к интересному выводу - я рассказал вам почти все :) Остался последний штрих.

Возможно в качестве завершения он будет не совсем к месту, но делать нечего. Сегодня я расскажу вам о том, как оформлять в DreamWeaver-е формы.

Где они прячутся я рассказывал еще на первом шаге.

Начнем с самой формы. По сути она играет роль некого контейнера, внутри которого находятся основные элементы формы (поля ввода, чекбоксы и прочее...). При создании формы обязательно нужно указать метод (method), используемый при отправке информации, программу которая будет обрабатывать данную форму (action). Кроме того, если вы пожелаете работать с данной формой при помощи JavaScript вам необходимо указать имя (name). JavaScript может применяться для проверки корректности ввода.

Первый объект, с которым я вас знакомлю - текстовое поле ввода информации. В HTML оно выглядит примерно так:

Что с ним можно делать? Да информацию в него вводить :)

Существует несколько типов данного поля. А именно:

  1. поле обыкновенное (см. выше)
  2. поле типа password (разница в том, что при вводе вместо букв отображаются звездочки.
  3. многострочное поле - для любителей оставлять целые поэмы о себе :)

Где применяются данные поля:

  1. для ввода фамилий, имен, адресов, явок и т.д.
  2. для ввода паролей, секретных сообщений и т.д.
  3. для написания поэм, пунктов прочее и т.д.

Кнопочка. Без нее в вормах никуда. Что толку все писать если не будет чего-то, на что можно ткнуть и отправить ваши мысли программе-обработчику :)

Кнопки бывают разные - полезные и безобразные:

1.

2.

  1. Полезная кнопка. Без нее вы не сможете отправить вашу форму по-назначению
  2. Бесполезная кнопка (зачем очищать всю форму, если можно просто поправить то что вы ввели...)

CheckBox & Radiobutton - братья близнецы с разными родителями :)

Вот как они выглядят:

1.

я - Вася

я - не Вася, а Петя

сам ты Вася

2.

я - Вася

я - не Вася, а Петя

сам ты Вася

Где их используют:

  1. при необходимости указать несколько вариантов по одному вопросу (теме)
  2. при необходимости указать только один вариант ответа на заданный вопрос.

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

Выглядит она вот так (2 варианта):

1.

text

text2

text3

 2.

textlabel

textlabel2

textlabel3

Где применяются:

  1. либо для навигации по сайту, либо для выбора из некоторого ограниченного списка (указание страны, даты рождения)
  2. в основном для навигации. хотя может рассматриваться как альтернатива checkbox-у

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

Еще один вариант submit-кнопки. Для эстетов. Просто вместо кнопки подставляется графическое изображение. Выглядит красиво, но в нетскейпе при наведении мышки курсор свою форму не меняет :( Пример подобной кнопки, сделанный автором можно увидеть здесь (автора ногами не пинать - что заказчик хотел, то и получил...)

Последнее поле - hidden. Его никто не видит, о нем никто не знает (кроме вас). Применяться может по-всякому. В основном используется для хранения некой промежуточной информации...

Теперь немного о дизайне форм.

  1. если хотите получить что-либо красивое - используйте таблицы. пример - на форуме данного сайта. без таблиц формы выглядят как минимум странно.
  2. используйте стили. большая часть элементов форм подвергается стилевому изменению. особенно хорошо это работает в IE (можно задать цветовое и прочее оформление всего что вы видите на элементах формы
  3. очень часто установка формы в таблицу приводит к разбуханию ячейки в которой находится таблица - побороть это можно, если переназначить стилевое оформление тега form - задать все параметры padding и spacing.

Ну вот пожалуй и все...

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

Кстати, в моих планах есть создание подобного описания по Macromedia Flash :) Возможно мы снова зашагаем вместе.

|

 




- Начало -    



Книжный магазин