13470

Разработка web-сайта в Adobe Dreamweaver

Лабораторная работа

Информатика, кибернетика и программирование

Лабораторная работа Тема: Разработка webсайта в Adobe Dreamweaver Цель работы: научиться регистрировать сайт разрабатывать его физическую структуру создавать шаблоны страниц и страницы на основе шаблона. Задание: Запустите Adobe Dreamweaver. Зарегистрируйте новый сайт ...

Русский

2013-05-11

811 KB

106 чел.

Лабораторная работа

Тема: Разработка web-сайта в Adobe Dreamweaver

Цель работы: научиться регистрировать сайт, разрабатывать его физическую структуру, создавать шаблоны страниц и страницы на основе шаблона.

Задание:

  1.  Запустите Adobe Dreamweaver. 
  2.  Зарегистрируйте новый сайт (SiteNew Site…; Сайт – Новый сайт…), который будет создаваться на локальном компьютере, а затем выгружаться в Интернет. Сайт не будет использовать серверных технологий. В качестве имени сайта укажите свою фамилию, укажите в качестве папки для хранения файлов сайта папку MySite, которую следует создать в вашей личной папке.

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

  1.  Определите физическую структуру сайта, описывающую размещение файлов и папок сайта на диске локального компьютера (WindowFiles):
    1.  В папке MySite создайте папки: Pictures (в этой папке будут храниться все графические объекты сайта), History (в этой папке будут размещаться html-файлы, описывающие страницы сайта).
    2.  В папке MySite создайте файл index.html (он будет содержать главную страницу сайта).
    3.  Найдите в Интернете и скопируйте в папку Pictures картинки, которые вы будете размещать на сайте (файлы картинок могут иметь форматы .gif, .jpeg, .jpg, .png, .psd).
    4.  Из папки Исходные файлы для сайта скопируйте в папку Pictures файлы:
      •  BabbageDifferenceEngine.jpg;
      •  Gears_large.jpg;  
      •  Lochkarte_Tanzorgel.jpg.
    5.  В папке History создайте файлы, в которых будут сохранены страницы сайта:

beginning.html; 

punch_cards.html;

programmable_machines.html;

electromechanical_computers.html;

first_generation.html;

second_generation.html;

third_generations.html.

  1.  Разработайте шаблон страниц сайта:
    1.  Создайте пустой шаблон (FileNew… – Blank Template; Файл – Новый… – Бланк шаблона): тип шаблона – шаблон HTML (HTML template; Шаблон HTML), макет – 3 гибридных столбца, верхний и нижний колонтитулы (3 column hubrid, header and footer).
    2.  Оформите области шаблона по образцу (см. ):
      •  Рисунок, размещаемый в верхнем колонтитуле, выберите самостоятельно среди файлов, скопированных вами в папку Pictures. Для вставки нужного элемента (рисунка, таблицы, гиперссылки и др.) на страницу используется меню Insert.
      •  Меню, расположенное слева, должно содержать следующие пункты: Главная страница; Ранние приспособления и устройства для счёта; Появление перфокарт; Первые программируемые машины; Электромеханические цифровые компьютеры; Первое поколение компьютеров; Второе поколение компьютеров; Третье и последующие поколения компьютеров.
    3.  Создайте гиперссылки на документы (выделите текст ссылки, выберите команду Insert – Hyperlink; Вставка – Гиперссылка и заполните поле Link; Связь, указав имя файла нужного документа):
  •  Главная страница – файл index.html;
  •  Ранние приспособления и устройства для счёта – файл beginning.html;
  •  Появление перфокарт – файл punch_cards.html;
  •  Первые программируемые машины – файл programmable_machines.html;
  •  Электромеханические цифровые компьютеры – файл electromechanical_computers.html;
  •  Первое поколение компьютеров – файл first_generation.html;
  •  Второе поколение компьютеров – файл second_generation.html;
  •  Третье и последующие поколения компьютеров – файл third_generations.html

  1.  Создайте редактируемые области в шаблоне: основное содержимое Edit1   (выделите текст, выберите команду InsertTemplate ObjectsEditable Region; Вставка – Объекты шаблона – Редактируемая область), примеры Edit2. См. .

Рисунок . Шаблон страниц

  1.  Сохраните шаблон под именем Main (FileSave As…; Файл – Сохранить как… тип файла – Template Files (*.dwt); Шаблон (*.dwt)). Для файла шаблона в папке сайта будет создана папка Templates.

  1.  Создайте страницы сайта на основе шаблона:
    1.  Главная страница (см. ). Откройте файл index.html. Примените шаблон Main (ModifyTemplatesApply template to Page…; Изменить – Шаблон – Применить шаблон к странице…). Заполните редактируемые области (текст находятся в папке Исходные файлы для сайта). Для размещения рисунка справа от текста создайте таблицу, в левую часть которой внесите текст, в правую – рисунок. Рисунок выберите самостоятельно среди рисунков, скопированных вами в папку Pictures.

