Как стать автором
Обновить
0

Микроформаты *

Способ семантической разметки на веб-страницах

Сначала показывать
Порог рейтинга
Уровень сложности

Введение в микроразметку в Nuxt.js: как это работает

Уровень сложности Средний
Время на прочтение 9 мин
Количество просмотров 2.9K

Привет, Хабр! Меня зовут Павел, я JS-разработчик SimbirSoft. За три года работы во фронтенде я убедился, что микроразметка необходима для оптимизации и улучшения UX на сайте, и считаю ее важным инструментом при разработке. В целом микроразметка феномен распространённый. Но что мы знаем об использовании Server-Side Rendering (SSR)? Разберёмся по порядку.

Читать далее
Всего голосов 2: ↑2 и ↓0 +2
Комментарии 0

Новости

Смотрим любое кино мгновенно

Время на прочтение 2 мин
Количество просмотров 145K

После ареста серверов Moonwalk жить стало в разы труднее. Лично я уже совсем отвык от торрентов. Нужно что-то качать, ждать, чем-то открывать, куда-то кликать, иногда еще и место на диске кончается. Как можно ждать час пока скачается фильм? За час можно жизнь прожить. Пришлось искать решение, которое позволит смотреть кино также просто, как и раньше. Норматив: от идеи посмотреть что-нибудь до начала просмотра - не более минуты.

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

Читать далее
Всего голосов 94: ↑80 и ↓14 +66
Комментарии 266

Довольно непонятное решение в schema.org с LocalBusiness

Время на прочтение 1 мин
Количество просмотров 1.6K

Описание, для чего проект schema.org можно найти здесь — https://schema.org. На хабре это редкий гость, для него даже специального хаба не было.


Я знаю, что Яндекс пытался пользоваться schema.org… Они этой частью, видимо, не пользуются.


Отношения


https://schema.org/Library, https://schema.org/ExerciseGym — оба относят себя к https://schema.org/LocalBusiness.


LocalBusiness относит себя сразу к двум объектам (именно здесь и есть особенность schema.org): https://schema.org/Organization и https://schema.org/Place


Словари


https://www.oxfordlearnersdictionaries.com/definition/english/gym?q=Gym (один смысл — место, другой — организация)
https://dictionary.cambridge.org/us/dictionary/english/gym (один смысл использует неоднозначное слово "club", другой про место)


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

Всего голосов 15: ↑6 и ↓9 -3
Комментарии 4

Виды защитных технологий светодиодов LED экранов

Время на прочтение 7 мин
Количество просмотров 5.9K
Чем выше разрешение светодиодного экрана при малом физическом размере экрана – тем меньше становятся сами светодиоды и расстояние между ними. Отсюда вытекают технические сложности размещения светодиодов, способе их крепления, обеспечения защиты при транспортировке и эксплуатации. Статья посвящена разбору существующих технологий для защиты светодиодных LED экранов для внутреннего применения от внешних воздействий.


Читать дальше →
Всего голосов 2: ↑2 и ↓0 +2
Комментарии 0

Истории

Технологии производства светодиодных LED экранов: Micro-LED vs. Mini-LED

Время на прочтение 9 мин
Количество просмотров 17K
Изначально стояла задача разобраться, что из себя представляет Micro LED, а также Mini LED в области светодиодных экранов для внутреннего исполнения. Потому что на этом рынке происходит путаница из-за применения слов «micro, mini, nano» для экранов, созданных с использованием разных технологий. Заказчики в свою очередь бездумно повторяют эти пресловутые «микро», «мини» и «нано» в гонке за самым «крутым» экраном, не понимая, что эти приставки не более чем маркетинговый ход.


Читать дальше →
Всего голосов 12: ↑12 и ↓0 +12
Комментарии 11

Микробраузеры повсюду. Но что мы о них знаем?

Время на прочтение 8 мин
Количество просмотров 23K

Рис. 1. Превью одной и той же страницы в iMessage (слева), Hangouts и WhatsApp (справа)

