Стремительное развитие информационных технологий неразрывно связано с развитием веб-программирования как базы для реализации доступа к Интернет-ресурсам и построения этих ресурсов как веб-объектов.
Основу веб-разработки документов составляет язык разметки гипертекста HTML, разработанный в 1990-х гг. ХХ века одним из сотрудников Европейского института физики частиц и к настоящему моменту прошедший ряд преобразований до стандарта HTML5, который с октября 2014 года является официально рекомендованным стандартом, предназначенным для создания гипертекстовых документов в среде Web. Таким образом, выбранная тематика курсовой работы актуальна и практически целесообразна.
Объектом исследования в работе являются подходы к разработке сайтов с применением HTML, предметом исследования – непосредственная разработка сайта с четко ориентированной ознакомительной тематикой, совпадающей с темой данной курсовой работы – «Основы программирования на языке HTML».
В ходе выполнения работы следует решить следующие задачи:
Создание веб-приложения на python | HTML, CSS, JS
— выполнить обзор учебно-методической и научной литературы в соответствии с темой работы;
— провести анализ теоретических аспектов разработки веб-страниц;
— изучить практические подходы к разработке веб-страниц средствами HTML;
— реализовать разработку веб-сайта в соответствии с заявленной тематикой.
1. Язык разметки гипертекста. Основные принципы построения HTML-документов
1.1 История развития и стандарты
Специальный язык, содержащий управляющие конструкции построения и организации web-страниц, носит название HTML (Hyper Text Markup Language, язык разметки гипертекстовой информации).
Начало истории HTML относят к 1969 году, когда работник компании IBM Чарльз Гольдфарб создал прототип языка для разметки технической документации, в последствии названный GML, в 1986 году он получил статус международного стандарта SGML (Standard Generalized Markup Language). Этот обобщенный метаязык был предназначен для построения систем логической, структурной разметки любых разновидностей текста (устанавливает синтаксис записи элементов разметки, правила определения новых элементов и указания структурных отношений между ними).
Принципы, на которых был построен SGML, были изначально положены в основу при создании системы передачи гипертекстовой информации через Интернет. Таким образом, HTML был предложен сотрудником Европейского института физики частиц (CERN) Тимом Бернесом-Ли в 1989-1991 гг. и разделял все особенности идеологии SGML. При этом версии HTML1 официально никогда не существовало и первой официальной версией стала спецификация HTML 2.0, опубликованная в 1994 году IETF (Internet Engineering Task Force) как рекомендованный стандарт.
В марте 1995 года W3C (Консорциум Всемирной паутины) ввел стандарт HTML 3.0, позволивший обеспечить возможности создания и форматирования таблиц, изображений. Следующей в январе 1997 года стала версия 3.2 (при этом принятой версии 3.1 не существовало), позволившая поддерживать использование нестандартных элементов при оформлении web-страниц, например, таких, как gif-изображения.
ВЕБ-ИНТЕРФЕЙС ЗА 15 МИНУТ | Как сделать графический интерфейс для программы на Python / JS
В декабре 1997 года принят стандарт HTML 4.0, в котором многие элементы были приняты устаревшими и не рекомендованными к использованию (например, рекомендовано для оформления стилей текста использовать CSS – каскадные таблицы стилей, а не теги чистого HTML). В мае 2000 года был утвержден стандарт ISO/IEC 15445:2000 (ISO HTML), основанный на HTML 4.01.
В настоящее время W3C совместно с WHATWG (сообществом специалистов по HTML и API) разрабатывается стандарт HTML 5, официально введенный в 2014 году, но при этом используемый разработчиками ориентировочно с 2012-2013 гг. Версия HTML 5.1 рекомендована к применению с ноября 2016 года, 5.2 – с декабря 2017 года, 5.3 – представлена в декабре 2018 года. При этом стандарт продолжает активно развиваться. Целью разработки данного стандарта являлось улучшение уровня поддержки мультимедиа-технологий с одновременным сохранением совместимости с предыдущими стандартами.
С октября 2014 года HTML5 является официально рекомендованным стандартом, предназначенным для создания гипертекстовых документов в среде Web. При этом HTML-документы могут просматриваться различными типами web-браузеров и создаваться при помощи любого текстового редактора или специализированных HTML-редакторов.
1.2 Синтаксис HTML
Обычный текст превращается в документ HTML путем добавления инструкций языка, называемых тегами. Важно понимать различие между тегами – единицами разметки и элементами – составными частями документа. Теги, во-первых, разделяют исходный неформатированный текст документа на элементы, а во-вторых, создают новые элементы, которым ничего не соответствовало в тексте (например, графические вставки).
Тег – элемент HTML, представляющий собой текст, заключенный в угловые скобки (<>). Тег является активным элементом, изменяющим представление следующей за ним информации. Тег может иметь атрибуты. Теги, как и скобки, бывают парными – в этом случае открывающему тегу должен соответствовать закрывающий тег . Кроме того, теги могут быть непарными, без закрывающего тега.
Теги HTML могут быть условно разделены на две категории:
— теги, определяющие, как будет отображаться web-браузером тело документа в целом;
— теги, описывающие общие свойства документа, такие как заголовок или автор документа.
Тег HTML состоит из следующих друг за другом в определенном порядке элементов:
— левой угловой скобки (<);
— необязательной косой черты (/), которая означает, что тег является конечным тегом, закрывающим некоторую структуру;
— идентификатора (имени) тега;
— правой угловой скобки (>).
Тег может быть без атрибутов или сопровождаться одним, или несколькими атрибутами.
Между открывающим и закрывающим тегами может содержаться текст или другие теги. В таких случаях два тега и часть документа, заключенная между ними, образуют блок, называемый элементом HTML.
Спецификация атрибута включает в себя:
— идентификатор (имя) атрибута;
— значение атрибута, которое задается строкой символов в кавычках (“80”).
При этом регистр букв в идентификаторах (именах) тегов и атрибутов (но не в значениях атрибутов) не учитывается.
Кроме тегов в языке HTML используется специальный управляющий символ
1.3.1 Объявление версии HTML
Каждый HTML-документ, отвечающий спецификации HTML некоторой версии, для корректного отображения документа в браузере должен начинаться со строки объявления версии HTML.
Используется следующий синтаксис для стандартов до HTML 4.01 включительно:
Можно ли на HTML написать программу?
04 Января 2013 Программирование 
15 
0
Бывает такое, что мне задают какой-нибудь вопрос, а я говорю, что для решения твоей задачи достаточно просто написать программку, которая сделает все для тебя. Ну вполне логично так отвечать, ведь ко мне часто обращаются те, кто пишет код, или начинает писать. И вот уже не в первый раз слышку в ответ вопрос — а на HTML можно написать такую программу?
Мне кажется, что людей путает выражение «HTML код». Ведь на самом деле это не код, а специальные теги форматирования. HTML в чистом виде не является языком программирования, это стандарт разметки документов. А за логику отвечают совершенно другие языки, например JS, PHP и другие.
Вот интересно, почему стали говорить HTML код? Хотя как можно скзать по другому, чтобы звучало и отражало реальную суть языка. А можно ли называть HTML языком? Столько вопросов в голове пролетело. Это вопросы так, чисто потрындеть. У меня есть свое мнение, но оно мое. Правильно ли говорить «писать программу на HTML», ведь ее пишут на JS? JS является ли частью HTML?
Мне кажется в HTML5 он стал частью.
Понравилось? Кликни Лайк, чтобы я знал, какой контент более интересен читателям. Заметку пока еще никто не лайкал и ты можешь быть первым
Источник: www.flenov.info
Курс HTML / CSS
Интерактивный онлайн курс HTML и CSS программирования и верстки сайтов для начинающих — Обучение HTML с нуля
В видеокурсе Вы изучите основы языков HTML и CSS, научитесь создавать адаптивные HTML страницы Вашего сайта. В процессе обучения Вы создадите портал КиноМонстр — сайт о кино, адаптированный для работы одновременно на компьютерах и мобильных устройствах.
Изучите онлайн уроки по основам верстки и программирования Html и Css с нуля и Вы сможете эффективно создавать верстку любых собственных сайтов!
Онлайн курс HTML / CSS программирования и верстки сайтов с нуля
Поделитесь страницей с друзьями
О курсе — Чему Вы научитесь?
Посмотрите видео об онлайн курсе программирования и верстки HTML / CSS для начинающих. Вы узнаете, как эффективно построить обучение основам Html и Css и научиться самому создавать веб сайты с нуля.
- Основы HTML и CSS
- Полноценная верстка страниц сайтов, на примере сайта о кино
- Работа в редакторе кода SublimeText
- Практическое применение основных тегов HTML
- CSS-верстка текста: цвет и размер шрифта
- Позиционирование блоков на сайте
- Работа с изображениями
- Правильная HTML-разметка для SEO
- Адаптивная верстка под мобильные устройства
- Специальные классы для адаптивности
- Полезные инструменты для frontend-разработчика
План курса
Программа обучения включает видео уроки по изучению HTML и CSS с нуля. Благодаря интерактивным тестам и заданиям, Вы сможете закрепить полученные знания по Html и Css верстке и программированию веб сайтов на практике.
1. Введение
- 1.1 Вводная часть. Знакомство. 09:22
2. Подготовка к работе. Установка редактора кода
- 2.1 Подготовка компьютера к работе. Установка редактора кода и инструментов 07:39
- 2.2 Тестирование 00:15
- 2.3 Тестирование 00:15
3. Основы HTML и CSS. Базовая разметка, html-теги, css-стили
- 3.1 Базовая разметка HTML 05:15
- 3.2 Интерактивное задание 00:30
- 3.3 Теги ,
, 04:07
- 3.4 Тестирование 00:15
- 3.5 Интерактивное задание 01:00
- 3.6 Интерактивное задание 01:00
- 3.7 Интерактивное задание 01:30
- 3.8 Познакомимся с новыми html-тегами , . Базовый синтаксис CSS 08:21
- 3.9 Интерактивное задание 02:00
- 3.10 Интерактивное задание 02:00
- 3.11 Тестирование 00:15
- 3.12 Тестирование 00:15
- 3.13 Теги
-
,
- и этапы создания веб-сайта 07:57
4. Создание сайта на практике. Главная страница — Верхняя часть (Header) и меню
- 4.1 Подключение css стилей в отдельном файле 09:09
- 4.2 Интерактивное задание 02:00
- 4.3 CSS свойства: margin, padding, height, font-size и другие 07:02
- 4.4 Тестирование 00:15
- 4.5 Тестирование 00:15
- 4.6 Интерактивное задание 01:30
- 4.7 Тестирование 00:15
- 4.8 Интерактивное задание 01:30
- 4.9 Интерактивное задание 02:30
- 4.10 Тестирование 00:15
- 4.11 Стилизация ссылок с помощью CSS 05:56
- 4.12 Тестирование 00:15
- 4.13 Тестирование 00:15
- 4.14 Интерактивное задание 01:30
- 4.15 Создание горизонтального меню 07:45
- 4.16 Тестирование 00:15
- 4.17 Стилизация горизонтального меню 05:33
- 4.18 Тестирование 00:15
- 4.19 Интерактивное задание 03:00
5. Создание сайта. Главная страница — Правый блок
- 5.1 HTML Form. Создание форм 07:31
- 5.2 Интерактивное задание 01:30
- 5.3 Right Block. Начнем создавать панель справа 13:05
- 5.4 Тестирование 00:15
- 5.5 Right Block. Продолжение 12:03
- 5.6 Right Block. Часть 3 10:51
- 5.7 Интерактивное задание 07:00
6. Создание сайта. Главная страница — Нижняя часть (Footer)
- 6.1 Footer. Часть 1 04:22
- 6.2 Footer. Часть 2 05:21
- 6.3 Интерактивное задание 05:00
7. Создание сайта. Главная страница — Фильмы, Сериалы, Блог
- 7.1 Content главной страницы 08:56
- 7.2 Главная страница. Записи блога 05:30
8. Создание сайта. Страница просмотра фильмов
- 8.1 Страница просмотра фильмов 05:37
- 8.2 Страница просмотра фильмов. Блок информации о фильме 05:50
- 8.3 Страница просмотра фильмов. Блок с описанием фильма 05:10
- 8.4 Страница просмотра фильмов. Блок с отзывами к фильму 06:40
- 8.5 Интерактивное задание 05:00
- 8.6 Страница просмотра фильмов. Форма отправки отзывов к фильму 08:44
9. Создание сайта. Страницы Фильмы и Рейтинг фильмов
- 9.1 Страница Фильмы 13:45
- 9.2 Интерактивное задание 07:00
- 9.3 Страница Рейтинг фильмов 12:22
- 9.4 Тестирование 00:15
- 9.5 Интерактивное задание 10:00
10. Создание сайта. Адаптивная верстка
- 10.1 Адаптивная верстка. Инструменты разработчика 06:48
- 10.2 Адаптивная верстка. Media queries, тэг viewport 09:43
- 10.3 Адаптивная верстка. Правила адаптивной верстки 11:56
- 10.4 Тестирование 00:15
- 10.5 Адаптивная верстка. Продолжение 09:53
- 10.6 Адаптивная верстка. Заключительная часть 11:59
Источник: beonmax.com