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

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

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

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

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

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

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

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

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

Новости

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

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

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

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

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

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

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

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

Закон Амдала


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

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


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

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

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

Время на прочтение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

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

Универсальный валидатор микроразметки в Яндекс.Вебмастере

Время на прочтение2 мин
Количество просмотров25K
В последнее время вебмастера используют семантическую микроразметку все чаще: по нашим данным, сейчас 10% страниц рунета размечены, и это число постоянно растет. А вслед за популярностью микроразметки растет и потребность вебмастеров в дополнительных ее видах. И не только тех, которые поддерживает Яндекс. Именно поэтому мы решили сделать валидатор микроразметки в Яндекс.Вебмастере универсальным. Для начала мы научили его проверять корректность всех типов разметки Schema.org и microdata.

Пример валидации разметки Product (Schema.org):валидатор микроразметки
Небольшая экскурсия в историю
Всего голосов 38: ↑34 и ↓4+30
Комментарии19

Много нового про семантическую разметку от Яндекса

Время на прочтение2 мин
Количество просмотров5.4K
Сегодня у Яндекса есть сразу несколько новостей из мира семантической разметки и передачи данных о сайтах.

Начнём с крупного. Яндекс вошёл в состав Schema.org Working Group и теперь участвует в разработке стандартов семантической разметки для всего мира. В Помощи теперь можно найти перевод оригинального руководства по началу использования семантической разметки Schema.org – Getting Started, с небольшими дополнениями.

Теперь о современном. Роботы Яндекс.Видео научились распознавать тег video спецификации HTML5. Теперь эта разметка учитывается наравне с остальными. Как и в случае со schema.org, данный тег позволяет отметить несколько видеороликов на странице.

