Цифровой элемент
Оставить заявку

Сайт использует файлы cookie для удобства работы, аналитики и рекламы. Нажимая «Принять» или продолжая пользоваться d-element.ru, вы соглашаетесь с нашей Политикой конфиденциальности и обработкой персональных данных (включая файлы cookie).

SEO проектирование

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

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

...
Продвижение сайтов
right-dots

Ответим на вопросы по SEO-проектированию в течение дня

Зачем нужно SEO-проектирование?

Определите и внедрите на этапе разработки сайта конкурентные решения, которые позволять достигнуть и обойти конкурентов в ТОПе поисковых систем.

Цель работы — продумать структуру сайта, содержание и отображение контента.

Результаты исследования используют проектировщики и дизайнеры при разработке UI/UX всех страниц. ТЗ на разработку сайта пишется с учетом этих рекомендаций.

Возможности предпроектной аналитики:

  • узнать до создания веб-сайта эффективную стратегию продвижения, чтобы учесть все работы на этапе разработки;
  • получить рекомендации по реализации структуры сайта в соответствии с текущим спросом в поисковых системах;
  • узнать сводку данных (видимость, релевантность, позиции) текущих конкурентов в поиске;
  • узнать текущие технические, поисковые, юзабилити проблемы веб-сайта;
  • получить эффективный план работ с прогнозируемым результатом (и это действительно работает!).

Что входит в предпроектное исследование?

