Характеристика HTML как языка программирования для Интернет — МегаЛекции
HTML является наиболее популярным языком разметки документов. В исходном виде файл HTML содержит инструкции форматирования (теги), чередующиеся с текстом документа. Главной особенностью разметки HTML является возможность вставки ссылок на внешние документы или на внутренние разделы того же документа.
Язык HTML отличается от других широко распространенных языков программирования тем, что он позволяет отображать содержимое документа на компьютерах с различными аппаратными платформами, операционными системами и графическими характеристиками. Достигается это тем, что файл с документом WWW представляет собой набор инструкций для программы-обозревателя (браузера), которая выводит содержимое документа, интерпретируя его построчно. При этом задача выбора точных размеров окна, размера и цвета шрифтов и т. п. полностью ложится на браузер, который решает их в соответствии со своими возможностями и с возможностями системы. Этим достигается большая гибкость в выборе технических средств вывода изображения документа, но теряется точность. На практике это означает, что изображения одного и того же документа на одном компьютере, выведенные при помощи различных браузеров, будут отличаться.
В соответствии со спецификациями языка HTML текстовые документы сохраняются в файлах, имеющих расширение .htm или .html. Однако документ, открытый на сервере, редко бывает полностью текстовым, чаще всего он содержит графические изображения, создающие фон под текстом, либо имеющие определенную смысловую нагрузку. В документе могут присутствовать и звуковые файлы, и движущиеся изображения. Все эти составные части документа являются разными файлами, содержащими логически связанную между собой информацию и объединенными локальными ссылками, которые позволяют управлять просмотром графики, прослушиванием звука, перемещением по тексту, либо выполняют другие функции.
Наряду с неоспоримыми достоинствами язык HTML обладает рядом слабых сторон. По сути, HTML — это технология представления информации, описывающая то, как браузер должен скомпоновать текст и графику на странице. В результате справедливо утверждение: «То, что вы видите, это все, что вы получаете»:
— невозможно описать данные независимо от отображения этих данных, что является главной проблемой поиска нужной информации;
— клиент не имеет средств извлечения данных со страницы Web для дальнейшей обработки;
— на конкретной странице Web-клиент получает только одно представление конкретного множества данных.
Например, для получения данных, отсортированных иным образом, нежели тот, что представлен на текущей странице, браузер должен посылать новый запрос серверу. В свою очередь серверу придется заново отправлять полную страницу HTML со списком данных. Такое манипулирование данными ведет к значительному увеличению числа обращений к Web-серверам и затрудняет их дальнейшее масштабирование.
Другой недостаток языка HTML заключается в его «плоскости», т. е. невозможности предоставления информации об иерархии данных.
Непоследовательность языка HTML (неоднозначность синтаксиса) затрудняет разбор текста программным обеспечением браузеров. Примером такой непоследовательности может служить необязательное наличие закрывающих тегов для соответствующих открывающих. Для обозначения тегов используются символы «<» и «>», внутри которых помещаются названия инструкций и их параметры.
Базовая структура страницы WEB
1. Для создания Web-страницы требуются текстовый редактор, например, стандартное приложение ОС Windows Блокнот (Пуск-> Программы-> Стандартные -> Блокнот). В блокноте создается новый файл и сохраняется с расширением .html.
2. Язык HTML — это набор меток с форматом <TAG>текст</TAG>.
3. Все Web-страницы начинаются с метки <HTML> и заканчиваются меткой </HTML>.
4. HTML-документ состоит из двух секций. Первая из них, голова, определяется метками <HEAD> и </HEAD>.
5. Вторая секция, тело страницы, обрамляется метками <BODY> и </BODY>.
6. Заглавие страницы указывается между метками <TITLE> и </TITLE> и должно находиться в секции головы.
7. Текст Web-страницы располагается в секции тела. Для превращения текста в абзацы используется метка <P>.
Стили форматирования
1. Для введения стилей текста предназначены четыре основные метки: <В> — жирный, <I> — курсивный, <U> — подчеркнутый и <ТТ> — моноширинный. Допускается комбинировать эти метки, определяя для одного и того же текста несколько стилей.
| Стиль текста | Начальная метка | Конечная метка |
| Жирный | <В> | </В> |
| Курсив | <I> | </I> |
| Подчеркивание | <U> | </U> |
| Моноширинный | <ТТ> | </ТТ> |
2. Для вывода нестандартных символов, например знака авторского права, применяются специальные коды (символьные ссылки или названия).
| Знак | Символьная ссылка | Название |
| < | < | < |
| > | > | > |
| ¢ | ¢ | ¢ |
| £ | £ | £ |
| ¥ | ¥ | ¥ |
| © | © | © |
| ® | ® | ® |
| º | ° | ° |
| ¼ | ¼ | ¼ |
| ½ | ½ | ½ |
| ¾ | ¾ | ¾ |
| × | × | × |
3. При наличии на странице нескольких разделов (глав) для форматирования их названий и определения структуры страницы применяются метки заголовков от <Н1> до <Н6>.
4. Для вывода белого пространства и возврата каретки в предформатированном тексте предназначены метки <PRE> и </PRE>.
5. Конец строки определяет метка <BR>.
6. Чтобы провести поперек страницы горизонтальную линию, применяется метка <HR>.
Списки
1. Нумерованные списки удобны для ранжирования элементов и поэтапных процедур. Перед каждым элементом указывается метка <LI>, а весь список обрамляется метками <OL> и </OL>.
2. Маркированные списки позволяют выводить на странице Web бланочные комментарии. Перед каждым элементом списка указывается метка <LI>, а весь список находится внутри меток <UL> и </UL>.
3. Списки определений удобно применять для элементов типа словаря или секций документа (где каждый термин служит заголовком секции, а определение — текстом секции). Для указания термина применяется метка <DT>, для определения — метка <DD>, а весь список обрамляется метками <DL> и </DL>.
4. Допускается вставлять список одного типа в список другого типа и даже того же самого типа.
Гипертекстовые связи
1. Адреса URLs можно разбить на четыре части: «как» (протокол, например http, с последующими символами ://), «кто» (имя хост-компьютера, например www.logophilia.com), «где» (каталог, например /Ноme/) и «что» (имя файла, например, homepage.html).
2. Базовая структура гипертекстовой связи имеет такой вид:
<А НREF= «URL»>Текст связи</А>
3. Если страница, к которой создается связь, находится в том же каталоге, что и текущий документ, в адресе URL связи можно оставить только имя файла.
4. Для создания якоря применяется такая разновидность метки <А>:
<А NАМЕ= «Имя»>Текст якоря</А>
5. Для образования связи к якорю применяется такая метка:
<А НREF= «#Имя»>Текст связи</А>
6. В связях электронной почты применяется разновидность mailto метки <А>:
<А HREF= «mailto: Адрес электронной почты»>Текст связи</А>
Графика
1. Встроенные изображения появляются непосредственно на странице Web, а внешние изображения можно просмотреть только с применением отдельной графической программы.
2. Имеется множество графических форматов, но в Web применяются только два — GIF (самый распространенный) и JPEG.
3. Графику можно получить из библиотек клипартов, других страниц, архивов Интернет, с помощью сканера или факса.
4. Для образования графического файла в формат GIF издругого формата применяется программа LView.
5. Для добавления изображения на страницу Web применяется метка
<IMG SRC= «имя_файла»>,
где имя_файла есть имя графического файла.
6. Чтобы превратить изображение в гипертекстовую связь, применяется метка <А>, в которой обычный текст связи заменяется меткой <IMG>:
<А HREF= «URL»><IMG SRC=«имя_файла»></А>
Рекомендуемые страницы:
Воспользуйтесь поиском по сайту:
10 топовых языков программирования для веб-разработки в 2019
Карьера в области веб-разработки является прибыльной, захватывающей и требующей готовности к постоянным изменениям. Для этого требуется определенный набор хорошо отработанных навыков и знание языков, которые вам нужно будет обновлять год за годом. В свою очередь, каждый день Вы сможете создавать действительно классные веб-материалы, и в конце каждого месяца вы будете получать хорошую зарплату. Неплохо, да?
В последние годы, когда сеть продолжает развиваться, появилось несколько различных потоков веб-разработки:
- Backend (или веб-разработка на стороне сервера) охватывает все те вещи, которые работают в фоновом режиме, чтобы создавать веб-сайты или веб-приложения, например базы данных и скрипты.
- Frontend (также известная как веб-разработка на стороне клиента) касается части веб-интерфейса, с которой пользователь взаимодействует — часть, с которой знакомы все, кто пользуется Интернетом.
- Есть Fullstack разработчики, которые могут сделать все вышеперечисленное.
Независимо от того, какой путь вы выбрали, вы все равно должны понимать каждую сторону, чтобы правильно выполнять свою работу.
Итак, вот 10 лучших языков программирования для веб-разработки, как на стороне клиента, так и на стороне сервера.
CSS / HTML
Рука об руку с JavaScript идут CSS и HTML — вместе они составляют святую троицу разработки веб-интерфейса. HTML (Hyper Text Mark Up Language) — это язык веб-браузеров — с помощью которых сделаны сайты. Вы можете пройти курс HTML бесплатно на нашем сайте. CSS (каскадные таблицы стилей) заставляет их выглядеть стильно и со вкусом — гораздо лучше, чем те ужасные сайты, действующие с первых дней работы в Интернете. Для разработчиков веб-интерфейсов очень важно знать эти инструменты от и до. Они также окажутся полезными для backend разработчиков: вы сможете понять, как изменения вашей серверной части влияют на конечного пользователя.
PHP
PHP — это скриптовый язык, используемый для быстрого создания динамических веб-страниц. Отличный выбор для frontend и backend разработчиков, чтобы добавить их в арсенал (но особенно для последних), он стоит за такими веб-гигантами, как WordPress и Facebook. PHP позволяет быстро и легко расширять веб-приложения и запускать веб-сайты с повторяющимися серверными задачами (например, обновлять новостные ленты). Он имеет открытый исходный код и очень популярен в среде начинающих компаний, медиа-агентств и электронной коммерции — таких людей, которые часто нанимают новых веб-разработчиков. А ещё, это любимый язык программирования автора этого блога, и да, у нас вы можете изучить PHP бесплатно!
SQL
Для full stack разработчиков и на стороне сервера SQL (Structured Query Language) — это вишня на торте вашего разрабатываемого инструментария. SQL является важной частью веб-разработки, что позволяет получать конкретные данные из больших, сложных баз данных. Он пользуется большим спросом среди крупных компаний, таких как Microsoft, поэтому это умный выбор для любого разработчика с высокими амбициями или необходимость, если вы работаете с базами данных на регулярной основе. На нашем сайте вы также можете найти бесплатный курс MySQL для начинающих.
JavaScript
Язык интерфейса, используемый для создания и разработки веб-сайтов, настольных приложений и игр. JavaScript работает во всех браузерах и может работать с программами, которые не размещены в Интернете. Он поддерживает как функциональные, так и объектно-ориентированные стили программирования, и в основном, это ваш подход к созданию потрясающих пользовательских интерфейсов и веб-сайтов / приложений / игр, которые выглядят супер круто. Понимание JavaScript важно, даже если ваше сердце настроено на развитие серверной части. Компоненты, структуры данных и алгоритмы JavaScript применяются практически к любому другому языку.
Python
Новый парень на блоке по сравнению с некоторыми другими языками в этом списке. Python чрезвычайно прост в освоении и является динамичным, универсальным языком. Хотя он более популярен как язык на заднем плане, с ним можно делать практически все, что вы хотите. Разработанный с целью быть читабельным, простым и, самое главное, забавным, это новый фаворит разработчиков во всех областях индустрии. Python является основным языком для начинающих. Он гибкий и чрезвычайно мощный, а главное — имеет очень светлое будущее.
Go
Go — специальный язык программирования Google. Новичок на сцене программирования, который может похвастаться отличной интеграцией, хорошей читабельностью и простотой использования, а также возможностью решения множества проблем, с которыми друг языки не справляются. По мере появления новинок этот — очень перспективный. Кроме того, мы все знаем, что Google является королем Интернета на сегодняшний день, и именно он платит за создание веб-приложений за языке Go.
Java
Java, разработанная в 1990-х годах и по-прежнему наиболее востребованная, является золотым стандартом в области веб-разработки во всем мире, во всех областях. Она ориентирована на объекты и работает на любой платформе, что делает ее чрезвычайно универсальной. Если вы хотите, чтобы ваш safe можно было использовать практически во всех технологических компаниях в мире, то непременно выбирайте Java. Интересный факт: Java изначально предназначался для интерактивного телевидения, но вскоре его создатели поняли, что она слишком далеко опережает свое время для этой конкретной отрасли. Остальное уже история.
Ruby
Масштабируемая, простая и сверхбыстрая, Ruby и Ruby on Rails — это дуэт мечты, который предлагает язык full stack, а также рамки для быстрого создания полных программ. Любимый среди предпринимателей и начинающих, Ruby имеет широкий выбор сторонних «драгоценных камней» (надстроек), которые могут заставить его делать практически все, что вам нужно. Twitter и Basecamp используют Ruby — неплохой показатель, не так ли?
C++
Главная цель, правильно поставленная и действующая с 1979 года, C ++ — объектно-ориентированный, очень технический язык. Чрезвычайно мощный и с обширными библиотеками, это один из краеугольных языков backend развития. С++ особенно полезен для высокопроизводительных программ и программ с большим количеством шаблонов. Если вы уже знаете C (или если вы изучили C ++ и хотите повернуть свою голову на C), вы уже находитесь на правильном пути.
С
Подобно C++, C — старый школьный язык, легко скомпилированный. Это часто используемая платформа программирования, которая предлагает элементы построения для других языков, таких как C ++, Python и Java. Фактически, многие из этих языков основаны на C. Отличный вариант для full stack и тех, кто хочет добавить новое измерение в свой набор навыков (или метафорическое силовое упражнение в свою панель инструментов программирования). Он лучше всего подходит для написания системного программного обеспечения и приложений, гарантируя удобный язык для разработчиков, на котором все привыкли работать.
Лекция 6. Основы языка HTML — Мегаобучалка
Основные понятия, связанные с определением языка HTML
Назначение языка HTML
Теги HTML
Атрибуты тегов
Основные понятия, связанные с определением языка HTML
Все Web-страницы Интернета имеют одну общую черту — они созданы с помощью средств языка HTML.
HTML — не обычный язык программирования, хотя процесс создания Web-страницы очень близок к процессу программирования.
HTML — это язык разметки гипертекста. Он определяет правила, согласно которым обычный текст представляется в виде Web-страниц.
Язык HTML появился одновременно со службой World Wide Web и развивался вместе с ней, постепенно вбирая в себя новые черты, которые позволяли создавать все более и более впечатляющие Web-страницы.
Он является основой World Wide Web и одновременно причиной ее широчайшей популярности. Смысл и назначение языка HTML можно понять, исходя из его названия.
Как было сказано выше Гипертекст — это текст, в который встроены специальные коды, управляющие дополнительными элементами, такими как форматирование, иллюстрации, мультимедийные вставки и гиперссылки на другие документы.
Под разметкой понимается вставка в текст этих кодов, определяющих то, как итоговый гипертекстовый документ должен отображаться специальной программой-броузером.
Разметка, может быть, простой или сложной, но в любом случае исходный текст сохраняется в документе в неизменном виде.
Но самое важное слово в этом описании — язык.
HTML представляет собой компьютерный язык, в некотором смысле родственный языкам программирования. Он включает достаточно строгие правила, которые необходимо соблюдать, чтобы получить правильные результаты.
Назначение языка HTML
Несмотря на то, что Web-страницы появляются на экране компьютера в отформатированном виде, язык HTML не предназначен для форматирования документов, поскольку жесткое задание оформления и точное позиционирование элементов текста на странице приводит к ограничениям, недопустимым в Интернете.
Так, например, когда мы форматируем текст с помощью текстового процессора Word, мы однозначно определяем, как должен выглядеть этот текст при печати на совершенно определенном принтере и на бумаге заданного формата. Когда документ размещен в Интернете, невозможно предсказать, какой компьютер будет использован для его просмотра, да и будет ли вообще у этого компьютера монитор.
Может быть, текст появится на экране компьютера, работающего в системе Windows в окне одного из современных браузеров. Может быть, это будет текстовый браузер (неспособный отображать графику), работающий в системе MS-DOS. Возможно, текст документа вообще не будет отображаться на экране, а будет воспроизводиться вслух с помощью синтезатора речи. Для слепого пользователя документ может выводиться на специальное устройство шрифтом Брайля.
В связи с необходимостью подготавливать документы для столь разнообразных устройств язык HTML не предназначен для описания формата документа. Он служит для функциональной разметки документа, то есть позволяет определить назначение фрагментов текста.
Например, если в тексте встречается заголовок, то код HTML просто указывает, что соответствующий фрагмент является заголовком. Получив такой код, программа просмотра (браузер) сама «решает», что ей делать с заголовком. Возможно, она отобразит его более крупным шрифтом, а может быть выровняет по центру экрана. Возможно, что синтезатор речи, воспроизводящий текст документа, использует код заголовка для того, чтобы повысить громкость и сделать необходимую интонационную паузу.
Язык HTML все-таки имеет некоторые команды форматирования, но общий курс на разделение содержания и оформления документа выдерживается четко. В последней версии HTML- 4.0 использовать команды форматирования, как правило, не рекомендуются.
Тэги HTML
Коды языка HTML, с помощью которых выполняется разметка исходного текста, называются тэгами.
Тэг — это набор символов. Все теги начинаются с символа «меньше» (<) и заканчиваются символом «больше» (>). Пару этих символов иногда называют угловыми скобками. После открывающей угловой скобки идет ключевое слово, определяющее тэг.
Каждый тэг в языке HTML имеет специальное назначение. Регистр букв в названиях тэгов не имеет значения — можно использовать как строчные, так и прописные буквы, хотя общепринято использовать прописные буквы, чтобы тэги отличались от обычного текста документа.
Как правило, один тег HTML воздействует только на часть документа, например на абзац. В таких случаях используют парные тэги: открывающий и закрывающий. Открывающий тэг создает эффект, а закрывающий — прекращает его действие. Закрывающие тэги начинаются с символа косой черты (/).
Некоторые теги дают разовый эффект в месте своего появления. В этом случае необходимости в закрывающем теге нет, и он не употребляется.
Если по ошибке в теге указано ключевое слово, отсутствующее в языке HTML, то тэг игнорируется целиком.
При отображении документа в браузере сами теги не отображаются, но влияют на способ отображения документа.
Атрибуты тегов
Открывающие теги часто могут содержать атрибуты, влияющие на эффект, создаваемый тэгом. Атрибуты — это дополнительные ключевые слова, отделенные от ключевого слова тега и друг от друга пробелами.
Некоторые атрибуты требуют указания значения атрибута. Это значение отделяется от ключевого слова знаком равенства (=). Значение атрибута должно заключаться в кавычки, но во многих случаях эти кавычки могут опускаться без какого-либо вреда. Закрывающие тэги никогда не содержат атрибутов.
Примеры использования тегов HTML:
<HEAD> Общий заголовок
<TITLE> Заголовок окна </TITLE >
</HEAD>
<BODY>
<Н1>Крупный текст</h2 >
<Н2>Средний текст</Н2>
<Р> Эти строки изображаются слитно, несмотря на то, что в документе они отделены друг от друга
<Р> Закрывающий тэг абзаца не обязателен.
<Р>Тэг начала абзаца более важен, чем реальный переход на новую строку. <HR>
Текст после горизонтальной линейки <BR> разбит на две строки.
</BODY>
</HTML>
Примеры парных тэгов HTML:
<HTML> … </HTML>
<HEAD>… </HEAD>
<h4> … </h4>
Примеры одиночных тэгов HTML:
<BR> … <HR>… <BASEFONT> … <FRAME> … <INPUT>…<P>
Примеры тэгов HTMLс атрибутами:
<BODY BGCOLOR=»YELLOW» TEXT=»BLUE» > …
<HR COLOR=RED SIZE=16 WIDTH=100%> …
Перечень основных понятий:Язык HTML. Теги HTML.
Ключевые моменты:. Основные понятия, связанные с определением языка HTML. Назначение языка HTML. Теги HTML. Атрибуты тегов.
Вопросы к самопроверке:
1. Что такое HTML?
2. Что такое гипертекст?
3. Что понимается под разметкой?
4. Что представляет собой HTML?
5. Для чего не предназначен HTML?
6. Как называют коды языка HTML, с помощью которого выполняется разметка исходного текста?
7. Что такое Тэг?
8. В каких случаях используют парные тэги?
9. Что такое атрибуты?
10. Что требуют некоторые атрибуты?
Веб-программирование — Википедия
Материал из Википедии — свободной энциклопедии
Веб-программирование — раздел программирования, ориентированный на разработку веб-приложений (программ, обеспечивающих функционирование динамических сайтов Всемирной паутины).
Языки веб-программирования — это языки, которые в основном предназначены для работы с веб-технологиями. Языки веб-программирования можно условно разделить на две пересекающиеся группы: клиентские и серверные.
Как следует из названия, программы на клиентских языках обрабатываются на стороне пользователя, как правило, их выполняет браузер. Это и создает главную проблему клиентских языков — результат выполнения программы (скрипта) зависит от браузера пользователя. То есть, если пользователь запретил выполнять клиентские программы, то они исполняться не будут, как бы ни желал этого программист. Кроме того, может произойти такое, что в разных браузерах или в разных версиях одного и того же браузера один и тот же скрипт будет выполняться по-разному. С другой стороны, если программист возлагает надежды на серверные программы, то он может упростить их работу и снизить нагрузку на сервер за счет программ, исполняемых на стороне клиента, поскольку они не всегда требуют перезагрузку (генерацию) страницы.
Когда пользователь дает запрос на какую-либо страницу (переходит на неё по ссылке или вводит адрес в адресной строке своего браузера), то вызванная страница сначала обрабатывается на сервере, то есть выполняются все программы, связанные со страницей, и только потом возвращается к посетителю по сети в виде файла. Этот файл может иметь расширения HTML, PHP, ASP, ASPX, Perl, SSI, XML, DHTML, XHTML.
Работа программ уже полностью зависима от сервера, на котором расположен сайт, и от того, какая версия того или иного языка поддерживается. К серверным языкам программирования можно отнести PHP, Perl, Python, Ruby, любой .NET язык программирования (технология ASP.NET), Java, Groovy, Javascript.
Важной стороной работы серверных языков является возможность организации непосредственного взаимодействия с системой управления базами данных (или СУБД) — сервером базы данных, в которой упорядоченно хранится информация, которая может быть вызвана в любой момент.
См. Веб-фреймворк.
Шаблоны программирования[править | править код]
- Samisa Abeysinghe. Ch 3. Dealing with Complexity → Frameworks to simplify complexity // PHP Team Development. — Packt (англ.)русск., 2009. — P. 58—68. — 183 p. — ISBN 978-1-847195-06-7.
- Денис Баженов. Каркасы, каркасы, каркасы… // PHP Inside. — phpclub.ru, 2005. — № 11. — С. 5—10.
- Йен Маурер. Среды Web-разработки на языке Python, Часть 1: Разработка для Web с помощью Django и Python = Python Web frameworks, Part 1: Develop for the Web with Django and Python. — IBM developerWorks., Часть 2. Разработка для Web с помощью TurboGears и Python = Part 2: Web development with TurboGears and Python. — IBM developerWorks.
- Julia Plekhanova. Evaluating web development frameworks: Django, Ruby on Rails and CakePHP (англ.) // The IBIT Report. — Temple University, Сентябрь 2009.
- Martin Björemo, Predrag Trninić. Evaluation of web application frameworks with regards to rapid development (англ.). — Июнь 2010.