Пошаговое руководство по созданию сайта в Word

ТЕМА 8 РАЗРАБОТКА WEB-СТРАНИЦ С ИСПОЛЬЗОВАНИЕМ WORD В роли инструментов, упрощающих процесс создания веб-сайтов, вполне подойдут приложения из пакета Microsoft Office – такие как Word, Excel, PowerPoint и другие. Пользователю не обязательно обладать знаниями языка HTML, он может работать в привычной среде редактирования – WYSIWYG (что вижу, то и получаю).

Множество людей, которые используют Word в своем повседневном труде, становятся потенциальными авторами HTML-документов. Создать веб-страницу в Word можно двумя способами: используя мастер или шаблон, или же преобразовав уже существующий документ Word в формат HTML. При этом Word автоматически генерирует HTML-теги, хотя и не всегда в оптимальном виде.

Первый метод создания HTML-документов весьма прост: просто начните работу над документом «с нуля», следуя рекомендациям Мастера и применяя инструменты, доступные в меню программы. Второй метод заключается в конвертации уже существующего документа Word в HTML-теги, сохраняя файл Word в формате HTML.

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

Когда вы сохраняете HTML-документ в соответствующей директории, Word создаёт на диске папку, куда помещает сопутствующие графические элементы. К примеру, если вы сохраните файл с изображениями под именем frieds.htm, Word создаст папку с названием frieds.files, в которую будут помещены все изображения.

Поэтому при разработке веб-сайта, состоящего из связанных между собой веб-страниц, настоятельно рекомендуется выделять отдельную папку для сайта, а при его перемещении или публикации следует тщательно соблюдать всю внутреннюю структуру папок. При подготовке материалов, созданных в Word, для публикации в Интернете, полезно учитывать некоторые особенности преобразования в формат HTML. Ниже представлены некоторые из них (табл. 8.1). Таблица 8.1

Рекомендуемые материалы

Тест 1 — Основы программирования Си
Программирование и создание алгоритмов
340 руб.

Лабораторная работа №2 — РК6. Создать программу для преобразования текстовых файлов из кодировки КОИ-8 в кодировку ср1251

Информатика

499 90 руб.

Вопросы и ответы из тестирования по 1С Платформе 8.3.

Информатика

390 руб.

Семинар №1. «Создание циклических алгоритмов»

Программирование

340 руб.

Ответы на сертификацию Google Навыки Основы интернет-маркетинга модули и финальный экзамен 2022 Декабрь

Информатика
380 руб.
Основы языка программирования Си; Функции и многомодульные приложения на Си
Алгоритмизация и программирование
340 руб.

При необходимости вставить на HTML-страницу собственные тэги, в Word предусмотрено непосредственное редактирование HTML-кода. Это можно сделать, вызвав окно редактора через меню «Вид» — «Источник HTML». До того, как перейти в этот режим следует сделать сохранение файла. После завершения редактирования перед закрытием окна, файл также нужно сохранить.

Другая возможность – открыть документ в Браузере и вызвать меню «Вид» — «В виде HTML». По умолчанию редактирование выполняется в Блокноте. Хотя Word отображает документ практически в том же виде, как он в дальнейшем будет выглядеть в Браузере, предварительный просмотр Web-документа можно выполнить, не покидая Word.

Рис. 8.1

На рис. 8.1. приведены способы отображения документа Word, устанавливаемые в меню «Вид». При выборе «Web-документ» файл отображается так, как будет выглядеть в Браузере, установленном на компьютере. Через меню «Вид» можно вернуться к обычному режиму работы с документом.

ОСНОВНЫЕ ТЕРМИНЫ ASCII (American Standard Code for information Interchange – Американский стандартный код для обмена информацией) – семиразрядный код для представления текстовой информации. GIF (Graphics Interchange Format – формат обмена графикой) – используется для немногоцветных четких изображений, поддерживает прозрачные области и анимацию. HTML (Hyper Text Markup Language) – язык разметки гипертекстов.

JPEG (Joint Photography Experts Group – объединенная группа экспертов по машиной обработке фотоизображений) – распространенный формат растровой графики, который идеально подходит для сканируемых фотографий. Web-page (Web-страница) – электронный документ, предназначенный для размещения (размещенный) в Интернет. Web-site (Web-сайт) – совокупность Web-страниц, связанных между собой темой, гиперссылками и близким расположением в Интернет. Web server (Web-сервер) – сервер, предназначенный для размещения Web-сайтов в Интернет, и предоставляющий услуги по запросам клиентов. WYSIWYG (What You See Is What You Get – что вижу, то и имею) – тип редакторов, в которых документ отображается так, как он будет напечатан или представлен в Интернет. ЗАДАНИЕ № 8 Тема: Создание Web-сайта на основе программных приложений MS Office (Word и Excel)

