Создание шаблона сайта, используя программу Adobe Dreamweaver 8.0
Определение основных понятий web-проектирования. Обзор программного обеспечения для создания web-страниц. Браузеры для просмотра web-сайтов. Разработка web-ресурса с помощью среды Dreamweaver 8.0. Структура HTML документа и Форматирование текста.
| Рубрика | Программирование, компьютеры и кибернетика |
| Вид | курсовая работа |
| Язык | русский |
| Дата добавления | 17.12.2011 |
| Размер файла | 5,9 M |
Отправить свою хорошую работу в базу знаний просто. Используйте форму, расположенную ниже
Студенты, аспиранты, молодые ученые, использующие базу знаний в своей учебе и работе, будут вам очень благодарны.
Размещено на http://www.allbest.ru/
Содержание
- Введение
- 1. Основы Web-проектирования
- 1.1 Основные понятия
- 1.2 Обзор программного обеспечения
- 1.3 Браузеры для просмотра web-сайтов
- 2. Разработка web-ресурса с помощью среды Dreamweaver 8.0
- 2.1 Язык HTML
- 2.2 Структура HTML документа
- 2.3 Форматирование текста
- Заключение
- Литература
Введение
World Wide Web - глобальная компьютерная сеть на сегодняшний день содержит миллионы сайтов, на которых размещена всевозможная информация. Люди получают доступ к этой информации посредством использования технологии Internet. Для навигации в WWW используются специальные программы - web-браузеры, которые существенно облегчают путешествие по бескрайним просторам WWW. Вся информация в web-браузере отображается в виде web-страниц, которые являются основным элементом байтов WWW.
Web-страницы, поддерживая технологию мультимедиа, объединяют в себе различные виды информации: текст, графику, звук, анимацию и видео. От того, насколько качественно и красиво сделана та или иная web-страница, зависит во многом ее успех в сети.
Пользователю приятно посещать те web-страницы, которые имеют стильное оформление, не отягощены чрезмерно графикой и анимацией, быстро загружаются и правильно отображаются в окне web-браузера.
Школьники зачастую являются уверенными пользователями сети Интернет. И для них изложение материала в электронном формате или в формате web-страницы представляет особый интерес к предмету и значительно упрощает понимание.
Мне, как будущему учителю, важно обладать умениями web-проектирования, т.к. я хочу привлекать своих учеников к работе, пробуждать интерес к моему предмету. Именно поэтому я решила выбрать данную тему.
В своей курсовой работе я сделала попытку разобраться в том, что необходимо знать и уметь для создания web-страницы, какое программное обеспечение является инструментарием создания и просмотра Web-страниц и как его эффективно использовать.
Также в данной работе мною рассмотрены основы языка программирования web-страниц - HTML, который является общепринятым стандартом WWW. Это даст возможность ознакомиться со структурой web-страницы и приемами ее правильного оформления.
Изучив теоретический материал по теме курсовой работы, мною была поставлена задача - закрепить теоретические знания созданием шаблона сайта, используя программу Adobe Dreamweaver 8.0.
1. Основы Web-проектирования
1.1 Основные понятия
Web-сайт (англ. Website, от web -- паутина и site -- «место») -- в компьютерной сети объединённая под одним адресом (Доменным именем или IP-адресом) совокупность документов частного лица или организации. По умолчанию подразумевается что сайт располагается в сети Интернет. Все web-сайты Интернета в совокупности составляют Всемирную паутину. Для прямого доступа клиентов к web-сайтам на серверах был специально разработан протокол HTTP. Web-сайты иначе называют Интернет-представительством человека или организации. Когда говорят «своя страничка в Интернет», то подразумевается целый web-сайт или личная страница в составе чужого сайта. Кроме web-сайтов в сети Интернет так же доступны WAP-сайты для мобильных телефонов.
Доменное имя -- символьное имя домена. Должно быть уникальным в рамках одного домена. Полное имя домена состоит из имён всех доменов, в которые он входит, разделённых точками. Доменное имя служит для адресации узлов сети Интернете и расположенных на них сетевых ресурсов (web-сайтов, серверов электронной почты, сетевых сервисов) в удобной для человека форме. Альтернативой может быть адресация узла по IP-адресу, что менее удобно и труднее запоминается.
Доменная зона -- совокупность доменных имён определённого уровня, входящих в конкретный домен. Термин «доменная зона» в основном применяется в технической сфере.
Хостинг (англ. hosting) -- услуга по предоставлению дискового пространства для физического размещения информации на сервере, постоянно находящемся в сети (обычно Интернет). Сервер может принадлежать либо компании-поставщику услуги, либо клиенту.
Система управления содержимым / контентом (англ. Content management system, CMS) -- компьютерная программа, используемая для управления содержимым чего-либо. Обычно такие системы используются для хранения и публикации большого количества документов, изображений, музыки или видео.
PHP (англ. PHP: Hypertext Preprocessor -- «PHP: препроцессор гипертекста», англ. Personal Home Page Tools (устар.) -- «Инструменты для создания персональных web-страниц») -- язык программирования, созданный для генерирования HTML-страниц на веб-сервере и работы с базами данных.
HTML (от англ. HyperText Markup Language -- «язык разметки гипертекста») -- стандартный язык разметки документов во Всемирной паутине. Большинство web-страниц создаются при помощи языка HTML (или XHTML).
Текстовые документы, содержащие код на языке HTML (такие документы традиционно имеют расширение «html» или «htm»), обрабатываются специальными приложениями, которые отображают документ в его форматированном виде. Такие приложения, называются браузерами.
CSS (англ. Cascading Style Sheets -- каскадные таблицы стилей) -- технология описания внешнего вида документа, написанного языком разметки.
JavaScript -- скриптовый язык, чаще всего использующийся при создании сценариев поведения браузера, встраиваемых в web-страницы.
1.2 Обзор программного обеспечения
Каждый выбирает свой инструмент для создания Web-страниц. Это может быть MS FrontPage или Adobe Dreamweaver, Macromedia HomeSite или 1st Page 2000. А кто-то пользуется простым текстовым редактором, например Блокнотом (WordPad).
Текстовые редакторы возможно использовать только для создания небольших страниц, так как у них есть много минусов: не поддерживаются проекты, отсутствует "подсветка" текста и т.д. В общем, работать крайне неудобно.
Рис. 1 Окно редактора WordPad
Начнем с Microsoft FrontPage. Это редактор HTML, входящий в состав пакета приложений Microsoft Office (Рис. 1).
Программа обладает широким спектром возможностей, в частности, может автоматически отправлять изменения, внесённые разработчиком сайта в исходные тексты, в режиме реального времени.
В Microsoft Office 2007 программа FrontPage была заменена на SharePoint Designer и Microsoft Expression Web.
Рис. 2 Microsoft FrontPage
Основным недостатком MS FrontPage (Рис. 2) является то, что он генерирует очень большой HTML-код (слишком много лишнего), поэтому страницы получаются большими, что сказывается на скорости загрузки. Более того, при создании web-страниц в этом редакторе видишь одно, а в окне браузера - совсем другое (особенно это касается Netscape Navigator).
Странички получаются какими-то кривыми, поэтому для создания качественных web-страниц рекомендуется использовать пакеты, которые будут рассмотрены ниже.
Следующий редактор - Macromedia HomeSite (Рис. 3).
Рис. 3 Macromedia HomeSite 5.5
Это редактор для создания страниц вручную, т. е. для знатоков HTML. Вы получаете полный контроль над HTML-кодом, причем существует возможность оптимизировать свою страничку под один из трех популярных браузеров (MSIE, NN, Opera).
HomeSite содержит два основных режима: Edit и Design. Режим Design - это подобие WYSIWYG-редактора, выдающее HTML-код, причем, если вы загрузите чужой HTML-код, то HomeSite все перепишет по-своему. Режим Edit позволяет получить полный контроль над страничкой. Здесь вы можете настроить практически все, сможете прописать функции каждого тега (тогда ваша страничка в любом браузере будет смотреться одинаково).
Еще одна отличительная особенность HomeSite - это его «склейка» с Dreamweaver. HomeSite обладает кнопкой «Dreamweaver» (рассматривается ниже), а также входит в его стандартный пакет поставки. Впрочем, и DreamWeaver имеет возможность подключения HomeSite, как редактора для коректировки HTML-кода.
Еще один редактор, который может быть использован на web-страницах - CKeditor (Рис. 4).
Рис. 4 CKeditor
До версии 3.0 назывался FCKeditor («FCK» от имени создателя редактора, Frederico Caldeira Knabben), но сменил имя, чтобы не ассоциироваться с распространённым в английском языке ругательством (при старте проекта бразилец Фредерико об этом не знал).
Особенностью редактора является малый размер без необходимости инсталляции на стороне клиента. CKeditor совместим с большинством современных браузеров: Opera, Firefox, Camino, Internet Explorer, Google Chrome.
Следующий редактор - Namo WebEditor (Рис. 5).
Рис. 5 Namo WebEditor 2006
Он сочетает в себе практически все инструменты, необходимые для создания web-сайтов в простом и интуитивно понятном интерфейсе. Элементы интерфейса являются чрезвычайно понятными, простыми и удобными в использовании. Можно переключаться между дизайн-редактором, HTML-браузером и просмотром фотографий. Также можно использовать ряд мастеров, чтобы автоматизировать рабочий процесс. Namo является мощным, однако его WYSIWYG-возможности ограничены. Редактор не обновлялся с 2006 года, в связи с чем производство исходного кода иногда чрезвычайно кривое.
Теперь рассмотрим популярный Adobe Dreamweaver.
Заметную популярность программа получила, начиная с версии MX, выпущенной компанией Macromedia в 2002 году. До этого момента были выпущены версии 1--4, версию 5 компания пропустила. 7-я версия программы получила название Dreamweaver MX 2004, а затем в 2005 году была выпущена Dreamweaver 8 (Рис. 6).
Рис. 6 Macromedia Dreamweaver 8.0
20 апреля 2007 года уже компания Adobe выпустила более свежую версию под названием Dreamweaver CS3.
На сегодняшний момент последней версией является Dreamweaver CS5. Богатый инструментарий, открытость приложения для всевозможных настроек, удобный интерфейс и другие особенности сделали Dreamweaver одним из наиболее популярных HTML-редакторов в мире. Для работы в этой программе не нужно досконально знать HTML.
Dreamweaver на несколько шагов опережает другие редакторы, использующие технологию WYSIWYG, в первую очередь тем, что генерирует очень чистый HTML-код. Dreamweaver позволяет вам избавиться от однотипной работы при создании страниц (например, верстка текста) при помощи использования опции "запись последовательности команд" вы записываете последовательность производимых вами команд, потом нажимаете, например, CTRL+P, и Dreamweaver воспроизводит все в той же последовательности.
1.3 Браузеры для просмотра web-сайтов
Для просмотра web-сайтов используются специальные программы - браузеры. Они позволяют получить доступ ко всем информационным ресурсам сети. Существует несколько видов браузеров, рассмотрим подробней каждый из них.
1) Браузеры режима командной строки
К этому типу относятся самые ранние браузеры. Они не дают возможности просматривать текст и графику. Такие браузеры поддерживают перемещение только с использованием цифровых адресов (IP). В настоящее время практически не используются.
2) Полноэкранные браузеры
Текстовый браузер без поддержки мультимедийных (картинки, анимация и т.п.) ресурсов сети Интернет. С помощью него можно просматривать только текст и ссылки. Так как большинство пользователей привыкло путешествовать по Интернету с помощью браузеров поддерживающих мультимедиа, не стоит окончательно забывать и те, которые отображают только текст. Конечно, браузеры такого вида используются довольно редко, но скорость загрузки страниц у них впечатляет. Без графических и оформительных элементов многие страницы загружаются практически мгновенно.
Один из самых популярных полноэкранных браузеров является Lynx (Рис. 7), который входит в состав операционной системы Lynix.
Рис. 7 Lynx
Он не поддерживает таблицы и JavaScript. Работает довольно быстро, переносим, имеет большое количество настроек, является незаменимым помощником при работе в терминале vt100. Чрезвычайно удобен для просмотра веб-страниц слабовидящими людьми.
Однако сегодня более удобным текстовым браузером можно считать Links. В отличие от Lynx имеет поддержку фреймов, вкладок, таблиц и javascript. В данный момент существуют две основные ветки разработки на базе кода links:
- ELinks для повышения функциональности имеет встроенный язык программирования Lua.
- Links2 поддерживает также графику. Ветка Links Hacked содержит в себе многие улучшения из Elinks.
3) Браузеры с поддержкой мультимедиа
Самые распространенные и популярные браузеры сегодня. Позволяют работать практически со всеми видами информации, представленной в Интернете. 99% пользователей глобальной сети Интернет интенсивно и каждодневно используют возможности этих браузеров. Рассмотрим наиболее популярные из них.
Internet Explorer -- один из самых популярных браузеров в мире. Специально устанавливать его не нужно, так как он входит в стандартный комплект любого из Windows.
На данный момент самая свежая версия -- Microsoft Internet Explorer 9.0. Internet Explorer на сегодняшний день поддерживает абсолютно все технологии, использующиеся при создании сайтов. Это всевозможные мультимедиа-ролики, шифрование данных в системах электронной коммерции, различные языки разметки гипертекста. Internet Explorer (Рис. 8) корректно работает с подавляющим большинством существующих сайтов. Достоинств и возможностей у этого браузера еще очень много, а с каждой новой версией становиться еще больше.
Рис. 8 Microsoft Internet Explorer 8.0
Но хотелось бы остановиться и на некоторых его недостатках. Во-первых, данный браузер относительно медленно обрабатывает и выводит на экран страницы сайтов. Однако, это тоже спорно. Для пользователей, у которых связь с Интернетом очень быстрая подобный недостаток не играет никакой роли. Но если все-таки вспомнить людей, пользующихся медленными линиями связи, этот недостаток может оказаться существенным. Во-вторых, неудачно реализованы функции сохранения информации из Интернета. И в-третьих, очень неудобное отключение графики при просмотре сайтов -- нужно очень долго ходить по меню, чтобы поставить нужную галочку в настройках.
Netscape Navigator - браузер, производившийся компанией Netscape Communications с 1994 по 2007 год. Когда-то был действительно реальным конкурентом Internet Explorer.
Рис. 9 Netscape Navigator 9
Причина снижения его популярности состояла в удачной рекламе Microsoft и встраивании Internet Explorer в Windows. Помимо этого, разработчики Netscape Navigator (Рис. 9) в период активного развития интернет-технологий запоздали с выпуском новой версии, поддерживающей последние разработки в этой области. А когда эта версия все-таки появилась, то оказалась недоработанной, со множеством недочетов. Это заставило отказаться от этого браузера даже его поклонников. 28 декабря 2007 года компания объявила о прекращении поддержки и разработки браузера.
Opera -- браузер, разработанный в 1994 году группой исследователей из норвежской компании Telenor. С 1995 года продукт компании Opera Software, образованной авторами первой версии браузера. Opera сразу составил серьезную конкуренцию обoим лидерам (Internet explorer и Netscape Navigator) и является, во многом, гораздо более удобным в работе.
Рис. 10 Opera 10.63
Браузер имеет очень большое количество достоинств, которых нет у конкурентов. Как утверждают разработчики, это самый быстрый браузер в мире. Это подтверждается отзывами пользователей. Выигрыш в скорости можно получить, если связь с Интернетом достаточно медленная, хотя скорость загрузки страниц зависит и от персональных настроек компьютера, а также от его мощности. Поэтому, однозначно говорить, что на вашем компьютере Opera (Рис. 10) будет работать быстрее, чем Internet Explorer, не стоит.
Кроме того, этот браузер, несмотря на неплохие функциональные возможности, занимает очень мало места на диске и требует минимум системных ресурсов. Благодаря этому, данный браузер можно использовать на достаточно старых компьютерах, достигая при этом достаточного быстродействия. Еще одним преимуществом этого браузера является практически полностью настраиваемый интерфейс. Пользователь может изменить по своему желанию любую его часть. Стоит заметить, что Opera - многооконный браузер. Некоторым пользователем эта функция очень даже нравиться и они с удовольствием пользуются ей. В браузере Opera достаточно много полезных дополнительных функций. В частности, при открытии страницы он определяет скорость передачи информации и процент уже загруженных данных. К тому же Opera может показывать WAP-страницы (т. е. страницы, предназначенные для отображения на дисплеях сотовых телефонов). Есть опция, с помощью которой можно задать время обновления страниц в минутах или часах. Еще один немаловажный факт -- это дизайн пользовательского интерфейса. Opera написан для Microsoft Windows и использует стандартный дизайн Windows-программ. Следовательно, пользователи интуитивно узнают большинство функций по аналогии с другими программами. Стандартно сделанные меню, обычная последовательность кнопок на панели и другие функции, например, возможность одновременного открытия множества окон знакомы всем по обычной работе с MS Windows. Это позволяет преодолеть трудности первых шагов в новом программном продукте. Разработчики Opera позаботились и о тех, кому кажется неудобной медленная работа с мышью. При разработке управления программой был сделан упор на быстрый и простой доступ к важным функциям как с клавиатуры, так и при помощи мыши. Что очень важно, Opera позволяет быстро, нажатием на одну кнопку, выключить и снова включить отображение графики на сайте. Еще у этого браузера очень хорошо работает кэширование страниц, удобный список закладок, все команды дублируются на клавиатуре, можно делать изменение масштаба документа от 20% и до 1000%... Этот список достоинств можно продолжать и продолжать.
Рис. 11 Mozilla Firefox 3.6.3
Mozilla Firefox (Рис. 11) -- свободно распространяемый браузер. В нем присутствуют вкладочный интерфейс, проверка орфографии, поиск по мере набора, «живые закладки», менеджер закачек, поисковая система. Новые функции можно добавлять при помощи расширений, которые добавляют новые возможности в программы или разрешают модифицировать существующие настройки. Они могут добавить практически что угодно: от кнопки на панели инструментов до совершенно новых возможностей.
Google Chrome -- браузер, разрабатываемый компанией Google. Первая публичная бета-версия для Microsoft Windows вышла 2 сентября 2008 года, а первая стабильная -- 11 декабря 2008 года.
Браузер направлен на повышение безопасности, скорости и стабильности. Он периодически загружает обновления из двух чёрных списков (один для фишинг сайтов и один для сайтов содержащих вредоносное ПО) и предупреждает пользователя, когда тот пытается посетить вредоносный сайт. Также в Google Chrome (Рис. 12) присутствует функция перевода страниц. При посещении страниц, язык которых отличен от используемого в интерфейсе, в верхней части страницы автоматически появляется панель с предложением перевести web-страницу.
Рис. 12 Google Chrome 9.0.587.0
Помимо всего прочего, браузер содержит инструменты для web-разработчиков: Web-инспектор (Открывает диалоговое окно, в котором указываются элементы и ресурсы, связанные с компонентом. Также позволяет просмотреть иерархическое представление модели DOM и консоль JavaScript.), диспетчер задач (показывает все процессы, запущенные в Google Chrome, и используемые этими процессами ресурсы), отладчик JavaScript (используется для отладки запущенных процессов.)
4) Браузеры-дополнения.
Они являются надстройками над полнофункциональными браузерами. Чаще всего разработчиками дополнений используется Internet Explorer. Поэтому их возможности почти идентичны. Дополнения всего лишь изменяют интерфейс и добавляют некоторые функции, которые разработчики из Microsoft обошли своим вниманием.
2. Разработка web-ресурса с помощью среды Dreamweaver 8.0
2.1 Язык HTML
Web-страницы могут существовать в любом формате, но в качестве стандарта принят Hyper Text Markup Language - язык разметки гипертекстов, предназначенный для создания форматированного текста, насыщенного изображениями, звуком, анимацией, видеоклипами и гипертекстовыми ссылками на другие документы, разбросанные как по всему web-пространству, так и находящиеся на этом же сервере или являющиеся составной частью этого же web-проекта.
Язык HTML существует в нескольких вариантах и продолжает развиваться, но конструкции HTML скорее всего будут использоваться и в дальнейшем. Изучая HTML и познавая его глубже, создавая документ в начале изучения HTML и расширяя его насколько это возможно, мы имеем возможность создавать web-страницы, которые могут быть просмотрены многими браузерами web, как сейчас, так и в будущем. Это не исключает возможности использования других методов, например, метод расширенных возможностей, который предоставляется Netscape Navigator, Internet Explorer или некоторыми другими программами.
Работа по HTML - это способ усвоить особенности создания документов в стандартизированном языке, используя расширения, только если это действительно необходимо.
HTML был ратифицирован World Wide Web Consortium. Он поддерживается несколькими широко распространенными браузерами, и, является основанием почти всего программного обеспечения, которое имеет отношение к web.
2.2 Структура HTML документа
Поскольку HTML-документы записываются в ASCII-формате, то для ее создания может использоваться любой текстовый редактор.
Обычно HTML-документ - это файл с расширением .html или .htm, в котором текст размечен HTML-тегами (англ. tag - специальные встроенные указания). Средствами HTML задаются синтаксис и размещение тегов, в соответствии с которыми браузер отображает содержимое web-документа. Текст самих тегов web-браузером не отображается.
Все теги начинаются символом '<' и заканчиваются символом '>'. Обычно имеется пара тегов - стартовый (открывающий) и завершающий (закрывающий) тег (похоже на открывающиеся и закрывающиеся скобки в математике), между которыми помещается размечаемая информация:
<p>Информация</p>
Здесь стартовым тегом является тег <P>, а завершающим - </P>. Завершающий тег отличатся от стартового лишь тем, что у него перед текстом в скобках <> стоит символ '/' (слэш).
Браузер, читающий HTML-документ, отображает его в окне, используя структуру HTML-тегов. В каждом HTML-документе должны присутствовать три главных части:
1) Объявление HTML;
2) Заголовочная часть;
3) Тело документа.
1) Объявление HTML:
<HTML> и </HTML>. Пара этих тегов сообщает программе просмотра (браузеру) что между ними заключен документ в формате HTML, причем первым тегом в документе должен быть тег <HTML> (в самом начале документа), а последним - </HTML> (в самом конце документа).
<HTML>
</HTML>
2) Заголовочная часть:
<HEAD> и </HEAD>. Между этими тегами располагается информация о документе (название, ключевые слова для поиска, описание и т.д.). Однако наиболее важным является название документа, которое распологается в верхней строке окна браузера и в списках "Избранное (BookMark)". Специальные программы-спайдеры поисковых систем используют название документа для построения своих баз данных. Для того чтобы дать название своему HTML-документу, текст помещается между тегами <TITLE> и </TITLE>.
<HTML>
<HEAD>
<TITLE>Моя первая страница</TITLE>
</HEAD>
</HTML>
3) Тело документа:
Третьей главной частью документа является его тело. Оно следует сразу за заголовком и находится между тегами <BODY> и </BODY>. Первый из них должен стоять сразу после тега </HEAD>, а второй - перед тегом </HTML>. Тело HTML-документа - это место, куда автор помещает информацию, отформатированную средствами HTML.
<HTML>
<HEAD>
<TITLE> Моя первая страница</TITLE>
</HEAD>
<BODY>
</BODY>
</HTML>
Теперь можно написать HTML-код странички:
<HTML>
<HEAD>
<TITLE>Моя первая страница</TITLE>
</HEAD>
<BODY>
Здесь будут мои страницы!
</BODY>
</HTML>
2.3 Форматирование текста
В разделе BODY все символы табуляции и конца строк браузером игнорируются и никак не влияют на отображение страницы. Поэтому перевод строки в исходном тексте HTML-документа не приведет к началу новой строки в отображаемом обозревателем тексте при отсутствии специальных тегов. Это правило очень важно помнить и не забывать ставить разделяющие строки теги, иначе у текста не будет абзацев, и он станет нечитаемым.
Для начала новой строки используется тег <BR> (сокр. от англ. break - прервать). Этот тег приводит к отображению браузером дальнейшего текста с начала следующей строки. Закрывающий для него тег не используется. Он удобен, если требуется с какого-то места писать с новой строки без начала нового абзаца, например, в стихотворении. Повторное его использование позволяет вставить одну или несколько пустых строк, отодвинув следующий фрагмент страницы вниз.
Сплошной текст без промежутков читается не очень легко, его неудобно просматривать и находить нужные места. Разбитый на абзацы, текст воспринимается гораздо быстрее. Для начала нового абзаца используется тег <P> (англ. paragraph - абзац). Этот тег, кроме начала новой строки, вставляет одну пустую строку. Но многократное повторение <P>, в отличие от <BR>, не приведет к появлению нескольких пустых строк, останется все та же одна пустая строка.
Внутри скобок тега кроме его названия могут размещаться также атрибуты (англ. atributes - атрибуты). Они отделяются от названия и между собой пробелами (одним или несколькими), а пишутся в виде имя_атрибута="значение". Если значение не содержит пробелов, то кавычки могут быть опущены, но так делать не рекомендуется. Тег <P> может содержать атрибут ALIGN, определяющий выравнивание абзаца. По умолчанию абзац выровнен влево ALIGN="left". Возможны также выравнивания вправо ALIGN="right" и по центру ALIGN="center". При использовании атрибутов, после форматируемого текста следует использовать закрывающий тег </P>. Если его нет, то новый тег <P> означает закрытие предыдущего, соответственно вложенные <P> невозможны. Выровнять текст по центру возможно также тегом <CENTER>.
Теперь мы можем поместить на нашу Web-страницу некоторый текст с различным выравниванием:
<HTML>
<HEAD>
<TITLE>Моя первая страница</TITLE>
</HEAD>
<BODY>
<P align=center>Здесь будут мои личные страницы!
<P align=left>На них Вы сможете найти:<BR>- рассказ обо мне и о моих увлечениях;<BR>- мои фотографии.
<P align=right>С одной из моих страниц можно будет<BR>отправить мне электронное письмо.
</BODY>
</HTML>
Кроме использования этих тегов, для разрыва строк возможно использование символов конца строк и табуляций в самом HTML-документе. Для этих целей существует тег <PRE>. Весь текст, помещенный между тегами <PRE> и </PRE> будет выводиться без изменений, то есть со всеми концами строк и табуляциями.
Например:
<PRE>Это текст написан
в две строки.</PRE>
В HTML-документе, кроме текста, могут содержаться горизонтальные разделительные линии. Они, как и текст, не требуют никаких внешних файлов. Тег <HR> выведет горизонтальную линию единичной толщины вдоль всей ширины страницы. Горизонтальная разделительная линия всегда приводит к разрыву строки, но пустых строк между линией и текстом не появляется. Тег <HR> может содержать несколько атрибутов. <HR SHADE> и <HR> дают контурную линию с трехмерным эффектом углубления. <HR NOSHADE> дает сплошную черную линию. Линия может не простираться во всю ширину страницы, а составлять лишь некоторую часть. Атрибут WIDTH задает ширину линии, в процентах от ширины всей страницы или в пикселях. Например, 50% - половина ширины страницы, 400 - ширина в 400 пикселей. Атрибут ALIGN может принимать значения, аналогичные его значениям для тега <P>, но выравнивание по умолчанию - по центру. Атрибут SIZE задает толщину линии в пикселях от 1 до 175; по умолчанию 1, но если <HR SHADE>, (линия - контурная), то добавляется толщина, необходимая для трехмерного эффекта углубления.
Линии, наряду с абзацами, позволяют выделить логические фрагменты текста. Но большое количество горизонтальных линий неприятно для посетителя вашей web-страницы, поэтому после каждого абзаца их ставить не следует. Они больше подходят для выделения целых разделов.
Заключение
При подготовке работы были изучены возможности языка HTML для создания web-страниц, рассмотрено, какие браузеры лучше использовать в web-разработке, каковы преимущества и недостатки тех или иных программных пакетов. И, наконец, выяснено, какие возможности для создания web-страниц имеет Macromedia Dreamweaver 8.0.
Итак, поняв принцип построения web-страницы, изучив возможности соединения в ней различных видов информации, можно смело сказать, что web-страницы, с их потенциалом могут применяться для различных целей.
Web-страница - это лицо человека, который разместил ее в WWW. Именно поэтому сегодня web-разработке уделяется такое огромное внимание, ибо от него напрямую зависит популярность того или иного информационного ресурса сети.
Человек, создающий web-страницу, соединяет свои знания и навыки со своим творческим потенциалом. Для того чтобы создать web-страницу, которая бы радовала глаз, нужно сочетать в себе качества художника и программиста.
Подводя итог всему выше сказанному, хочется отметить, что HTML стал тем форматом передачи данных, который наиболее полно и качественно удовлетворяет запросы современного общества. Несомненным фактом является и то, что будущее именно за HTML и его различными модификациями в зависимости от представляемой информации.
Литература
сайт браузер adobe dreamweaver
1. Айзекс, С. Dynamic HTML/ С. Айзекс - СПб.: БХВ-Петербург, 2004.
2. Бубнов, А.Е. Компьютерный дизайн. Основы/ А.Е. Бубнов - М.: Знание, 2008.
3. Бурлаков, М.В. Illustrator CS3. Самоучитель с электронным справочником/-- М.: КУДИЦ-ПРЕСС, 2008.
4. ДеБольт , В. HTML и CSS. Совместное использование / И. С. Елов. - М.: НТ Пресс, 2006.
5. Дронов, В. Macromedia Dreamweaver MX. Наиболее полное руководство/ В. Дронов - СПб.: БХВ-Петербург, 2005.
6. Дунаев, В.Ф. Web-графика: нужные программы/ - СПб.: БХВ-Петербург, 2006.
7. Кастро, Э. HTML и CSS для создания Web-страниц/ Э. Кастро - М.: НТ Пресс, 2006.
8. Комолова , Н.В. CorelDRAW X4. Самоучитель/ Н.В. Комолова -- СПб.: БХВ-Петербург, 2008.
9. Крайнак, Д. Создание Web-страниц. Наглядное руководство/ Д. Крайнак - М.: Аст-Пресс, 2007.
10. Крамер, Э. HTML. Наглядный курс Web-дизайна/ Э. Крамер - М.-Спб.-Киев: Диалектика, 2005.
11. Кричалов, А.А. Компьютерный дизайн. Учебное пособие/ А.А. Кричалов - М.: Знание, 2008.
12. Леонтьев, Ю. Web-дизайн. Руководство пользователя/ Ю. Леонтьев - М.: Компьютера, 2001.
13. Мак-Клелланд, Д., Фуллер, Л.У. Adobe Photoshop CS2. Библия пользователя/ Д. Мак-Клелланд -- М.: Диалектика, 2008.
14. Макфедрис, П. Создание Web-страниц/ П. Макфедрис - М.: АСТ Астрель, 2005.
15. Матросов, А.В., Сергеев А.О., Чаунин М.П. HTML 4.0/ А.В. Матросов - СПб.: БХВ-Петербург, 2004.
16. Нидерст ,В. Web-мастеринг для профессионалов. Настольный справочник/ В. Нидерст - М.: Компьютера, 2001
17. Роуз, Р., Биндер, К. Освой самостоятельно Adobe Photoshop CS3 за 24 часа/ Р. Роуз --М.: Вильямс, 2007.
18. Симонович, С., Евсеев, Г., Алексеев, А. Специальная информатика (Учебное пособие)/ С. Симонович - М.: Аст-Пресс, 2005.
19. Смолина, М.А. CorelDRAW X3. Самоучитель/ М.А. Смолина -- М.: Диалектика, 2006.
20. Хейз, Д. Освой самостоятельно HTML. 10 минут на урок/ Д. Хейз - М.-Спб.-Киев: Диалектика, 2006.
21. Шапошников, И. Web-сайт своими руками/ И. Шапошников - СПб.:БХВ-Петербург, 2007.
22. Создание сайта в Macromedia Dreamweaver
http://www.beluys.com/yrok.html
23. Создание сайта при помощи Microsoft Front Page
http://nastya.kulakoff.org/Lesson1.htm
24. Учебник по Macromedia Homesite 5
http://www.pervyiurok.ru/Info/Homesite5/index.html
25. Уроки создания сайта в блокноте http://mm-business.ru/uroki-sozdaniya-sayta.html
Размещено на Allbest.ru
Подобные документы
Работа с HTML-редактором Adobe Dreamweaver. Этапы и правила построения заглавной страницы сайта, форматирования HTML-страниц, создания гипертекстовых ссылок, создания и форматирования таблиц. Использование графических материалов при разработке сайта.
методичка [1,9 M], добавлен 06.07.2011Рассмотрение визуального HTML-редактор Dreamweaver. Определение структуры сайта ООО "Фаст Студия". Содержание страниц "Главная", "Портфолио", "Контакты". Теги форматирования текста и способы его оформления с использованием подключаемых таблиц CSS.
курсовая работа [1,4 M], добавлен 18.08.2013Интерфейс среды Dreamweaver. Обзор популярных интернет-технологий создания динамических сайтов. Методика выбора средства разработки. Критерии сравнения популярных интернет-технологий. Записная книжка на базе РНP. Электронный прайс-лист на базе XML.
дипломная работа [2,3 M], добавлен 30.08.2010Теоретический обзор по проблеме создания web-сайта "Конфликты в организации". Анализ информационных ресурсов и сервисов. Характеристика методов исследования конфликтов в организациях. Программный пакет Macromedia Dreamweaver для создания web-сайтов.
дипломная работа [1,7 M], добавлен 22.06.2015Возможность работы с текстовыми редакторами только для создания небольших WEB-страниц. Теория Web-дизайна и его история. Редактор DreamWeaver, его особенности. Основные требования, предъявляемые к Web-странице. Предпосылки возникновения DreamWeaver.
курсовая работа [576,1 K], добавлен 12.06.2009Язык разметки гипертекстовых страниц HTML. Обеспечение доступности Web-страницы, представление текста и графики. Основные правила и этапы создания сайта, выбор структуры страницы. Оценка экономической целесообразности использования HTML-редакторов.
дипломная работа [86,7 K], добавлен 25.03.2013Рассмотрение средств создания web-страниц: HTML, CSS и РНР. Разработка приложения в PhpMyAdmin, работающего с базой данных "Спортивные организации города". Соединение с сервером и базой данных. Создание сайта "Институт" в Macromedia Dreamweaver 8.
курсовая работа [461,8 K], добавлен 10.07.2015Обзор программ для создания Web-страниц; сравнительный анализ Macromedia Dreamweaver и Front Page. Процесс создания современного сайта; оценка экономической целесообразности использования компьютера. Охрана труда оператора компьютерного набора и верстки.
дипломная работа [84,2 K], добавлен 07.07.2010Понятие профориентации, ее приемы и механизмы, трудности у молодежи на сегодня. Методические основы создания web-сайта профориентации выпускников школы. Обзор визуального html-редактора Macromedia Dreamweaver-4. Расчет экономической эффективности.
дипломная работа [7,0 M], добавлен 17.06.2013Современные Интернет-технологии, Web-дизайн и браузеры. Язык разметки гипертекстовых страниц HTML. Представление текста и графики на Web-страницах. Правила и этапы создания сайта. Влияние дисплеев на Web-дизайн. Сравнительный анализ HTML-редакторов.
дипломная работа [3,3 M], добавлен 21.06.2013