Если упомянуть любой URL в твите, на Slack-канале, в Telegram или WhatsApp — ссылка развернётся в превью. Оно даёт примерное представление, как выглядит настоящая веб-страница.

Предварительный просмотр стал настолько обычным делом, что мы почти не обращаем внимания, как он работает. Но это мощнейшее средство привлечения новой аудитории. Возможно, оно даже важнее, чем поисковая оптимизация. К сожалению, большинство систем веб-аналитики не видят этот трафик и не могут показать, как микробраузеры взаимодействуют с вашим сайтом.

Вот основные факты о микробраузерах, которые должен знать каждый веб-разработчик.
Читать дальше →
Всего голосов 38: ↑38 и ↓0 +38
Комментарии 10

Protobuffers — это неправильно

Время на прочтение 10 мин
Количество просмотров 55K
Значительную часть своей профессиональной жизни я выступаю против использования Protocol Buffers. Они явно написаны любителями, невероятно узкоспециализированы, страдают от множества подводных камней, сложно компилируются и решают проблему, которой на самом деле нет ни у кого, кроме Google. Если бы эти проблемы протобуферов остались в карантине абстракций сериализации, то мои претензии на этом и закончились бы. Но, к сожалению, плохой дизайн Protobuffers настолько навязчив, что эти проблемы могут просочиться и в ваш код.

Узкая специализация и разработка любителями

Остановитесь. Закройте свой почтовый клиент, где уже написали мне полписьма о том, что «в Google работают лучшие в мире инженеры», что «их разработки по определению не могут быть созданы любителями». Не хочу этого слышать.

Давай просто не будем обсуждать эту тему. Полное раскрытие: мне доводилось работать в Google. Это было первое (но, к сожалению, не последнее) место, где я когда-либо использовал Protobuffers. Все проблемы, о которых я хочу поговорить, существуют в кодовой базе Google; это не просто «неправильное использование протобуферов» и тому подобная ерунда.
Читать дальше →
Всего голосов 33: ↑28 и ↓5 +23
Комментарии 32

Издержки согласования в коллективах

Время на прочтение 4 мин
Количество просмотров 8.5K
Это краткое отступление в текущей серии статей о том, как избегать введения сервисов для различных сущностей. Интересный разговор за ужином привёл к мыслям, которые я решил записать.

Закон Амдала


В 1967 году Джин Амдал представил довод против параллельных вычислений. Он утверждал, что рост производительности ограничен, поскольку только часть задачи поддаётся распараллеливанию. Размер остальной «последовательной части» отличается в разных задачах, но она есть всегда. Этот довод стал известен как закон Амдала.

Если построить график «ускорения» выполнения задачи в зависимости от количества выделенных ей параллельных процессоров, вы увидите следующее:


Это асимптотический график для фрагмента, который не поддаётся распараллеливанию («последовательная часть»), поэтому существует верхний предел максимального ускорения
Читать дальше →
Всего голосов 32: ↑32 и ↓0 +32
Комментарии 11

Пирамида тестов на практике

Время на прочтение 45 мин
Количество просмотров 250K
Об авторе: Хэм Фокке — разработчик и консультант ThoughtWorks в Германии. Устав от деплоя в три ночи, он добавил в свой инструментарий средства непрерывной доставки и тщательной автоматизации. Сейчас налаживает такие системы другим командам для обеспечения надёжной и эффективной поставки программного обеспечения. Так он экономит компаниям время, которое эти надоедливые людишки тратили на свои выходки.

«Пирамида тестов» — метафора, которая означает группировку тестов программного обеспечения по разным уровням детализации. Она также даёт представление, сколько тестов должно быть в каждой из этих групп. Несмотря на то, что концепция тестовой пирамиды существует довольно давно, многие команды разработчиков по-прежнему пытаются неправильно реализовать её на практике должным образом. В этой статье рассматривается первоначальная концепция тестовой пирамиды и показано, как её воплотить в жизнь. Она показывает, какие виды тестов следует искать на разных уровнях пирамиды, и даёт практические примеры, как их можно реализовать.