Немного о вкусном. Мы начали поддерживать разметку Schema.org для рецептов. Владельцам кулинарных сайтов нужно просто разметить рецепты на своём ресурсе с помощью схемы Recipe (http://schema.org/Recipe), и их сниппеты в результатах поиска Яндекса автоматически станут такими же наглядными:



А также про hCard и вакансию в Яндексе
Всего голосов 65: ↑62 и ↓3+59
Комментарии19

До свидания, <time>

Время на прочтение2 мин
Количество просмотров1.4K
Редактор спецификаций HTML5 Йен Хиксон решил исключить из HTML5 элемент <time>. Тем, кто сейчас применяет <time>, а это такие сайты как Github, Reddit и WordPress (дефолтная тема WordPress с 2,6 млн инсталляций), и разработчикам браузера Opera, придётся поменять <time> на <data> или надеяться, что Хиксон передумает.
Читать дальше →
Всего голосов 39: ↑34 и ↓5+29
Комментарии17

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

Google начинает учитывать в выдаче мета-теги rel="author" и rel="me"

Время на прочтение2 мин
Количество просмотров9.8K
С 7 июня Google начал учитывать в поисковой выдаче авторский мета-тег HTML5 (rel="author") со ссылкой на личный профиль автора.

Written by <a rel="author" href="../authors/mattcutts">Matt Cutts</a>

По правилам использования авторских мета-тегов личная страница автора обязательно должна располагаться на том же домене, что и авторский текст. Для связывания страниц на разных доменах с одним автором используются взаимные ссылки с пометкой XFN (rel="me"). Если на Хабре стоит ссылка на личную страницу автора,

<a rel="me" href="http://mattcutts.com">Read more about Matt</a>

то на домене mattcutts.com должна быть обратная ссылка на Хабр:

Matt has also written <a rel="me" href="http://mattcutts.habrahabr.ru/blog/">lots of articles for the Habrahabr</a>.
Читать дальше →
Всего голосов 68: ↑64 и ↓4+60
Комментарии33

Twitter и Facebook тихо убрали RSS, полностью

Время на прочтение3 мин
Количество просмотров10K
В прошлом году я рассуждал, как Twitter становится всё более закрытым и менее ориентированным на веб-стандарты сервисом, когда они обновили дизайн, чтобы привлечь больше пользователей на сайт Twitter.com. Тогда они прибрали заметную RSS-иконку и сделали так, что увидеть RSS-фид можно было только полностью разлогинившись и зайдя в профиль определённого пользователя.

После прочтения моего поста, Исаак Хепворт (Isaac Hepworth), разработчик из компании Twitter, попытался успокоить меня, ответив на сообщение через Buzz:
Читать дальше →
Всего голосов 112: ↑96 и ↓16+80
Комментарии104

Валидатор микроразметки — новый инструмент в Яндекс.Вебмастере

Время на прочтение2 мин
Количество просмотров2.8K
В этом году много запусков и нововведений для вебмастеров было посвящено содержимому сайта и различным способам акцентировать это содержимое в результатах поиска Яндекса или в соответствующих поисковых сервисах (Яндекс.Авто, Яндекс.Недвижимость и др.). Данные о содержимом сайта можно передать различными способами. Одним из способов является разметка HTML-кода страницы микроформатами.

Для того чтобы облегчить владельцам сайтов работу с разметкой страниц микроформатами, в Яндекс.Вебмастере сегодня появился новый инструмент – валидатор микроразметки. С помощью него вы можете проверить, как наш поисковый робот видит и обрабатывает предложенную вами семантическую разметку страницы, а также выяснить, есть ли в коде разметки ошибки, которые могут помешать корректной обработке данных.

Сейчас мы поддерживаем четыре вида микроформатов:
  • hCard — формат разметки контактной информации (адресов, телефонов и т.д.);
  • hRecipe — формат для описания кулинарных рецептов;
  • hReview —  формат разметки отзывов;
  • hProduct —  формат разметки товаров; сейчас используется в партнерской программе «Отзывы об автомобилях» для разметки информации об автомобилях.
Также мы поддерживаем microdata – международный стандарт семантической разметки, позволяющий с помощью атрибутов описать смысл информации, содержащейся в HTML-коде страниц. Такие атрибуты позволяют роботам-обработчикам находить и извлекать нужные данные. В настоящий момент в Яндексе микроданные  используются для разметки словарных и энциклопедических статей, терминов и определений.Подробнее узнать о том, какие данные можно передать Яндексу, смотрите на странице «Передача данных о содержимом сайта». А о микроформатах и микроданных читайте в Помощи.

Также мы рассказывали о семантической разметке и использовании микроформатов на июльском Яндекс.Субботнике. Послушать выступление и посмотреть текст доклада вы можете здесь.
Всего голосов 54: ↑54 и ↓0+54
Комментарии21

OMF — микроформат для email. Опыт использования в сервисе чатов

Время на прочтение3 мин
Количество просмотров3.3K
imageСовсем недавно компания Mail.ru разработала открытый стандарт OMF.

Open Mail Format (OMF) — это открытый стандарт разметки почтовых уведомлений. OMF позволяет вам улучшить представление ваших писем в интерфейсе почты Mail.Ru, повышая их эффективность и конверсию.
Ознакомиться с опытом использования...
Всего голосов 70: ↑56 и ↓14+42
Комментарии47

Шпаргалка по микроформатам на русском

Время на прочтение1 мин
Количество просмотров1.7K
Предлагаю вашему вниманию шпаргалку по микроформатам собственного перевода.
Шпаргалку делал конкретно для себя, без подробного описания, но думаю по примерам должно быть понятно.
Рекомендую смотреть не в обычном блокноте, а в notepad++
В дополнение, включил пустой css с классами. Сам этим css не пользуюсь, но может кому-нибудь пригодиться.
Включает в себя:
  • rel, rev
  • XFN
  • hCard
  • hReview
  • xFolk
  • hAtom
  • hCalendar
  • hResume
  • hAudio

Скачать можно по этой ссылке www.site-creator.info/projects/mf.rar
P.S. Если кто найдет неточность, ошибку или переведет то что еще не переведено — буду только рад.
Материалы для этого, искать тут microformats.org
Всего голосов 51: ↑42 и ↓9+33
Комментарии30

Yahoo Search будет индексировать микроформаты

Время на прочтение1 мин
Количество просмотров1.2K
В качестве очередного шага на пути к созданию открытой поисковой платформы, компания Yahoo объявила о поддержке микроформатов и других семантических веб-стандартов. Таким образом, разработчики могут смело внедрять в HTML-код данные hCard, hCalendar, hReview, hAtom и XFN, а также создавать структурированные фиды на RDF и eRDF. Поисковый робот Yahoo будет корректно распознавать перечисленные микроформаты и добавлять информацию в общую базу.

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

Было:

Будет:

Читать дальше →
Всего голосов 29: ↑28 и ↓1+27
Комментарии23

Парсим микроформаты

Время на прочтение7 мин
Количество просмотров3.8K
Микроформаты — это способ внедрения специфических семантических данных в HTML, который мы используем сегодня. Первый вопрос, который задал бы гуру XML: «А зачем применять HTML, если XML позволяет создать ту же самую семантику?» Я не буду перечислять все причины, по которым XML был бы лучшим или худшим выбором для кодирования данных, или же почему микроформатами был выбран HTML в качестве базы. Эта статья будет сосредоточена на том, как работают базовые правила парсинга, и как они отличаются от XML-ных.
Читать дальше →
Всего голосов 28: ↑27 и ↓1+26
Комментарии13
1