HTML — Hyper Text Markup Language. Web-страница (документ HTML) представляет собой текстовый файл на языке HTML формата *.htm или *.html, размещенный в World Wide Web (WWW). WWW — Всемирная Паутина, распределенная система доступа к гипертекстовым документам, существующая в Интернете. Web-страница кроме текста может содержать гипертекстовые ссылки, при помощи которых можно переходить к другим Web-страницам и просматривать их. Web-страница может содержать вставки в виде графики, анимации, видеоклиппов и музыки.
Для просмотра Web-страниц можно использовать, например, MicroSoft Internet Explorer или NetScape Navigator, или Opera (просмотрщик или броузер).
Язык HTML позволяет:
1) Создавать и редактировать Web-страницы, в том числе свою домашнюю Web-страницу, которую можно затем разместить в Интернете;
2) Редактировать документы HTML, полученные из Интернета, так чтобы функционировали все внедренные в документ объекты (картинки, анимации и т.д.);
3) Создавать мультимедийные презентации, слайд-шоу, демонстрационные проекты, благодаря гипертекстовым ссылкам и возможности вставлять в документ HTML рисунки, диаграммы, анимации, видеоклипы, музыкальное и речевое сопровождение, текстовые спецэффекты (например, бегущая строка).
Урок 1 — создание простой web-страницы
Существуют три основных способа создания Web-страниц (или документов HTML):
1) Использование текстового редактора Блокнот (NotePad), встроенного в Windows, и просмотр результатов с помощью броузера. Этот самый простой способ рекомендуется начинающим.
Технология этого способа создания Web-страницы такова:
В редакторе Блокнот создается файл Web-страницы, который сохраняется с расширением *.htm. Затем этот файл загружается и просматривается программой Internet Explorer. Для вызова редактора Блокнот с целью редактирования файла Web-страницы во время ее просмотра в Internet Explorer, используется пункт меню Вид, Источник или В виде HTML. После сохранения файла и выхода из Блокнота для просмотра отредактированной страницы надо нажать клавишу F5 или кнопку «Обновить» в панели инструментов Internet Explorer.
2) Использование специальных редакторов документов HTML, например Hot Metal Light, Hot Dog Professional, MS Front Page, HTMLPad и др.
3) Использование редактора Word-97, где создается текст документа, который затем конвертируется в HTML-формат.
Рассмотрим основные понятия языка HTML.
1. Элемент — это конструкция языка HTML, или контейнер, содержащий данные. Web-страница представляет собой набор элементов.
2. Тег — это стартовый и конечный маркеры элемента. Теги определяют границы действия элементов и отделяют элементы друг от друга. В тексте Web-страницы теги заключаются в угловые скобки, например: . Конечный тег всегда снабжается косой чертой: .
3. Гиперссылка — фрагмент текста, который является указателем на другой файл или объект. Гиперссылки позволяют переходить от одного документа к другому.
4. Фрейм — область гипертекстового документа со своими полосами прокрутки.
Что такое web-программирование? ДЛЯ НОВИЧКОВ / Про IT / Geekbrains
5. Апплет — программа, передаваемая на компьютер клиента в виде отдельного файла и запускаемая при просмотре Web-страницы.
6. Скрипт — программа, включенная в состав Web-страницы для расширения ее возможностей.
7. Загрузка (DownLoad) — копирование документа с Web-сервера на компьютер клиента.
UpLoad — копирование документа c компьютера клиента на Web-сервер — используется при создании собственной Web-страницы (т.е. при ее опубликовании).
Источник: www.examen.ru
1. Технологии создания сайта
1. HTML — это язык гипертекстовой разметки, который использую для создания сайтов. С помощью специальных тегов и текста необходимо описать команды для браузера. Записывается такая последовательность в простом текстовом редакторе (Блокнот). Можно воспользоваться программой Notepad++ , которая подсвечивает синтаксис и ошибки языка HTML .
Рис.(1) Код HTML
2. Можно создать документ в текстовом процессоре ( Microsoft Word, Writer ). Этот способ отлично подойдёт для тех, кто не умеет пользоваться профессиональными инструментами для создания сайтов. Для этого необходимо открыть Word , назвать документ, например, домашняя страница и сохранить как веб-страницу. Далее можно оформить страницу по вашему желанию, если сайт планируется сделать многостраничным, то необходимо каждую отдельную страницу создавать в новом файле, после чего связать все файлы гиперссылками.
3. Воспользоваться программой инструментом для создания сайтов — HTML редактором . Такие программы имеют больший функционал, по сравнению с текстовым редактором. Проверка синтаксиса, подсказки, механизмы автозаполнения, визуализация кода (т.е. при написании кода в отдельном окне программы сразу показывается результат). Все эти инструменты значительно сокращают затраченное время на создание сайта и в результате получается чистый функциональный код. Примеры HTML редакторов : WYSIWYG , Visual Studio Code , Atom и другие.
 |
 |
 |
