Семантическая разметка

Основы синтаксиса языка разметки EduTerra.PRO

Структура текста

Язык семантической разметки оперирует структурными элементами текста.

На верхнем уровне текст состоит из блочных элементов: абзацев, заголовков, списков, таблиц и т.д.

Блоки могут содержать строчные элементы: ссылки, термины, эмфазис и т.д.

Основные правила

  • Пустые строки: блочные элементы отделяются друг от друга как минимум одной пустой строкой.
  • Значащие отступы: количество пробелов в начале строки играет важную роль в структурных блоках (например, в списках).
  • Пробелы: отступы задаются только обычными пробелами с кодом 0x20.

Шпаргалка разметки

В режиме редактирования элемента курса пользователь может воспользоваться подсказкой разметки.

Шпаргалка разметки состоит из четырех вкладок: общие сведения, списки, таблицы, блоки и стили. Здесь пользователь может найти всю необходимю информацию для создания качественного веб-контента.

Вставка объектов

Изображения, аудио, видео, формулы и т.д.

Вставка изображений

Изображения должны быть размещены в Интернете (загружены на сайт сообщества или на специальный сервис).

Синтаксис

![текст замещения](url)

Пример: изображения

![](http://i.imgur.com/u0FzLj9.jpg)

Файлы в учебном курсе

Файлы можно загружать в учебный курс и использовать их в элементах. При этом используются квадратные скобки вместо круглых.

Для вставки объекта следует использовать кнопку “Вставить”.

Аудиозаписи

Аудиозаписи вставляются с помощью HTML-тега <audio>. Для поддержки различных браузеров рекомендуется загружать аудио в форматах MP3 и OGG.

<audio controls>
  <source src='[classic.mp3]'/>
  <source src='[classic.ogg]'/>
</audio>

Рекомендации: аудиозаписи

  • Воспользуйтесь сервисом media.io, чтобы сконвертировать аудио в форматы MP3 и OGG
  • Аудиофайлы можно также размещать на публичных хостингах: SoundCloud, Tindeck и др.

Видео из YouTube

Получите код HTML для вставки: “Поделиться” → “Встроить” → “Копировать”.

Видео из Vimeo

Используйте код вставки “Share” → “Embed”.

Видео из других источников

Ищите код вставки в виде HTML-элементов <video>, <iframe>, <object> или <embed>.

Внимание! Вопросы поддержки видео на мобильных устройствах обеспечиваются выбранным Вами сервисом.

Математические формулы

Семантический язык разметки поддерживает формулы на языке LaTeX.

Код написание математических обозначений можно посмотреть на LaTeX/Mathematics.

Строчные элементы

Ссылки

В текст можно вставить ссылку, которая будет открыта в новом окне.

Синтаксис

[Текст ссылки](URL)

Пример: ссылки

Здесь есть [ссылка на обратную связь](http://eduterra.pro/contact.html).

Пример: список ссылок

* [Новости](/blog)

* [Цены](/index.html#plansSlide)

* [Обратная связь](/contact.html)

Логическое выделение

Выделение применяется для акцентирования внимания читателя на каком-либо участке текста.

В зависимости от степени выделения можно использовать либо курсивное начертание, либо полужирный шрифт.

Пример: выделение

Этот текст содержит фрагмент, выделенный _курсивным шрифтом_.

Этот текст содержит фрагмент, выделенный курсивным шрифтом.

Пример: выделение

Этот текст содержит фрагмент, выделенный *полужирным шрифтом*.

Этот текст содержит фрагмент, выделенный полужирным шрифтом.

Методическая рекомендация

Избегайте «пестрящего» текста.

Избегайте «пестрящего» текста

Используйте логическое выделение, ссылки и другие элементы оформления только по необходимости.

Перенасыщение текста визуальными элементами усложняет восприятие и рассредотачивает внимание читателя.

Соблюдайте баланс между «голым текстом» и «новогодней ёлкой».

В начало1 из 27ВыйтиЗавершить просмотр