Рисунок . Главная страница сайта

  1.  Страница «Ранние приспособления и устройства для счёта» (см. ). Откройте файл beginning.html. Примените шаблон Main. Заполните редактируемые области (текст находятся в папке Исходные файлы для сайта). Вставьте рисунки из папки Pictures.

Рисунок . Фрагмент страницы «Ранние приспособления и устройства для счёта»

  1.  Оформите остальные страницы сайта самостоятельно.
  2.  Для каждой страницы сайта определите заголовки (Title; Заголовок):
    •  index.html – История вычислительной техники
    •  beginning.htmlРанние приспособления и устройства для счёта
    •  punch_cards.htmlПоявление перфокарт
    •  programmable_machines.html - Первые программируемые машины
    •  electromechanical_computers.html - Электромеханические цифровые компьютеры
    •  first_generation.html - Первое поколение компьютеров
    •  second_generation.html - Второе поколение компьютеров
    •  third_generations.html - Третье и последующие поколения компьютеров

  1.  Сохраните все страницы сайта (FileSave All; Файл – Сохранить все).
  2.  Просмотрите страницы сайта в браузере, проверьте работу гиперссылок (File – Preview in BrowserIExplore; Файл – Предпросмотр в браузере – IExplore).

Контрольные вопросы:

  1.  Как зарегистрировать новый сайт в Adobe Dreamweaver?
  2.  Что такое «физическая структура сайта»?
  3.  Какое имя обычно имеет главная страница сайта?
  4.  Как создать шаблон страницы?
  5.  Как добавить на страницу рисунок?
  6.  Как создать таблицу?
  7.  Как добавить редактируемую область в шаблон?
  8.  Как применить шаблон к странице?
  9.  Как создать заголовок страницы?

PAGE   \* MERGEFORMAT 4


 

А также другие работы, которые могут Вас заинтересовать

22389. ТРЕЩИНОСТОЙКОСТЬ И ПЕРЕМЕЩЕНИЯ ЖЕЛЕЗОБЕТОННЫХ ЭЛЕМЕНТОВ. СОПРОТИВЛЕНИЕ ОБРАЗОВАНИЮ ТРЕЩИН ЦЕНТРАЛЬНО РАСТЯНУТЫХ, ИЗГИБАЕМЫХ, ВНЕЦЕНТРЕННО СЖАТЫХ И РАСТЯНУТЫХ ЭЛЕМЕНТОВ. ТРЕЩИНОСТОЙКОСТЬ И ПЕРЕМЕЩЕНИЯ ЖЕЛЕЗОБЕТОННЫХ ЭЛЕМЕНТОВ 101.52 KB
  ТРЕЩИНОСТОЙКОСТЬ И ПЕРЕМЕЩЕНИЯ ЖЕЛЕЗОБЕТОННЫХ ЭЛЕМЕНТОВ. СОПРОТИВЛЕНИЕ ОБРАЗОВАНИЮ ТРЕЩИН ЦЕНТРАЛЬНО РАСТЯНУТЫХ ИЗГИБАЕМЫХ ВНЕЦЕНТРЕННО СЖАТЫХ И РАСТЯНУТЫХ ЭЛЕМЕНТОВ. ТРЕЩИНОСТОЙКОСТЬ И ПЕРЕМЕЩЕНИЯ ЖЕЛЕЗОБЕТОННЫХ ЭЛЕМЕНТОВ. Общие положения Трещиностойкость элементов как условлено ранее это сопротивление образованию трещин в стадии I или сопротивление раскрытию трещин в стадии II.
22390. РАСЧЕТ ПО ОБРАЗОВАНИЮ ТРЕЩИН, НОРМАЛЬНЫХ И НАКЛОННЫХ К ПРОДОЛЬНОЙ ОСИ ЭЛЕМЕНТА. СОПРОТИВЛЕНИЕ РАСКРЫТИЮ ТРЕЩИН. ОПРЕДЕЛЕНИЕ РАССТОЯНИЯ МЕЖДУ ТРЕЩИНАМИ 235.22 KB
  РАСЧЕТ ПО ОБРАЗОВАНИЮ ТРЕЩИН НОРМАЛЬНЫХ И НАКЛОННЫХ К ПРОДОЛЬНОЙ ОСИ ЭЛЕМЕНТА. СОПРОТИВЛЕНИЕ РАСКРЫТИЮ ТРЕЩИН. ОПРЕДЕЛЕНИЕ РАССТОЯНИЯ МЕЖДУ ТРЕЩИНАМИ. Расчет по образованию трещин нормальных к продольной оси элемента Этот расчет заключается в проверке условия что трещины в сечениях нормальных к продольной оси элемента не образуются если момент внешних сил М не превосходит момента внутренних усилий в сечении перед образованием трещин Мcrcт.
