От автора: статья нашего гостя Каталин Рошу, которая вместе с коллегами собрала тонны данных о HTML контенте на веб-сайтах. Исследование было проведено совсем недавно, не терпится посмотреть на результаты. Хочется сравнить лучшие результаты с моими предположениями и узнать, был ли я прав.
Все мы участвовали в этом исследовании. Мы пытаемся улучшить HTML код, делая его чище, красивее и более читаемым. Мы гонимся за семантикой и доступностью, чтобы сайт был доступен абсолютно всем. И у нас всегда возникают вопросы:
Как лучше структурировать разметку?
Как это делают другие разработчики?
Предыдущее исследование
В 2005 Ян Хиксон, редактор спецификации по HTML5, провел анализ более миллиона образцов документов. Он хотел понять, из чего состоит веб-страница. Миллион – очень большое число, но для Google нет ничего невозможного. Ян извлек из всех документов ценную информацию о популярных именах классов, элементах, атрибутах и метаданных. Позднее эти результаты были опубликованы на Web Authoring Statistics. Это исследование до сих пор остается самым обширным в сфере ПО для создания сайтов.

JavaScript. Быстрый старт
Изучите основы JavaScript на практическом примере по созданию веб-приложения
Узнать подробнееЧуть позже в 2008 году поисковой робот Opera Metadata Analysis and Mining Application или MAMA закончили анализ 3,5 миллионов адресов сайтов. Брайан Уилсон, автор этой впечатляющей работы, расширил исследование, опубликовав данные о полной структуре страниц, в том числе HTML, CSS и JS код.
Список самых популярных имен классов в этих HTML документах был одним из тестов, который позже оказал огромное влияние на HTML5 разработку. Поисковой робот Opera MAMA также определил самые распространенные имена классов. Помимо данных от Google робот также опубликовал данные о самых популярных значениях атрибута ID.
Что дает нам это исследование?
Данные были собраны с 8,021,323 индекс страниц из первой двадцатки поисковой выдачи Google по примерно 30 миллионам ключевых слов по их важности. Что это значит: у нас есть 30 миллионов ключевых слов. Мы произвели поиск в Google по каждому из них и сохранили URL первых двадцати сайтов, удалив повторяющиеся.
О том, что эти страницы релевантны по отношению к основной массе, можно только предположить. Такое предположение мы делаем на основе того, что эти сайты будут самыми популярными и будут иметь высокую нагрузку, что поднимет их в поисковой выдаче.
Свежесть данных
Последние данные были получены 20 мая 2016 года. Новое исследование никогда не побьет предыдущее, проведенное Google в 2005 году. В этом исследовании также не стояло цели побить результаты Opera. Целью был поиск новых и актуальных способов написания разметки на основе популярнейших сайтов.
Так как же выглядит среднестатистическая веб-страница сейчас? Посмотрите на скриншот ниже, полную статистику можно посмотреть по ссылке на исследование.
Статистика
Судя по скриншоту, среднестатистическая индекс страница использует 26 различных типов тегов.
Частотность употребления всех 26 тегов на самых популярных сайтах:

JavaScript. Быстрый старт
Изучите основы JavaScript на практическом примере по созданию веб-приложения
Узнать подробнееНеудивительно, что теги head и html используются на всех сайтах. Слегка удивительно, что тег body получил 99% — может быть, на больших сайтах есть ошибки? Теги таблиц находятся в самом низу, что тоже довольно необычно. Они используются на трети сайтов. Среди версий (X)HTML страниц лидирует HTML5 Doctype.
Если посмотреть на теги, которые отвечают за стили и общаются и поисковыми движками, вы найдете 175 миллионов тегов. Их частотность:
Частотность употребления 105 миллионов тегов для контента:
Частотность миллиона тегов с текстовым контентом:
Что ждет интернет?
Нас, веб-разработчиков и создателей контента интересует работа с сайтом, статистика и поддержка в браузерах. Именно это привело к тому, что после исследования 2005 года именно эти имена классов стали популярны в HTML5 тегах.
Интернет быстро развивается. Тут нет ничего нового, но это может ошеломить. Тренды меняются каждый год, и создателям контента нужна определенная мотивация и усилие, чтобы оставаться на гребне волны. Подумайте, как среднестатистическая веб-страница выглядела 10 лет назад, и как выглядит современная веб-страница.
В этом исследовании мы также обратили внимание на новые технологии типа Web Components. Web Components позволяет создавать теги с произвольными именами, однако в самом коде данного инструмента можно найти стандартные теги.
Будущее невозможно предсказать. Мы в силах только гадать, как среднестатистическая страница будет выглядеть через 10 лет. Когда мы проведем еще одно исследование, увидим ли мы рост технологии Web Components?
Автор: Catalin Rosu
Источник: //css-tricks.com/
Редакция: Команда webformyself.

JavaScript. Быстрый старт
Изучите основы JavaScript на практическом примере по созданию веб-приложения
Узнать подробнее