Страница 1 (главная страница)

Страница 2 (Мое детство)

Бесплатная лекция: "4. Табель форм документов" также доступна. Страница3 (Мои друзья) – использовать ранее созданный Web-документ friends.htm, созданный с помощью Excel. Страница 4 (Мои университеты) Полное название Университета, адрес сайта ГУТ, картинка с фотографией главного здания ГУТ О Вашем факультете, ссылка на сайт Вашего факультета.

Инструкция, как сделать сайт в Word

В 2023 году существует множество программ и средств, которые позволяют разрабатывать веб-сайты без знаний программирования. Одним из таких средств является Microsoft Word. Эта известная программа предназначена для создания и редактирования текстовых документов. Несмотря на то, что Word ориентирован преимущественно на работу с текстом, его функции можно адаптировать для создания простого веб-сайта.

Инструкция

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

Работа в Word может быть полезной для быстрого создания простых страниц, таких как лендинги или веб-портфолио. Для этого можно использовать шаблоны, предоставляемые самой программой или доступные на сайтах сторонних разработчиков.

Однако для более сложных и функциональных ресурсов, таких как интернет-магазины, корпоративные сайты или форумы, лучше обратиться к специалистам. Они смогут спроектировать и реализовать сайт, учитывая все требования.

В большинстве случаев не рекомендуется создавать HTML-страницу в Word, если планируете использовать ее в профессиональной или широко распространенной среде. Ворд предназначен для бумажных документов со стандартным размером страницы, шрифтом и макетом, в то время как сайты имеют различные размеры, шрифты и оформление, доступные для разных просматривающих.

Обратите внимание! Документы, созданные в Word, загружаются с определенными настройками форматирования, которые могут выглядеть не так, как вы планировали.

Хотя создание сайта в Word возможно, его функционал ограничен и не позволяет реализовать сложные и интерактивные функции. Для более качественного результата и получения профессионального ресурса рекомендуется обратиться к специалистам.

Варианты

При создании сайтов многим приходится сталкиваться с языком HTML, который может быть сложным для понимания. Однако, благодаря приложениям Microsoft Office, таким как Word, Excel и PowerPoint, создание сайтов становится более простым и удобным. Пользователи могут использовать знакомую среду WYSIWYG (What You See Is What You Get), где макет документа отображается так, как он будет выглядеть в итоговом виде.

Word предоставляет два способа создания ресурсов:

В обоих случаях Word автоматически генерирует HTML-теги, хотя не всегда оптимально.

Одной из характерных черт HTML-документов является то, что они содержат исключительно текст, в то время как другие элементы, такие как графические изображения, добавляются в документ в процессе его отображения веб-браузером с помощью специализированных тегов. Когда вы сохраняете HTML-файл в Word, программа автоматически создает каталог, в котором располагаются все связанные изображения. К примеру, если файл с иллюстрациями сохранить под именем «frieds.htm», Word создаст папку «frieds.files», где будут помещены все изображения.

Рекомендуется создавать сайты в отдельных папках, а при перемещении или публикации сайта следует сохранять всю внутреннюю структуру папок, чтобы гарантировать правильное отображение и работу ресурса.

Рекомендации

Несколько рекомендаций по поводу создания ресурса в Ворде:

Гораздо проще сделать сайт в Publisher. Эта программа настольной издательской системы, которая содержит различные шаблоны. С ее помощью легко создавать газеты, брошюры, визитные карточки, открытки, объявления, подарочные сертификаты. Publisher включает много готовых макетов для создания уникальных ресурсов.

Для создания ресурса на основе готового макета необходимо просмотреть предлагаемые шаблоны в программе. При выборе типа публикации отображаются эскизы доступных шаблонов. Чтобы разработать страницу на основе одного из них, достаточно кликнуть на эскиз.

При выборе построителя веб-узлов необходимо указать, какие страницы нужны на сайте (в дальнейшем их можно добавить через команду «Вставка», а удалить через меню «Правка»). Publisher открывает копию выбранного шаблона. Как только заготовка веб-узла открывается, можно заменять текст и рисунки на свое усмотрение.