22391. КРИВИЗНА ОСИ ПРИ ИЗГИБЕ, ЖЕСТКОСТЬ И ПЕРЕМЕЩЕНИЯ ЖЕЛЕЗОБЕТОННЫХ ЭЛЕМЕНТОВ. ОБЩИЕ ПОЛОЖЕНИЯ РАСЧЕТА 161.5 KB
  КРИВИЗНА ОСИ ПРИ ИЗГИБЕ ЖЕСТКОСТЬ И ПЕРЕМЕЩЕНИЯ ЖЕЛЕЗОБЕТОННЫХ ЭЛЕМЕНТОВ. ОБЩИЕ ПОЛОЖЕНИЯ РАСЧЕТА Расчет перемещений железобетонных элементов прогибов и углов поворота связан с определением кривизны оси при изгибе или с определением жесткости элементов. Считается что элементы или участки элементов не имеют трещин в растянутой зоне если при действии постоянных длительных и кратковременных нагрузок с коэффициентом надежности по нагрузке γf= 1 трещины не образуются. Кривизна оси при изгибе и жесткость железобетонных элементов на участках...
22392. БЕТОН. СТРУКТУРА БЕТОНА. ПРОЧНОСТЬ И ДЕФОРМАТИВНОСТЬ. КЛАССЫ И МАРКИ БЕТОНА. АРМАТУРА. НАЗНАЧЕНИЕ И КЛАССИФИКАЦИЯ. МЕХАНИЧЕСКИЕ СВОЙСТВА. АРМАТУРНЫЕ СВАРНЫЕ ИЗДЕЛИЯ 130.03 KB
  СТРУКТУРА БЕТОНА. КЛАССЫ И МАРКИ БЕТОНА. В связи с этим в бетоне со временем прочность нарастает несколько изменяется объем в зависимости от соотношения состава бетона и химического состава цемента происходит усадка или при использовании специальных цементов расширение. По этим полостям и частично капиллярам возможно перемещение влаги и газа в толще бетона.
22393. ЖЕЛЕЗОБЕТОН. ОСОБЕННОСТИ ЗАВОДСКОГО ПРОИЗВОДСТВА. ПРЕДВАРИТЕЛЬНО-НАПРЯЖЕННЫЙ ЖЕЛЕЗОБЕТОН. АНКЕРОВКА АРМАТУРЫ В БЕТОНЕ. СЦЕПЛЕНИЕ АРМАТУРЫ С БЕТОНОМ. УСАДКА И ПОЛЗУЧЕСТЬ ЖЕЛЕЗОБЕТОНА 435.32 KB
  УСАДКА И ПОЛЗУЧЕСТЬ ЖЕЛЕЗОБЕТОНА. СПЕЦИАЛЬНЫЕ ВИДЫ ЖЕЛЕЗОБЕТОНА. Железобетон состоит из бетона и стальной арматуры. В изгибаемых элементах высокое сопротивление бетона сжатию используется в сжатой зоне а высокое сопротивление арматуры растяжению в растянутой зоне где бетон слабо сопротивляется растяжению и в нем образуются трещины рисунок 2.
22394. КЛАССИФИКАЦИЯ ЗДАНИЙ И СООРУЖЕНИЙ. КОНСТРУКТИВНЫЕ ЭЛЕМЕНТЫ НАДЗЕМНОЙ ЧАСТИ ПРОМЫШЛЕННЫХ ЗДАНИЙ 213.84 KB
  Различные строительные объекты здания и сооружения в зависимости от их назначения можно подразделить на четыре основные группы: жилые и общественные здания которые объединяются общим названием гражданские здания; к общественным зданиям относятся общежития клубы больницы школы.различные административные здания учебные театральнозрелищные торговые здания и т.; промышленные здания здания фабрик заводов и других производственных помещений здания гаражей электростанций котельных и т. сельскохозяйственные здания здания...
22395. Системный (структурный) уровень компьютерного проектирования сложных объектов 230 KB
  Системный подход к задаче автоматизированного проектирования технологического процесса; 2. Системный анализ сложных процессов 3 Этапы проектирования сложных систем 1. Системный подход к задаче автоматизированного проектирования технологического процесса Системный подход к задачам автоматизированного проектирования требует реализации совместного проектирования технологического процесса ТП и автоматизированной системы управления этим процессом АСУТП.
22396. Системный уровень компьютерного проектирования сложных объектов 110.5 KB
  Системный подход направление методологии научного познания и социальной практики в основе которого лежит рассмотрение объектов как системы; ориентирует исследователя на раскрытие целостности объекта на выявление многообразных типов связей в нем и сведения их в единую теоретическую картину. Основная процедура – построение обобщающей модели отражающие взаимосвязи реальной ситуации; техническая основа системного анализа – ЭВМ и информационные системы. Основной общий принцип системного подхода заключается в рассмотрении частей явления или...
22397. Математические модели объектов проектирования 148 KB
  3 Функциональные и структурные модели; 3. В САПР для каждого иерархического уровня сформулированы основные положения математического моделирования выбран и развит соответствующий математический аппарат получены типовые ММ элементов проектируемых объектов формализованы методы получения и анализа математических моделей систем. Это обстоятельство приводит к расширению множества используемых моделей и развитию алгоритмов адаптивного моделирования.