Содержание

Примечания

Читать дальше →
Всего голосов 14: ↑14 и ↓0 +14
Комментарии 4

WRIO Internet OS. Архитектура: Linked Data и JSON-LD

Время на прочтение 8 мин
Количество просмотров 3.8K
По итогам опроса в “WRIO Internet OS. Введение”, это первый пост в серии призванной раскрыть технические детали. Информация сможет заинтересовать разработчиков желающих использовать в своих проектах следующие технологии: JSON-LD, блокчеин, Node.js и React. В конце поста вы найдете опрос, который позволит нам узнать, какая следующая тема была бы полезной и интересной для хабросообщества.

Вводное видео о проекте:
www.youtube.com/watch?v=JUiMijJ6tEg English version
www.youtube.com/watch?v=DxA6t2kax_k Русская версия

Сегодняшняя тема: Linked Data и JSON-LD. На примере своего опыта мы расскажем чем данный формат интересен и какие преимущества он предоставляет.
Читать дальше →
Всего голосов 5: ↑5 и ↓0 +5
Комментарии 2

Опрос: насколько строго вы следуете стандартам и лучшим практикам на фронтенде?

Время на прочтение 1 мин
Количество просмотров 12K
Как-то так получилось, что за последнюю неделю я посмотрел довольно большое количество выступлений на разных крупных и не очень конференциях. И часто там говорили об очень важных, в теории, вещах: производительности, доступности, прогрессивном улучшении.
Но, судя по моему опыту и ощущениям, на практике никто этим не занимается, кроме самых крупных компаний. Эти ощущения подтверждает, например, подкаст Веб-стандартов: там при обсуждении каких-то технологий или практик, постоянно звучат слова "мы это у себя не используем", "только если заказчик пнёт".
Я бы хотел проверить, так ли это, проведя небольшой опрос. Думаю, результаты будут интересны многим, приглашаю обсудить вопросы, ответы и вообще эту тему в целом в комментариях.
P.S. Я в опросе довольно вольно использую термин "стандарты". Понятно, что для некоторых вещей стандартов нет, но придумывать какое-то альтернативное название не вижу смысла.
14 вопросов
Всего голосов 19: ↑16 и ↓3 +13
Комментарии 29

API для валидатора от Яндекса. А также почему валидаторы микроразметки выдают разные ответы?

Время на прочтение 7 мин
Количество просмотров 16K
Некоторое время назад мы выпустили API для своего валидатора микроразметки. И сегодня я хочу поговорить как об API, так и вообще о валидаторах. Чтобы, например, понять, почему результаты разных валидаторов различаются.

Валидаторы бывают разных типов и разрабатываются для разных целей. В общем их можно разделить на два типа: универсальные и специализированные. Универсальные – наш валидатор, Structured data testing tool от Google, Validator.nu, Structured Data Linter, Markup Validator от Bing – проверяют сразу несколько стандартов разметки. При этом валидаторы от поисковых систем проверяют разметку еще и на соответствие документации к своим продуктам на ее основе. Специализированные валидаторы, такие как JSON-LD Playground, Open Graph Object Debugger, – это инструменты от разработчиков самих стандартов. С помощью Open Graph Object Debugger можно проверить правильность разметки Open Graph, а JSON-LD Playground показывает, как разметка JSON-LD будет разбираться роботами.



Мы взяли разные примеры разметки и сравнили ответы этих валидаторов, чтобы найти лучший.
Читать дальше →
Всего голосов 40: ↑35 и ↓5 +30
Комментарии 3

Не только Яндексу. Микроразметка на крупнейших сайтах рунета: зачем ею пользуются и почему она пригодится и вам

Время на прочтение 12 мин
Количество просмотров 107K
Мы уже рассказали вам о мире семантической разметки — о том, какие бывают словари, почему столько стандартов синтаксиса, а также разобрали, в каких продуктах она используется.

Теперь мы решили показать, как микроразметка участвует в жизни существующих сайтов: сделали обзор всех возможностей, которые она дает интернет-магазинам, сайтам СМИ и видеохостингам, и узнали, насколько они пользуются спросом у крупнейших проектов рунета.



