понедельник, 26 февраля 2018 г.

Вперёд, в прошлое! Лента времени на раз-два-три

Как сделать рассказ о жизни и творчестве писателя нескучным, а описание исторических событий интригующим? Можно попробовать смастерить ленту времени и поселить её у себя в блоге или на сайте.

С помощью такой цифровой хроники можно составить родословную, рассказать об истории города или страны, наглядно представить развитие искусства, музыки, науки... И это ещё не полный список всех возможностей!

Чаще всего таймлайн - это временная шкала, на которую в хронологической последовательности наносятся события. К каждому событию можно прикрепить небольшой текст, картинку, видео, гиперссылку...

Один из самых простых сервисов для создания такого вебдванольного чуда - Timeline JS.

Такая лента времени получилась у нас. 

Бесплатный сервис позволяет создать неограниченное цифровых хроник: быстро и просто, буквально в три шага.

Готовый таймлайн состоит из двух блоков. Первый блок – это временная шкала с событиями и датами. Второй  – это слайдер, который отображает контент каждого события: тексты с гиперссылками, фото, аудио, видео, карты и документы.

Для работы не надо регистрироваться! Нужен только аккаунт Google. Пробуем?


Делай раз!


Заходим на сайт сервиса и нажимаем “Make a Timeline”.



Чтобы получить шаблон для создания ленты времени, нажимаем “Get the Spreadsheet Template”.



Открывается шаблон Google таблицы, на основе которого будет создаваться наша лента времени. Для начала сохраняем его на свой Google диск, для этого нажимаем “Использовать этот шаблон” вверху слева.


Делай два!


Переходим к самому интересному - заполняем ячейки шаблона. Там уже содержатся различные данные, их можно удалять и вставлять вместо них свои сведения. Главное: в таблице нельзя удалять и переименовывать столбцы и объединять ячейки.

На первый взгляд, такая англоязычная таблица выглядит страшновато. Но - не пугаемся! На самом деле, всё несложно. Итак...

