#!/usr/bin/env python # coding: utf-8 # # Python для анализа данных # # *Алла Тамбовцева, НИУ ВШЭ* # ### Немного про язык html # # **HTML (HyperText Markup Language)** – язык разметки (для тех, кто работал с *RMarkdown*: *Markdown* ‒ тоже язык разметки, только попроще). Поэтому, любая html-страница в интернете – это обычный текст, в котором отмечено, какие части представляют собой заголовок, абзац, таблицу, картинку и так далее. Вообще, правилом хорошего тона считается включать в html-код только содержательные вещи с разметкой, а все оформление и интерактив выносить в отдельные файлы. # # Обычно, за страницей в интернете кроется примерно следующее. На сервере лежит несколько папок. В одной папке лежат сами html-страницы с размеченным текстом. В другой – хранятся файлы *css* (*Cascading Style Sheets*), в которых заданы параметры оформления разных страниц (цвет заголовков, фона, меню, ширина рамочек вокруг текста и картинок и прочее). В третьей папке находятся файлы с кодом на *JavaScript*, которые отвечают за всевозможный интерактив: будь то всплывающий перевод слова при наведении курсора, увеличение картинки при просмотре, подсветка формы для заполнения, если формат даты неверный, и так далее. JavaScript ‒ тоже отдельный язык программирования (несмотря на название, с Java не связан), на котором пишется код, соответствующий интерактиву. # # Все эти файлы связаны между собой: к каждому html-файлу присоединены с помощью ссылок css-файл с оформлением и код javascript. Иногда, к сожалению, html-страницы создаются не по стандартам, и в файле с текстом встречаются огромные куски, отвечающие за оформление, что значительно затрудняет работу (на примеры таких сайтов мы потом посмотрим). # # Сегодня мы начнем разбирать веб-скрейпинг и парсинг html-файлов. Обычно два этих процесса связаны, просто парсинг – более узкое понятие. Веб-скрейпинг (*web scraping*) – это вообще выгрузка данных с веб-страниц, а парсинг (*parsing*) – это выбор текста из файла с разметкой, например, из html или xml. Но прежде, чем разбирать работу с html-файлами, давайте познакомимся поближе с их структурой. Для этого зайдем на сайт [w3schools.com](https://www.w3schools.com/Html/) и откроем [раздел](https://www.w3schools.com/Html/tryit.asp?filename=tryhtml_default) *Try it yourself*. # # Это удобный учебный инструмент для создания html-файлов (и да, вообще на сайте много документации и тьюториалов по html, css и веб-дизайну вообще). Давайте создадим свою страничку. # # ![](html1.png) # # Для разметки используются тэги – служебные слова в треугольных скобках `<>`. Тэги бывают разными: открывающие и закрывающие. Закрывающие тэги начинаются с прямого слэша (`/`). # # Вся страница заключается в тэг ``. В начале обычно указывается какая-то мета-информация: язык страницы, кодировка, метки, название и прочее. Здесь, правда, такого нет. "Тело" документа, собственно страница, которая отображается при просмотре, заключается в тэг `
`. # # Для заголовков используются тэги с `h` (`h` – от *header*). Тэги `` ‒ для заголовков первого уровня, тэг `` – для заголовков уровня, и так далее. В тэги `` заключаются абзацы (`p` – от *paragraph*). Давайте для начала внесем изменения в файл ‒ создадим страничку о себе. Можете скопировать код ниже в поле на странице *Try it Yourself* и нажать кнопку *Run*. # In[ ]:Я учусь создавать html-страницы.
# ![](html2.png) # Теперь добавим небольшую таблицу. Знания об устройстве таблиц нам понадобятся, потому что чаще всего при парсинге приходится «выцапывать» данные из таблиц на html-страницах. # # Вся таблица заключается в тэги `Фамилия | Имя | Возраст |
---|---|---|
Тамбовцева | Алла | 24 |
Фамилия | Имя | Возраст |
---|---|---|
Тамбовцева | Алла | 24 |
Я учусь создавать html-страницы.
Фамилия | Имя | Возраст |
---|---|---|
Тамбовцева | Алла | 24 |