Также можно изменять цветовую и шрифтовую схемы, удалять или добавлять элементы макета и производить любые другие необходимые изменения, чтобы страница точно отражала стиль организации, ее деятельность и назначение веб-узла. Для выполнения этих действий можно отобразить область задач с помощью меню «Вид», выбрать нужную область, кликнув на маленькую стрелку вверху.

Нужно быть внимательным при удалении объектов с веб-страницы. Обязательными элементами являются заголовок (например, домашняя страница) и панели ссылок – верхняя и нижняя (без них невозможно перемещаться по страницам сайта). При добавлении новых страниц на сайт эти элементы появляются автоматически.

Обратите внимание! Количество страниц на сайте соответствует количеству кнопок на панелях ссылок.

В конце сохраните работу.

Создание Web-страницы с помощью шаблонов

При разработке ресурса первым шагом является создание пустой страницы. Если нет времени изучать все возможности Word, то можно воспользоваться имеющимися шаблонами или мастером создания Web-страницы.

В случае выбора варианта применения встроенных шаблонов для создания ресурса, следуйте приведённым ниже шагам:

1. Выберите команду «Файл», затем «Создать». Появится область задач, в которой будет отображена панель «Создание документа».
2. Щелкните по ссылке «Общие шаблоны». В открывшемся диалоговом окне «Шаблоны» раскройте вкладку «Веб-страницы».
3. Выберите один из шаблонов.
4. Подтвердите свои действия, нажав «ОК».

Чтобы создать пустую Web-страницу:

Теперь у вас есть пустой документ. Обратите внимание, что если выбрать команду «Файл», затем «Сохранить как», то в списке «Тип файла» будет выделен элемент «Веб страница», а не «Документ Word», как обычно.

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

Изменение фона

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

Для изменения фона выполните следующие шаги:

Также можно использовать дополнительные цвета фона. Для этого:

Дополнительно можно добавить фоновый рисунок или узор, нажав кнопку «Способы заливки» на палитре цветов фона.

В появившемся диалоговом окне «Способы заливки» выберите фоновый узор, тип градиентной заливки или текстурный рисунок.

Вставка бегущей строки

Чтобы привлечь внимание к ресурсу, можно использовать бегущую строку. Она представляет собой текст, перемещающийся по странице.

Чтобы использовать бегущую строку, выполните следующие шаги:

1. Установите точку вставки на пустой строке. Бегущая строка должна обязательно появляться в пустой строке.
2. Нажмите кнопку «Бегущая строка» на панели инструментов веб-компонентов. Появится диалоговое окно бегущей строки.
3. Введите текст бегущей строки в соответствующее поле.
4. Настройте скорость, цвет фона, параметры движения и повтора бегущей строки.
5. Подтвердите свои действия, нажав «ОК».

Если на экране не отображается панель инструментов веб-компонентов, то выведите ее, выбрав команду «Вид» – «Панели инструментов» – «Веб-компоненты».

При необходимости измените параметры бегущей строки после ее добавления. Выделите бегущую строку и нажмите кнопку «Бегущая строка» на панели инструментов веб-компонентов.

Вставка рисунков

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

Придерживайтесь правил при выборе изображений:

• Элемент 1
• Элемент 2
• Элемент 3

Осталось добавить рисунок. Действуйте следующим образом:

>

1. Установите точку вставки в то место, где нужно разместить изображение.
2. Активируйте команду «Вставка», затем нажмите «Рисунок».
3. Выберите необходимый файл в открывшемся меню. Если не можете его найти, то воспользуйтесь поисковой строкой.
4. Выделите рисунок и нажмите «Вставка».

Оформление

Word 2002 (и последующие версии) предоставляют возможность применить к веб-странице специальный шаблон оформления – тему. Они содержат типовые варианты оформления, включая фон, стили текста, графические элементы.

Для выбора темы выполните следующие действия:

Создание интерактивных форм

Интерактивные формы используются для того, чтобы собирать динамические данные. Например, есть формы, которые после получения соответствующего запроса предоставляют данные из базы данных.

В Ворде предусмотрена возможность создавать такие формы. Для этого выполните следующие действия:

Создание с нуля

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

Панель навигации

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

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

В предыдущих версиях Publisher можно было создать панель навигации для сайта, содержащую не более десяти ссылок. В Publisher 2003 это ограничение было устранено. Кроме того, добавлены три новых конфигурации панели навигации:

В Publisher 2003 можно изменять панели навигации, добавлять и удалять ссылки, а также изменять их внешний вид.

Если нужно добавить ссылки на веб-страницы, не относящиеся к создаваемому сайту или создать на некоторых из них специальную панель навигации, которая будет связывать только эти страницы, то можете добавить новую панель навигации.

