Применение HTML в сервисе Tilda
Расширьте возможности сайта
Немного истории
В далеком 1969 году, фирмой IBM был разработан язык GML (англ. Generalized Markup Language - стандартный обобщенный язык разметки) для создания машиночитаемых документов в правительственных и аэрокосмических проектах США. Позже язык был доработан, получил название SGML — стандартизированный GML. Но широкой популярностью он не пользовался, так как был достаточно сложным.
В 1989 году, работая в CERN, Тим Бернерс-Ли предложил проект, известный как Всемирная паутина (англ. World Wide Web). Проект подразумевал публикацию гипертекстовых документов, связанных между собой гиперссылками, что облегчило бы поиск и консолидацию информации. Проект Паутины был предназначен для учёных CERN и первоначально использовался во внутренней сети CERN. Для осуществления проекта Тимом Бернерсом-Ли (совместно с его помощниками) были изобретены идентификаторы URI (и, как частный случай, URL), протокол HTTP и язык HTML. Эти технологии легли в основу современной Всемирной паутины. В период с 1991 по 1993 год Бернерс-Ли усовершенствовал технические спецификации стандартов и опубликовал их.
Первый в мире веб-сайт Бернерс-Ли появился онлайн в Интернете 6 августа 1991 года. На этом сайте описывалось, что такое Всемирная паутина, как установить веб-сервер, как заполучить браузер и т. п. Этот сайт также являлся первым в мире интернет-каталогом, потому что позже Тим Бернерс-Ли разместил и поддерживал там список ссылок на другие сайты.
В ноябре 1991 года он опубликовал описание языка HTML в документе «Теги HTML», и сэтого момента жизнь интернета изменилась. Благодаря простоте и доступности, язык получил широкое применение от учеников школ до преподавателей университетов.
HTML
Основные понятия и определения
HTML (от англ. HyperText Markup Language — «язык гипертекстовой разметки») — стандартизированный язык гипертекстовой разметки документов для просмотра веб-страниц в браузере. HTML создавался как язык для обмена научной и технической документацией, пригодный для использования людьми, не являющимися специалистами в области программирования и вёрстки. Любой документ на языке HTML представляет собой набор элементов, причём начало и конец каждого элемента обозначается специальными пометками — тегами.
Гипертекст — это текст, сформированный с помощью языка разметки (например, HTML) с расчётом на использование гиперссылок.
Тег, те́ги (иногда тэг, англ. tag — именованная метка название — более правильное название дескриптор) — элемент языка разметки гипертекста. Текст, содержащийся между начальным и конечным тегом, отображается и размещается в соответствии со свойствами, указанными в начальном теге. У тега могут быть свойства, называемые атрибутами, дающие дополнительные возможности форматирования текста. Они записываются в виде сочетания: имя атрибута-значения, причём текстовые значения заключаются в кавычки.
Атрибут -это дополнительные значения, которые настраивают элементы или регулируют их поведение различным способом, чтобы соответствовать критериям пользователей. Есть два типа атрибутов: атрибут со значением и логический атрибут (есть только одна опция), у которого нет значения. Атрибуты пишутся внутри открывающего тега, несколько атрибутов перечисляются через пробел, порядок их значения не имеет.
Тег <head> - элемент-контейнер для метаданных HTML-документа, таких как <title>, <meta>, <script>, <link>, <style>, которые хранят информацию для браузеров и поисковых систем. Содержимое тега <head> не отображается напрямую на веб-странице, за исключением тега <title> устанавливающего заголовок окна веб-страницы.
Тег <body> - (от англ. «тело») — представляет тело документа (содержимое, не относящееся к метаданным документа), предназначен для хранения содержимого веб-страницы (контента), отображаемого в окне браузера. Информацию, которую следует выводить в документе, следует располагать именно внутри контейнера <body>. К такой информации относится текст, изображения, теги, скрипты JavaScript и т. д.
Тег <a> - (сокращение от «ancore» — якорь) - определяет гиперссылку для перехода на определённое место на странице или на другую страницу в Интернете: другие HTML-документы, произвольные файлы, адреса электронной почты, номера телефонов и т. д. Для создания ссылки необходимо сообщить браузеру, что является ссылкой, а также указать адрес документа, на который следует сделать ссылку. В качестве значения атрибута href используется адрес документа (URL, Universal Resource Locator, универсальный указатель ресурсов), на который происходит переход. Адрес ссылки может быть абсолютным и относительным. Абсолютные адреса работают везде и всюду независимо от имени сайта или веб-страницы, где прописана ссылка. Относительные ссылки, как следует из их названия, построены относительно текущего документа или корня сайта.
Tilda Publishing
Tilda Publishing — это платформа для создания сайтов, интернет-магазинов, портфолио, верстки статей, лендингов. Разработана Никитой Обуховым в 2014 году.
Добавление HTML-кода в Tilda
Бывают ситуации, когда возможностей Тильды, весьма широких, не хватает. Нет нужной формы обратной связи; хотелось бы, подключить свою страницу соцсети, и обсуждать с посетителями разные вопросы; знать сколько человек посетили ваш сайт. И в этом случае, нам поможет вставка кода. Можно заказать код программисту. Но можно воспользоваться виджетами сервисов-партнеров Tilda.
Внимание! При вставке стороннего кода, нужно учитывать, что Tilda «не осуществляет поддержку по вопросам, связанным с работой вашего кода». Это означает, что все риски и ответственность, ложаться на вас. Ресурс, который вы хотите привязать к Tilda, должен быть надежен в плане интернет безопасности.
HTML-код можно добавлять на страницу (внутрь тега <body>), либо в HEAD сайта или страницы, используя блок T123 «HTML-код». В режиме редактирования (и предпросмотра) код выводится просто текстом. Чтобы код заработал, страницу нужно опубликовать.
Вставка HTML-кода в HEAD сайта
Заходим в "Настройки сайта", мотаем вниз до "Ещё"
Находим "HTML-код для вставки внутрь HEAD"
Жмем "Редактировать код"
Вставляем нужный код
Сохранить
Опубликовать
Вставка HTML-кода в HEAD на какой-то определенной странице
Настройки страницы
Дополнительно
Находим " Html-код для вставки внутрь HEAD"
Жмем "Редактировать код"
Вставляем нужный код
Сохранить
Опубликовать
Вставка на страницу виджета
На стороннем сайте регистрируемся. Создаем необходимый виджет. Выставляем необходимые размеры, шрифт, текст. Задайте название, и после внесенных изменений сохраните.
Нажмите кнопку «Получить код», скопируйте код виджета.
На Tilda на свой сайт добавьте «Zero block». Из «Библиотеки блоков» раздел «Другое» добавьте блок T123 «HTML-код».
В добавленном блоке заходим в «Контент», и в блок для HTML-кода вставляем полученный код.
Сохранить и закрыть.
Опубликовать.
Виджет появился на странице
Итоговая аттестационная работа по курсу: «Веб-дизайн на Тильде»
Выполнила: Ашихина Ольга
Использованы материалы сайтов: help-ru.tilda.cc/html; https://webref.ru/html/; https://developer.mozilla.org/ru/docs/Web/HTML/; https://ru.wikipedia.org/.
Фото обложка ru.freepik.com/free-photo/website-html-code-browser-view-printed-on-white-paper-closeup-view_8 487 289.htm.
