Типология сетевых СМИ. 3 курс. Лабораторное занятие №1. Визуализация статистики

Задание состоит из двух частей - создания виджета визуализации данных (1) и публикации этого виджета в виде колонки под блоком меню из предыдущего задания (2).

Часть 1.

1) Вам нужно выбрать любые открытые данные - можно, например, взять статистику челябинскстата - http://chelstat.gks.ru/ - в формате excel (минимум - два файла с различными данными).
2) Открыть сервис Tableau Public и зарегистрировать в нем аккаунт - https://public.tableau.com/s/ Затем начать работу с последней версией (если у вас нет программы - скачать дистрибутив с сайта).
3) Запустить программу и выбрать данные (экспортируются из текстового файла, access или excel).
4) Оформить данные в таблице (sheet) различным образом для различных данных (у вас два варианта для минимума), распределив по колонкам и строкам.
5) Создать дэшбод-страницу (Dashboard-New Dashboard) и перенести туда таблицу (sheet 1 и sheet 2, соответственно).
6) Оформить страницу на русском языке и удалить все нулевые параметры из конечного виджета.
7) Зарегистрироваться в tableausoftware и загрузить статистику в сервис (File - Save to web).
8) Открыть дэшбод в вашем профиле и скопировать embed-код.

Часть 2.

9) Для добавления простых колонок нужно добавить на страницу CSS-стиль этих колонок и указать их в HTML.

10) Берете скрипт CSS из прошлого задания и внутри параметров стилей создаете идентификатор #maket  и указываете в нем атрибут ширины макета в процентах ( в моем примере - 145%). После этого закрываете идентификатор.

11) Обозначаем селекторы таблиц-колонок с идентификаторами левой и правой. Ширину вы задаете свою, как и фоновые цвета:

TD {
vertical-align: top;
padding: 5px;
}
TD#leftcol {
width: 800px;
background: #87ceeb;
}
TD#rightcol {
width: 500px;
background: #4169e1;
}

12) После этого задаем подвал сайта с помощью селектора footer и указываем его атрибуты: цвет (background-color), цвет текста (color) и ширину (width) в процентах (равна ширине всего макета)

13) Закрываем селектор футера и загружаем файл CSS в sites.google.com. Сам файл встраиваем в HTML перед закрывающим тегом </head>

14) После закрытой части меню навигации задаем колонки как таблицу с идентификатором макета:

<table cellspacing="0" id="maket">

15) Внутри указываем тело таблицы с идентификатором колонки (левой и правой): 
<tbody>
<tr>
<td id="leftcol">содержимое левой колонки</td>
<td id="rightcol">содержимое правой колонки</td>
</tr>
</tbody>
</table>

16) После тега </body> вставляете тег подвала страницы <footer> и указываете в нем произвольное содержимое.

17) Встраиваете виджет визуализированных данных в любую колонку, настраивая ширину виджета.

Если все верно, то у вас получится примерно такой вариант: https://konoplevtech3.blogspot.com/2019/02/css.html

Ссылки на выполненное задание принимаются в комментариях до 20:00 16 марта.