Можно изменить расположение панелей навигации, выбрав нужный вариант в области задач «Параметры сайта» в группе «Панель навигации».

Также можно щелкнуть по панели навигации, чтобы выбрать ее, а затем кликнуть значок мастера в нижней части экрана, чтобы открыть область задач «Панель навигации», где можно добавлять ссылки и вносить изменения.

Имена файлов веб-страниц

Publisher 2003 позволяет задавать имена файлов каждой веб-страницы публикации. Это особенно удобно, если вы собираетесь разместить вспомогательные файлы сайта в папке.

Обратите внимание! Названия файлов показываются в строке адреса вашего веб-браузера.

По умолчанию в Publisher имена файлов для веб-страниц задаются автоматически при публикации сайта в Интернете. Если хотите самостоятельно выбрать имена для всех веб-страниц, за исключением домашней, то измените настройки.

Оптимальным вариантом для названия файла главной страницы является «index.htm», так как это обеспечивает её автоматическое отображение при вводе пользователями URL-адреса сайта. Если же не применять «index.htm» в качестве имени файла для главной страницы, то посетителям придется указывать полное имя файла вместе с URL-адресом сайта.

Добавочная загрузка

Обслуживание веб-сайта и обновление его содержимого зачастую требуют больше времени и усилий, чем его разработка. Publisher 2003 позволяет тратить меньше ресурсов с помощью новой функции добавочной загрузки.

При использовании добавочной загрузки Publisher создает на сервере специальный XML-файл, который отслеживает изменения веб-страниц. Когда в публикацию вносятся изменения и ее необходимо повторно опубликовать, этот файл используется Publisher для определения измененных страниц и загрузки только соответствующих файлов.

Если у вас небольшой сайт или вы планируете внести изменения во множество страниц, использование этой функции не требуется. Однако эта возможность может значительно сэкономить время при обслуживании большого ресурса, загрузка которого занимает много времени, а также при внесении изменений в небольшое число веб-страниц.

Как использовать функцию добавочной загрузки:

Вставка изображения, списков, ссылок на другие страницы и таблиц

Для вставки каких-либо изображений нужно использовать тег «img».

Если нужно вставить ссылку на другую страницу, то используется тег .

Презентация по информатике "Создание Web-сайта с помощью MS Word"

Презентация содержит указания к выполнению практического задания по формированию Web-сайта в ТП MS Word.

Васильева Евгения Валерьевна, ГБОУ СПО (ССУЗ) МТК

Описание разработки

изучение методов разработки Web-страниц и Web-сайтов при помощи текстового редактора MS Word;

оформление дизайна страницы;

организация внутренних гиперссылок;

организация внешних гиперссылок.

Этапы создания сайта

Анализ и проектирование сайта

Информационное заполнение сайта

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

Содержимое разработки

Практическая работа: Создание Web -сайта с помощью MS Word

Требования к сайту

Процесс разработки веб-сайта

— способ перехода между документами сайта.

ГЛАВНАЯ СТРАНИЦА СЕМЕЙНОГО САЙТА

Это наша дружная семья: мой папа, моя мама и я – Наташа.

На руках у меня сидит кот по кличке Тимка.

Моего папу зовут Виктор Семенович. Он профессор, доктор физико-математических наук. Папа преподает в университете высшую математику.

Мою маму зовут Ирина Николаевна. Она музыкант – играет на скрипке в оркестре Большого Театра.

Меня зовут Наташа Викторовна. Я учусь в 10-а классе лицея №115 г. Москвы. Мои увлечения . . . , и достижения . . .

Кот Тимка – Русская голубая. Его главное занятие спать на коленках у всех членов семьи.

ПАПИНА СТРАНИЦА

Виктор Семенович Смирнов появился на свет 12 февраля 1960 года в столице России, городе Москве.

В 1977 году он окончил школу с золотой медалью.

В этом же году поступил на механико-математический факультет Московского государственного университета им. М. В. Ломоносова.

После окончания университета Виктор Семенович поступил в аспирантуру МГУ и в 1985 году защитил кандидатскую диссертацию.

Мой папа очень интересный человек: он много читает, увлекается такими видами спорта как хоккей, футбол. Любит кататься на горных лыжах и коньках. И нас всех привлекает к этому же.

Главная страница сайта

Внутренние гиперссылки (с помощью закладок)

Внешние гиперссылки на другой файл

АЛГОРИТМ ВЫПОЛНЕНИЯ РАБОТЫ:

-80%