Столбцы A-D – время начала события. А – год (Year), B – месяц (Month), C – день (Day), D – время (Time) в формате 00:00:00. Заполняются цифрами. Столбец А обязателен для заполнения (исключение - если в столбце P стоит надпись “title” (титульный слайд).

Столбцы E-H – время окончания события. E – год (End Year), F – месяц (End Month), G – день (End Day), H – время (End Time) в формате 00:00:00. Тоже заполняются цифрами.

Столбец I (Display Date) - временной интервал события например: январь - май.

Столбец J (Headline) – заголовок события.

Столбец K (Text) – текстовое описание для события.



Столбец L (Media) – медиаконтент события, который добавляется по ссылкам из Сети. Можно использовать:
  • изображения или фото,
  • видео – из видеохостингов Vimeo, DailyMotion, Vine и YouTube,
  • аудио - из хостинга Sound Cloud,
  • сообщения из Twitter,
  • Google-карты,
  • статьи из “Википедии”,
  • документы из DocumentCloud.

Столбец M (Media Credit) – автор медиаконтента или источник медиафайла (в том числе ссылки на Интернет-ресурсы).

Столбец N (Media Caption) – заголовок или краткое описание, которое отображается под медиаконтентом (допускается использование ссылок).

Столбец О (Media Thumbnail) – путь к миниатюре изображения (ссылка), используемого в кратком описании события на временной шкале. Рекомендуемый размер изображения - не более 32 х 32 px.

Столбец Р – для установки стартовой страницы ленты времени (title). По умолчанию “title” стоит напротив первого события ленты времени.

Столбец Q  (Group) позволяет сгруппировать события. Для этого тем событиям, которые связаны между собой, в этом поле присваиваем тег — любое слово. Тегов в одной ленте времени может быть несколько.

Столбец R (Background) – фон для каждого слайда событий. Как фон можно указывать цвет (в формате шестнадцатеричного цифрового кода) или ссылку на изображение, которое будет использоваться в качестве фона. Если ячейку оставить незаполненной, то фон слайда будет белым.

Не знаете, что такое шестнадцатеричный цифровой код? Не беда. Можно воспользоваться “Палитрой web цветов”.



Чтобы добавить новые строки в таблицу, нажимаем внизу слева на кнопку “Добавить строки внизу” а рядом в скобках указываем необходимое количество строк.


Прелесть сервиса в том, что можно пригласить соавторов для работы. Вместе интереснее! Для этого нажимаем справа вверху “Настройки доступа” и в открывшееся окно вносим адреса электронной почты будущих соавторов. Нажимаем “Готово”.



Делай три!


После того, как таблица будет заполнена, выбираем “Файл” - “Опубликовать в Интернете”.



Нажимаем “Опубликовать” и копируем ссылку на таблицу из строки браузера вверху. Полученную ссылку вставляем на сайт сервиса - в раздел 3. А в разделе 4 получаем код для встраивания ленты времени на страницу сайта или блога. Вуаля!



Для предварительного просмотра ленты времени нажимаем “Preview”.


Эффектнее всего лента времени смотрится в "широкоэкранном формате". Например, вот так.

В разделе “Optional settings” спрятаны дополнительные настройки для созданной ленты времени: можно поменять язык публикации, изменить шрифт, установить порядок показа и масштабирования слайдов. Для того, чтобы открыть список настроек, нажимаем “show”.


Ну вот, пожалуй, и все хитрости. Творческого вдохновения вам!

17 комментариев:

  1. Очень интересно. Ленты времени еще не делала, а воспринимаются они свежо, живо. В марте хочу попробовать и у себя в блоге сделать что-то подобное. К месяцу истории в институте библиотека готовит историческую панораму "На изломе эпох" по великим империям мира. Мне думается, должно получится интересно. Спасибо за идеи, новые сервисы и замечательные обучалки!

    ОтветитьУдалить
  2. Мне показалось, что сервис очень сложный! Нужна большая подготовка! И как все в блоге будет, интересно, выглядеть?!

    ОтветитьУдалить
    Ответы
    1. Здравствуйте, коллеги! А изображения как вставлять по ссылке? Интересный сервис! Я сейчас его изучаю.

      Удалить
    2. Ссылки на изображения из Сети можно вставить в столбец L (Media). Ссылка на изображения должна иметь примерно такой вид: https://img.fonwall.ru/o/tz/alleya-doroga-listva-geltaya.jpg

      Удалить
    3. В блоге лента времени будет выглядеть так: http://murmansk-nordika.blogspot.ru/2018/02/blog-post_21.html

      Удалить
  3. Очень интересно! Спасибо за новые идеи))

    ОтветитьУдалить
  4. Здравствуйте Марина! Попробовала сделать ленту, заполнила таблицу, но увы, возникли проблемы с публикацией. Жму на файл, дальше на публикацию, копируем URL-адрес, вставляем в раздел 3 сервиса, и опять ошибка "Недопустимый URL-адрес Google" Если будет возможность, подскажите, что делаю не так?

    ОтветитьУдалить
    Ответы
    1. Наталья, добрый день! После публикации таблицы надо ссылку взять из строки браузера вверху. У Вас ссылка, наверное, из открывающегося при публикации окошка, эту ссылку сервис правда не воспринимает. А ссылка из браузера может выглядеть примерно вот так: https://docs.google.com/spreadsheets/d/1RxDdbN7FluEqAa91NhBw7SWPlc2deuXyi4OMcuoEUtw/edit#gid=0

      Удалить
    2. Этот комментарий был удален автором.

      Удалить
    3. Марина, снова здравствуйте! Я не очень хороший ученик. Кажется, что делаю все правильно, но сбиваются даты и получается, что события как-бы смешиваются. Например у меня в ленте должны идти события по Византии потом Османская империя и, наконец Россия, но результат https://cdn.knightlab.com/libs/timeline3/latest/embed/index.html?source=1IXo3g47Z58jP0TRm7B1SYlR7_ddWgYLIIcc-JTk-C8s&font=Default&lang=en&initial_zoom=2&height=650

      В таблице заполняла последовательно... Спасибо за помощь!

      Удалить
    4. Наталья, добрый день! Дело в том, что сервис выстраивает все события по хронологии, поэтому всё смешалось. В лентах времени всегда все события выстраиваются по датам, независимо от порядка заполнения шаблона. Можно сгруппировать события, присвоим им разные теги.

      В столбце Q (Group) можно попробовать проставить тег — любое слово, например "Византия", "Россия". Тегов в одной ленте времени может быть несколько. И тогда теги появятся рядом с лентой. Нажав на любой тег, можно посмотреть события уже конкретно по России или по Византии.

      Удалить
  5. Марина, спасибо большое! Разобралась! Получилось! Освоила! Блог Библиопульс

    ОтветитьУдалить
    Ответы
    1. Здорово! Поздравляю! Я очень рада за Вас. :)

      Удалить
  6. Уважаемые коллеги! Спасибо, что научили меня создавать Ленту времени! Посмотрите, что у меня получилось.
    http://librarytreasurer.blogspot.ru/2018/04/Valentin-Berestov.html

    ОтветитьУдалить
  7. Поздравляю! Отличная лента времени получилась! Очень понравилась. :)

    ОтветитьУдалить

Этот пост ждёт ваших комментариев.
Не знаете, как оставить комментарий?
Тогда эта инструкция для вас!

- Нажмите на стрелку рядом с окошком "Подпись комментария".
- Выберите "Имя/URL".
- Напишите своё имя, строчку URL можно оставить пустой.
- Нажмите "Продолжить" и комментируйте.

Заранее спасибо!

Related Posts Plugin for WordPress, Blogger...