Состав предпроектного исследования

    АУДИТ

    Комплексный аудит — это подробный анализ вашего сайта.

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

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

    Подробнее о аудите.

    АУДИТ
    АНАЛИЗ СПРОСА

    Анализ спроса — это сбор слов или фраз, которые формируют спрос на услуги, товары или любую другую деятельность в поисковых системах. Семантическое ядро подбирается на основании бизнеса — не только по услугам, но и по принципу подхода к оказанию этих услуг.

    Семантическое ядро – фундамент будущей структуры сайта.

    В результате заказчик получает рекомендации по структуре и готовую группировку запросов по страницам.

    Подробнее о подборе запросов.

    АНАЛИЗ СПРОСА
    АНАЛИЗ КОНКУРЕНТОВ

    Анализ конкурентов — подробная аналитика ваших конкурентов в поисковых системах. Анализируем решения конкурентов как с поисковой, так и с пользовательской точки зрения.

    Вы получаете подробный отчет о запросах, позициях и стратегиях ваших конкурентов.

    Подробнее о анализе конкурентов.

    АНАЛИЗ КОНКУРЕНТОВ
    СТРАТЕГИЯ

    Формируем эффективную стратегию и подготавливаем общие и частные рекомендации по развитию вашего бизнеса в интернете.

    Подготавливается комплексный план работ с учетом конкурентов, текущего спроса и состояния веб-сайта.

    СТРАТЕГИЯ

    Оставьте заявку на консультацию, мы ответим вам в течение дня

    Часто задаваемые вопросы

    Сколько стоит?

    Стоимость предпроектного исследования рассчитывается индивидуально под каждый проект. В расчете принимаются факторы: тематика, конкурентность, тип текущего сайта. В среднем, стоимость предпроектного находится в районе 70 тыс руб.

    Сколько времени выполняется анализ?

    Проектное исследование выполняется до 2 месяцев.

    Что получает клиент?

    Заказчик получает список текущих проблем текущего сайта (если он есть), сводку конкурентов и список изменений, которые рекомендуется учесть при разработке/доработке сайта. Также заказчик получает модернизированное ТЗ на разработку сайта с учетом всех описанных рекомендаций по содержанию и отображению. Если материалы предпроектного представляют анализ текущего сайта без разработки нового, то составляется план работ на 6-12 месяцев минимум.

    Где можно увидеть пример результата работ?

    К сожалению, материалы предпроектного исследования часто являются частью NDA. Но мы можем рассказать, каких результатов добились наши клиенты после внедрения всех рекомендаций нашего SEO-отдела. Смотрите наши кейсы по SEO.

    Рейтинги

    Рейтинг по разработке сайтов
    Рейтинг по разработке сайтов
    в среднем ценовом сегменте «Рейтинг Рунета»
    Рейтинг digital-агентств
    Рейтинг digital-агентств
    работающих с крупнейшими компаниями
    за 2021 год «Рейтинга Рунета»
    Рейтинг по поддержке и развитию сайтов
    Рейтинг по поддержке и развитию сайтов
    работающих с крупнейшими компаниями
    и корпораций за 2021 год «Рейтинга Рунета»
    Рейтинг SEO-компаний
    Рейтинг SEO-компаний
    лучшие компании по продвижению сайтов
    за 2021 год «Рейтинга Рунета»
    Лидер по качеству
    Лидер по качеству
    аттестованных разработчиков «1С-Битрикса»
    Лидер по оценке клиентов
    Лидер по оценке клиентов
    качество проектов на «1С-Битрикс»

    Отзывы

    Цифровой элемент
    Россия, Челябинская область, Челябинск, ул. Энтузиастов, 2, оф. 200
    АО «НСИС» выражает искреннюю благодарность компании «Цифровой элемент» за успешное сотрудничество и профессиональный подход к реализации проекта по разработке и доработке функциональности информационного технологического портала в сфере страхования. Благодаря высокому уровню экспертизы, оперативности и ответственности на всех этапах работы был создан современный, удобный и технологичный портал nsis.ru, предоставляющий пользователям широкий спектр услуг, включая универсальный децентрализованный личный кабинет с персонализированным контентом.
    Акционерное Общество «Национальная Страховая Информационная Система» (АО «НСИС»)
    Цифровой элемент
    Россия, Челябинская область, Челябинск, ул. Энтузиастов, 2, оф. 200
    «Центр здоровья НЛМК» выражает свою благодарность за качественное выполнение работ по модернизации официального сайта нашей компании. Стоит отметить, что эффективная организация рабочего процесса, профессионализм команды и гибкость в разрешении нестандартной ситуаций, способность решать сложные задачи в сжатые сроки обеспечили своевременное выполнение всех задач по проекту.
    Ассоциация «Новолипецкий медицинский центр»
    Цифровой элемент
    Россия, Челябинская область, Челябинск, ул. Энтузиастов, 2, оф. 200
    АО «Страховое общество газовой промышленности» благодарит команду ООО «Цифровой Элемент» за успешное выполнение проекта по разработке онлайн сервиса подачи и урегулирования претензий в личном кабинете АО «СОГАЗ». Мы ценим оперативность и качество выполнения задач в рамках технического задания и условий договора. Специалисты вашей компании продемонстрировали высокий профессионализм и компетентность при решении поставленных целей.
    АО «Страховое общество газовой промышленности»
    Цифровой элемент
    Россия, Челябинская область, Челябинск, ул. Энтузиастов, 2, оф. 200
    ООО «АЛСО» выражает благодарность за разработку сайта alsoarm.ru. Ваша команда проявила высокий профессионализм, создав современное и технологичное решение, которое полностью отвечает нашим бизнес-задачам. Особенно отметим качественную организацию проекта и работу менеджера Евгения Мешкова, благодаря которому все этапы были выполнены четко и в срок. Мы ценим сложившееся партнерство и рассчитываем на дальнейшее сотрудничество.
    Завод стальных шаровых кранов ООО «АЛСО»

    Дополнительные услуги по SEO

    Аудит сайта
    Аудит сайта

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

    Подробнее
    Подбор запросов
    Подбор запросов

    Подберем ключевые фразы на основании анализа специфики работы вашей компании и предложений конкурентов.

    Подробнее
    Базовая оптимизация
    Базовая оптимизация

    Базовое SEO — это техническая и поисковая оптимизация сайта, в которой устраняются первичные проблемы SEO. Базовая оптимизация подойдет для бизнеса, которому не требуется полноценное SEO.

    Подробнее
    Анализ конкурентов
    Анализ конкурентов
    Подбор и анализ конкурентов в поиске Яндекс и Google. Вы получите максимум информации о стратегиях, структуре и походе конкурентов для оптимизации сайта.
    Подробнее

    Услуги по SEO продвижению

    Продвижение по позициям
    Продвижение по позициям

    Подбираем запросы и оптимизируем сайт под них. Оплата зависит от попадание сайта в ТОП-10 из списка собранных запросов.

    Подробнее
    Продвижение по трафику
    Продвижение по трафику

    Привлечем на сайт посетителей, заинтересованных конкретным товаром или услугой. Оплата зависит от привлеченного трафика из поисковых систем.

    Подробнее
    Комплексное продвижение
    Комплексное продвижение

    Комплексное продвижение включает работу над тремя направлениями: позиции, трафик, конверсия. Независимо от выбранного вами региона.

    Подробнее
    Не знаете что выбрать?
    Звоните по телефону или пишите через форму обратной связи
    8-800-555-85-89

    Читайте в нашем блоге

    Читайте в нашем блоге

    Микроразметка schema.org
    МАРКЕТИНГ
    28.05.2019
    Микроразметка schema.org

    Schema.org – микроразметка, позволяющая структурировать данные на сайте для поисковых систем. С ее помощью поисковые системы понимают, какие данные взять для показа расширенного сниппета. Сниппет – это краткая информация, которая показывается в поисковой выдаче. Для расширенного сниппета используются данные, размеченные микроразметкой. Пример сайта без микроразметки Schema.org: Сайт с микроразметкой: Так видит размеченные данные поисковой робот Микроразметка Shema.org внедряется на уровне HTML кода. Ознакомиться с полным описанием микроразметки schema.org можно на официальном сайте. Зачем нужна микроразметка Schema.org Структура данных schema.org нужна для SEO оптимизации. Результат после ее добавления вы можете не увидеть, но в выдаче поисковой системы сайт будет выглядеть лучше, что напрямую влияет на поведение пользователей. А еще, при поиске определенного товара по ключевым запросам, Яндекс или Google может предложить ваш товар на своих площадках и сервисах с указанием свойств, которые вы разметили. Какие данные можно разметить с помощью schema.org Schema.org включает в себя большой набор объектов и их свойств. Сейчас их уже больше сотни. Микроразметкой Schema.org можно разметить: Шапку сайта (WPHeader) Меню (SiteNavigationElement) Хлебные крошки (Breadcrumbs) Адреса и организации (Organization и LocalBusiness) Список товаров (Products list) Карточку товара (Product → Offer) Карточку услуги (Product → AggregateOffer) Список статей блога (Blog) Статью блога (Article, NewsArticle и BlogPosting) Научная работа (CreativeWork) Фильм (Movie) Рецепт (Recipe) Изображение (Painting) Картинка (ImageObject) Видео (VideoObject) Событие (Event) Вопрос-ответ (Question) Отзывы (Reviews) Рейтинг (AggregateRating) Поиск сайта (SearchAction) Футер сайта (WPFooter) Типы разметки данных Schema.org Любое свойство разметить по-разному. Например, название товара можно разными способами: <meta itemprop="name" content="название товара" /> <div itemprop="name">название товара</div> <div itemprop="name"><h1>название товара</h1></div> Ссылку на товар можно описать способами: <a itemprop="url" href="ссылка"></a> <meta itemprop="url" content="ссылка" /> <link itemprop="url" href="ссылка" /> Способ разметки свойств зависит от преследуемых целей и задач. Некоторые интернет-магазины используют скрытую микроразметку с помощью тегов <meta> или <link>, которые изначально не видны, но доступны для просмотра через исходный код страницы. Как правильно разметить шапку сайта (Schema.org WPHeader) Допустим, у нас есть такая шапка: <head> <title>название_страницы</title>> <meta name="description" content="описание_сайта"> <meta name="keywords" content="ключевые_слова_тематики_сайта"> … </head> Шапка с микроразметкой: <head itemscope itemtype="http://schema.org/WPHeader"> <title itemprop="headline">название_страницы</title> <meta itemprop="description" name="description" content="описание_страницы"> <meta itemprop="keywords" name="keywords" content="ключевые_слова_для_страницы"> … </head> Для WPHeader предусмотрено множество свойств. Ознакомиться c ними и добавить их вы сможете самостоятельно, просмотрев страницу о объекте. Примеры разметки меню (SiteNavigationElement) Главное меню без разметки: <ul> <li> <a href="ссылка">название_пункта_меню_1</a> </li> <li> <a href="ссылка">название_пункта_меню_2</a> </li> <li> <a href="ссылка">название_пункта_меню_3</a> </li> <li> <a href="ссылка">название_пункта_меню_4</a> </li> <li> <a href="ссылка">название_пункта_меню_5</a> </li> <li> <a href="ссылка">название_пункта_меню_6</a> </li> </ul> Главное меню с микроразметкой: <ul itemscope itemtype="http://schema.org/SiteNavigationElement"> <li> <a itemprop="url" href="ссылка">название_пункта_меню_1</a> </li> <li> <a itemprop="url" href="ссылка">название_пункта_меню_2</a> </li> <li> <a itemprop="url" href="ссылка">название_пункта_меню_3</a> </li> <li> <a itemprop="url" href="ссылка">название_пункта_меню_4</a> </li> <li> <a itemprop="url" href="ссылка">название_пункта_меню_5</a> </li> <li> <a itemprop="url" href="ссылка">название_пункта_меню_6</a> </li> </ul> Пример разметки хлебных крошек (Breadcrumbs) Хлебные крошки без микроразметки: <ul> <li> <a href="ссылка"> <span>название_1_пункта</span> </a> </li> <li> <a href="ссылка"> <span>название_1_пункта</span> </a> </li> <li> <a href="ссылка"> <span>название_1_пункта</span> </a> </li> … </ul> Хлебные крошки c микроразметкой: <ul itemscope itemtype="http://schema.org/BreadcrumbList"> <li itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem"> <a itemprop="item" href="ссылка"> <span itemprop="name">название_1_пункта </span> </a> <meta itemprop="position" content="1" /> </li> <li itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem"> <a itemprop="item" href="ссылка" > <span itemprop="name">название_2_пункта</span> </a> <meta itemprop="position" content="2" /> </li> <li itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem"> <a itemprop="item" href="ссылка"> <span itemprop="name">название_3_пункта</span> </a> <meta itemprop="position" content="3" /> </li> … </ul> Другие примеры можно посмотреть на официальном сайте schema.org. Как разметить последний элемент хлебных крошек (breadcrumbs) Последний элемент размечать нужно ссылкой, через тег <a> без атрибута href: <li itemprop="itemListElement" itemscope="" itemtype="http://schema.org/ListItem"> <a itemprop="item"> <span itemprop="name">название_последнего_пункта</span> </a> <meta itemprop="position" content="4"> </li> В официальном ответе тех поддержки Google одни эксперты говорят, что размечать последний элемент не нужно, другие эксперты советуют разметить все же нециклической ссылкой , но на практике получается, что не размеченный элемент не учитывается в поисковой выдаче. И это факт. Пример разметки организации (Organization и LocalBusiness) Объект Organization – более крупная организация, частью которой является объект LocalBusiness, если есть. Пример Organization – школа, НПО, корпорация. и др. Объект LocalBusiness – филиал объекта Organization. Обычно LocalBusiness – это ресторан, ресторан сети ресторанов, филиал банка, клуб, боулинг и др. Рекомендуем размечать юр. адрес типом Organization, остальные филиалы – через LocalBusiness. Объекты не должны быть вложены в друг друга (!), как может показаться изначально. Организация без микроразметки (Organization): <div> <div>название_компании</div> <div><img src="ссылка_на_логотип" /></div> <div>почтовый_индекс, Страна, Область, Город, улица, номер дома</div> <div>Телефон: <a href="tel:+79999999999">+7 (999) 999-99-99</a></div> <div>Почта: <a href="mailto:email@email.ru">email@email.ru</a></div> <div>Факс: <a href="tel:+79999999999">+7 (999) 999-99-99</a></div> </div> Организация с микроразметкой (Organization): <div itemscope itemtype="http://schema.org/Organization"> <div itemprop="name">название_компании</div> <link itemprop="url" href="ссылка_на_сайт"> <div itemprop="address" itemscope itemtype="https://schema.org/PostalAddress"> <span itemprop="postalCode">почтовый_индекс</span>, <span itemprop="addressCountry">Страна</span>, <span itemprop="addressRegion">Область</span>, <span itemprop="addressLocality">Город</span>, <span itemprop="streetAddress">улица, номер_дома</span> </div> <div>Телефон: <a itemprop="telephone" href="tel:+79999999999">+7 (999) 999-99-99</a></div> <div>Почта: <a itemprop="email" href="mailto:email@email.ru">email@email.ru</a></div> <div>Факс: <a itemprop="faxNumber" href="tel:+79999999999">+7 (999) 999-99-99</a></div> </div> Филиал без микроразметки (LocalBusiness): <div> <span>ООО «Цифровой элемент»</span> <div>454000, Челябинск, ул. Энгельса, д.2, оф. 200</div> <span>8 (800) 555–85–89</span> <span>info@d-element.ru</span> <time>Пн-Пт, 9:00 – 18:00</time> </div> Филиал с микроразметкой (LocalBusiness): <div itemscope itemtype="http://schema.org/LocalBusiness"> <span itemprop="name">ООО «Цифровой элемент»</span> <span itemprop="address" itemscope itemtype="http://schema.org/PostalAddress"> <meta itemprop="streetAddress" content="ул. Энгельса, д.2, оф. 200"> <meta itemprop="postalCode" content="454000"> <meta itemprop="addressLocality" content="Челябинск"> </span> <span itemprop="telephone">8 (800) 555–85–89</span> <span itemprop="email">info@d-element.ru</span> <time itemprop="openingHours" datetime="Mo-Fr, 9:00−18:00">Пн-Пт, 9:00 – 18:00</time> <img itemprop="image" src="ссылка на изображение филиала" /> </div> Какие поля обязательные, как учитывает адреса и организации Яндекс можно посмотреть на официальном сайте Яндекса. Пример разметки списка товаров (Products list) Список товаров без микроразметки: <ul> <li> <a href="ссылка_на_товар"> <img src="ссылка_на_изображение_товара"> <div>название_товара</div> <div> <span>47280</span> <span>руб.</span> </div> <div>Бренд</div> <div>Модель</div> </a> </li> <li> <a href="ссылка_на_товар"> <img src="ссылка_на_изображение_товара"> <div>название_товара</div> <div> <span>47280</span> <span>руб.</span> </div> <div>Бренд</div> <div>Модель</div> </a> </li> <li> <a href="ссылка_на_товар"> <img src="ссылка_на_изображение_товара"> <div>название_товара</div> <div> <span>47280</span> <span>руб.</span> </div> <div>Бренд</div> <div>Модель</div> </a> </li> </ul> Список товаров с микроразметкой: <ul itemscope itemtype="http://schema.org/ItemList"> <li itemscope itemprop="itemListElement" itemtype="http://schema.org/Product"> <a itemprop="url" href="ссылка_на_товар_1"> <img itemprop="image" src="ссылка_на_изображение_товара"> <meta itemprop="description" content="описание_товара"> <div itemprop="name">название_товара</div> <div itemscope itemprop="offers" itemtype="http://schema.org/Offer"> <div><span itemprop="price">47280</span> руб.</div> <meta itemprop="priceCurrency" content="RUB"> <meta itemprop="availability" content="http://schema.org/InStock" /> </div> <div itemprop="brand">Бренд</div> <div itemprop="model">Модель</div> </a> </li> <li itemscope itemprop="itemListElement" itemtype="http://schema.org/Product"> <a itemprop="url" href="ссылка_на_товар_2"> <img itemprop="image" src="ссылка_на_изображение_товара"> <meta itemprop="description" content="описание_товара"> <div itemprop="name">название_товара</div> <div itemscope itemprop="offers" itemtype="http://schema.org/Offer"> <div><span itemprop="price">47280</span> руб.</div> <meta itemprop="priceCurrency" content="RUB" /> <meta itemprop="availability" content="http://schema.org/InStock" /> </div> <div itemprop="brand">Бренд</div> <div itemprop="model">Модель</div> </a> </li> <li itemscope itemprop="itemListElement" itemtype="http://schema.org/Product"> <a itemprop="url" href="ссылка_на_товар_3"> <img itemprop="image" src="ссылка_на_изображение_товара"> <meta itemprop="description" content="описание_товара"> <div itemprop="name">название_товара</div> <div itemscope itemprop="offers" itemtype="http://schema.org/Offer"> <div><span itemprop="price">47280</span> руб.</div> <meta itemprop="priceCurrency" content="RUB" /> <meta itemprop="availability" content="http://schema.org/InStock" /> </div> <div itemprop="brand">Бренд</div> <div itemprop="model">Модель</div> </a> </li> </ul> Рекомендуем указывать только основную информацию о товаре. По желанию, можно вставить свойство отзывов, рейтинг для списка товаров. Для Google не допускается разметка списка товаров при наличии детальной страницы (написано в документации). Поэтому, размечайте список только если ссылка на отдельную страницу товара отсутствует. Если детальная страница товара есть, размечайте только её. Пример разметки товара (Product → Offer) Товар без микроразметки: <div> <h1>наименование_товара</h1> <a href="ссылка-на-увеличенное-изображение.jpg"> <img src="ссылка_на_изображение_товара" /> </a> <div> <div>В наличии</div> </div> <div>Описание товара</div> </div> Товар с микроразметкой: <div itemscope itemtype="http://schema.org/Product"> <h1 itemprop="name">наименование_товара</h1> <a href="ссылка-на-увеличенное-изображение.jpg"> <img itemprop="image" src="ссылка_на_изображение_товара" /> </a> <div itemprop="offers" itemscope itemtype="http://schema.org/Offer"> <meta itemprop="price" content="690.00"> <meta itemprop="priceCurrency" content="RUB"> <link itemprop="availability" href="http://schema.org/InStock"> <div>В наличии</div> </div> <div itemprop="description">описание_товара</div> </div> Пример подробной микроразметки товаров: <div itemscope itemtype="http://schema.org/Product"> <span itemprop="name">Наименование_товара</span> <a href="ссылка-на-изображение.jpg"><img src="ссылка_на_изображение.jpg" itemprop="image" /></a> <div itemprop="aggregateRating" itemscope itemtype="http://schema.org/AggregateRating"> <span itemprop="ratingValue">4</span> <span itemprop="reviewCount">9</span> //рейтинг 4 основан на 9 оценках </div> <div itemprop="description">Описание_товара</div> <div>Производитель: <span itemprop="brand">название_бренда</span></div> <div>Модель: <span itemprop="model">номер_модели</span></div> <div>Остаток на складе: <span itemprop="sku">4</span></div> <div itemprop="offers" itemscope itemtype="http://schema.org/Offer"> <span itemprop="priceCurrency" content="RUB">руб.</span> <span itemprop="price">699</span> <span><link itemprop="availability" href="http://schema.org/InStock"/>В наличии</span> <meta itemprop="priceValidUntil" content="2013-09-14T21:30"> <div itemprop="review" itemscope itemtype="http://schema.org/Review"> <span itemprop="name">Заголовок отзыва</span> от <span itemprop="author">Имя пользователя</span>, <meta itemprop="datePublished" content="2013-09-14"> <div itemprop="reviewRating" itemscope itemtype="http://schema.org/Rating"> <meta itemprop="worstRating" content="1"> //Минимальная оценка <span itemprop="ratingValue">4</span> //Оценка пользователя <span itemprop="bestRating">5</span>звезд. //Максимальная оценка <span itemprop="description">текст_отзыва</span> </div> </div> </div> Каждый товар имеет свои особенности: где-то отсутствуют отзывы или нет названия бренда и т.д. Поэтому не всегда удается разметить товар подробно, но валидатор google будет это помечать. Какие поля обязательные и как учитывает товары и цены Яндекс можно посмотреть на официальном сайте Яндекса. Используемые свойства Свойство или объект Описание свойства http://schema.org/Product Указывается для начала разметки товара http://schema.org/Offer Указывается для начала разметки свойств товара http://schema.org/Review Указывается для начала разметки отзывов товара http://schema.org/Rating Указывается для начала разметки рейтинга name Название товара image Изображение товара price Цена товара priceCurrency Валюта товара. Например: RUB, EURO, USD и т.д. availability Доступность товара. Возможные значения: http://schema.org/PreOrder - на заказ (товар под заказ). http://schema.org/InStock - в наличии (товар есть в продаже). http://schema.org/OutOfStock - отсутствует (товара нет в продаже). description Описание товара http://schema.org/AggregateRating Указывается для начала разметки рейтинга товара ratingValue Сформированный рейтинг товара на основании голосов (оценка пользователей) reviewCount Количество голосований (оценок) за рейтинг товара brand Бренд товара model Модель товара (артикул) sku Остаток на складе (количество) priceValidUntil Срок актуальности цены (до какого срока цена будет такой же) name Заголовок отзыва (название) author Автор отзыва (ФИО) datePublished Дата публикации отзыва worstRating Минимальная оценка отзыва ratingValue Сформированный рейтинг отзыва на основании голосов (оценка пользователей) bestRating Максимальная оценка отзыва description Текст отзыва Пример разметки услуги (Product → AggregateOffer) Св-во AggregateOffer используется вместо Offer внутри объекта Product. Бывают случаи, когда на сайте предлагают не товар, а услуги. Часто услуги не имеют точной цены и представлены "от" или в виде диапазона. Для этого случая можно использовать свойство AggregateOffer вместо обычного Offer. Примеры отображения с ценой "от" можно увидеть в нашей статье 7 способов привлечь внимание в поиске. Рекомендуется использовать объект https://schema.org/Service в случае разметки услуг, но мы предлагаем более простое решение с использованием http://schema.org/Product. Услуга без микроразметки: <div> <div>Название услуги</div> <div>Описание услуги</div> <img src="ссылка_на_изображение_услуги" /> <div> <div>Готовы оказать услугу! Оставляйте заявку!</div> <div>Цена: от 600 до 1000 руб.</div> </div> </div> Услуга с микроразметкой: <div itemscope itemtype="http://schema.org/Product"> <div itemprop="name">Название услуги</div> <div itemprop="description">Описание услуги</div> <img itemprop="image" src="ссылка_на_изображение_услуги" /> <div itemprop="offers" itemscope itemtype="http://schema.org/AggregateOffer"> <div>Готовы оказать услугу! Оставляйте заявку!</div> <meta itemprop="priceCurrency" content="RUB"> <link itemprop="availability" href="http://schema.org/InStock"> <div>Цена: от <span itemprop="lowPrice">600</span> до <span itemprop="highPrice">1000</span> руб.</div> </div> </div> Пример разметки списка статей блога (Blog) Список статей без микроразметки: <div> <article> <h2>название_статьи_1</h2> <time>2019-04-22T11:48:26+00:00</time> <img src="ссылка_на_постер_для_статьи"> <p>краткое_описание_статьи</p> <p>Автор</p> </article> <article> <h2>название_статьи_1</h2> <time>2019-04-22T11:48:26+00:00</time> <img src="ссылка_на_постер_для_статьи"> <p>краткое_описание_статьи</p> <p>Автор</p> </article> … </div> Список статей с микроразметкой: <div itemscope itemtype="http://schema.org/Blog"> <div itemprop="description">описание_для_списка_статей</div> <article itemprop="blogPosts" itemscope itemtype="http://schema.org/BlogPosting"> <h2 itemprop="headline">название_статьи_1</h2> <time itemprop="datePublished" datetime="2019-04-22">22 апреля 2019</time> <img itemprop="image" src="ссылка_на_постер_для_статьи"> <p itemprop="description">краткое_описание_статьи</p> <p itemprop="articleBody">полный_текст_статьи_анонс</p> <p itemprop="author">Автор</p> <div itemprop="publisher" itemscope itemtype="https://schema.org/Organization"> <div itemprop="logo" itemscope itemtype="https://schema.org/ImageObject"> <img itemprop="url image" src="ссылка_на_логотип" /> </div> <link itemprop="url" href="ссылка_на_сайт"> <div itemprop="address" itemscope itemtype="https://schema.org/PostalAddress"> <span itemprop="postalCode">почтовый_индекс</span>, <span itemprop="addressCountry">Страна</span>, <span itemprop="addressRegion">Область</span>, <span itemprop="addressLocality">Город</span>, <span itemprop="streetAddress">улица, номер_дома</span> </div> <div>Телефон: <a itemprop="telephone" href="tel:+79999999999">+7 (999) 999-99-99</a></div> <div>Почта: <a itemprop="email" href="mailto:email@email.ru">email@email.ru</a></div> <div>Факс: <a itemprop="faxNumber" href="tel:+79999999999">+7 (999) 999-99-99</a></div> <meta itemprop="name" content="название_сайта"> </div> <meta itemprop="dateModified" content="2019-04-22T11:48:26+00:00"> <meta itemscope itemprop="mainEntityOfPage" itemType="https://schema.org/WebPage" itemid="ссылка_на_статью"/> </div> </article> <article itemprop="blogPosts" itemscope itemtype="http://schema.org/BlogPosting"> <h2 itemprop="headline">название_статьи_2</h2> <time itemprop="datePublished" datetime="2019-04-22">22 апреля 2019</time> <img itemprop="image" src="ссылка_на_постер_для_статьи"> <p itemprop="description">краткое_описание_статьи</p> <p itemprop="articleBody">полный_текст_статьи_анонс</p> <p itemprop="author">Автор</p> <div itemprop="publisher" itemscope itemtype="https://schema.org/Organization"> <div itemprop="logo" itemscope itemtype="https://schema.org/ImageObject"> <img itemprop="url image" src="ссылка_на_логотип" /> </div> <link itemprop="url" href="ссылка_на_сайт"> <div itemprop="address" itemscope itemtype="https://schema.org/PostalAddress"> <span itemprop="postalCode">почтовый_индекс</span>, <span itemprop="addressCountry">Страна</span>, <span itemprop="addressRegion">Область</span>, <span itemprop="addressLocality">Город</span>, <span itemprop="streetAddress">улица, номер_дома</span> </div> <div>Телефон: <a itemprop="telephone" href="tel:+79999999999">+7 (999) 999-99-99</a></div> <div>Почта: <a itemprop="email" href="mailto:email@email.ru">email@email.ru</a></div> <div>Факс: <a itemprop="faxNumber" href="tel:+79999999999">+7 (999) 999-99-99</a></div> <meta itemprop="name" content="название_сайта"> </div> <meta itemprop="dateModified" content="2019-04-22T11:48:26+00:00"> <meta itemscope itemprop="mainEntityOfPage" itemType="https://schema.org/WebPage" itemid="ссылка_на_статью"/> </article> … </div> Как правильно разметить статью блога (Article, NewsArticle или BlogPosting) Чем отличается тип Article, NewsArticle и BlogPostiing? Типы используют практически одинаковые свойства и передают основные параметры (заголовок, тело статьи, дата публикации). Если поменять тип BlogPosting на Article ничего не изменится. BlogPosting – схема для разметки статей в блоге и публикаций на сайте. NewsArticle – схема для разметки новостей (новостных статей). Article – общая схема. Подходит для всех типов текстовых материалов. Статья без микроразметки: <article> <p>Автор: Автор статьи</p> <span>Дата: <time>2019-04-22T11:48:26+00:00</time></span> <h1>название_статьи</h1> <img src="ссылка_на_изображение_статьи" /> <div>полное_текст_статьи</div> </article> В разметке ниже, замените общий объект Article на NewsArticle или на BlogPosting, валидность сохранится. Это универсальная разметка. Статья с микроразметкой: <div itemscope itemtype="http://schema.org/Article"> <p>Автор: <span itemprop="author">Автор статьи</span></p> <p>Дата публикации: <time itemprop="datePublished" datetime="2019-04-22">22 апреля 2019</time></p> <h1 itemprop="headline">название_статьи</h1> <img itemprop="image" src="ссылка_на_изображение_статьи" /> <article itemprop="articleBody">полное_текст_статьи</article> <div itemprop="publisher" itemscope itemtype="https://schema.org/Organization"> <div itemprop="logo" itemscope itemtype="https://schema.org/ImageObject"> <img itemprop="url image" src="ссылка_на_логотип" /> </div> <link itemprop="url" href="ссылка_на_сайт"> <div itemprop="address" itemscope itemtype="https://schema.org/PostalAddress"> <span itemprop="postalCode">почтовый_индекс</span>, <span itemprop="addressCountry">Страна</span>, <span itemprop="addressRegion">Область</span>, <span itemprop="addressLocality">Город</span>, <span itemprop="streetAddress">улица, номер_дома</span> </div> <div>Телефон: <a itemprop="telephone" href="tel:+79999999999">+7 (999) 999-99-99</a></div> <meta itemprop="name" content="название_сайта"> </div> <meta itemprop="dateModified" content="2019-04-22T11:48:26+00:00"> <meta itemscope itemprop="mainEntityOfPage" itemType="https://schema.org/WebPage" itemid="ссылка_на_статью"/> </div> Как правильно разметить научную работу (CreativeWork) Под научной работой можно понимать разные виды работы: реферат, книга, диссертация, курсовая и т.д. Научная работа без микроразметки: <div> <img alt="essay cover" src=​"essay.jpg" /> <span>Сказки Пушкина</span> <span>Иван Петров</span>, <span>Александр Сергеевич Пушкин как выдающийся, великий русский поэт, драматург и прозаик. Общая характеристика творчества Пушкина в середине 20-х годов XIX века. История создания сказок. Образный мир и исторические корни сюжетов поэтических произведений.</span> </div> Научная работа с микроразметкой: <div itemscope itemtype="http://schema.org/CreativeWork"> <img itemprop="image" alt="essay cover" src=​"essay.jpg" /> <meta itemprop="learningResourceType" content="StudentEssay"> <span itemprop="name">Сказки Пушкина</span> <span itemprop="author">Иван Петров</span>, <span itemprop="description">Александр Сергеевич Пушкин как выдающийся, великий русский поэт, драматург и прозаик. Общая характеристика творчества Пушкина в середине 20-х годов XIX века. История создания сказок. Образный мир и исторические корни сюжетов поэтических произведений.</span> </div> Больше примеров CreativeWork на официальном сайте. Какие поля обязательные и как учитывает научную работу Яндекс можно посмотреть на официальном сайте Яндекса. Как правильно разметить фильм (Movie) Фильм без микроразметки: <div itemscope itemtype="http://schema.org/Movie"/> <h1>название_фильма</h1> <span>альтернативное_название_на_латинице</span> <a href="ссылка_на_фильм"> <img src="ссылка_на_изображение_превьюшку_фильма" /> </a> <p> <a href="ссылка_на_режиссера">фио_режиссера</a>, <a href="ссылка_на_режиссера">фио_режиссера</a>. </p> <p> <a href="ссылка_на_продюсера">фио_продюсера</a>, <a href="ссылка_на_продюсера">фио_продюсера</a>, <a href="ссылка_на_всех_продюсеров">и другие</a>. </p> <p> <a href="ссылка_на_композитора">фио_композитора</a>, <a href="ссылка_на_композитора">фио_композитора</a>. </p> <p> <a href="ссылка_на_категорию_жанра">название_жанра</a>, <a href="ссылка_на_категорию_жанра">название_жанра</a>, <a href="ссылка_на_категорию_жанров">и другие</a>. </p> <p>В главных ролях:</p> <div> <a href="ссылка_на_актёра">фио_актёра</a> <a href="ссылка_на_актёра">фио_актёра</a> <a href="ссылка_на_актёра">фио_актёра</a> </div> </div> Фильм c микроразметкой: <div itemscope itemtype="http://schema.org/Movie"/> <h1 itemprop="name">название_фильма</h1> <span itemprop="alternativeHeadline">альтернативное_название_на_латинице</span> <a itemprop="url" href="ссылка_на_фильм"> <img src="ссылка_на_изображение_превьюшку_фильма" itemprop="image" /> </a> <p> <a itemprop="director" href="ссылка_на_режиссера">фио_режиссера</a>, <a itemprop="director" href="ссылка_на_режиссера">фио_режиссера</a>. </p> <p> <a itemprop="producer" href="ссылка_на_продюсера">фио_продюсера</a>, <a itemprop="producer" href="ссылка_на_продюсера">фио_продюсера</a>, <a href="ссылка_на_всех_продюсеров">и другие</a>. </p> <p> <a itemprop="musicBy" href="ссылка_на_композитора">фио_композитора</a>, <a itemprop="musicBy" href="ссылка_на_композитора">фио_композитора</a>. </p> <p> <a itemprop="genre" href="ссылка_на_категорию_жанра">название_жанра</a>, <a itemprop="genre" href="ссылка_на_категорию_жанра">название_жанра</a>, <a href="ссылка_на_категорию_жанров">и другие</a>. </p> <p>В главных ролях:</p> <div> <a itemprop="actor" href="ссылка_на_актёра">фио_актёра</a> <a itemprop="actor" href="ссылка_на_актёра">фио_актёра</a> <a itemprop="actor" href="ссылка_на_актёра">фио_актёра</a> </div> <div itemprop="video" itemscope itemtype="http://schema.org/VideoObject"/> <!-- Описание видеоролика, общее для всех видео --> <link itemprop="url" href="ссылка_на_фильм" /> <span itemprop="description">описание_фильма</span> <meta itemprop="contentRating" content="официальный_рейтинг_фильма_возрастной_категории" /> <meta itemprop="duration" content="PT1H30M" /> <meta itemprop="uploadDate" content="2019-04-23T09:12:32+00:00" /> <meta itemprop="inLanguage" content="ru" /> <meta itemprop="isFamilyFriendly" content="true" /> <meta itemprop="productionCompany" content="фио_компании_выпустившая_фильм" /> <div> <h1 itemprop="name">название_фильма</h1> <span itemprop="alternativeHeadline">альтернативное_название_на_латинице</span> <img src="ссылка_на_изображение_превьюшку_фильма" itemprop="thumbnailUrl thumbnail" /> </div> </div> <meta itemprop="dateCreated" content="2019-04-23T09:12:32+00:00" /> </div> Используемые свойства Свойство или объект Описание свойства http://schema.org/Movie Указывается для начала разметки фильма http://schema.org/VideoObject Указывается для начала разметки объекта видео director Режиссер фильма producer Продюсер фильма musicBy Композитор фильма или название группы genre Жанр фильма actor Актёр фильма url Ссылка на фильм (видео) description Краткое описание фильма contentRating Возрастная категория фильма. Например, «MPAA R» duration Продолжительность фильма, в формате ISO 8601. Например, промежуток 1 час 30 минут записывается как PT1H30M. dateReleased Дата выхода фильма на экраны. Например, «2019-01-08T00:00:00» uploadDate Дата загрузки фильма. Например, «2019-01-08T00:00:00» dateCreated Дата окончания съемок фильма. Например, Например, «2019-01-08T00:00:00» inLanguage Оригинальный язык фильма (ru, en, de и т.д.) isFamilyFriendly True или False. Указывает, подходит ли этот фильм для семейного просмотра productionCompany Кинокомпания, выпустившая фильм. Например, «Warner bros» name Название фильма alternativeHeadline Альтернативное название фильма на латинице thumbnailUrl Постер фильма (изображение) subtitleLanguage Язык субтитров (ru, en, de и т.д.) Как правильно разметить рецепт (Recipe) Рецепт без микроразметки: <div> <h1>название_рецепта</h1> <div>описание_рецепта</div> <img src="ссылка_на_изображение_готового_блюда" /> <ul> <li>Автор рецепта: Автор</li> <li>После приготовления вы получите 4 порции</li> <li>Время приготовления: 45 минут</li> </ul> <h2>ингредиенты</h2> <ul> <li>1 курица</li> <li>5 л пива</li> <li>соль</li> <li>перец</li> <li>специи по вкусу</li> </ul> <h2>способ_приготовления</h2> <ul> <li> <img src="ссылка_на_изображение_ингредиента" /> Курицу нарезать на кусочки, выложить в форму для запекания, посолить, поперчить, добавить специи по вкусу. </li> <li> <img src="ссылка_на_изображение_ингредиента" /> Курицу залить пивом, поставить в духовку. </li> <li> <img src="ссылка_на_изображение_ингредиента" /> Жарить при температуре 180 градусов в течение 40—45 минут. </li> </ul> <span>Блюда из курицы</span> <div> Пищевая ценность: <ul> <li>Калории: 120 ккал.</li> <li>Жиры: 7 г.</li> <li>Углеводы: 1 г.</li> </ul> </div> Приятного аппетита! </div> Пример рецепта с микроразметкой: <div itemscope itemtype="http://schema.org/Recipe"/> <h1 itemprop="name">название_рецепта</h1> <div itemprop="description">описание_рецепта</div> <div>Теги: <span itemprop="keywords">ключевые, слова, для, рецепта</span></div> <img itemprop="image" src="ссылка_на_изображение_готового_блюда" /> <ul> <li>Автор рецепта: <span itemprop="author">Автор</span></li> <li>После приготовления вы получите <span itemprop="recipeYield">4 порции</span></li> <li>Время приготовления: <meta itemprop="totalTime" content="PT45M" />45 минут</li> </ul> <h2>ингредиенты</h2> <ul> <li itemprop="recipeIngredient">1 курица</li> <li itemprop="recipeIngredient">5 л пива</li> <li itemprop="recipeIngredient">соль</li> <li itemprop="recipeIngredient">перец</li> <li itemprop="recipeIngredient">специи по вкусу</li> </ul> <h2>способ_приготовления</h2> <ul itemprop="recipeInstructions" itemtype="https://schema.org/ItemList" itemscope> <li itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem"/> <img itemprop="image" src="ссылка_на_изображение_ингредиента" /> Курицу нарезать на кусочки, выложить в форму для запекания, посолить, поперчить, добавить специи по вкусу. </li> <li itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem"/> <img itemprop="image" src="ссылка_на_изображение_ингредиента" /> Курицу залить пивом, поставить в духовку. </li> <li itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem"/> <img itemprop="image" src="ссылка_на_изображение_ингредиента" /> Жарить при температуре 180 градусов в течение 40—45 минут. </li> </ul> <span itemprop="recipeCategory">Блюда из курицы</span> <div itemprop="nutrition" itemscope itemtype="http://schema.org/NutritionInformation"/> Пищевая ценность: <ul> <li>Калории: <span itemprop="calories">120 ккал.</span>,</li> <li>Жиры: <span itemprop="fatContent">7 г.</span></li> <li>Углеводы: <span itemprop="carbohydrateContent">1 г.</span></li> </ul> </div> Приятного аппетита! </div> Используемые свойства Свойство или объект Описание свойства http://schema.org/Recipe Указывается для начала разметки рецепта name Обязательное поле. (Текст) Название рецепта или блюда. image (URL) URL изображения результата приготовления. Рекомендуем указать данное поле для формирования расширенного сниппета. author (Текст, Person/name, Organization/name) Автор рецепта. recipeYield (Текст) количество порций, получаемых с помощью рецепта. totalTime (Duration) время приготовления. Указывается в формате ISO 8601. Например, «PT30M» (30 минут). recipeIngredient Обязательное поле. (Текст) ингредиент рецепта и его объем, количество (может быть несколько). recipeInstructions (Текст) Инструкция по приготовлению image (URL) URL изображение процесса приготовления, может быть несколько. Рекомендуем указать данное поле для формирования расширенного сниппета. recipeCategory (Текст) тип блюда. Например, горячее блюдо, десерт. nutrition (NutritionInformation) энергетическая или пищевая ценность блюда, то есть содержание калорий, белков, жиров, углеводов, витаминов и т. д. calories Калорийность. fatContent Жиры. carbohydrateContent Углеводы. sugarContent Сахар. fiberContent Клетчатка. proteinContent Белки. cholesterolContent Холестерин. servingSize (Текст) порция, объем или вес для которого указывается информация о энергетической и пищевой ценности. Как правильно разметить рисунок (Painting) Изображение без микроразметки: <div> <h1>название_изображения</h1> <img src="ссылка_на_изображение" /> <a href="ссылка_на_автора">фио_автора</a> <span>Портрет</span> <span>описание_изображения</span> </div> Изображение с микроразметкой: <div itemscope itemtype="http://schema.org/Painting" /> <h1 itemprop="name">название_изображения</h1> <img src="ссылка_на_изображение" /> <a href="ссылка_на_автора" itemprop="author">фио_автора</a> <span itemprop="genre">Портрет</span> <span itemprop="description">описание_изображения</span> </div> Как правильно разметить картинку (ImageObject) Картинка без микроразметки: <div> <div>Компьютер</div> <img src=​"computer.jpg" /> <span>Компьютер стоит на столе.</span> </div> Картинка с микроразметкой: <div itemscope itemtype="http://schema.org/ImageObject"> <div itemprop="name">Компьютер</div> <img src="computer.jpg" itemprop="contentUrl" /> <span itemprop="description">Компьютер стоит на столе.</span> </div> Как правильно разметить видео (VideoObject) Видео без микроразметки: <div> <link href="ссылка_на_видео"> <meta content="название_видео" /> <p>описание_видео</p> <p>Дата загрузки: 2013-06-05T00:00:00</p> </div> Видео с микроразметкой: <div itemscope itemtype="http://schema.org/VideoObject"> <link itemprop="url" href="ссылка_на_видео"> <meta itemprop="name" content="название_видео"> <p itemprop="description">описание_видео</p> <meta itemprop="duration" content="PT6M58S" /> <meta itemprop="isFamilyFriendly" content="true"> <link itemprop="thumbnailUrl" href="превьюшка_изображение"/> <p>Дата загрузки: <span itemprop="uploadDate">2013-06-05T00:00:00</span></p> <div itemprop="thumbnail" itemscope itemtype="http://schema.org/ImageObject"> <img itemprop="contentUrl" src="превьюшка_изображение"> <meta itemprop="width" content="250"> <meta itemprop="height" content="120"> </div> </div> Как правильно разметить событие (Event) Событие без микроразметки: <div itemscope itemtype="http://schema.org/Event" /> <img src="изображение_или_постер_события.jpg" /> <div>название_события</div> <div>описание_события</div> <div> Концерт состоится 8 мая, в 19:30 Окончание концерта 8 мая, в 20:30 </div> <div> Место проведения: страна_или_город, полный_адрес </div> <div>фио_исполнителя_или_название_группы</div> </div> Событие c микроразметкой: <div itemscope itemtype="http://schema.org/Event" /> <img itemprop="image" src="изображение_или_постер_события.jpg" /> <div itemprop="name">название_события</div> <div itemprop="description">описание_события</div> <div> Концерт состоится <time itemprop="startDate" datetime="2019-05-08T19:30">8 мая, в 19:30</time> Окончание концерта <time itemprop="endDate" datetime="2019-05-08T20:30">8 мая, в 20:30</time> </div> <div itemprop="location" itemscope itemtype="http://schema.org/Place" /> Место проведения: <span itemprop="name">страна_или_город</span>, <span itemprop="address">полный_адрес</span> </div> <div itemprop="performer" itemscope itemtype="http://schema.org/Person" /> <span itemprop="name">фио_исполнителя_или_название_группы</span> </div> </div> Как правильно разметить Вопрос-ответ (Question) Является дочерним объектом типа FAQPage и QAPage. Вопрос-ответ без микроразметки: <div> <div>Как продвинуть сайт в Москве?</div> <div>Сколько не пытаюсь, не получается.</div> <div>Ответ №1: <span>Для начала прочитайте статью на тему, как продвинуть сайт в регионах: https://d-element.ru/about/blog/kak-prodvinut-sayt-v-regionakh/</span></div> <div>Ответ №2: <span>Кто бы умел...</span></div> </div> Вопрос-ответ c микроразметкой (FAQ Page) (один вопрос — один ответ): <div itemscope itemtype="https://schema.org/FAQPage"> <div itemprop="mainEntity" itemscope itemtype="https://schema.org/Question"> <div itemprop="name">Как продвинуть сайт в Москве?</div> <div itemprop="text">Сколько не пытаюсь, не получается.</div> <span itemprop="answerCount">1</span> ответ</div> <div itemprop="upvoteCount">196</div> //Всего голосов за вопрос <div itemprop="acceptedAnswer" itemscope="" itemtype="http://schema.org/Answer"> <div itemprop="upvoteCount"/>3</div> //Всего голосов за ответ Ответ: <span itemprop="text">Для начала прочитайте статью на тему, как продвинуть сайт в регионах: https://d-element.ru/about/blog/kak-prodvinut-sayt-v-regionakh/</span> </div> </div> </div> Пример подробной микроразметки Вопрос-ответ (с возможностью ответа на вопросы, один вопрос — несколько ответов) для типа QAPage: <div itemscope itemtype="https://schema.org/QAPage"> <div itemscope itemtype="http://schema.org/Question"> <h1 itemprop="name">Как продвинуть сайт в Москве?</h1> <div itemprop="upvoteCount">196</div> <div itemprop="text">Как добиться результата? С чего лучше начать?</div> <span itemprop="answerCount">2</span> ответа</div> <div><time itemprop="dateCreated" datetime="2019-11-11T20:07Z">11 ноября, 20:03</time></div> <div itemprop="author" itemscope itemtype="http://schema.org/Person"><span itemprop="name">Имя_пользователя_кто_задал_вопрос</span></div> <div>Всего задал <span itemprop="answerCount">4</span> вопроса</div> <div itemprop="suggestedAnswer acceptedAnswer" itemscope itemtype="http://schema.org/Answer"> <div itemprop="upvoteCount">всего_голосов_за_этот_ответ</div> <div itemprop="text">текст_ответа</div> <div>Ответ оставлен <time itemprop="dateCreated" datetime="2019-12-01T22:06Z">1 декабря, 22:06</time></div> <div itemprop="author" itemscope itemtype="http://schema.org/Person"><span itemprop="name">Имя_пользователя_кто_оставил_ответ</span></div> </div> <div itemprop="suggestedAnswer" itemscope itemtype="http://schema.org/Answer"> <div itemprop="upvoteCount">всего_голосов_за_этот_ответ</div> <div itemprop="text">текст_ответа</div> <div>Ответ оставлен <time itemprop="dateCreated" datetime="2019-12-01T22:10Z">1 декабря, 22:10</time></div> <div itemprop="author" itemscope itemtype="http://schema.org/Person"><span itemprop="name">Имя_пользователя_кто_оставил_ответ</span></div> </div> </div> </div> Как правильно разметить отзывы (Review) В данный момент Яндекс принимает отзывы только про автомобили или организации, Google же принимает отзывы на организации, книгу (Book), курс (Course), мероприятие (Event), инструкцию (HowTo), фильм (Movie), товар (Product), рецепт (Recipe), приложение (Game). Ниже приведен пример на основе отзыва об организации (Organization). Отзывы без микроразметки: <div> <span>Отличная организация!</span> от <span>Николай Правдин</span>, <span>Очень хорошая организация! Пользовался их услугами, все ок!</span> </div> Отзывы c микроразметкой shema.org: <div itemscope itemtype="http://schema.org/Review"> <a href="ссылка_на_отзыв" itemprop="url">№134</a> <span itemprop="name">Отличная организация!</span> от <span itemprop="author">Николай Правдин</span>, <time itemprop="datePublished" datetime="2005-08-09">09 августа 2005</time> <div itemprop="itemReviewed" itemscope itemtype="https://schema.org/Organization"> <div itemprop="name">название_компании</div> <div itemprop="logo" itemscope itemtype="https://schema.org/ImageObject"> <img itemprop="contentUrl" src="ссылка_на_логотип_" alt="Logo"> </div> <link itemprop="url" href="ссылка_на_сайт"> <div itemprop="address" itemscope itemtype="https://schema.org/PostalAddress"> <span itemprop="postalCode">почтовый_индекс</span>, <span itemprop="addressCountry">Россия</span>, <span itemprop="addressRegion">Область</span>, <span itemprop="addressLocality">Город</span>, <span itemprop="streetAddress">улица, номер_дома</span> </div> <div>Телефон: <a itemprop="telephone" href="tel:+79999999999">+7 (999) 999-99-99</a></div> <div>Почта: <a itemprop="email" href="mailto:email@email.ru">email@email.ru</a></div> <div>Факс: <a itemprop="faxNumber" href="tel:+79999999999">+7 (999) 999-99-99</a></div> </div> <div itemprop="reviewRating" itemscope itemtype="http://schema.org/Rating"> <meta itemprop="worstRating" content="0"> <span itemprop="ratingValue">9</span> <span itemprop="bestRating">10</span> </div> <span itemprop="reviewBody">Очень хорошая организация! Пользовался их услугами, все ок!</span> </div> Используемые свойства Свойство или объект Описание свойства http://schema.org/Review Указывается для начала разметки отзыва name Заголовок (название) отзыва author Автор отзыва (ФИО) datePublished Дата публикации отзыва в формате ISO 8601 itemReviewed Объект отзыва (то, о чем отзыв). Может принимать значения: Action CreativeWork Event Intangible MedicalEntity Organization Person Place Product reviewRating Рейтинг отзыва (объект) worstRating Самая низкая оценка bestRating Самая высокая оценка ratingValue Рейтинг отзыва (цифра) reviewBody Текст отзыва Как правильно разметить рейтинг (AggregateRating) AggregateRating — это объект, с помощью которой можно разметить рейтинг товара или статьи/новости. Используется либо как часть микрораметки, например, Article или Product. Пример разметки рейтинга внутри товара:<div itemscope itemtype="http://schema.org/Product"> <h1 itemprop="name">наименование_товара</h1> <a href="ссылка-на-увеличенное-изображение.jpg"> <img itemprop="image" src="ссылка_на_изображение_товара" /> </a> <div itemprop="offers" itemscope itemtype="http://schema.org/Offer"> <meta itemprop="price" content="690.00"> <meta itemprop="priceCurrency" content="RUB"> <link itemprop="availability" href="http://schema.org/InStock"> <div>В наличии</div> </div> <div itemprop="aggregateRating" itemscope="" itemtype="https://schema.org/AggregateRating">; <meta itemprop="bestRating" content="10"> <meta itemprop="ratingValue" content="8.8"> <span itemprop="ratingCount">356233</span> </div> <div itemprop="description">описание_товара</div> </div> Пример разметки рейтинга внутри статьи: <div itemscope itemtype="http://schema.org/Article"> <p>Автор: <span itemprop="author">Автор статьи</span></p> <p>Дата публикации: <time itemprop="datePublished" datetime="2019-04-22">22 апреля 2019</time></p> <h1 itemprop="headline">название_статьи</h1> <img itemprop="image" src="ссылка_на_изображение_статьи" /> <article itemprop="articleBody">полное_текст_статьи</article> <div itemprop="publisher" itemscope itemtype="https://schema.org/Organization"> <div itemprop="logo" itemscope itemtype="https://schema.org/ImageObject"> <img itemprop="url image" src="ссылка_на_логотип" /> </div> <link itemprop="url" href="ссылка_на_сайт"> <div itemprop="address" itemscope itemtype="https://schema.org/PostalAddress"> <span itemprop="postalCode">почтовый_индекс</span>, <span itemprop="addressCountry">Страна</span>, <span itemprop="addressRegion">Область</span>, <span itemprop="addressLocality">Город</span>, <span itemprop="streetAddress">улица, номер_дома</span> </div> <div>Телефон: <a itemprop="telephone" href="tel:+79999999999">+7 (999) 999-99-99</a></div> <meta itemprop="name" content="название_сайта"> </div> <div itemprop="aggregateRating" itemscope="" itemtype="https://schema.org/AggregateRating"> <meta itemprop="bestRating" content="10"> <meta itemprop="ratingValue" content="8.8"> <span itemprop="ratingCount">356233</span> </div> <meta itemprop="dateModified" content="2019-04-22T11:48:26+00:00"> <meta itemscope itemprop="mainEntityOfPage" itemType="https://schema.org/WebPage" itemid="ссылка_на_статью"/> </div> В микроразметке используются следующие теги: Свойство или объект  Описание свойства https://schema.org/AggregateRating Этот тег указывает поисковику, что перед ним рейтинг bestRating Шкала оценок. В данном случае материал оценивается по 10-бальной шкале ratingValue Рейтинг статьи. В нашем случае равен 8.8 ratingCount Общее количество оценок. Свои оценки поставили 356 233 человека. Как правильно разметить поиск сайта (SearchAction) На сайте можно разметить любое количество поисков. Объект SearchAction является дочерним объектом WebSite. Поиск сайта без микроразметки: <div> <form action="/search/"> <input type="text" placeholder="Поиск" name="q"> <input type="submit" name="s" value="Искать"> </form> </div> Поиск с микроразметкой: <div itemscope="" itemtype="http://schema.org/WebSite"> <form action="/search/" itemprop="potentialAction" itemscope="" itemtype="http://schema.org/SearchAction"> <meta itemprop="target" content="/search/?q={query}"> <input type="text" class="text" placeholder="Поиск" name="q"> <input itemprop="query-input" type="hidden" name="query"> <input type="submit" class="submit" name="s" value="Искать"> </form> </div>> Поле query хранит GET запрос поиска из поля q. Как правильно разметить пошаговую инструкцию (HowTo) Разметку HowTo рекомендуется использовать для всех статей/обзоров/решений, которые включают в себя поэтапное выполнение (исключая приготовление блюд, для этого есть свойство Recipe). Также HowTo можно использовать для разметки условий использования или установки на страницах товара или категории товаров. Но Google требует, чтобы HowTo не использовали в рекламных целях. На одной странице можно использовать только один объект HowTo. Контент HowTo должен быть виден пользователям. Разметку HowTo поддерживает только Google. HowTo без микроразметки: <div> <div>Название инструкции</div> <div>Краткое описание</div> <div>Потребуется 2 минуты</div> <-- видео-инструкция --> <div> <video>...</video> </div> <p>Материалы, необходимые для выполнения инструкций:</p> <div> <a href="ссылка_на_материал"><span>материал №1</span></a> <img alt="изображение_материала_№1" src="ссылка_на_изображение"/> </div> <div> <a href="ссылка_на_материал"><span>материал №2</span></a> <img alt="изображение_материала_№2" src="ссылка_на_изображение"/> </div> <p>Все работы мы будем выполнять при помощи:</p> <div> <a href="ссылка_на_инструмент"><span>bucket</span></a> <img alt="изображение_инструмента" src="ссылка_на_изображение"/> </div> <-- этапы выполнения --> <-- этап №1 --> <div> <div>Заголовок этапа №1</div> <img src="ссылка_на_изображение_этапа"/> <div>Описание этапа</div> </div> <-- этап №2 --> <div> <div>Заголовок этапа №2</div> <img src="ссылка_на_изображение_этапа"/> <div>Описание этапа</div> </div> ... </div> HowTo с подробной микроразметкой: <div itemscope itemtype="http://schema.org/HowTo"> <div itemprop="name">Название инструкции</div> <div itemprop="description">Краткое описание</div> <div>Потребуется: <span itemprop="totalTime" content="PT2M">2 минуты</span></div> <-- видео-инструкция --> <div itemprop="video" itemscope itemtype="http://schema.org/VideoObject"> <meta itemprop="name" content="Название видео" /> <meta itemprop="description" content="Краткое описание видео" /> <link itemprop="thumbnailUrl" content="ссылка_на_пост_видео" /> <link itemprop="contentUrl" content="ссылка_на_видео" /> <link itemprop="embedUrl" content="ссылка_на_вставку_видео" /> <meta itemprop="duration" content="продолжительность_например_P1MT10S" /> <meta itemprop="uploadDate" content="дата_загрузки_например_2021-01-05T08:00:00+08:00" /> <video>...</video> </div> <p>Материалы, необходимые для выполнения инструкций:</p> <div itemprop="supply" itemscope itemtype="http://schema.org/HowToSupply"> <a itemprop="url" href="ссылка_на_материал"> <span itemprop="name">материал №1</span> </a> <img alt="изображение_материала_№1" itemprop="image" src="ссылка_на_изображение"/> </div> <div itemprop="supply" itemscope itemtype="http://schema.org/HowToSupply"> <a itemprop="url" href="ссылка_на_материал"> <span itemprop="name">материал №2</span> </a> <img alt="изображение_материала_№2" itemprop="image" src="ссылка_на_изображение"/> </div> <p>Все работы мы будем выполнять при помощи:</p> <div itemprop="tool" itemscope itemtype="http://schema.org/HowToTool"> <a itemprop="url" href="ссылка_на_инструмент"> <span itemprop="name">bucket</span> </a> <img alt="изображение_инструмента" itemprop="image" src="ссылка_на_изображение"/> </div> <-- этапы выполнения --> <-- этап №1 --> <div itemprop="step" itemscope itemtype="http://schema.org/HowToSection"> <link itemprop="url" href="ссылка_якорь_на_этап" /> <meta itemprop="position" content="1"/> <div itemprop="name">Заголовок этапа №1</div> <img itemprop="image" src="ссылка_на_изображение_этапа"/> <link itemprop="video" href="ссылка_на_видео_этапа" /> <-- берем сразу одно описание --> <div itemprop="text">Описание этапа</div> <-- или делим описание на подэтапы --> <div itemprop="itemListElement" itemscope itemtype="http://schema.org/HowToDirection"> <meta itemprop="position" content="1"/> <div itemprop="text">Сначала делай раз.</div> </div> <div itemprop="itemListElement" itemscope itemtype="http://schema.org/HowToDirection"> <meta itemprop="position" content="2"/> <div itemprop="text">Потом делай два.</div> </div> <-- добавляем HowToTip, если используем пояснение к HowToDirection --> <div itemprop="itemListElement" itemscope itemtype="http://schema.org/HowToTip"> <meta itemprop="position" content="3"/> <div itemprop="text">Во втором пункте будьте осторожней, мало ли.</div> </div> </div> <-- этап №2 --> <div itemprop="step" itemscope itemtype="http://schema.org/HowToSection"> <link itemprop="url" href="ссылка_якорь_на_этап" /> <meta itemprop="position" content="2"/> <div itemprop="name">Заголовок этапа №2</div> <img itemprop="image" src="ссылка_на_изображение_этапа"/> <link itemprop="video" href="ссылка_на_видео_этапа" /> <-- берем сразу одно описание --> <div itemprop="text">Описание этапа</div> <-- или делим описание на подэтапы --> <div itemprop="itemListElement" itemscope itemtype="http://schema.org/HowToDirection"> <meta itemprop="position" content="1"/> <div itemprop="text">Сначала делай раз.</div> </div> <div itemprop="itemListElement" itemscope itemtype="http://schema.org/HowToDirection"> <meta itemprop="position" content="2"/> <div itemprop="text">Потом делай два.</div> </div> <-- добавляем HowToTip, если используем пояснение к HowToDirection --> <div itemprop="itemListElement" itemscope itemtype="http://schema.org/HowToTip"> <meta itemprop="position" content="3"/> <div itemprop="text">Во втором пункте будьте осторожней, мало ли.</div> </div> </div> ... Важно учесть, что валидатор Google выдает ошибку на корректную разметку в месте разметки HowToDirection, HowToTip при использовании объекта itemListElement. Видимо, валидатор Google сам не поддерживает то, что описал у себя в справке по HowTo. Как правильно разметить футер сайта (WPFooter) Футер без микроразметки: <footer> <div>© 2019 Все права защищены.</div> </footer> Футер с микроразметкой schema.org: <footer itemscope itemtype="http://schema.org/WPFooter"> <meta itemprop="copyrightYear" content="2019"> <meta itemprop="copyrightHolder" content="Держатель_копирайта"> <div>© 2019 Все права защищены.</div> </footer> Schema.org WPFooter предусматривает множество свойств. Ознакомиться с ними и добавить нужные можно самостоятельно, после просмотра страницы об объекте. Проверка микроразметки Проверить микроразметку можно с помощью: валидатор от Google; проверка расширенных сниппетов от Google; валидатор от Яндекс.

    209K
    Топ 10 лучших сервисов для онлайн-опросов
    АНАЛИТИКА
    28.07.2022
    Топ 10 лучших сервисов для онлайн-опросов

    Как провести онлайн-опрос аудитории легко и не затратить на составление анкет уйму времени? Ответ прост – используйте готовые формы, предлагаемые специальными сервисами опросов онлайн. Что это за программы и как выбрать наиболее подходящий для вас конструктор – расскажем сейчас. Содержание Google Forms «Яндекс. Взгляд» Anketolog Survio Testograf Survey Monkey Simpoll Online Test Pad FormDesigner Questions Star Вывод Проведение опроса аудитории – обязательная часть продвижения любой компании. С помощью анкетирования можно тестировать новые продукты и бизнес-идеи, оценивать лояльность клиентов и сотрудников, проводить различные маркетинговые и социальные исследования и т.д. Чтобы не составлять анкеты вручную и не тратить время на поиск нужных вопросов – воспользуйтесь услугами сервисов опросов, которые предлагают готовые решения и удобные инструменты для администрирования. Рассмотрим 10 популярных конструкторов онлайн-опросов.  Google Forms Google Forms – сервис для создания опросов онлайн. Входит в набор веб-редакторов Google Docs. Есть русскоязычный сайт. Пользователи могут работать с бесплатной версией для личного пользования или купить тарифы для бизнеса с расширенными функциональными возможностями.  Сервис «Google Forms» Общий функционал Google Forms: заданные шаблоны легко трансформируются под запросы конкретного пользователя;  можно выбирать нужные варианты формулировок, менять последовательность показа вопросов в зависимости от ответов;  также система позволяет оформить дизайн анкеты: выбрать цвета и шрифты, вставлять изображения и видео;  формы опросов доступны на всех устройствах: ПК, планшетах, мобильных телефонах; диаграммы по результатам тестирования автоматически обновляются; количество опросов – не ограничено. При этом число уведомлений о заполнении респондентами анкет в рамках бесплатного тарифа – не более 20 в месяц;  помимо создания опросников система может собирать электронные адреса пользователей; все данные клиентов Google Forms шифруются и хранятся в облачном архиве для безопасности и многое другое. Расширенный платный функционал Google Forms: Включает четыре платных тарифа: Business (Starter, Standard,Plus) и Enterprise. Цены начинаются от 6 до 18 $ за пользователя в месяц, стоимость тарифа Enterprise озвучивают в отделе продаж. Есть бесплатный тестовый период – 14 дней. платные тарифы нацелены на корпоративную работу компаний и предоставляют большой набор функций для эффективного внутреннего взаимодействия;   включают все необходимые инструменты для создания опросов онлайн; коллеги могут совместно создавать контент в режиме реального времени; есть защищенная корпоративная почта; можно проводить голосовые чаты и видеовстречи с числом участников от 100 до 500; продолжительность видеовстречи – до 24 часов; объемы облачного хранилища – от 30 ГБ, 2-5 ТБ до неограниченного резерва, в зависимости от тарифа; расширенные инструменты управления; безопасность платформы (защита от спама и фишинга с блокировкой до 99,9 % атак, двухэтапная аутентификация и др.); доступны календари с бронированием встреч; есть конструктор сайтов и многое другое. Тарифы Business могут использовать компании с числом сотрудников не более 300. Для остальных – тариф Enterprise. «Яндекс. Взгляд» Сервис «Яндекс. Взгляд» оказывает платные услуги. Для доступа к программе необходимо иметь регистрацию в Яндексе. Помимо конструирования опросов система предлагает таргетинговую рассылку.  Сервис «Яндекс.Взгляд» При создании опроса можно использовать готовые шаблоны или сформировать анкету самостоятельно под свои потребности. Для вопросов и ответов действуют ограничения. Так, в простом опросе количество вопросов должно быть не более четырех, в продвинутом опросе – не больше 20. Длина вопроса – максимум 68 символов, ответа – до 40 символов. Опрос на «Яндекс.Взгляд» Продвинутые и простые опросы также отличаются по типам и количеству вопросов. Так, в обоих тестах можно выбирать один или несколько вариантов ответа, оценивать по числовой шкале, но в продвинутом анкетировании дополнительно можно давать ответы в свободной форме, оценивать их по шкале со звездами и эмоциями и сравнивать картинки. Количество респондентов зависит от вида опроса и региона таргетинга. К примеру, в России подключить к продвинутому опросу можно 2000 пользователей, а в Белоруссии и Казахстане – всего 300. Перед публикацией каждая анкета проходит модерацию. Цены на тесты варьируются в зависимости от выбранного функционала. Так, одна анкета с простым опросом без таргетинга будет стоить 15 рублей (без учета НДС). Если подключается таргетинг, то цена увеличится вдвое – 30 руб. Цены на продвинутый опрос: без таргетинга – 80 р., с поиском ЦА – 100 руб. Параметры целевой аудитории (возраст, пол, геолокация, интересы) заказчик вносит непосредственно при создании опроса, или, если эти данные есть в CRM или Яндекс.Аудитории, то система забирает их оттуда. Если вы проводите опрос среди клиентов по своей базе, то анкета будет стоить всего 3 рубля. Результаты тестирования на «Яндекс.Взгляд» можно отследить в Яндекс.Метрике или с помощью встроенной статистики. Все данные доступны в личном кабинете и в Excel. Anketolog Сервис опросов онлайн Anketolog Российский сервис опросов. Есть бесплатный тестовый период с возможностями экспертного тарифа, дается на 5 дней. Также доступен бесплатный тарифный план, но функционал его сильно ограничен – пользователи могут провести в месяц всего 3 опроса, в каждом 10 вопросов, 50 респондентов. Здесь нельзя менять дизайн – только стандартный вариант оформления, также нет многих других функций. У платных тарифов расширенные возможности. Anketolog предлагает несколько платных тарифов на выбор:  индивидуальные (базовый, профи, эксперт от 1490 рублей в месяц. При долгосрочном сотрудничестве даются скидки). академические (для студентов) – от 745 руб. в месяц; корпоративные подписки на 1 год: от 35 598 рублей. Цены на два последних тарифа указаны со скидками (данные на 25.07 2022 года). Функционал: количество анкет – от 5 в базовых тарифах до неограниченного числа в остальных тарифных планах; число доступных шаблонов анкет – 114 и 129, для корпоративных заказов – без ограничений; 20 типов вопросов; количество ответов – от 500 и выше; можно самостоятельно настроить дизайн опросника (корпоративные цвета, брендирование); прикреплять фото-, видео-, аудиофайлы; ограничивать время и количество ответов; настраивать внутреннюю логику опроса; расширенный экспорт данных; есть несколько вариантов размещения опросов (общие и индивидуальные ссылки, e-mail- и sms-рассылки, вставки на сайт, QR-код, постинг в соцсетях); для сбора ответов можно использовать клиентскую базу «Анкетолога», в которой более 160 тысяч респондентов. Это удобно, если у вас нет своей аудитории или она немногочисленная; помимо опросов доступны маркетинговые исследования и т.д. Опросы можно проводить самостоятельно или доверить специалистам сервиса. Survio Чешский продукт, есть русскоязычная версия. Survio позиционируется как бесплатный сервис опросов. Создать онлайн-опрос бесплатно можно легко и с использованием большинства настроек. В отличие от других конструкторов опросов онлайн, в бесплатном тарифе Survio можно полноценно работать, так как он предоставляет основной функционал по созданию и настройке анкет, внешнему оформлению, сбору ответов, анализу результатов. Сервис «Survio» Возможности бесплатного тарифа: можно создавать неограниченное число анкет и вопросов; лимит на ответы – до 100 в месяц; адаптивный дизайн; протокол безопасности (SSL-сертификат); количество готовых шаблонов 100+ и 19 типов вопросов, как и в платных тарифах сервиса; можно копировать опросы и вопросы; доступен плагин «Поделиться в соцсетях»; тексты-подсказки для участников опроса и многое другое; во внешнем оформлении доступны 70+ версий современного дизайна; можно добавлять картинки и видео; настройки размера и цвета встроенной анкеты и всплывающего окна; есть версия для печати и др.; расширенный сбор ответов (текстовые, встроенные ссылки, pop-up, рассылка в соцсетях, по QR-коду); настройка даты начала и конца проведения опроса; ограничение для повторного прохождения анкеты по IP-адресу и паролю и др.; для анализа результатов – в Survio доступна итоговая статистика, таблицы и графики, печать графиков; можно включать/исключать выборочные вопросы; есть показ отдельных ответов и др.; в экспорте и отчетности данных много ограничений – можно экспортировать только графики в форматах PNG и SVG; в поддержку входит апгрейд профиля в любое время. Возможности платных тарифов Survio: Что недоступно для бесплатного пользования, но можно приобрести в платных тарифах? На Survio действуют три платных тарифа: Mini, Standart, Plus. Тарифы Survio Функционал платных тарифов Survio включает все вышеназванные опции бесплатного тарифа. Дополнительно следующие возможности: можно менять логику опроса (пропускать вопросы в зависимости от ответов); размещать логотип компании в анкете; добавлять картинки и видео между вопросами; настраивать параметры ссылки под именной URL компании; для электронных приглашений к опросу составляются индивидуальные тексты с логотипом компании; идентификация респондентов и др.; можно перенаправлять опрашиваемых на URL компании; доступна интеграция с Google Analytics; предоставляется неограниченное число фильтров при анализе результатов; отчеты предоставляются в формате PDF, DOCx – MS Word, PPTx - MS Powerpoint; экспорт ответов – в XLS (MS Excel), CSV, XML, Google Sheets; итоговый отчет можно брендировать логотипом компании; резервное копирование в облачные сервисы Dropbox, Google Drive, OneDrive; в поддержке проводятся локальные методы оплаты, предоставляются счета-фактуры; тариф Plus оказывает поддержку по электронной почте в режиме 24/7. Testograf Платный сервис Testograf предлагает готовые шаблоны для опросов, анкетирования, голосования, тестов, также проводит аналитику и выдает статистику по полученным результатам.  Сервис Testograf Доступные опции: можно купить разовую лицензию на один опрос (6990 р.) с неограниченным числом вопросов, страниц и фильтров, 10 тысяч ответов и всем необходимым набором настроек;  или приобрести годовую подписку (от 34 990 р. за пользователя) с неограниченным числом опросов и более расширенным функционалом; Шаблон опроса «Узнаваемость бренда» на Testograf для кадровой службы HR предлагаются шаблоны опросов, которые помогут выбрать кандидатов на вакансии, оценить вовлеченность персонала в работу и многое другое;  опросы для маркетинга дают обратную связь с клиентами, которые оценивают товары и услуги; В сервисе есть все современные инструменты для создания и администрирования веб-форм, сбора ответов, проведения аналитики и т.д. На Testograf можно проводить анонимные опросы онлайн или с идентификацией ответов; использовать для доставки анкет e-mail- и sms-рассылки, всплывающие окна (pop-up), прямые ссылки, виджеты; редактировать анкеты; менять дизайн и многое другое.  Survey Monkey Одна из самых популярных в мире систем для создания форм опросов, есть версия на русском языке. Но для работы в России Survey Monkey проблематичен, так как зарубежный сервис не отвечает требованиям законодательства РФ по обработке персональных данных. Также среди минусов, передает netology.ru – конструктор требует времени для привыкания и наблюдаются периодические простои в работе сервиса.  Сервис Survey Monkey Функциональные возможности:  совместный доступ к онлайн-опросам;  бесплатная интеграция с программами для работы группой; неограниченное количество вопросов и опросов в индивидуальных тарифах;  многоязычные опросы (один опрос переводится на несколько языков); много функциональных настроек для редактирования анкет и создания индивидуального дизайна; быстрое создание диаграмм и отчетов; расширенный экспорт данных (CSV, PDF, PPT, XLS, SPSS); готовая база с наиболее популярными вопросами и многое др. Survey Monkey имеет несколько тарифных планов на выбор. Есть бесплатный базовый тариф, цены на остальные – от 1499 до 4999 рублей за пользователя в месяц. При заказе опросов для юрлиц и более трех пользователей даются скидки от 20 %.  Simpoll Есть бесплатный тариф (3 опроса в месяц, 10 вопросов, 100 ответов). На платные опросы Simpoll – невысокие цены. Сервис «Simpoll» Так, базовый тариф стоит 390 рублей в месяц (5 опросов, в каждом – 25 вопросов, 1500 ответов). Для компаний, которые часто проводят тестирование продуктов и услуг, подойдут тарифы «Профи» и «Корпоративный» – 690 и 1990 рублей в месяц. Здесь предоставляется неограниченное число опросов и вопросов, ответов – 30 тысяч и больше. Конструктор, который предлагает Simpoll, позволяет легко и быстро создавать формы опросов любой сложности: анкеты, голосования, тестирование. Для доступа к опросам не обязательно регистрироваться, достаточно аккаунта в соцсетях.  Функционал: в бесплатном тарифе доступны печатная версия для офлайн-опросов, управление логикой опроса, открытое API сервиса, которое расширяет возможности взаимодействия заказчика с Simpoll; для платных тарифов, помимо этого, отключается реклама Simpoll, нет ссылок на сервис, есть переадресация на нужный адрес после прохождения опроса; место под файлы – от 250 мб до 5 Гб в платных тарифах, 10 мб – в бесплатном; в тарифе «Профи» доступен экспорт результатов в формате Microsoft Excel с двумя видами отчетов – с суммарным результатом и детализированным по каждому респонденту; опросы распространяются через HTML-ссылки на сайтах, форумах, блогах, через всплывающие окна, прямые ссылки по e-mail и в соцсетях; в корпоративном тарифном плане можно проводить совместную работу над опросами, брендировать и оформлять дизайн под корпоративные цвета, размещать анкеты под собственным URL компании; расширенный выбор ответов – респонденты могут выбрать один или несколько ответов, написать собственный вариант, оценить по шкале и т.д.; можно устанавливать фильтры на ответы респондентов. Например, вы хотите знать, сколько мужчин среднего возраста ответили на ваш вопрос об автомобилях. Для этого в пункте «Условия фильтра» добавьте пол и возраст анкетируемых. Кстати, этим Simpoll отличается от многих других сервисов, где фильтры обычно устанавливаются на запросы по респондентам. Установка фильтров на ответы в Simpoll формирование опроса по гендерным признакам. Так, вначале запрашивается пол респондента: мужчина или женщина, исходя из результата, идет перенаправление на разные страницы; ограничение опроса по сроку проведения (день, месяц, полгода) и количеству респондентов; есть защита от повторного участия – по cookies или IP-адресу; мультиязычность позволяет проводить опросы на пяти языках (русский, белорусский, украинский, английский, немецкий); наблюдение за результатами анкетирования – в режиме реального времени по наглядным графикам; доступен просмотр геолокации участников и сколько времени они потратили на прохождение опроса онлайн и т.д. Online Test Pad Бесплатный многофункциональный сервис Online Test Pad, где можно создавать не только опросы и тесты, но и кроссворды всех типов, диалоговые тренажеры, логические игры, организовывать дистанционное обучение, проводить комплексные задания с использованием всех вышеназванных форм. Сервис «Online Test Pad» Доступные опции: формы Online Test Pad адаптивны для всех устройств: компьютеров, планшетов, мобильных телефонов; конструктор опросов имеет гибкую настройку параметров; можно создать небольшой сайт специально для опросов; предлагаются 11 типов вопросов, с одним или несколькими ответами на выбор из списка, свободным ответом, «Другое» и т.д.; просмотр статистики ответов по каждому вопросу; ответы показываются в таблице и графике, можно сохранить результаты в Excel и в изображении; широкие возможности для дизайна анкеты (шрифты, цвет, размер, рамки и т.д.); с добавлением логотипа бренда; доступ к опросу – через основную ссылку, виджет для сайта, блога или форума; можно опубликовать опрос в общем доступе на сервисе Online Test Pad, чтобы его прошли все желающие; рассылка приглашений по e-mail; расширенные настройки позволяют установить постраничное отображение отдельных вопросов; предварительный просмотр каждого вопроса и в целом созданной формы; есть ограничения на повторное прохождение опроса и другое. FormDesigner Российский конструктор. Интуитивно понятный Drag&Drop интерфейс позволяет быстро и легко создавать веб-формы пользователям без специальной подготовки.  Сервис «FormDesigner» Каталог шаблонов включает 92 позиции: опросы, тесты, калькуляторы, формы заказа и обратной связи, квизы (краткие опросы) и т.д. Все шаблоны распределены по категориям и типам. Например, вам нужно разместить на сайте онлайн-калькулятор строительства дома или провести опрос по подбору оптимальной недвижимости для клиентов – готовые формы есть на FormDesigner. Доступны платные и бесплатные шаблоны. В FormDesigner есть бесплатный тариф для опросов онлайн с традиционным набором: три опроса в месяц, по 10 вопросов каждый, количество ответов – не более 100. Для проведения расширенного тестирования следует воспользоваться платными версиями.  Платформа предоставляет три коммерческих тарифа: базовый (Basic), золотой (Gold) и платиновый (Platinum) с низкими ценами – от 5,45 $ до 10,99 $ за 1 месяц. При долгосрочном сотрудничестве предлагаются скидки: 3 месяца – 5 %, полгода – 10 %, год – 20 %.  Есть тарифы без абонентской платы. Удобно компаниям, которые проводят опросы нерегулярно. FormDesigner предлагает пакеты на 50, 100, 500 и 1000 заявок с неограниченным сроком действия.  Функционал: можно создавать веб-формы любой сложности – как простую рассылку по e-mail, так и объемные анкеты; предлагается 31 тип элементов форм на выбор; можно создавать многостраничные и персонализированные веб-формы; есть функция автосохранения данных; настройки параметров каждого поля формируются отдельно; при создании анкет отсутствуют ссылки на сайт сервиса; можно настроить собственный поддомен, чтобы в опросах отражался URL вашего сайта; количество заявок, отправленных респондентам – от 1 000 до 20 000, в зависимости от тарифа; доступна загрузка медиафайлов: тексты, графика, картинки, музыка, видео; рассылка e-mail- и sms-уведомлений; объемы дискового пространства для хранения файлов – от 100 МБ (бесплатный тариф) до 200 МБ и 2 ГБ (платные); доступны типовая графика для оформления, можно создать собственный дизайн веб-формы; интеграция с платежными, поисковыми системами и многое другое. В платных тарифах предоставляется тестовый период на 7 дней.   Questionstar Профессиональный конструктор опросов онлайн QuetionStar создан в Германии. Есть русскоязычный сайт, сервис соответствует законодательству РФ о защите персональных данных, предоставляет все необходимые документы для работы с юрлицами. Конструктор QuestionStar Так как сервис создан в академической среде он предоставляет тарифы не только для бизнеса, но и для образования и науки. Во всех тарифах, в том числе бесплатном, можно создавать неограниченное число опросов и вопросов. При этом количество активных опросов, которые стартовали и уже собирают данные, варьируется от 1 до 100, в зависимости от тарифа. Функционал QuestionStar предлагает 3000+ настроек и различных функций: более 30 типов вопросов с детальными корректировками; есть визуальный редактор; адаптивный дизайн для десктопов и мобильных гаджетов; автоматическое сохранение обезопасит вас от потери данных; форматирование текста, вставка изображений, таблиц, видео; простое перетаскивание элементов анкеты с помощью Drag'n'Drop; адаптация опроса под корпоративный стиль со вставкой логотипа; большой выбор графических шкал для ответов (звезды, смайлы, сердечки и пр.) все виды распространения опроса; можно проводить открытые и закрытые опросы с паролем или индивидуальной ссылкой; работает логика ветвления и отображения; и еще огромный перечень всех необходимых функций, которые мы перечисляли ранее в других сервисах. Сервис QuestionStar отличает тонкая настройка логики опросов (смена последовательности вопросов в зависимости от ответов), а также в конструктор встроена система статистической обработки результатов опросов.  Интерфейс понятен для профессионалов, обычным пользователям помогут всплывающие подсказки. В разделе «Поддержка» доступны подробные инструкции по всем этапам работы с сервисом, также можно задать вопросы по обратной связи. Вывод Выбор подходящего конструктора опросов онлайн зависит от целей и финансовых возможностей заказчика. В принципе, все платные версии сервисов опросов предлагают одинаковый набор функций и настроек, за небольшими различиями. Чтобы оценить возможности того или иного конструктора можно воспользоваться тестовыми периодами или бесплатными версиями. Но необходимо учитывать, что бесплатные тарифы на многих сервисах проведения опросов очень ограничены по функционалу и оценить все возможности системы не получится. Для тех, кто хочет создать опрос онлайн бесплатно – есть полностью бесплатные платформы, такие как Online Test Pad. В некоторых сервисах, например, Survio или Google Forms, есть бесплатные тарифы с расширенным функциональными возможностями. Если вам трудно самостоятельно выбрать конструктор с лучшей формой опроса – обращайтесь за консультацией в digital-агентство «Цифровой Элемент». Мы подберем наиболее подходящий для вашего бизнеса сервис опросов.  Услуга на Маркетинговый анализ Заказать услугу

    187K
    TОП-40 плагинов Figma
    РАЗРАБОТКА
    11.03.2021
    TОП-40 плагинов Figma

    Для создания дизайнов и прототипов большинство современных дизайнеров использует Figma. Его основное преимущество перед другими графическими программами заключается в возможности создавать дизайн онлайн вместе с коллегами. Единственным недостатком Figma считали отсутствие плагинов, дополнительных инструментов, которые позволяли бы оптимизировать и автоматизировать некоторые рутинные задачи. Но ситуация изменилась и сейчас в Figma более 400 плагинов. Давайте рассмотрим самые интересные плагины, которые облегчат вам работу с дизайном. Содержание Autoflow Avatars BeatFlyer Lite Blend Blobs Bullets Chart Charts Chroma Coda for Figma Color Kit Content Buddy Content Reel Design Lint Design System Organizer Dot Grid Figmoji Figmotion Font Scale Get Waves GiffyCanvas Humaaans for Figma Image tracer Isometric LilGrid LottieFiles Mapsicle Material Palette Movie Posters Palette Status Table Paste Themer TinyImage Compressor Translate Tumble Unsplash Vector Maps Webgradients Wire Box Autoflow Ссылка на плагин: https://www.figma.com/c/plugin/733902567457592893/Autoflow Плагин позволяет создавать связи кривыми между объектами, артбордами и расположением в 2 клика. С этим инструментом легко проиллюстрировать связи между экранами и схемы переходов от страницы к странице Avatars Ссылка на плагин: https://www.figma.com/community/plugin/739659977030056719/Avatars С помощью плагина вы можете генерировать аватарки вымышленных людей, в заданную дизайнером область (прямоугольник, звезда, многоугольник и т.д.). Плагин поддерживает множественную загрузку. BeatFlyer Lite Ссылка на плагин: https://www.figma.com/community/plugin/776923340646658146/BeatFlyer-Lite Этот плагин позволяет дизайнеру создать анимационные эффекты всего за пару кликов мыши. В анимацию можно добавлять сколько угодно эффектов. Blend Ссылка на плагин: https://www.figma.com/c/plugin/735442706723922553/Blend Этот инструмент помогает создать логотипы и паттерны (фоны) на основе экземпляра фигуры. Blobs Ссылка на плагин: https://www.figma.com/community/plugin/739208439270091369/Blobs Один из трендов современного дизайна – цветовое решение в виде капель (кривых Безье). Плагин «Blobs» помогает контролировать уникальность фигуры, количество точек и т.д. Bullets Ссылка на плагин: https://www.figma.com/community/plugin/734628505008435795/Bullets Редко, когда макет обходится без создания списков. Плагин Bullets позволяет создать стильные маркированные списки. Создавайте стили, сохраняйте их в Figma и используйте их в рамках работы над всем проектом. Chart Ссылка на плагин: https://www.figma.com/community/plugin/734590934750866002/Chart Плагин Chart позволяет создавать графики разнообразных форм. Работает как с рандомными данными, так и с данными клиента. Поддерживается копипаста из Google Sheet, Excel, Numbers, что значительно уменьшает время на обработку данных. Charts Ссылка на плагин: https://www.figma.com/community/plugin/731451122947612104/Charts Плагин Charts позволяет создавать линейные, круговые, кольцевые и многие другие диаграммы. Является неким аналогом Chart, так что стоит решить, каким плагином вам пользоваться удобнее. Chroma Ссылка на плагин: https://www.figma.com/c/plugin/739237058450529919/Chroma Плагин Chroma позволяет создать стили цвета. Нужно выбрать объекты с заливкой, запустить плагин, и цветовые стили сгенерируются автоматически. Удобно, когда не нужно искать нужные цвета, можно выбрать из генерируемых. Coda for Figma Ссылка на плагин: https://www.figma.com/community/plugin/738264841927149297/Coda-for-Figma С помощью этого плагина, вы сможете заполнять макеты данными из Wikipedia, Gmail, Github, Jira и т.д. Color Kit Ссылка на плагин: https://www.figma.com/community/plugin/797696673804519719/Color-Kit С помощью плагина Color Kit можно генерировать оттенки выбранного цвета от тёмных к светлым. Раннее дизайнерам требовалось использовать сторонние программы и приложения. Теперь получить 50 оттенков синего можно непосредственно в Figma. Content Buddy Ссылка на плагин: https://www.figma.com/c/plugin/731260490045684148/Content-Buddy Многие дизайнеры сталкивались с ситуацией, когда необходимо изменить одинаковый текст сразу в нескольких макетах. Раньше приходилось открывать каждый макет и отдельно и делать правку. Но плагин Content Buddy, позволяет организовать автоматическую правку одновременно в 50 макетах! Content Reel Ссылка на плагин: https://www.figma.com/community/plugin/731627216655469013/Content-Reel Этот плагин избавляет дизайнера от нужды придумывать «рыбный текст» для макета. Content Reel генерирует как текст, так и аватарки и имена пользователей, телефоны и адреса электронной почты, названия компаний и URL-адреса. Design Lint Ссылка на плагин: https://www.figma.com/community/plugin/801195587640428208/Design-Lint Многие дизайнеры знакомы с ситуацией, когда после сдачи макета, разработчики находят расхождения – несоответствие цветов, шрифтов, заливки и т.д. Design Lint избавляет дизайнера от таких ошибок. Он проверяет макет полностью и автоматически исправляет несоответствия. Инструмент работает динамически и учитывает при проверке уже внесённые дизайнером исправления. Плагин позволяет работать над макетом, не зацикливаясь на ошибках и мелких помарках. Design System Organizer Ссылка на плагин: https://www.figma.com/community/plugin/802579985985331070 Этот инструмент позволяет сгруппировать элементы в удобном интерфейсе. Таким образом можно упорядочить структуру, без утомительной работы. А значит, дизайнер избавлен от необходимости прописывать вручную такие пути как «Иконки / Маленькие / Состояния / По умолчанию». Если вы переименуете название группы, то это название будет автоматически изменено для всех компонентов и стилей. Dot Grid Ссылка на плагин: https://www.figma.com/community/plugin/795474715778185230/Dot-Grid Плагин для тех, кто работает с сетками. С его помощью, можно украсить точечную сетку согласно выбранным параметрам (ширина, длина, цвет, разрывы). Dot Grid поможет заполнить пустоту ненавязчивым привлекательным элементом. Figmoji Ссылка на плагин: https://www.figma.com/community/plugin/736612173445813953/Figmoji С помощью плагина Figmoji можно добавлять различные Эмодзи в формате svg. Figmotion Ссылка на плагин: https://www.figma.com/community/plugin/733025261168520714/Figmotion Один из нескольких представленных в нашей подборке инструментов для создания анимации. С его помощью можно прямо в Figma, не переключаясь на сторонние инструменты, добавлять в макет анимационные эффекты. Font Scale Ссылка на плагин: https://www.figma.com/community/plugin/741231992144144738/Font-Scale Это плагин для новичков в дизайне, которые ещё не приобрели навык автоматически, «на глаз», определять пропорции шрифтов. Font Scale позволяет быстро создать последовательную иерархию типографики. Get Waves Ссылка на плагин: https://www.figma.com/community/plugin/745619465174154496/Get-Waves С помощью плагина Get Waves вы сможете создавать собственные эффекты волн. GiffyCanvas Ссылка на плагин: https://www.figma.com/community/plugin/803633147991628761/GiffyCanvas Без этого плагина, дизайнеру приходится создавать изображения с расширением GIF в отдельной программе, а после загружать её в прототип. Плагин GiffyCanvas позволяет создать GIF прямо в Figma. Нужно только загрузить изображения, из которых должна получится гифка, и прописать чёткие параметры. Humaaans for Figma Ссылка на плагин: https://www.figma.com/community/plugin/739503328703046360/Humaaans-for-Figma Добавив плагин Humaaans for Figma, вы получаете возможность пользоваться огромной библиотекой с иллюстрациями людей. С этими иллюстрациями можно работать прямо в Figma, комбинируя, создавая новые образы. Плагин позволяет менять причёски и одежду, добавлять разное окружение. Image tracer Ссылка на плагин: https://www.figma.com/community/plugin/735707089415755407/Image-tracer Плагин Image tracer поможет вам преобразовать растровые чёрно-белые изображения в кривые, чтобы получить возможность внести изменения. Подходит для тех, кто часто теряет исходники логотипов и иконок. Isometric Ссылка на плагин: https://www.figma.com/community/plugin/741184519069077841/Isometric Плагин Isometric позволяет создать изометрическую проекцию дизайна прямо в Figma, не прибегая к помощи Photoshop и других графических программ. LilGrid Ссылка на плагин: https://www.figma.com/community/plugin/795397421598343178/LilGrid Плагин LilGrid стоит на страже порядка в вашем интерфейсе. Очень полезный инструмент для тех, кто хочет организовать максимально аккуратное рабочее пространство. При этом, LilGrid не поменяет элементы дизайна, а только поможет их упорядочить на холсте. LottieFiles Ссылка на плагин: https://www.figma.com/community/plugin/809860933081065308/LottieFiles Плагин LottieFiles позволяет украсить прототип анимациями. Плагин позволяет создавать собственные анимации или использовать готовые из библиотеки. Плагин позволяет вставлять анимационные фреймы как высококачественные SVG. Mapsicle Ссылка на плагин: https://www.figma.com/c/plugin/736458162635847353/Mapsicle В прототипе нужна карта? С плагином Mapsicle можно генерировать карты и вставлять в заданную область. При этом можно воспользоваться набором стилей и поиском по координатам. Material Palette Ссылка на плагин: https://www.figma.com/community/plugin/799767414861565467/Material-palette Многие дизайнеры используют инструмент Material Design для создания палитр. Теперь создавать палитры можно прямо в Figma, экономя время и силы. Сейчас в плагине три типа палитр: True monochrome, Monochrome и Material. Movie Posters Ссылка на плагин: https://www.figma.com/community/plugin/797471678566755597/Movie-Posters Movie Posters – полезный плагин для тех, кто занимается созданием сайта по тематике «Кино, ТВ и сериалы». В векторный объект, созданный дизайнером, подгружается постер фильма, сериала или ТВ-шоу, популярный на данный момент. Palette Ссылка на плагин: https://www.figma.com/community/plugin/742549221432366731/Palette Если вы любите эксперименты и «поиграть с цветами» – плагин Palette как раз для вас. Машинный интеллект генерирует автоматические палитры. Вы можете блокировать цвета, менять их местами. Плагин постоянно обновляется, туда добавляются новые варианты палитр, что позволяет экспериментировать на полную катушку. Status Ссылка на плагин: https://www.figma.com/community/plugin/742769304454952644/Status-%E2%9C%85 Плагин Status позволяет помечать статус дизайна. Когда над макетом работают несколько разработчиков, бывает трудно понять – какие страницы уже готовы к реализации, а над какими ещё ведётся работа. Воспользуйтесь плагином Status, чтобы решить эту проблему. Table Paste Ссылка на плагин: https://www.figma.com/community/plugin/781208362060364436/Table-Paste Table Paste – ещё один табличный плагин, который позволяет перенести данные из Excel в стилизованные таблицы в Figma. Работать с ним достаточно просто – нужно создать свой стиль таблицы, а затем переносить данные из Excel, они автоматически стилизуются. Themer Ссылка на плагин: https://www.figma.com/community/plugin/731176732337510831/Themer Дизайнеры знают, как много времени и нервов отнимают сложные макеты, когда требуется переключать темы. С помощью плагина Themer можно создавать «темы», закрепив за ними стили из библиотек. А затем по одному клику менять стили. TinyImage Compressor Ссылка на плагин: https://www.figma.com/community/plugin/789009980664807964/TinyImage-Compressor Плагин TinyImage Compressor позволяет экспортировать ваши файлы в Figma и сжать их размер без потери качества. Плагин оптимизирует JPEG, а также PNG без фона, автоматически преобразует множественную загрузку в ZIP-папку. Правда у плагина есть ограничение на сжатие 15 файлов бесплатно, после придётся приобрести лицензию, но многие дизайнеры отмечают, что плагин сжимает файлы на 90% лучше, чем встроенные инструменты Figma. Translate Ссылка на плагин: https://www.figma.com/community/plugin/733062974250826253/Translate Плагин Translate помогает автоматически перевести интерфейс на выбранный язык. Пока количество языков ограничено, но у расширения огромный потенциал. Tumble Ссылка на плагин: https://www.figma.com/community/plugin/736084415195819692/Tumble Плагин Tumble добавит эффект гравитации и прибьёт объекты к нижней границе фрейма. Таким образом, можно быстро создать забавные паттерны, которые «работают благодаря силе Ньютона». Unsplash Ссылка на плагин: https://www.figma.com/c/plugin/738454987945972471/Unsplash Плагин Unsplash интегрируется со стоковым сервисом и позволяет выбрать бесплатное стоковое изображение на любую тему. Можно использовать случайные снимки или поискать внутри расширения близкую по тематике. Vector Maps Ссылка на плагин: https://www.figma.com/community/plugin/777954172157933782/Vector-Maps С помощью Vector Maps можно загрузить в макеты векторные карты. Для выбора страны или региона достаточно ввести название в поиск или выбрать на карте. Карта импортируется в Figma в виде отдельного фрейма. Webgradients Ссылка на плагин: https://www.figma.com/community/plugin/802147585857776440/Webgradients В плагине Webgradients встроенный фильтр позволяет выбрать сочетания цветов для создания градиентов. Созданные градиенты можно добавить в избранное, чтобы, работая над разными страницами одного макета, экономить время на подборе. Wire Box Ссылка на плагин: https://www.figma.com/community/plugin/764471577604277919/Wire-Box Плагин Wire Box позволяет преобразовать макет высокой точности в варфреймы, помогая сосредоточиться на UX, а не на UI. Конечно, работать в системах hi-fi быстрее и проще, но иногда требуется вернуться в lo-fi. Изменение цвета прототипа на навязчивый розовый показывает, что прототип уже в варфрейме. Вывод С каждым днём Figma становится всё более и более удобной. Плагины ускоряют работу дизайнера, помогая ему эффективнее создавать макеты, прототипы. А скорость и удобство повышают творческий потенциал, позволяя уделить больше времени воплощению интересных задумок, креативным идеям.

    165K

    Заявка на услуги

    Мы перезвоним

    Остались вопросы? Мы перезвоним, ответим на вопросы и сформируем проектную команду под ваши цели и задачи.

    Ваш браузер не поддерживается

    К сожалению, Ваш браузер устарел, поэтому мы не можем гарантировать корректную работу сайта.

    Заявка успешно отправлена

    В ближайшее время с вами свяжется наш специалист и уточнит подробности.

    Что-то пошло не так

    Ваш запрос не может быть обработан.

    Заявка

    Для консультации или подготовки предложения.

    Вы уже проголосовали

    Изменить рейтинг этого материала вновь вы сможете лишь через некоторое время.

    Получить коммерческое предложение

    Оставьте свои контактные данные. Мы тут же соберём проектную команду и подготовим необходимое решение.

    Получить доступ к демо-версии

    Оставьте свои контактные данные для получения доступа к демо-версии

    Получить пример результата работ

    Запрос на результат работ -

    Отправлено!

    Прислали статью на указанную почту

    Спасибо, что подписались на нашу рассылку.

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