У новій серії статей я хотів би розглянути деякі інструменти ближче і показати на прикладах їх використання. Перша стаття буде присвячена найефективнішому і найпростішому рішенню — сніппетам. У цій статті ми розглянемо приклади створення статичних та динамічних сніпетів при роботі з десктопом та мобільними програмами. Пам'ятайте, що сніпети - це універсальний інструмент, який може використовувати будь-який фахівецьпрацює з текстовою інформацією. Весь процес розглядатимемо на прикладі програми TextExpander для macOS. Є версії під Windows, Chrome, iOS. Це найфункціональніший інструмент. Вартість: $4.16 щомісяця або $3.33 на місяць при річній передплаті. Як альтернативу я б радив спробувати PhraseExpress. Є версії для MacOS, Windows, iOS, Android. У macOS є вбудована автозаміна. Знайти її можна шляхом: «Налаштування» → «Клавіатура» → «Текст».
Допустимо, ми хочемо автоматизувати процес створення звітів про дефекти.Для початку створимо найповніший шаблон для заповнення опису в баг-трекінговій системі Jira. Враховуватимемо те, що в майбутньому ми захочемо створити всі комбінації полів, що найчастіше використовуються, для заповнення опису звітів. Приступимо. Тепер потрібно створити новий сніпет, присвоїти йому ім'я та абревіатуру. Ім'я — ідентифікатор, за допомогою якого можна швидко визначити, що міститься в сніпеті та знайти його за потреби. Абревіатура — послідовність символів, при введенні яких вставлятиметься вміст сніпету. Ось кілька властивостей хороших абревіатур:
Наприклад, у мене цей набір виглядає так: Розглянемо ще кілька прикладів. Наприклад, мені потрібно швидко вшити посилання в текст під час оформлення звіту. При використанні вбудованого інструменту Jira це виглядає так:
Тепер удосконалимо наш перший шаблон. Допустимо, ви мобільний тестувальник, у вас є парк мобільних пристроїв, частина якого закріплена за вами. Ви тестуєте на цих пристроях найчастіше, і вам хотілося б мати їхній список під рукою при оформленні звіту про дефект. Для початку створимо перелік пристроїв. Зробимо це за допомогою опціональних для вибору елементів.
При вставці динамічних елементів, які очікують від користувача будь-яких дій (заповнення, вибір тощо), відкриватиметься окреме вікно, в якому над цими елементами потрібно буде зробити відповідні дії. Ще один приклад: створення шаблонів структури робочих нотаток. Я веду нотатки з підтримкою markdown для білдів мобільних додатків з певною структурою та використовую сніпети для їхнього швидкого генерування.
Розглянемо створення звіту про тестування. Припустимо, що раз на тиждень ми пишемо звіт про нові проекти у мобільних додатках. Використовуємо динамічні елементи, форматований текст та картинки.
В Android можна використовувати Texpand чи Gboard. На жаль, в обох програмах немає можливості синхронізації між пристроями. Gboard підтримує лише звичайний текст. По суті, це розширений буфер обміну, в якому можна закріплювати деякі з фрагментів. У TextExpander всі сніпети синхронізуються між десктопною та мобільною версією. У мобільній версії є низка обмежень у порівнянні з десктопною версією:
Ми розглянули роботу статичних та динамічних сніпетів на прикладі створення тестової документації. Їх також можна використовувати для створення різного роду листів (поштових розсилок, що повторюються, пропозицій про розгляд вакансій і т. д.), структури документів і нотаток, генерації коду і багато чого ще. Дякую за те, що дочитали статтю до кінця. Сподіваюся, інформація, викладена в ній, виявиться вам корисною, і ви зможете заощадити час, використовуючи її на практиці. Якщо у вас виникли будь-які питання за статтею — радий на них відповісти. У наступній статті я планую написати про використання скриптових сніппетів. А поки що пропоную підписатися на мій Telegram-канал, де я публікую всю решту інформації на тему тестування. У пошуковій видачі Яндекс і Google відображаються посилання на сайти у супроводі коротких анонсів, що отримали назву Сніппет. Вони впливають як на просування, так і на обсяг органічного трафіку: чим ширше і зрозуміліше сніппет, тим більше кліків та цільових переходів отримує сайт. Пошуковики висувають різні вимоги, їх потрібно враховувати для формування анонсів. Розповідаємо про сніпет - що це простими словами і яке значення має, пояснюємо, як розширити його і яких помилок варто уникати. Слово Сніппет походить від англійської snippet - "фрагмент", термін позначає анонс сторінок, що відображається в пошуковій видачі. До структури входить пошуковий заголовок (title), а також текстовий фрагмент, що є найбільш релевантним. Класична структура блоку: Яку структуру має сніпет в Яндекс Існують розширені анонси – покращені версії, в яких додатково розкриваються зображення, довгі фрагменти тексту, таблиці та інші елементи, які роблять анонс привабливішим та підвищують його клікабельність. Остання робить непрямий вплив на позиції сайту в пошукових системах, наприклад, Яндекс враховує CTR (коефіцієнт клікабельності) як фактор поведінки. Основна функція СНІПЕТу – інформування аудиторії про те, що представлено на сторінці. Користувачі читають короткі описи та заголовки, а потім визначають, чи вони релевантні введеному пошуковому запиту. Якщо людина бачить, що опис та заголовок відповідають інтересу – клікає та переходить на сайт, що впливає як на пошукове просування, так і на відвідуваність, комерційні показники. Друге призначення сніпету - SEO-просування: алгоритми пошукових систем враховують, як часто користувачі переходять на сайт, скільки часу вони на ньому проводять, який показник відмов фіксується після відкриття сторінок. Погіршення поведінкових чинників знижує позиції ресурсу: алгоритми вважають, що контент є корисним або нерелевантним запиту, тому відбувається песимізація. Якісний анонс у комплексі з корисним контентом та оптимізацією приносить сайтам органічний трафік: користувачі заходять прямо з пошукової системи, а не через рекламу чи за рекомендацією лідерів думок. Все це позитивно впливає на розкручування, обсяг маркетингового бюджету та можливості залучення нових потенційних клієнтів. Сніпети в Яндекс, при натисканні на «Читати ще» доступна додаткова інформація Пошуковики використовують набір алгоритмів для формування СНІПЕТу, тому передбачити його зовнішній вигляд або впливати на нього досить складно. Title створюється із заданого при оптимізації сторінки тексту, якщо поле не заповнене або містить помилки – автоматично, виходячи із змісту сторінки. Опис часто ґрунтується на description, в Яндекс алгоритми вибирають релевантний фрагмент тексту, обсяг якого досягає 220 символів, іноді підтягуються дані з Яндекс.Каталогу або Маркету. SEO-оптимізація та додаткові інструменти допомагають надавати непрямий вплив на структуру та обсяг анонсу, але вирішальне слово завжди залишається за пошуковими системами, ще один момент – параметри екрану, на якому користувачі переглядають інформацію (визначають структуру та довжину). Працюючи зі сниппетом, потрібно вміти лавірувати між вимогами пошукових систем, альтернатива – орієнтування на ту, яка приносить більше трафіку. Оформлення сніпетів у Google Згідно з Яндекс Довідкою, анонси в результатах пошуку створюються на базі метатегів (title, description) та тексту сторінки, мікророзмітки Schema.org. Враховуються такі джерела, як Каталог та Маркет, а також тексти посилань на сторінку на інших сайтах. У видачу виводяться найбільш корисні та релевантні формулювання, що повністю відповідають запитам користувачів. У Яндекс більш заплутані алгоритми формування СНІП, якщо порівнювати з Google, передбачити їх складно. Метатеги враховуються обов'язково, але використовуються не завжди: заголовком може стати частина тексту сторінки, а описом уривок, який машина вважає найбільш релевантним. Окреме питання – картинки: вони часто видно прямо у видачі з мобільних пристроїв, а з десктопних – лише у певних нішах, наприклад, пов'язаних із кулінарією чи модою. Розмір анонсу в Яндекс може досягати 300 символів (не плутати з пошуковим заголовком), до складу входять ключове слово та фрагмент тексту, насичений запитами. Як формується сніпет в Яндекс: Довідка У пошуковій системі
Google принцип створення анонсів більш зрозумілий, основне джерело інформації – метатеги, задані користувачем під час SEO-оптимізації сторінки. Головне – прописати коректні title та description з ключовими словами, але без переспаму, що точно відображають зміст сторінки та запити, які були використані для просування. Якщо метатеги не створені або не є коректними, алгоритми Google сформують їх автоматично. У випадку, коли всі вимоги пошуковика дотримані, до анонсу потрапить інформація, задана власником сайту або вебмайстром. Раніше розмір сніпета в пошуковику становив до 160 знаків, сьогодні - 230. Збільшення ліміту орієнтоване на користувачів, які отримують більше інформації без необхідності переходити на сайт з видачі. Розширений сніпет – покращений результат у пошуковій видачі, що реалізується за рахунок додаткових елементів контенту. Суттєво підвищує видимість для користувачів та покращує клікабельність. Основна перевага – більше інформації, тому сайти з розширеними сніпетами вигідно відрізняються від конкурентів з короткими анонсами та посиланнями. До розширеного snippet можуть входити: Розширений сніпет з цінами, рейтингом та додатковими посиланнями в Google Додавання корисних елементів безпосередньо залежить від вмісту сторінки, якщо йдеться про прайс - користувачі побачать ціни і картинки, в рецептах або інструкціях - текстові описи, у випадку з FAQ - питання-відповідь. Розширені snippet є у всіх пошукових системах, розрізняються лише алгоритми їх формування та оформлення. Існують рекомендації, перевірені досвідом та результатами, які можна впровадити при оптимізації сторінок. Усі сторінки, що беруть участь у ранжируванні, повинні відповідати вимогам пошукових систем.Стандарти якості пошукових систем різняться, виділимо усереднені параметри: Останній момент – загальна якість: ні Google, ні Яндекс не просуватимуть сторінки, наповнені спамним контентом або посиланнями, що мають дуже негативні фактори користувача. Витяг з технічних вимог Google Пошуку У межах реалізації мікророзмітки здійснюється поділ коду сторінки з урахуванням типу даних. Мікророзмітка доступна для пошукових роботів, вона не змінює вигляд сайту і залишається непомітною для користувачів. Розглянемо на прикладі інтернет-магазину, що можна виділити: Для створення використовуються різні стандарти, найпопулярніший –
Schema.org, до якого лояльно ставляться усі пошукові системи, альтернатива – Microformats.org. Мікророзмітка забезпечує систематизацію контенту для пошукових роботів та оптимізацію сторінок для голосового пошуку, підвищує шанси формування розширеного сниппета. Розширені сніпети в Яндекс В Яндекс посилання називаються швидкими, в Google - додатковими, але вони розміщуються в пошуковій видачі. Ведуть на розділи сайту, що просувається, виконуючи допоміжну функцію і покращуючи видимість у пошукових системах. Додавання відбувається автоматично на базі поведінки користувачів, статистики найбільш відвідуваних розділів та інших параметрів. Лінки можуть бути розміщені у формі блоку (друг під одним) або в один рядок. Для отримання швидких/додаткових посилань рекомендується: Так виглядають швидкі посилання В Яндекс умови схожі (докладніше – у Довідці), а створення швидких посилань виконується з внутрішніх лінків сайту: використовуються виділені в меню або отримують багато переходів зі сторінки, для якої формуються. У Google виключити сторінку з блоку, що розглядається, можна або шляхом видалення, або через заборону індексації, в Яндекс доступне управління з панелі Вебмайстра. Умови для відображення швидких посилань: Яндекс.Довідка Пошукові системи не дають жодних гарантій, що сніпет буде виглядати так, як хоче власник сайту або спеціаліст з оптимізації. Якщо анонс не розширився/не видозмінився, можна провести додатковий пошук помилок: Причина може бути банальною – система просто не проіндексувала сторінку після внесених змін (може зайняти як кілька днів, так і тиждень), трохи почекати. Ще один варіант – сторінка прихована від індексації, тому роботи не можуть її сканувати. Ми розповіли, що означає сніпет для сайту, його зовнішній вигляд – основа підвищення клікабельності, отримання органічного трафіку та покращення позицій у пошукових системах. На оформлення анонсу впливає маса параметрів – від правильної структури сайту до контенту та метатегів, які використовуються для наповнення. Варто добуквенно дотримуватись вимог пошукових систем, виконувати якісну SEO-оптимізацію та залучати фахівців, які вже мають досвід формування розширених сніпетів та вміють працювати з мікророзміткою. Після впровадження змін потрібно почекати кілька днів (залежить від пошукової системи), якщо анонс залишився колишнім – доведеться проводити роботу над помилками, але позитивний результат все одно не може бути гарантованим. Сніппет – це візитна картка вашого сайту в пошукових системах та в очах користувачів. Саме сніпет першим відображається в пошуковій видачі, а значить - формує у потенційного клієнта уявлення про вас. Однак помилково думати, що роль Сніппет обмежується тільки цим. Цей елемент також істотно впливає на кількість кліків і переходів і, отже, на просування сайту в пошукових системах. У статті ми докладніше поговоримо про те, що є сніпетом, як він впливає на позиції сайту у видачі, як його правильно заповнити та оптимізувати. Термін "сніппет" походить від аналогічного англійського snippet, тобто "фрагмент". Це короткий анонс сторінки, який відображається у пошуковій видачі та дає загальне уявлення про її вміст. Читаючи текст Сніппет, користувач вже розуміє, чи варто йому переходити на сайт, або на цьому ресурсі немає того, що він шукає. Текст має бути максимально релевантним та чіпляючим. Якщо текст «водянистий» і «ні про що», або просто не відповідає на запити користувача, переходити за посиланням йому не захочеться. Чим краще складено та оптимізовано сніпет, тим більше переходів на сайт, тобто вище показник клікабельності CTR. Сніппети бувають простими та доповненими. Вважається, що для комерційних сайтів, інтернет-магазинів сніпет розширеного вигляду несе більше користі, але в цілому вибір залишається на розсуд власника сайту. У базовому варіанті сніпет містить наступні елементи: Для того щоб блок привертав увагу аудиторії і працював на просування, важливо приділити увагу його заповненню. Оформлення Сніппет теж має свої правила, як і SEO-оптимізація або налаштування контекстної реклами. Поговоримо детальніше про складові сніпету і про те, якими вони мають бути. У пошуковій видачі Яндекса та Гугла заголовок для сніпету автоматично підтягується з поля Title. Тому тайтл сторінки завжди має бути грамотно оптимізований, щоб привертати увагу користувача та «збирати» більше кліків. Вдалим вважається заголовок, що містить ключовий запит та заклик до дії. Якщо поле Title не заповнене, пошукова система сама формує заголовок на основі підзаголовків h1-h6 і всього тексту, розміщеного на сторінці. У цьому випадку Сніппет ризикує отримати не найвдалішу назву, тому найкраще рішення - заповнювати тайтли для всіх сторінок сайту. Логічно припустити, що опис для Сніппет підтягується з мета-тега Description, але це не зовсім так. Описовий блок справді створюється на основі дескрипшну, але не завжди повністю дублює його. Щоб пошуковик згенерував адекватний опис, мета-тег Description також слід заповнювати відповідно до вимог SEO. Якщо поле не заповнене, система сама вибере шматок тексту, в якому фігурує запит користувача, проте цей шматок може виявитися не самим релевантним, або в цілому не придатним для «візитної картки» сторінки. Найчастіше система формує опис на основі фрагмента, що вважає найбільш інформативним. Були зафіксовані і такі випадки, коли пошуковик додавав в опис СНіПЕТу відгуки користувача, що містять в тому числі негатив. Щоб такого не відбувалося, робіть максимально релевантні тексти, грамотно заповнюйте мета-тег Description для кожної сторінки та приховуйте від індексації невигідні блоки.Сніппети. Як зробити процес роботи з документацією простіше
Привіт, Хабре! Мене звуть Павло Лесюк. Я тестувальник нативних мобільних додатків. У своїй попередній статті я навів список інструментів, які можуть використовуватися тестувальниками та іншими фахівцями для підвищення продуктивності своєї роботи.
Сніпетети - Це фрагменти тексту (коду), які зберігаються для подальшого багаторазового використання. Сніппети бувають трьох видів: статичні (звичайний текст), динамічні (з використанням змінних) та скриптові (З використанням коду).Інструменти для робочого столу
У ній підтримується лише звичайний текст, тому її можна використовувати лише для простих шаблонів.Заповнення звітів про дефекти
Створення групи сніпетів
Привласнення імені та абревіатури
Заповнення сніпету
Ми створили статичний сніпет. Символи «*» та «#» – синтаксис форматування в Jira (жирний та нумерований список відповідно). Подивимося, як працює вставка.
Набагато краще, ніж вводити все це вручну або шукати потрібний шаблон у нотатках, чи не так? У налаштуваннях можна встановити параметри вставки сніпету. Вставка може відбуватися відразу після введення або натискання клавіші-обмежувача.
Таким же чином можемо створити шаблони для всіх комбінацій полів, що використовуються в описі звіту про дефект. Можна створити саме той набір шаблонів, який ми використовуватимемо найчастіше.
Використання динамічних елементів
Начебто непогано, ми можемо відразу почати друкувати. Але що якщо я хочу замість example.com вставляти вже скопійоване посилання з буфера обміну? Для цього нам знадобиться можливість створення динамічного контенту всередині сніпету.
За допомогою динамічних елементів ми вставляємо скопійований у буфер обміну контент та встановлюємо курсор у потрібну нам позицію. Подивимося, як працює вставка.
Далі створимо список хостів, на яких проводимо тестування. Додамо до нашої групи новий сніпет і знову використовуємо опціональні елементи.
Чудово! Тепер перейдемо до нашого основного Сніппет і збагатимо його контентом.
Ми додали вставку опціональних елементів з інших сніпетів і встановили позицію курсору, щоб можна було відразу розпочати введення тексту. Подивимося як працює наш удосконалений сніпет.Створення шаблонів нотаток
Нижче показано приклад вставки готового шаблону в нотатки.Заповнення тестових форм
Під час роботи з веб-додатками можна використовувати сніпети для заповнення форм даними.
За допомогою імітації натискання кнопки Tab перехід між полями відбувається автоматично.Створення звітів
У результаті отримаємо готову структуру звіту, яку можна швидко заповнити потрібними значеннями та надіслати листа.Інструменти для мобільних ОС
Android
У Texpand можливості ширші. У безкоштовній версії є підтримка 10 сніпетів, динамічних дати та часу, вставки з буфера обміну та встановлення позиції курсору. Також можна створити бекап та імпортувати сніпети на інші пристрої. iOS
Нижче показано приклад роботи з динамічним сніппетом.Висновок
Що таке сніпет сайту - пояснюємо простими словами як зробити сніпет сайту для пошукової видачі
Що таке Сніппет сайту
Навіщо потрібен сніпет
Принципи формування сніпету в пошукових системах
Максимальний розмір сніпету в Яндекс
Вимоги до сніпету в Google
Що таке розширений сніпет
Як зробити розширений сніпет самостійно
Відповідність вимогам пошукової системи
Додавання мікророзмітки
Робота зі швидкими посиланнями
Все зроблено, але сніпет не змінився і не розширився - в чому причина
На закінчення
Що таке сніпети, і як вони впливають
на просування сайту Що таке Сніппет
З чого складається сніпет
Яким має бути сніппет
Заголовок в сніпеті
Опис