Люди, которые отвечают за разработку и всю техническую часть таких сайтов, как Holodilnik.ru, Ozon.ru, Lenta.ru, Interfax.ru и Ivi.ru, ответили на вопросы о том, как на практике происходит внедрение микроразметки и каких результатов она позволяет добиться. А мы со своей стороны рассказали, какие типы мы бы порекомендовали таким сайтам и для чего.

Читать дальше →
Всего голосов 53: ↑49 и ↓4 +45
Комментарии 9

Ближайшие события

Московский туристический хакатон
Дата 23 марта – 7 апреля
Место
Москва Онлайн

rawdog — агрегатор RSS без завышенных запросов

Время на прочтение 5 мин
Количество просмотров 7.9K

Лирическое вступление


В связи с недавним отпочкованием от Хабрахабра нового ресурса, у меня возникла нужда обустроить удобный способ чтения обоих ресурсов. Первая мысль, разумеется, была об RSS, благо движок у обоих сайтов его поддерживает. Оставались сущие пустяки — найти хороший RSS-агрегатор, который можно было бы установить на малосильную VPS (поскольку участь Google Reader'а несколько охладила желание полагаться на сторонний сервис).
Читать дальше →
Всего голосов 10: ↑9 и ↓1 +8
Комментарии 10

Зачем на самом деле используют микроразметку. Обзор от Яндекса

Время на прочтение 8 мин
Количество просмотров 43K
Мы уже писали о том, как устроен мир семантической разметки и почему стандартов синтаксиса так много. Теперь хотим рассказать, зачем все это нужно. Зачем разработано столько стандартов и где они используются. Почему всем это полезно знать?

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



Поисковые системы стремятся к улучшению выдачи: разрабатывают колдунщики, запускают партнерские программы, собирают «базы знаний». Большая часть этих задач решается с помощью разметки. Сайты могут получить красивый сниппет, передать данные для Яндекс.Островов, а «базы знаний», которые есть почти у всех поисковых систем (Google Knowledge Graph, Bing Satori, Яндекс Entity Search), получают свежие данные.

Facebook был заинтересован в развитии индустрии приложений, поэтому дал разработчикам возможность продвигать свои проекты в социальных сетях и связываться с другими приложениями. Так — тоже с помощью разметки — Open Graph публикует записи приложений в социальных сетях, а Applinks позволяет приложениям легко ссылаться друг на друга. Позже публиковать свои записи стало возможно и в Google+.

Читайте дальше и узнайте подробнее, как перечисленные ниже задачи решаются с помощью семантической разметки в разных продуктах и сервисах:
  • Улучшение выдачи в поисковиках: сниппеты в Яндексе, Google, Bing и Yahoo!
  • Пополнение Баз знаний: Яндекс Entity Search, Google Knowledge Graph, Bing Satori.
  • Другие варианты использования: приложения, глубокие ссылки и почта.
Читать дальше →
Всего голосов 68: ↑61 и ↓7 +54
Комментарии 15

Элемент HTML <time>

Время на прочтение 4 мин
Количество просмотров 61K
Элемент <time> представляет собой дату, время или период времени, представленные в машинночитаемом формате. Он может быть полезен для создания расписаний, архивов или других функций, связанных со временем. WordPress использует этот элемент в базовой теме оформления. Ещё один пример использования <time> — Reddit:

image

Краткая история


Жизненный путь этого элемента был нелёгким. Его добавили в спецификацию HTML5 в 2009 году. Два года спустя, в 2011, его убрали и заменили на гораздо более широкий <data>. Однако в этом же году его вернули и добавили новых возможностей. Сейчас его можно уверенно использовать.

Ситуацию хорошо описал Брюс Лоусон (убрали, вернули, текущее положение дел). [Та же история на Хабре: убрали, вернули]. Классический пример того, как реакция сообщества разработчиков влияет на развитие HTML.
Читать дальше →
Всего голосов 68: ↑66 и ↓2 +64
Комментарии 33

Как устроен мир семантической микроразметки

Время на прочтение 13 мин
Количество просмотров 154K
Я работаю в команде семантического веба в Яндексе. Мы занимаемся тем, что создаем продукты на основе семантической разметки, делаем свои расширения и участвуем в развитии стандарта Schema.org.

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



Под микроразметкой (или семантической разметкой) мы подразумеваем разметку страницы с дополнительными тегами и атрибутами в тегах, которые указывают поисковым роботам на то, о чем написано на странице.

Микроразметка состоит из словаря и синтаксиса.
Что и как, подробно...
Всего голосов 109: ↑100 и ↓9 +91
Комментарии 69

Реестр стационарных объектов наблюдения (комплексы ФВФ)

Время на прочтение 2 мин
Количество просмотров 8.8K
image

Для жителей Москвы на сайте www.data.mos.ru есть официальный список камер фото и видео регистрации ПДД. На вкладке «Для разработчиков» находится описание полей. Всю базу можно выгрузить в формате CVS.

www.data.mos.ru/datasets/621_reestr_statsionarnyh_obektov_nablyudeniya_kompleksy_fvf

На портале «Открытые данные» опубликована информация о 600 с лишним стационарных комплексах фото и видео фиксации нарушений ПДД, установленных на дорогах столицы. Данные доступны в виде таблицы, по которой автовладельцы смогут проверить свой обычный маршрут, а также доступны для выгрузки в формате CVS, который могут использовать разработчики для создания приложений, например, предупреждающих водителя о необходимости снизить скорость на определенном участке дороги (эдакие самописные радар-детекторы).
Читать дальше →
Всего голосов 23: ↑23 и ↓0 +23
Комментарии 5

Google выложила руководства для начинающих SEO-оптимизаторов

Время на прочтение 1 мин
Количество просмотров 73K
В блоге для веб-мастеров инженеры Google подготовили и выложили два руководства разной степени сложности для тех, кто еще не знаком с базовыми методами оптимизации под поисковую машину Google.

Надо сразу сказать, что первое руководство действительно для новичков — профессионалы вряд ли обнаружат там нечто секретное и таинственное. Любопытно только то, что в Google не поленились и подготовили соответствующий одностраничный PDF-документ сразу в 13 языковых редакциях, включая и русский (английская версия). При этом документ (А4) выглядит визуально привлекательно и информативно, так что его можно распечатать и повесить в офисе, если вдруг возникнет необходимость в напоминании банальностей.

Второй документ более серьезного уровня и уже только на английском языке. Он довольно подробно и с примерами описывает различные «best practices» вроде создания уникальных заголовков веб-страниц, заполнения мета-тегов или улучшения структуры URL. Забрать документ можно отсюда.
Источник
Всего голосов 68: ↑59 и ↓9 +50
Комментарии 28

Как и для чего мы сделали свой валидатор микроразметки

Время на прочтение 9 мин
Количество просмотров 43K
Недавно мы писали о нашем валидаторе семантической разметки. А сегодня хотим рассказать, зачем и почему он был сделан, какие сложности возникли при разработке и как мы с ними справились. Одна из причин, по которой мы его сделали, конечно, в том, что мы хотели избавить роботов от встреч с ошибками вебмастеров. Но руководствовались мы не только этим.

Реакция роботов на ошибки в микроразметке

Медленно, но верно семантическая разметка набирает популярность. Чуть больше десяти лет назад (в мае 2001 года) впервые был введен термин «семантическая паутина». В 2004 году появилось первое упоминание формата RDFa, примерно тогда же начали развиваться микроформаты. В июне 2011 года был запущен стандарт schema.org. Сейчас семантическую микроразметку поддерживают и Яндекс, и другие ведущие мировые поисковые системы.

Однако вебмастера часто сталкиваются с тем, что валидаторы HTML выдают массу ошибок.
Читать дальше →
Всего голосов 47: ↑43 и ↓4 +39
Комментарии 15

Вклад авторов