| Рис. (2) Редактор WYSIWYG | Рис. (3) Visual Studio Code | Рис. (4) Редактор Atom |
Источник: www.yaklass.ru
С помощью каких программ можно создать web страницы
Создание web-сайтов, их поддержка и развитие осуществляется с помощью специализированного ПО. HTML-документ, можно создавать в любом текстовом редакторе, например, в «блокноте» (MS NotePAD в составе Windows). HTML-документ, можно конвертировать из многих программ, (например, Microsoft Word). После конвертации одна страница текста может превратиться в огромный HTML-файл размером более 100кб.
HTML-документ, можно создавать с помощью визуальных пакетов (WYSIWYG -What You See Is What You Get), таких, например, как Microsoft FrontPage. WYSIWYG-редакторы сами вырабатывают html-код документа, в то время как разработчик лишь выбирает нужные ему опции из меню. Разработчик сайта должен использовать разумное сочетание всех методов создания HTML-документов. При использовании этих методов следует учесть следующее:
создание различных эффектов в простом текстовом редакторе — громоздкая и сложная задача;
документ, подготовленный с помощью какой-либо программы проще конвертировать, чем создавать заново;
текстовые редакторы можно использовать для очистки от «мусора» HTML-документов, созданных с помощью специализированных программ;
при создании эффектов с помощью специальных программ (например, Microsoft FrontPage) следует предусмотреть поддержку этих эффектов на web-сервере.
Одним из лидеров в области разработки программного обеспечения для подготовки web-публикаций является компания Macromedia. Очень популярны пакеты Macromedia: Dreamweaver, HomeSite (до версии 5 этот пакет выходил под названием Allaire HomeSite), а также специализированные пакеты для создания компьютерной графики и анимации [7].
Создание графики для web заслуживает особого внимания. Следует иметь в виду, что графика бывает двух видов: растровой (когда описывается каждая точка изображения) и векторная (когда задается формула для генерации изображения). Последний способ построения графики более компактен и, в частности, идеально подходит для создания анимации.
В таблице 2.1. представлены наиболее популярные программные средства, предназначенные для разработки Web-сайтов.
Таблица 2.1 — Программные средства для разработки Web-сайтов
WYSIWYG-редактор. Недостаток: автоматически вырабатываемый html-код документа, созданного разработчиком в визуальном режиме, как правило, неоптимален.
Macromedia Flash 5
Технология Flash становится очень популярной. Имеется возможность передачи данных из HTML-документа FLASH-объекту и наоборот, что позволяет создавать управляемые FLASH-объекты, а также делать более эффектными HTML-страницы (например, формы).
Macromedia Director 8
Лидер рынка мультимедийных средств. Объединяет графику, звук, анимацию, текст и видео для интерактивных информационных каналов, которые можно разместить как на web-страницах, так и на CD- или DVD-дисках.От технологии Flash отличается более развитым встроенным языком программирования.
Macromedia Dreamweaver MX 2004
WYSIWYG-редактор. Профессиональное решение для web-дизайна и разработки web-сайтов.
Имеет очень удобный, простой интерфейс (в стиле PageMaker/Illustrator/PhotoShop).
Автоматизирует работу над проектом. Создаваемый код почти не отличается от написанного программистом.
Содержит встроенные средства работы с графикой.
Позволяет непосредственно внутри пакета создавать FLASH-анимации.
Обеспечивает средства отладки JavaScript-сценариев для браузеров MS Internet Explorer и Netscape Navigator.
Допускает расширение возможностей за счет дополнительных модулей. Библиотека дополнительных компонент (более 150) входят в комплект поставки
при вводе кодов создает список значений тэгов и атрибутов в виде всплывающей подсказки
Macromedia Fireworks 3
Профессиональное приложение для создания графических изображений и их размещения в Интернет.
Позволяет обрабатывать изображения, полученные с помощью других графических редакторов, цифровые фотографии, отсканированные изображения;
Позволяет создавать эффекты анимации, использовать динамические стили.
Macromedia Dreamweaver 3 Fireworks 3 StudioСовместное использовании Dreamweaver 3 и Fireworks 3 сокращает время разработки за счет взаимной автоматизации повторяющихся действий.
Allaire HomeSite 4.5
Позволяет легко и быстро создавать эффектные web-сайты, имеет удобный интуитивно понятный интерфейс, богатую палитру инструментов; содержит средства контроля качества: проверку синтаксиса html-кода, верификацию ссылок. Фирма Allaire несколько лет назад была поглощена компанией Macromedia. Известный продукт HomeSite теперь выходит под названием Macromedia HomeSite 4.5. (хотя название Allaire все еще присутствует на упаковке.)
Macromedia DreamWeaver UltraDev 4
Первая визуальная среда, позволяющая быстро разрабатывать Web-приложения для доступа к серверным базам данных. БД могут поддерживаться на различных серверных платформах. Достаточно просто создаются системы электронной коммерции, такие как электронные витрины, системы регистрации клиентов. Продукт уже имеет награды как лучший в своем классе средств разработки.
Macromedia ColdFusion 4.5. UltraDev 4 Studio
Объединение среды разработки ColdFusion Studio и среды DreamWeaver UltraDev. Содержит мощные инструменты визуальной разработки приложений для размещения на платформе ColdFusion Server 5, визуального представления серверного источника данных (набора записей, переменной, директория и пр.), средства отладки сценариев.
Adobe PhotoShop 6
Мировой стандарт обработки изображений как для печати, так и для web.
До появления Интернет компьютеры использовались лишь для обработки информации (главным образом, для вычислений); результаты расчетов переносились на внешние носители (чаще всего, на бумагу). Благодаря Интернет и, прежде всего, основной ее компоненте, — World Wide Web, компьютеры становятся средством связи.
Современные web-технологии представляют широчайшие возможности для публикации информации. WWW — одно из самых демократичных средств массовой информации: правом размещать в Web свою информацию в равной степени пользуются и правительственные организации, и крупные фирмы, и частные лица. Информация, опубликованная в WWW, не подвергается цензуре.
Web-технология применяется не только в Интернет, но и для обеспечения информационной поддержки работы различных подразделений в рамках одной организации (intra-сети, intranet). Intranet существенно облегчают процесс создания, хранения и поиска документов, позволяют не только усовершенствовать делопроизводство, но и качественно изменить весь процесс управления предприятием.
Очевидно, что наибольшее влияние развитие web-технологий имеет на те сферы общественной деятельности, которые непосредственно связаны с управлением информационными потоками, с передачей и обработкой информации, с визуализацией данных, полученных в результате вычислений.
Также многие из рассмотренных сайтов были построены на основе тех или иных CMS (Content management system — Система управления содержимым), которые тоже имеют свои достоинства и недостатки.
CMS появились не так давно. Первой системой принято считать Vignette, которая появилась на западе в 1995 году. В нашей стране решения по управлению контентом появились значительно позже.
История управления контентом началась с управления документами в классическом понимании этого слова — текстовыми файлами. По мере развития понятия «документ», системы управления документами стали называть системами управления контентом, подчёркивая способность таких систем управлять информацией независимо от формы ее представления, а также отделить информацию-контент от документа-формы.
Однако абстрактно управлять информацией невозможно — она обязательно должна быть представлена в какой-либо форме. Пытаясь управлять контентом, мы неизбежно приходим к управлению документами. Системы управления контентом, действительно, «научились» разделять управление документами (хранение, изменение и т.п.) и их представление конечному пользователю. Но они все-таки управляют документами в какой-то форме, а не информацией.
Само понятие «управление контентом» первоначально прочно ассоциировалось с процессом публикации и обновления информации на Web-сайтах — требовалась технология, позволяющая следить за ее актуальностью. Поэтому в качестве синонима content management часто используют термин Web content management. В результате термин content management расширился: им стали обозначать управление не только информацией на сайте, но и всеми разрозненными и разнообразными фрагментами корпоративной информации.
Одно из слабых мест таких систем — это работа сайта под нагрузкой. В отличие от статичной страницы, при пользовательском запросе через систему управления контентом, происходят более сложные процессы выдачи информации.
Так если в первом случае пользователю просто передается уже готовая веб-страница за десятки миллисекунд, то во втором — страница сначала «собирается» системой, а затем уже отправляется пользователю — это уже около 1,5 сек. Ресурс мощности всегда ограничен, поэтому при пиковой нагрузке система может отказать.
Это проблему можно решить при наличии у CMS возможности кэширования информации. Смысл кэширования в следующем: для первого пользователя, пришедшего на ресурс, страница действительно собирается, а для всех последующих она высылается в виде статик-контента, поскольку она уже была сохранена в кэш-памяти и в любой момент готова к отсылке. Данный способ снижает нагрузку на сервер в десятки раз. Существует и более сложное кэширование — так называемое «горячее кэширование», когда после запроса администратора все страницы сайта заранее «собираются» и в таком виде хранятся в ожидании запроса.
К сожалению не все просмотренные мною сайты имели систему кэширования, что было заметно по времени загрузки динамических страниц, а это весьма неудобно для пользователей, им приходится ждать пока сформируются и загрузятся страницы.
Еще один недостаток существующих систем управления контентом — проверки и нахождения не работающих ссылок на них, в большинстве случаев, невозможна. Наличие таких ссылок портит общее впечатление от сайта
Однако качественные CMS обладают рядом достоинств:
Простота в работе. Пользователю не нужно иметь представление об html и языках программирования. Редактирование информации осуществляется с помощью простых web-форм.
Удобный, интуитивно понятный интерфейс. Внешний вид рабочих окон системы, элементы навигации и служебные иконки понятны любому пользователю.
Отсутствие специального ПО на компьютере пользователя. Для работы владельцу сайта нужен только web-браузер (Internet Explorer или FireFox) и выход в интернет.
Гибкость. Владелец сайта может управлять не только информацией, но и структурой подразделов сайта.
Информационная безопасность. Использование шифрованных каналов при работе, как между пользователем и системой, так и между системой и сервером.
Все выше описанные достоинства CMS позволяют формировать и содержать сайт с большим количеством постоянно обновляемой информации. Это особенно полезно для больших предприятий у которых много меняющейся продукции и цен.
Помимо проблем связанных с flash и cms сайты агентств недвижимости имели недостатки следующего характера:
Навигация по сайту — невнятная навигация может легко запутать посетителя сайта и он предпочтет скорее покинуть его из за неудобства пользования.
Не правильно подобранный размер шрифта — шрифт слишком маленького размере затрудняет чтение необходимой информации на сайте.
Ошибка 404 — эта ошибка обозначает, что запрошенному URL не соответствует никакая страница сайта. Этому могут быть две причины: ссылка неверна или ранее существовавшая страница была удалена.
Не работающие ссылки — многие ссылки на сайтах не работали, из за этого не закачивались многие файлы, предназначенные для просмотра в оффлайне.
По итогам всего выше описанного, можно сделать вывод, что сайта абсолютного большинства фирм нельзя назвать удобными для использования. Даже сайты принадлежащие крупным фирмам имеют большие недостатки в дизайне и в расположении элементов управления сайтом, не говоря уже о мелких программных ошибках.
Для выполнения дипломной работы нами была выбрана СMS Joomla!.
Joomla написана на языке PHP. В своей работе она хранит данные в СУБД MySQL. Работа возможна на операционных системах Windows, Linux, FreeBSD. Для обеспечения дополнительного функционала, такого как ЧПУ-адреса, требуется web-сервер Apache с модулем mod_rewrite или web-сервер IIS от Microsoft с расширениями, эмулирующими или заменяющими таковой модуль в apache.
CMS Joomla! имеет следующие возможности:
Простота обучения. Для людей, которые раньше не работали с Joomla необходимо некоторое время, чтобы понять принцип работы с Joomla. Нужно понять, как работает сам движок, как публикуются материалы. CMS имеет трехуровневую структуру: раздел, категория материал. Нужно понять, как формируются материалы.
После понимания основных принципов работы все становиться очень просто.
Визуальный редактор.Стандартно в версии 1.5 идет WYSIWYG редактор TinyMce, который используется в большинстве CMS. К сожалению, в версии 1.5 идет довольно старая версия WYSIWYG редактора — 2.0. Будем надеяться, что в версии 1.6 это будет доработано. Есть несколько других вариантов, самым популярным можно назвать JCE.
Шаблоны.Для версии 1.5 есть множество бесплатных шаблонов. Также можно найти и warez шаблоны. Легко можно и самому доработать уже готовый шаблон. В версии 1.0 были ограничения, не всегда позволяющие организовать задуманный дизайн без правки кода, но в версии 1.5 этих ограничений уже нет. Можно реализовать практически все в этой версии.
Русскоязычная документация. Русскоязычной документации много, можно даже сказать очень много. Есть только проблема с технической документацией для написания модулей, но так как в большинстве случаев программисты пользуются англоязычной документацией, этот недостаток не значителен.
Русскоязычная поддержка. Два огромных портала полностью решают вопрос русскоязычной поддержки. Так же появилось два сообщества на украинском языке.
Удобство админ панели. Админ панель на первый взгляд не очень удобна. Скорее всего это объясняется тем, что на Joomla в отличии от многих других CMS можно реализовать практический любой проект. По этой причине возникают сложность в разработке удобной панели администратора, но факт остается фактом — панель управления сайтов реализована неудобно.
Плагины. В Joomla правильнее будет сказать компоненты, модули и плагины. Примером компонента можно назвать доску объявления. Модулем является опрос. Плагин — это дополнительная функциональность, которая интегрируется в модуль или компонент.
Примером плагина является добавления возможности комментировать опубликованный материал.
Проблем с компонентами, модулями, плагинами у Joomla нет. Существует множество как платных, так и бесплатный готовых решений для реализации необходимой функциональности. Так же можно написать собственные скрипты.
Комментирование. В базовой версии подобная функция отсутствует, но существует множество модулей и компонентов способных решить эту проблему. Самым распространенным можно назвать бесплатный компонент jComments.
Блокивиджеты. В шаблоне есть места, куда можно вставлять модули, меняя их местами и выставляя необходимым образом. Недостатком версии 1.0 было отсутствие возможности влиять на вывод конкретного модуля. Теперь можно переопределить любой модуль под себя, но необходимо, что бы он был написан в режиме совместимости с версией 1.5. В версии 1.5 также есть возможность совместимости с 1.0, если модуль не был переписан под 1.5, но в таком случае реализовать изменения вывода модуля будет невозможно (без правки кода).
Работа с изображениями. С версией 1.5 при публикации материалов появилась возможность загружать картинки в визуальном редакторе. Есть так же возможность сначала загрузить картинку на сервер, а потом при публикации указать ссылку. Редактирование изображений в визуальных редакторах стандартное.
Борьба со спамом. Joomla не форум и не блог, поэтому такая защита идет только на уровне компонентов. К сожалению, на регистрацию стандартно нет защиты, но есть возможность подключить captcha. В самый популярный компонент добавления комментариев jComments сразу встроена captcha. Мощных бесплатных решений бана по ip, дополнительных фильтров на данный момент нет, но есть довольно хорошие платные программы.
Подключение форума. Есть встроенные форумы такие как: FireBoard, Joomla-SMF. Так же есть возможность подключать и другие форумы через мосты. Можно подключить и phpBB, но для настройки моста придется кое-что делать вручную. Полной автоматической синхронизации на данный момент с внешними форумами нет.
Поддержка авторов. Многоуровневое администрирование в Joomla реализовано плохо. Есть три категории для пользователей и три категории для администраторов. Для каждой категории можно указать соответствующие права и отнести конкретного зарегистрированного пользователя к категории. Но создание новых категорий, или, же уникальных прав для зарегистрированного пользователя — нельзя.
Экспортимпорт. В Joomla есть возможность полностью перекинуть сайт с одного хостинга на другой, но автоматических скриптов перебрасывания конкретной информации — нет. При перекидывании БД, разные версии Joomla будут совместимы.
Обновления. Обновлять версию Joomla, тем самым убирая ряд ошибок и уязвимостей — просто. Достаточно скачать архив и залить по FTP на сервер поверх уже поставленной версии. Обновления могут спокойно ставиться уже на доработанную версию с дополнительными компонентами, модулями и плагинами. Главное, чтобы ядро оставалось не тронутым.
Можно реализовать любой проект без вмешательства в ядро.
Источник: studbooks.net