Теги – это определенные стандартом HTML, последовательности символов, являющиеся инструкциями для браузера.
Информатика и ИКТ 2 курс
Урок 47(104)
Раздел 7. Интернет.
Тема 7.2 Основы сайтостроения.
Тема урока: Основы сайтостроения. Инструменты для разработки web -сайтов (11кл.,И.Г.Семакин)
Цели урока:
ü освоение приемов работы с интерфейсом программ для разработки сайтов: MS Office SharePoint Designer, Adobe Dreamweaver, WebPagMaker, KompoZer
ü освоение приемов работы с поисковыми системами Интернета: поиск информации с помощью поискового каталога; поиск информации с помощью поискового указателя.
ü освоение приемов извлечения фрагментов из загруженных web-страниц, их вставка и сохранение в текстовых документах.
ü научить студентов применять полученные знания при работе в интернете.
ü знать правила работы с разными браузерами;
ü способствовать формированию умения использовать приемы настраивать браузер для эффективной работы в сети
Оборудование: Internet Explorer (возможно использование другой программы аналогичного назначения), поисковый сервер Rambler, Яндекс, браузер WWW, текстовый процессор Microsoft Word, компьютеры для студентов, §13, (учебник Информатика 11 кл. /И.Г.Семакин, Е.К.Хеннер,Т.Ю.Шеина 5-е издание, 2015г.),
Теоретический материал урока
Инструменты для разработки web-сайтов
Вернемся к разговору о web-сайтах и узнаем, с помощью каких средств можно самостоятельно создать сайт.
Web-сайт — это совокупность гипертекстовых документов,
которые рассматриваются как единое целое и определяются
|
|
одним URL-адресом.
Содержимое web-сайта может включать в себя все доступные в настоящее время типы информации, а также интерактивные средства для ведения диалога с пользователем (форумы, гостевые книги, формы обратной связи и т. д.). Помимо этого, каждый сайт может иметь индивидуальный дизайн (хотя следует заметить, что часть сайтов создается с применением готовых шаблонов).
Понятие языка разметки гипертекста
В предыдущем параграфе уже говорилось о том, что основой любого сайта является язык разметки гипертекста HTML (HyperText Markup Language). HTML включает в себя несколько десятков так называемых тегов (команд), каждый из которых определяет внешний вид отдельного элемента страницы: текста, изображения, таблицы, списка и др. Например, следующая запись в HTML-документе:
<FONT color=red face="Arial">MoH домашняя страница</ГОЫТ>
означает, что указанный текст («Моя домашняя страница») должен отображаться в окне браузера шрифтом Arial, цвет шрифта — красный.
Визуальные HTML-редакторы
Для создания сайта необязательно знать язык HTML. Существует множество доступных визуальных HTML-редакторов, их другое название — WYSIWYG-редакторы, позволяющих создавать сайты без знания данного языка. WYSIWYG расшифровывается как: What You See Is What You Get — что видишь, то и получаешь. Работа в таких редакторах происходит с визуальными формами, а не с тегами. Например, чтобы сделать шрифт текста жирным, надо просто выделить этот текст и нажать соответствующую кнопку в меню редактора. После этого редактор вставит в HTML-код необходимые теги, а разработчик сайта увидит на странице уже итоговый результат.
|
|
Визуальный HTML редактор (WYSIWYG-редактор) — прикладная программа, в которой содержимое web-страницы строится из визуальных форм и в процессе редактирования автоматически формируется HTML-код страницы, текущий вид которой сразу отображается на экране.
Правда, у визуальных редакторов есть ряд недостатков. В частности, сгенерированный ими HTML-код далеко не всегда бывает оптимальным, т. е. размер файла может получиться гораздо больше, чем при его непосредственном описании на языке HTML. Кроме того, в этих редакторах есть масса настроек, которые несведущему человеку будут просто непонятны. Например, человек, впервые создающий сайт, может не знать, что такое «якорь» ссылки или «альтернативный текст» изображения. Поэтому хоть какие-то минимальные сведения об используемых терминах необходимо предварительно получить.
|
|
Существует достаточно много программных продуктов, позволяющих в визуальном режиме создавать макет сайта и заполнять его содержимым. Кратко опишем наиболее распространенные.
1. Adobe Dreamweaver — один из наиболее популярных коммерческих программных продуктов, предназначенных для разработки сайтов. Изначально был разработан и поддерживался компанией Macromedia (до 2005 г.). Следующие версии, начиная с Dreamweaver CS3 (2007 г.), выпускает компания Adobe. Редактор содержит огромный выбор всевозможных инструментов, удобный интерфейс, тонкие настройки, позволяющие подогнать программу под нужды web-мастера, а также встроенный FTP-менеджер для загрузки файлов на сервер.
Начинающий пользователь может создавать страницы практически без знания HTML — добавляя элементы страницы и указывая их параметры с помощью встроенного мастера (рис. 2.7).
Официальный сайт для загрузки — http://www.adobe.com/ downloads/.
2. Microsoft Office SharePoint Designer 2007 — визуальный HTML-редактор и программа для web-дизайна от компании Microsoft (рис. 2.8). Является одним из компонентов пакета Microsoft Office 2007, но при этом требует отдельной установки. Данный пакет относится к числу достаточно сложных редакторов, позволяющих создавать не только простейшие web-страницы,
|
|
но и полноценные web-узлы, предназначенные для коллективной работы пользователей. Более новая версия программы Microsoft Office SharePoint Designer 2010 максимально завязана на совместную работу большого числа людей над одним проектом, что требует установки соответствующего программного обеспечения на сервере, где хранится данный проект.
Изначально этот продукт относился к разряду коммерческих, но с 2009 года стал распространяться бесплатно для всех желающих на официальном сайте Microsoft Office (http://office.microsoft. com/ru-ru/sharepoint-designer-help).
3. WebPageMaker — простой, быстрый и удобный редактор для создания сайтов. Пользователь с помощью мышки перетаскивает в необходимые места на странице заранее заготовленные тексты и графику. В состав программы входит большое количество готовых шаблонов, которые можно использовать как основу для будущего сайта.
Встроенный FTP-менеджер позволяет быстро загрузить готовый сайт на сервер. Сайты, сделанные в WebPageMaker-3.0.3, одинаково корректно отображаются во всех основных типах браузеров.
К одному из существенных достоинств редактора относится очень небольшой объем дистрибутива (всего 3,5 Мбайт). Кроме того, существует так называемая версия portable, которая не требует установки (ее объем — 6 Мбайт).
4. Nvu — свободно распространяемый визуальный HTML-редактор. Преимущество редактора Nvu состоит в его кроссплатфор- менности: есть версии под Linux, Microsoft Windows и MacOS.
Помимо типовых для web-редакторов функций, Nvu содержит интегрированный FTP-менеджер, мощную поддержку для форм, таблиц и шаблонов. Редактор очень прост в использовании. В последние несколько лет Nvu не развивается, но потенциал этого редактора продолжает реализовываться в редакторе KompoZer.
5. KompoZer (рис. 2.9) — ответвление от редактора Nvu. KompoZer является свободно распространяемой web-авторской системой, которая сочетает в себе менеджер для web-файлов и визуальный редактор. По сравнению с Nvu, KompoZer создает более короткий код разметки. KompoZer чрезвычайно прост в использовании,
что делает его привлекательным для пользователей, которые хотят создавать сайты без получения серьезных технических знаний. KompoZer может рассматриваться в качестве редактора для создания небольших web-проектов. Объем дистрибутива — 7 Мбайт.
Любой WWW-документ может содержать стилизованный и форматированный текст, графику и гиперсвязи с различными ресурсами Интернет. Чтобы реализовать все эти возможности, был разработан специальный язык описания WWW-документов, названный HyperText Markup Language (HTML), то есть, Язык Разметки Гипертекста.
Документ, написанный на HTML, представляет собой текстовый файл, содержащий собственно текст, несущий информацию читателю, и теги разметки (markup tags).
Теги – это определенные стандартом HTML, последовательности символов, являющиеся инструкциями для браузера.
Способы создания сайтов
Существует несколько способов создания сайта:
от “написания” его в блокноте до использования конструкторов веб-сайтов .
У всех у них есть свои плюсы и минусы, поэтому я остановлюсь на каждом из них отдельно.
Идеального варианта нет.
1. Создание сайтов в блокноте
Каждый веб-ресурс – это набор специальных тегов, скриптов, приложений и так далее. Так вот в обычном блокноте, который есть в каждой операционной системе можно написать эти теги и сохранить документ с расширением .htm
Этот способ занимает огромное количество времени, поэтому сейчас им пользуются только “любители экзотики” или специалисты, так как он требует отличного знания в html-программировании.
2. Создать сайт помогут программы
Специализированные программы, такие как Front Page, Dreamweaver, KompoZer и т.д.
С их помощью создавать web-сайты намного легче, используя те же html-теги. Это редакторы по верстке страниц в html, с визуальным режимом, позволяющим предпросмотривать разрабатываемую web-страницу.
На помощь в дизайнерском оформлении вам на помощь придут готовые шаблоны для сайтов (множество бесплатных html-шаблонов можно найти в интернете, например, на internet-technologies.ru).
Для создания сайта надо добавить контент на страницы (текст, видео, картинки и так далее) и перелинковать их.
3. Бесплатные конструкторы сайтов (слайд 5)
На предыдущие методы по созданию веб-ресурсов может уйти много времени. Быстро создать сайт помогут к бесплатным конструкторам.
Например:
ucoz . ru – Создать сайт может практически каждый интернет-пользователь. Это занимает всего лишь несколько часов. Здесь я имею в виду и наполнение веб-ресурса.
narod.ru – это если вы хотите создать бесплатный сайт на яндексе (Freeware).
ru.jimdo.com - Благодаря этому сервису получаются красивые и многофункциональные ресурсы (условно-бесплатный конструктор) Shareware
Конструкторы позволяют создавать веб-сайты, не имея знаний по html верстке или программированию. Достаточно владеть основными навыками управления компьютером. На выбор предлагается огромное множество оформлений и дизайнов, которые можно применить к своему будущему проекту.
Это вариант удобно использовать при создании какого-нибудь любительского, для личного использования ресурса. (Предоставляется бесплатный хостинг и бесплатный домен).
Если разрабатывается серьезный проект, то этот вариант не, так как в юридическом смысле вы не будете владеть своим проектом.
4. Бесплатные системы управления контентом (слайд 6)
Для создания полноценного проекта, с наличием юридических прав, помогут бесплатные системы управления контентом - Content Management System (CMS). Правда в таком случае надо потратиться. :
купить домен для своего проекта (доменное имя – то, что видится в строке браузера, например, kem-shool7.ho.ru), а также выбрать хостинг
Домен, хостинг и система управления контентом даст вам возможность бесплатно и самому создавать сайты различной сложности: от персональных страничек, визиток, блогов до социальных сетей
Дата добавления: 2021-05-18; просмотров: 77; Мы поможем в написании вашей работы! |
Мы поможем в написании ваших работ!