Создание гиперссылок | MDN
- Назад
- Обзор: Introduction to HTML
- Далее
Гиперссылки действительно важны — они делают Интернет Интернетом. В этой статье представлен синтаксис, необходимый для создания ссылки, а также обсуждаются лучшие практики обращения со ссылками.
| Предварительные требования: | Базовое знакомство с HTML, описанное в статье Начало работы c HTML. Форматирование текста в HTML, описанное в статье Основы редактирования текста в HTML. |
|---|---|
| Задача: | Научиться эффективно использовать гиперссылки и связывать несколько файлов вместе. |
Гиперссылки — одно из самых интересных нововведений Интернета. Они были особенностью Сети с самого начала, но именно они превращают Интернет в Интернет. Они позволяют нам связывать наши документы с любым другим документом (или ресурсом), с которым мы хотим. С их помощью мы также можем связывать документы с их конкретными частями, и мы можем сделать приложения доступными на простом веб-адресе (сравните это с локальными приложениями, которые должны быть установлены, и другими такими же вещами).
Примечание: URL-адрес может указывать на файлы HTML, текстовые файлы, изображения, текстовые документы, видео и аудиофайлы и все остальное, что может жить в Интернете. Если веб-браузер не знает, как отображать или обрабатывать файл, он спросит вас, хотите ли вы открыть файл (в этом случае обязанность открытия или обработки файла передаётся в соответствующее локальное приложение на устройстве) или загрузить файл (в этом случае вы можете попытаться разобраться с ним позже).
Например, домашняя страница BBC содержит большое количество ссылок, которые указывают не только на множество новостей, но и на различные области сайта (меню), страницы входа / регистрации (пользовательские инструменты) и многое другое.
Простая ссылка создаётся путём обёртывания текста (или другого содержимого, смотрите Ссылки-блоки), который вы хотите превратить в ссылку, в элемент <a>, и придания этому элементу атрибута href (который также известен как гипертекстовая ссылка, или цель), который будет содержать веб-адрес, на который вы хотите указать ссылку.
<p>Я создал ссылку на <a href="https://www.mozilla.org/ru/">домашнюю страницу Mozilla</a>. </p>
Это дало нам следующий результат:
Я создал ссылку на домашнюю страницу Mozilla.
Добавляем информацию через атрибут title
Другим атрибутом, который вы можете добавить к своим ссылкам, является —
<p>Я создал ссылку на
<a href="https://www.mozilla.org/ru/"
title="Лучшее место для поиска дополнительной информации
о миссии Mozilla и о том, как внести свой вклад">домашнюю страницу Mozilla
</a>.
</p>
Вот что получилось (описание появится, если навести курсор на ссылку):
Я создал ссылку на домашнюю страницу Mozilla.
Примечание: Описание из атрибута title отображается только при наведении курсора, значит люди, полагающиеся на клавиатурные элементы управления для навигации по веб-страницам, будут испытывать трудности с доступом к информации, которую содержит title.
Если информация заголовка действительно важна для удобства использования страницы, то вы должны представить её таким образом, который будет доступен для всех пользователей, например, поместив её в обычный текст.
Активное изучение: создаём собственную ссылку
Время упражнения: мы хотели бы, чтобы вы создали любой HTML-документ в текстовом редакторе на своём компьютере (наш базовый пример подойдёт.)
- Попробуйте добавить в тело HTML один или несколько абзацев или другие элементы, о которых вы уже знаете.
- Теперь превратите некоторые фрагменты документа в ссылки.
- Добавьте ссылкам атрибут
title.
Ссылки-блоки
Как упоминалось ранее, вы можете превратить любой элемент в ссылку, даже блочный элемент. Если у вас есть изображение, которые вы хотели бы превратить в ссылку, вы можете просто поместить изображение между тегами <a></a>.
<a href="https://www.mozilla.org/ru/"> <img src="mozilla-image.png" alt="логотип mozilla со ссылкой на их домашнюю страницу"> </a>
Примечание: вы узнаете гораздо больше об использовании изображений в Интернете в следующей статье.
Чтобы полностью понять адреса ссылок, вам нужно понять несколько вещей про URL-адреса и пути к файлам. Этот раздел даст вам информацию, необходимую для достижения этой цели.
URL-адрес (Uniform Resource Locator, или единый указатель ресурса, но так его никто не называет) — это просто строка текста, которая определяет, где что-то находится в Интернете. Например, домашняя страница Mozilla находится по адресу https://www.mozilla.org/ru/.
URL-адреса используют пути для поиска файлов. Пути указывают, где в файловой системе находится файл, который вас интересует. Давайте рассмотрим простой пример структуры каталогов (смотрите каталог creating-hyperlinks.)
Корень структуры — каталог creating-hyperlinks
В корне у нас есть два файла — index.html и contacts.html. На настоящем веб-сайте index.html был бы нашей домашней, или лендинг-страницей (веб-страницей, которая служит точкой входа для веб-сайта или определённого раздела веб-сайта).В корне есть ещё два каталога — pdfs и projects. У каждого из них есть один файл внутри — project-brief.pdf и index.html, соответственно. Обратите внимание на то, что вы можете довольно успешно иметь два index.html файла в одном проекте, пока они находятся в разных местах файловой системы. Многие веб-сайты так делают. Второй index.html, возможно, будет главной лендинг-страницей для связанной с проектом информации.
Примечание: вы можете объединить несколько экземпляров этих функций в сложные URL-адреса, если необходимо, например:
Фрагменты документа
Можно ссылаться на определённую часть документа HTML (известную как фрагмент документа), а не только на верхнюю часть документа.
Для этого вам сначала нужно назначить атрибут id элементу, с которым вы хотите связаться. Обычно имеет смысл ссылаться на определённый заголовок, поэтому это выглядит примерно так:
<h3>Почтовый адрес</h3>
Затем, чтобы связаться с этим конкретным id, вы должны включить его в конец URL-адреса, которому предшествует знак решётки, например:
<p>Хотите написать мне письмо? Используйте наш <a href="contacts.html#Почтовый_адрес">почтовый адрес</a>. </p>
Вы даже можете использовать ссылку на фрагмент документа отдельно для ссылки на другую часть того же документа:
<p> <a href="#Почтовый_адрес">Почтовый адрес компании</a> можно найти в нижней части этой страницы. </p>
Абсолютные и относительные URL-адреса
Два понятия, с которыми вы столкнётесь в Интернете, — это абсолютный URL и относительный URL:
- Абсолютный URL
Указывает на местоположение, определяемое его абсолютным местоположением в Интернете, включая протокол и доменное имя.
Например, если страница index.htmlзагружается в каталог, называемыйprojects, который находится внутри корня веб-сервера, а домен веб-сайта —http://www.example.com, страница будет доступна по адресуhttp://www.example.com/projects/index.htmlhttp://www.example.com/projects/), так как большинство веб-серверов просто ищет целевую страницу, такую какindex.html, для загрузки, если он не указан в URL-адресе.).
Абсолютный URL всегда будет указывать на одно и то же местоположение, независимо от того, где он используется.
- Относительный URL
Указывает расположение относительно файла, с которого вы связываетесь, это больше похоже на случай, который мы рассматривали в предыдущей секции. Для примера, если мы хотим указать со страницы
http://www.example.com/projects/index.htmlна PDF файл, находящийся в той же директории, наш URL может быть просто названием файла —project-brief.— никакой дополнительной информации не требуется. Если PDF расположен в поддиректории
pdfpdfsвнутри каталогаprojects, относительная ссылка будетpdfs/project-brief.pdf(аналогичный абсолютный URL был быhttp://www.example.com/projects/pdfs/project-brief.pdf.).
Относительный URL будет указывать на различные места, в зависимости от того, где находится файл, в котором он используется, — например, если мы переместим наш файл index.html из каталога projects в корневой каталог веб-сервера (верхний уровень, не в директорию) , то относительный URL pdfs/project-brief.pdf будет вести на http://www.example.com/pdfs/project-brief.pdf, а не на http://www.example.com/projects/pdfs/project-brief.pdf.
Советуем вам основательно разобраться в этой теме!
При написании ссылок рекомендуется следовать некоторым правилам. Давайте рассмотрим их.
Используйте чёткие формулировки описания ссылок
На вашей странице легко добавить ссылки. Но этого не совсем достаточно. Мы должны сделать наши ссылки доступными для всех читателей, независимо от их возможностей и инструментов просмотра страницы, которые они предпочитают. Например:
- Пользователям программ читающих с экрана нравится переходить по ссылкам на странице, читая адрес ссылки в тексте.
- Поисковые системы используют текст ссылки для индексирования файлов, поэтому рекомендуется включать ключевые слова в текст ссылки, чтобы эффективно описывать, куда ведёт ссылка.
- Пользователи часто бегло просматривают страницу, не читая каждое слово, и их глаза будут привлечены к тексту, который выделяется, например, ссылки. Им будет полезно описание того, куда ведёт ссылка.
Взгляните на этот пример:
Хороший текст ссылки: Скачать Firefox
<p><a href="https://firefox.com/"> Скачать Firefox </a></p>
Плохой текст ссылки: Нажми сюда, чтобы скачать Firefox
<p><a href="https://firefox.com/"> Нажми сюда </a> чтобы скачать Firefox</p>
Советы:
- Не пишите URL-адрес как часть текста ссылки. URL-адреса выглядят сложными, а звучат ещё сложнее, когда программы чтения с экрана читают их по буквам.
- Не пишите «ссылка» или «ссылки на» в тексте ссылки — это лишнее. Программы чтения с экрана сами проговаривают, что есть ссылка. На экране пользователи также видят, что есть ссылка, потому что ссылки, как правило, оформлены в другом цвете и подчёркнуты (подчёркивая ссылки, вы соблюдаете правила хорошего тона, поскольку пользователи привыкли к этому).
- Следите за тем, чтобы текст ссылки был как можно короче. Длинный текст ссылки особенно раздражает пользователей программ чтения с экрана, которым придётся услышать всё, что написано.
- Минимизируйте случаи, когда несколько копий одного и того же текста ссылок указывает на разные страницы. Это может вызвать проблемы для пользователей программ чтения с экрана, которые часто вызывают список ссылок — несколько ссылок, помеченных как «нажмите здесь», «нажмите здесь», «нажмите здесь», будут путать.
Используйте относительные ссылки, где это возможно
Из прочитанного выше, вы можете подумать, что всё время использовать абсолютные ссылки — хорошая идея; в конце концов, они не ломаются, когда страница перемещается. Тем не менее, лучше использовать относительные ссылки везде, где это возможно, в пределах одного сайта (при ссылке на другие сайты необходимо использовать абсолютную ссылку):
- Во-первых, гораздо проще прописать в коде относительные URL-адреса, как правило, они намного короче абсолютных URL-адресов, что значительно упрощает чтение кода
- Во-вторых, использование относительных URL-адресов эффективней по следующей причине. Когда вы используете абсолютный URL-адрес, браузер начинает поиск реального местоположения сервера запрашивая адрес у Domain Name System (DNS; также прочтите Как работает web), затем он переходит на этот сервер и находит файл, который запрашивается. С относительным URL-адресом проще: браузер просто ищет файл, который запрашивается на том же сервере.
Используя абсолютные URL-адреса вместо относительных, вы постоянно нагружаете свой браузер дополнительной работой.
Создавая ссылки на не HTML ресурсы — добавляйте описание
Когда вы создаёте ссылку на файл, нажав на который можно загрузить документ PDF или Word или открыть просмотр видео, прослушивание аудио файла или перейти на страницу с другим, неожиданным для пользователя результатом (всплывающее окно или загрузка Flash-фильма), добавляйте чёткую формулировку, чтобы уменьшить путаницу. Отсутствие описания может раздражать пользователя. Приведём пример:
- Если вы используете соединение с низкой пропускной способностью и вдруг нажмёте на ссылку без описания, начнётся загрузка большого файла.
- Если у вас нет установленного Flash-плеера и вы нажмёте ссылку, то внезапно перейдёте на страницу с Flash-контентом.
Посмотрите на примеры, чтобы увидеть, как добавить описание:
<p><a href="http://www.example.com/large-report.pdf"> Скачать отчёт о продажах (PDF, 10MB) </a></p> <p><a href="http://www.example.com/video-stream/"> Посмотреть видео (видео откроется в отдельном окне, HD качество) </a></p> <p><a href="http://www.example.com/car-game"> Играть в гонки (необходим Flash) </a></p>
Используйте атрибут download, когда создаёте ссылку
Когда создаёте ссылку на файл, который должен быть загружен, а не открыт в браузере, можете использовать атрибут download, чтобы создать имя файла по умолчанию для сохранения . Приведём пример ссылки для загрузки браузера Firefox 39:
<a href="https://download.mozilla.org/?product=firefox-39.0-SSL&os=win&lang=en-US" download="firefox-39-installer.exe"> Скачать Firefox 39 для Windows </a>
Для этого упражнения мы хотим, чтобы вы создали ссылки на страницы в меню навигации в многостраничном сайте. Это один из распространённых способов создания сайта: на каждой странице используется одна и та же структура страниц, включая одно и то же меню навигации, поэтому при нажатии ссылок создаётся впечатление, что вы остаётесь в одном месте: меню остаётся на месте, а контент меняется.
Вам нужно скачать или создать следующие страницы в одном каталоге (Смотрите navigation-menu-start):
- index.html
- projects.html
- pictures.html
- social.html
Что делать:
- Добавьте неупорядоченный список в указанном месте в любом html-файле. Список должен состоять из имён страниц (index, projects и т.д.). Меню навигации обычно представляет собой список ссылок, поэтому создание неупорядоченного списка семантически верно.
- Создайте ссылки каждому элементу списка, ведущие на эти страницы.
- Скопируйте созданное меню в каждую страницу.
- На каждой странице удалите только ссылку, которая указывает на эту же страницу (на странице index.html удалить ссылку index и так далее). Дело в том, что, находясь на странице index.html, нам незачем видеть ссылку в меню на эту же страницу. С одной стороны, нам незачем ещё раз переходить на эту же страницу, с другой, такой приём помогает визуально определить, смотря на меню, в какой части сайта мы находимся.
Когда закончите задание, посмотрите, как это должно выглядеть:
Примечание: Если не удаётся сделать, или вы не уверены, что сделали верно, посмотрите наш вариант navigation-menu-marked-up.
Можно создавать ссылки или кнопки, которые при нажатии открывают новое исходящее сообщение электронной почты, а не ссылку на ресурс или страницу. Для этого используется элемент <a> и mailto: — адрес почты.
Самыми простыми и часто используемыми формами mailto: являются subject, cc, bcc и body; дальше прописываем адрес электронной почты. Например:
<a href="mailto:[email protected]">Отправить письмо для nowhere</a>
В результате получим ссылку вида: Отправить письмо для nowhere.
Сам адрес электронной почты не является обязательным для заполнения. Если оставить это поле пустым (в поле href оставить только «mailto:»), откроется новое исходящее сообщение почтовой программой, в поле получателя будет пусто.
Это можно использовать для кнопки «Поделиться».
Особенности и детали
Помимо адреса электронной почты, вы можете предоставить другую информацию. Фактически, любые стандартные поля для отправки почты могут быть добавлены к указанному вами адресу mailto. Часто используемыми из них являются «subject», «cc» и «body» (которые не являются истинным полем заголовка, но позволяют указать дополнительную информацию для нового сообщения электронной почты). Каждое поле и его значение задаются в качестве условия запроса.
Вот пример который включает cc(кому отправить копию сообщения, все получатели письма видят список тех кто это письмо получит), bcc(скрытый адрес получателя, никто из получателей не будет видеть полный список получателей письма), subject(тема письма) и body(текст сообщения):
<a href="mailto:[email protected][email protected]&[email protected]&subject=The%20subject%20of%20the%20email &body=The%20body%20of%20the%20email"> Send mail with cc, bcc, subject and body </a>
Примечание: Значение каждого поля должно быть написано в URL-кодировке (то есть с непечатаемыми символами и пробелами percent-escaped).
Обратите внимание на знак вопроса (?) для разделения основного адреса и дополнительных полей, амперсанд (&) для разделения каждого поля mailto: URL. Для этого используется стандартное описание URL запроса. Прочтите о методе GET, чтобы лучше понимать описание URL запроса.
Вот несколько примеров использования mailto URLs:
- mailto:
- mailto:[email protected]
- mailto:[email protected],[email protected]
- mailto:[email protected][email protected]
- mailto:[email protected][email protected]&subject=This%20is%20the%20subject
Этой информации достаточно для создания ссылок! Вы вернётесь к ссылкам позже, когда начнёте изучать стили. Дальше вы рассмотрите семантику текста и более сложные и необычные возможности, которые будут полезны при создании контента сайта. В следующей главе будет рассматриваться продвинутое форматирование текста.
- Назад
- Обзор: Introduction to HTML
- Далее
- Начало работы с HTML
- Что такое заголовок? Метаданные в HTML
- Основы редактирования текста в HTML
- Создание гиперссылок
- Углублённое форматирование текста
- Структура документа и веб-сайта
- Отладка HTML
- Разметка письма
- Структурируем страницу
Found a content problem with this page?
- Edit the page on GitHub.
- Report the content issue.
- View the source on GitHub.
Want to get more involved? Learn
how to contribute.
This page was last modified on by MDN contributors.
Creating a GitHub App using URL parameters
Сведения параметрах URL-адреса GitHub App
Вы можете добавить параметры запроса к этим URL-адресам, чтобы предварительно выбрать конфигурацию GitHub App в личной учетной записи или учетной записи организации:
- Личная учетная запись:
http(s)://HOSTNAME/settings/apps/new - Учетная запись организации:
http(s)://HOSTNAME/organizations/:org/settings/apps/new
Пользователь, создающий приложение, может изменить предварительно выбранные значения на странице регистрации GitHub App перед отправкой приложения. Если вы не включите обязательные параметры в строку запроса URL-адреса, например name, пользователь, создающий приложение, должен будет ввести значение перед отправкой приложения.
Для приложений, которым требуется секрет для защиты веб-перехватчика, значение секрета должно быть установлено в форме пользователем, создающим приложение, а не с помощью параметров запроса. Дополнительные сведения см. в разделе Securing your webhooks.
Следующий URL-адрес создает новое общедоступное приложение с именем octocat-github-app с предварительно настроенным описанием и URL-адресом обратного вызова. Этот URL-адрес также выбирает разрешения на чтение и запись для checks, подписывается на события веб-перехватчика check_run и check_suite, а также выбирает вариант запроса авторизации пользователя (OAuth) во время установки:
http(s)://HOSTNAME/settings/apps/new?name=octocat-github-app&description=An%20Octocat%20App&callback_urls[]=https://example.com&request_oauth_on_install=true&public=true&checks=write&events[]=check_run&events[]=check_suite
Полный список доступных параметров запроса, разрешений и событий приведен в разделах ниже.
Параметры конфигурации GitHub App
| Имя | Тип | Описание |
|---|---|---|
name | string | Имя GitHub App. Присвойте своему приложению краткое и понятное имя. Это имя должно отличаться от имени существующего пользователя GitHub, если только это не ваше собственное имя пользователя или организации. Краткая версия имени вашего приложения будет отображаться в пользовательском интерфейсе, когда ваша интеграция выполнит действие. |
description | string | Описание GitHub App. |
url | string | Полный URL-адрес домашней страницы сайта GitHub App. |
callback_urls | array of strings | Полный URL-адрес для перенаправления после авторизации установки. Вы можете указать до 10 URL-адресов обратного вызова. Эти URL-адреса будут использоваться, если вашему приложению необходимо идентифицировать и авторизовать запросы от пользователя к серверу. Например, callback_urls[]=https://example.com&callback_urls[]=https://example-2.com. |
request_oauth_on_install | boolean | Если ваше приложение выполняет авторизацию пользователей с помощью потока OAuth, вы можете установить для этого параметра значение true. Это позволит пользователям авторизовать приложение при его установке, уменьшив количество шагов. Если вы выберете этот вариант, setup_url станет недоступным и пользователи будут перенаправлены на ваш callback_url после установки приложения. |
setup_url | string | Полный URL-адрес для перенаправления после установки GitHub App, если для приложения требуется дополнительная настройка после установки. |
setup_on_update | boolean | Задайте значение true, чтобы перенаправлять людей на URL-адрес настройки при обновлении установок, например после добавления или удаления репозиториев. |
public | boolean | Задайте значение true, если приложение GitHub App доступно для всех пользователей, или false — если оно доступно только владельцу. |
webhook_active | boolean | Задайте значение false, чтобы отключить веб-перехватчик. Веб-перехватчик включен по умолчанию. |
webhook_url | string | Полный URL-адрес, на который вы хотите отправлять полезные данные события веб-перехватчика. |
events | array of strings | События веб-перехватчика. Для некоторых событий веб-перехватчика необходимо получить разрешения read или write для ресурса, прежде чем выбрать событие при регистрации нового GitHub App. Сведения о доступных событиях и необходимых для них разрешениях см. в разделе События веб-перехватчика GitHub App. Вы можете выбрать несколько событий в строке запроса. Например, events[]=public&events[]=label. |
single_file_name | string | Это узкоспециализированное разрешение, позволяющее приложению получать доступ к одному файлу в любом репозитории. При задании разрешения read или write для single_file в этом поле указывается путь к одному файлу, которым будет управлять GitHub App. Если вам нужно управлять несколькими файлами, см. single_file_paths ниже. |
single_file_paths | array of strings | Этот параметр позволяет приложению получить доступ к десяти указанным файлам в репозитории. При задании разрешения read или write для single_file этот массив может хранить пути до десяти файлов, которыми будет управлять GitHub App. Все эти файлы получают одно и то же разрешение, заданное single_file, и не имеют отдельных индивидуальных разрешений. При настройке двух или более файлов API возвращает multiple_single_files=true, в противном случае возвращается multiple_single_files=false. |
Разрешения GitHub App
Вы можете выбрать разрешения в строке запроса, используя имя разрешения из приведенной ниже таблицы в качестве имени параметра запроса и тип разрешения в качестве значения запроса. Например, чтобы выбрать разрешения Read & write в пользовательском интерфейсе для contents, в строке запроса нужно указать &contents=write. Чтобы выбрать разрешения Read-only в пользовательском интерфейсе для &blocking=read, в строке запроса нужно указать blocking. Чтобы выбрать no-access в пользовательском интерфейсе для checks, ваша строка запроса не должна содержать разрешение checks.
| Разрешение | Описание |
|---|---|
administration | Предоставляет доступ к различным конечным точкам для администрирования организации и репозитория. Это может быть none, read или write. |
checks | Предоставляет доступ к API проверок. Это может быть none, read или write. |
contents | Предоставляет доступ к различным конечным точкам, которые позволяют изменять содержимое репозитория. Это может быть none, read или write. |
deployments | Предоставляет доступ к API развертываний. Это может быть none, read или write. |
emails | Предоставляет доступ к API сообщений электронной почты. Это может быть none, read или write. |
followers | Предоставляет доступ к API подписчиков. Это может быть none, read или write. |
gpg_keys | Предоставляет доступ к API ключей GPG. Это может быть none, read или write. |
issues | Предоставляет доступ к API проблем. Это может быть none, read или write. |
keys | Предоставляет доступ к API открытых ключей. Это может быть none, read или write. |
members | Предоставляет доступ для управления участниками организации. Это может быть none, read или write. |
organization_hooks | Предоставляет доступ к API веб-перехватчиков организации. Это может быть none, read или write. |
organization_plan | Предоставляет доступ для получения сведений о плане организации с помощью конечной точки Organizations. Это может быть none или read. |
organization_projects | Предоставляет доступ к API проектов. Это может быть none, read, write или admin. |
pages | Предоставляет доступ к API страниц. Это может быть none, read или write. |
plan | Предоставляет доступ для получения сведений о плане GitHub пользователя с помощью конечной точки Users. Это может быть none или read. |
pull_requests | Предоставляет доступ к различным конечным точкам запросов на вытягивание. Это может быть none, read или write. |
repository_hooks | Предоставляет доступ к API веб-перехватчиков репозитория. Это может быть none, read или write. |
repository_projects | Предоставляет доступ к API проектов. Это может быть none, read, write или admin. |
secret_scanning_alerts | Предоставляет доступ к API сканирования секретов. Это может быть none, read или write. |
security_events | Предоставляет доступ к API сканирования кода. Это может быть none, read или write. |
single_file | Предоставляет доступ к API содержимого. Это может быть none, read или write. |
starring | Предоставляет доступ к API пометки звездочкой. Это может быть none, read или write. |
statuses | Предоставляет доступ к API состояний. Это может быть none, read или write. |
team_discussions | Предоставляет доступ к API обсуждений в команде и API комментария к обсуждению в команде. Это может быть none, read или write. |
vulnerability_alerts | Предоставляет доступ для получения Dependabot alerts в репозитории. Дополнительные сведения см. в разделе About Dependabot alerts. Это может быть none, read или write. |
watching | Предоставляет доступ к репозиториям списков и изменений, на которые подписан пользователь. Это может быть none, read или write. |
События веб-перехватчика GitHub App
| Имя события веб-перехватчика | Требуемое разрешение | Описание |
|---|---|---|
check_run | checks | Произошло действие выполнения проверок. Тип действия указывается в свойстве action объекта полезных данных. Дополнительные сведения см. в разделе REST API Checks. |
check_suite | checks | Произошло действие набора проверок. Тип действия указывается в свойстве action объекта полезных данных. Дополнительные сведения см. в разделе REST API Checks. |
commit_comment | contents | Создается комментарий к фиксации. Тип действия указывается в свойстве action объекта полезных данных. Дополнительные сведения см. в разделе REST API Repositories. |
create | contents | Создается ветвь или тег Git. Дополнительные сведения см. в разделе REST API Git database. |
delete | contents | Удаляется ветвь или тег Git. Дополнительные сведения см. в разделе REST API Git database. |
deployment | deployments | Создается развертывание. Тип действия указывается в свойстве action объекта полезных данных. Дополнительные сведения см. в разделе REST API Deployments. |
deployment_status | deployments | Создается развертывание. Тип действия указывается в свойстве action объекта полезных данных. Дополнительные сведения см. в разделе REST API Repositories. |
fork | contents | Пользователь создает вилку репозитория. Дополнительные сведения см. в разделе REST API Repositories. |
gollum | contents | Вики-страница создается или обновляется. Дополнительные сведения см. в разделе About wikis. |
issues | issues | Действие, связанное с проблемой. Тип действия указывается в свойстве action объекта полезных данных. Дополнительные сведения см. в разделе REST API Issues. |
issue_comment | issues | Действия, связанные комментарием к проблеме или запросу на вытягивание. Тип действия указывается в свойстве action объекта полезных данных. Дополнительные сведения см. в разделе REST API Issues. |
label | metadata | Действие, связанное с меткой. Тип действия указывается в свойстве action объекта полезных данных. Дополнительные сведения см. в разделе REST API Issues. |
member | members | Действия, связанные с участниками совместной работы в репозитории. Тип действия указывается в свойстве action объекта полезных данных. Дополнительные сведения см. в разделе REST API Repositories. |
membership | members | Действие, связанное с членством в команде. Тип действия указывается в свойстве action объекта полезных данных. Дополнительные сведения см. в разделе REST API Teams. |
milestone | pull_request | Действия, связанные с вехами. Тип действия указывается в свойстве action объекта полезных данных. Дополнительные сведения см. в разделе REST API Issues. |
organization | members | Действие, связанное с организацией и ее членами. Тип действия указывается в свойстве action объекта полезных данных. Дополнительные сведения см. в разделе REST API Organizations. |
page_build | pages | Представляет попытку сборки сайта GitHub Pages, независимо от успешности ее выполнения. Это событие активируется при отправке в ветвь с поддержкой GitHub Pages (gh-pages для страниц проекта, ветвь по умолчанию для страниц пользователей и организаций). |
project | repository_projects или organization_projects | Действие, связанное с доски проектов. Тип действия указывается в свойстве action объекта полезных данных. Дополнительные сведения см. в разделе REST API Project boards. |
project_card | repository_projects или organization_projects | Действие, связанное с карточками в доска проекта. Тип действия указывается в свойстве action объекта полезных данных. Дополнительные сведения см. в разделе REST API Project boards. |
project_column | repository_projects или organization_projects | Действие, связанное со столбцами, которые содержит доска проекта. Тип действия указывается в свойстве action объекта полезных данных. Дополнительные сведения см. в разделе REST API Project boards. |
public | metadata | Когда частный репозиторий становится общедоступным. Без сомнения: лучшее событие GitHub Enterprise Server. |
pull_request | pull_requests | Действия, связанные с запросами на вытягивание. Тип действия указывается в свойстве action объекта полезных данных. Дополнительные сведения см. в разделе REST API Pulls. |
pull_request_review | pull_request | Действия, связанные с проверками запросов на вытягивание. Тип действия указывается в свойстве action объекта полезных данных. Дополнительные сведения см. в разделе REST API Pulls. |
pull_request_review_comment | pull_request | Действия, связанные с комментариями к проверке запроса на вытягивание в едином различии запроса на вытягивание. Тип действия указывается в свойстве action объекта полезных данных. Дополнительные сведения см. в разделе REST API Pulls. |
pull_request_review_thread | pull_request | Действие, связанное с отметкой ветви обсуждения по запросу на включение внесенных изменений как завершенной или незавершенной. Тип действия указывается в свойстве action объекта полезных данных. |
push | contents | Одна или несколько фиксаций отправляются в ветвь репозитория или тег. |
release | contents | Действие, связанное с выпуском. Тип действия указывается в свойстве action объекта полезных данных. Дополнительные сведения см. в разделе REST API Releases. |
repository | metadata | Действие, связанное с репозиторием. Тип действия указывается в свойстве action объекта полезных данных. Дополнительные сведения см. в разделе REST API Repositories. |
status | statuses | При изменении состояния фиксации в GIT. Дополнительные сведения см. в разделе REST API Commits. |
team | members | Действие, связанное с командой организации. Тип действия указывается в свойстве action объекта полезных данных. Дополнительные сведения см. в разделе REST API Teams. |
team_add | members | При добавлении репозитория для команды. |
watch | metadata | Когда кто-то запускает репозиторий. Тип действия указывается в свойстве action объекта полезных данных. Дополнительные сведения см. в разделе REST API Activity. |
Какая структура URL лучше всего подходит для SEO?
SEO 101: Какая структура URL лучше всего подходит для SEO?
Многие ваши посетители переходят на ваш веб-сайт, нажав на ссылку, поэтому вы можете задаться вопросом, действительно ли имеет значение то, что находится в фактическом URL-адресе конкретной страницы.
Вас может удивить тот факт, что когда дело доходит до внутреннего SEO, то, как выглядят ваши URL-адреса, на самом деле очень важно.
Что такое структура URL?
URL-адрес вашего веб-сайта работает как ваш адрес в Интернете. Это самый прямой способ для кого-то посетить страницу на вашем сайте. Если вы не знакомы с этим термином, URL-адрес — это то, что начинается с www или http.
На ранних этапах создания веб-сайта вы хотите сесть и определить стандартную структуру URL-адресов вашего веб-сайта. (Если ваш веб-сайт уже создан и развивается, еще не поздно сделать это сейчас, просто может потребоваться дополнительная работа.)
Ваши URL-адреса всегда начинаются с с корневого домена вашего веб-сайта (например, www.yourwebsitename .com ), поэтому вы хотите определить то, что следует для отдельных страниц.
Структура вашего URL-адреса будет напрямую связана с архитектурой вашего более крупного сайта. Вы хотите, чтобы ваши URL-адреса ссылались на то, что находится на конкретной странице, а также помогали посетителю веб-сайта определить, где эта страница принадлежит на более крупном веб-сайте. Например, URL поста в вашем блоге должен выглядеть примерно так: www.yourwebsitename.com/blog/nameofyouurblogpost
Взглянув на URL-адрес, любой посетитель, перешедший к сообщению по внешней ссылке, быстро сможет увидеть, что он находится в блоге, а также некоторую основную информацию о конкретный пост в блоге на странице.
Почему структура URL имеет значение?
Структура вашего URL важна по нескольким ключевым причинам.
- Во-первых, чтобы Google постоянно предоставлял пользователям релевантные результаты, он должен знать, о чем каждая страница в его индексе. URL — это одна из наиболее важных частей страницы, на которую Google смотрит, чтобы определить, о чем страница.
- Далее, интуитивно понятная структура URL-адресов упрощает навигацию по вашему сайту для пользователей . Если кто-то просматривает веб-сайт розничной торговли одеждой и попадает на страницу www.clothesretailer.com/womens/dresses/nameofspecificdress , он знает, что эта страница принадлежит к двум категориям, которые предшествуют последней части html: женская одежда и платья. Опытные интернет-пользователи также знают, что они могут удалить пару последних частей URL-адреса (платья/название конкретного платья), чтобы вернуться к более широкому выбору женской одежды.
- И, наконец, то, что делает хорошую структуру URL интуитивно понятной для пользователей, полезно и для поисковых систем. Сканер поисковой системы может более легко устанавливать релевантные связи между различными страницами вашего веб-сайта – он может видеть, что конкретный товар относится к той же категории, что и другие платья (даже если слово «платье» отсутствует в названии продукта), которые относятся к более широкой категории женской одежды на сайте — информация, которая помогает сканеру лучше понять, о чем разные разделы сайта и как они связаны друг с другом.
В качестве дополнительного преимущества наличие этих дополнительных категорий перед конкретным ключевым словом или названием продукта в вашем URL-адресе добавляет некоторые дополнительные релевантные ключевые слова, не создавая URL-адрес, который является спамом. Это дает Google немного больше информации, чтобы убедиться, что он понимает, что находится на странице, и знает, по каким ключевым словам страница должна отображаться в поиске.
7 советов по созданию хорошей структуры URL-адреса
URL-адрес — довольно простая часть внутренней оптимизации, но важно, чтобы она была правильной. Вот несколько хороших способов убедиться, что вы используете свои URL с умом.
1. Всегда редактируйте URL-адрес страницы, чтобы он был актуальным.
Удивительное количество веб-сайтов по-прежнему использует автоматически сгенерированные URL-адреса, которые выглядят как набор тарабарщины. Это упускает большую возможность SEO, а также создает более запутанный опыт для ваших посетителей.
Первое и самое важное, что вам нужно сделать для URL-адресов вашего веб-сайта, — это просто зафиксировать , настроив каждый из них на основе того, что находится на веб-странице .
2. Используйте стандартную структуру URL.
Как обсуждалось выше, это будет связано с общей организацией вашего веб-сайта и является важным правилом, которому необходимо следовать. Определите, какие категории и подкатегории вы будете использовать и как вы будете отображать их в URL-адресах веб-страниц, принадлежащих к каждой категории.
Будьте осторожны и не усложняйте здесь слишком много категорий — слишком много категорий увязнут в ваших URL-адресах и сделают их запутанными, а не полезными: www.clothesretailer.com/womens/dresses/nameofspecificdress — это интуитивно понятная структура URL, а www.clothesretailer.com/womens/dresses/short-sleeves/purple/floral/knee-length/nameofspecificdress заходит слишком далеко.
Придерживайтесь основных категорий, которые важны для того, чтобы сделать ваш веб-сайт более интуитивно понятным в его организации, и будьте максимально последовательными в структуре URL-адресов, которые вы используете на всем сайте.
3. Пишите кратко и просто.
Хорошие URL-адреса короткие и точные. Убедитесь, что вы не заполняете свой ненужными словами или символами, и избегайте наполнения ключевыми словами . Наличие одного и того же ключевого слова в вашем URL более одного раза не принесет вам никакой пользы.
Хотя большинство ваших посетителей будут использовать ссылки или закладки для доступа к определенным страницам вашего веб-сайта, а не напрямую переходить по URL-адресу, вы хотите, чтобы было хотя бы правдоподобно, что кто-то может запомнить конкретный URL-адрес, если захочет.
Для каждой страницы вашего веб-сайта вы должны иметь в виду основное целевое ключевое слово, по которому вы хотите, чтобы оно ранжировалось в поисковых системах. Очевидно, что это должно быть что-то, что конкретно описывает, что находится на веб-странице, а также является общим термином, используемым людьми, которые ищут то, что находится на странице.
Убедитесь, что основное ключевое слово является частью URL-адреса страницы. Можно просто использовать ключевое слово как часть URL-адреса, характерного для вашей страницы (например, www.yourwebsitename.com/relevant-category/primary-keyword ).
Если веб-страница предназначена для статьи или поста в блоге, основные слова в заголовке статьи обычно можно выделить, чтобы получился сильный заголовок, включающий основное ключевое слово и четко описывающий содержание страницы. Например, пост под названием 10 советов, как найти идеальное летнее платье 9. 0098 с целевым ключевым словом «летнее платье» может стать URL www.clothesretailer.com/blog/find-perfect-summer-dress
5. Используйте дефисы для разделения слов.
Вы не можете включать пробелы в URL-адрес, поэтому в SEO рекомендуется использовать дефисы для разделения слов. Это сообщит Google, где находятся разрывы между словами, и вашим посетителям будет легче понять URL-адреса, чем если бы все слова шли вместе.
6. Удалить стоп-слова.
Вы хотите, чтобы URL-адреса были короткими и простыми, а это означает, что вам никогда не понадобятся такие вещи, как местоимения и артикли. Поэтому при переводе заголовка страницы в структуру URL отбрасывайте в заголовке любые общие стоп-слова, например: 9.0015 а, и, или, но, ан, из и т. д. .
7. Используйте канонические теги там, где это необходимо.
Эта часть немного более техническая, но не менее важная. Вы не хотите, чтобы Google регистрировал разные версии одной и той же страницы на вашем веб-сайте как отдельные страницы. Поэтому, если у вас есть одна и та же веб-страница, которая по какой-либо причине привязана к более чем одному URL-адресу, вы снижаете ее ценность для SEO.
Наиболее распространенная версия этого — когда у вас есть веб-страницы для http://yourwebsite.com и www.yourwebsite.com или если у вас есть безопасная версия страницы по адресу https://yourwebsite.com вместе с двумя упомянутыми выше версиями. Какой бы ни была причина, вы хотите, чтобы каждый URL-адрес одной и той же страницы был объединен в глазах Google, чтобы обратная ссылка на одну из них учитывалась во всех версиях.
Вы можете сообщить об этом Google, используя тег canonical для каждого варианта страницы, который уточняет, какой URL-адрес следует считать основным URL-адресом для представления всех версий.
Настройка структуры URL-адреса
Создание стандартной структуры URL-адреса может потребовать некоторого времени и планирования, но как только вы определите свою основную структуру, выбор правильного URL-адреса для каждой веб-страницы на вашем сайте может стать одной из самых простых частей работы. SEO на сайте. Убедитесь, что вы каждый раз настраиваете свои URL-адреса для достижения наилучших результатов. Это простой способ улучшить SEO и повысить качество обслуживания посетителей.
Не пропустите остальную часть нашей серии SEO 101!
- Как работают поисковые системы?
- Как написать убедительные теги заголовков
- Как написать лучшие мета-описания
- Лучшие практики для архитектуры сайта Узнайте больше здесь.
SEO (поисковая оптимизация) включает в себя лотов различных частей. Для занятых владельцев бизнеса, которые знают, что SEO важно (вы наверняка слышали это достаточно раз), может возникнуть соблазн пропустить некоторые из более мелких шагов, связанных с SEO на месте.
Но каждая мелочь, которую вы можете сделать для улучшения SEO вашего веб-сайта, имеет значение, особенно если это то, что другие сайты могут упустить из виду.
Потратьте время на оптимизацию изображений для SEO — это простой и важный шаг к тому, чтобы сделать ваш сайт более конкурентоспособным в поисковых системах. Это та мелочь, которую многие компании упускают из виду, и именно поэтому это может дать вам конкурентное преимущество в поиске ваших целевых ключевых слов в поисковой выдаче (страницах результатов поисковой системы).
И, как и во многих передовых методах SEO, большинство шагов, связанных с оптимизацией изображений, также улучшают впечатление посетителей. Таким образом, работа, которую вы проделаете, не только повысит шансы людей найти ваш сайт, но и будет означать, что он им больше понравится, когда они на нем зайдут.
Чему вы научитесь…
- SEO 101: Какая структура URL лучше всего подходит для SEO?
- Что такое структура URL?
- Почему структура URL имеет значение?
- 7 советов по созданию хорошей структуры URL
- 1. Всегда редактируйте URL-адрес страницы, чтобы он был актуальным.
- 2. Используйте стандартную структуру URL.
- 3. Пишите кратко и просто.
- 4. Используйте основное ключевое слово.
- 5. Используйте дефисы для разделения слов.
- 6. Удалить стоп-слова.
- 7. Используйте канонические теги там, где это необходимо.
- 1. Всегда редактируйте URL-адрес страницы, чтобы он был актуальным.
- Настройка структуры URL-адреса
- Почему изображения важны для SEO
- 12 советов по улучшению SEO для изображений
- 1. Используйте релевантные высококачественные изображения.
- 2. Настройте имя файла.
- 3. Используйте замещающий текст.
- 4. Добавьте подписи к изображениям.
- 5. Уменьшите размер файла изображения.
- 6. Найдите правильное соотношение качества и размера.
- 7. Выберите правильный тип файла.
- 8. Добавьте изображения на карту сайта.
- 9. Используйте адаптивные изображения.
- 10. Используйте ленивую загрузку.
- 11. Используйте схемы для продуктов и рецептов, где это уместно.
- 12. Размещайте изображения на своем сайте.
- Найдите время для SEO изображений
Почему изображения важны для SEO
Мы понимаем, что SEO во многом связано с текстом и ключевыми словами, но изображения тоже играют свою роль. Во-первых, они являются огромной частью пользовательского опыта.
Подумайте об этом: если вы окажетесь на веб-странице, похожей на документ Word, где нет ничего, кроме текста на белом фоне, вы не почувствуете, что этот веб-сайт заслуживает доверия или запоминается.
На протяжении многих лет исследователи проводили исследования, подтверждающие, что визуальные эффекты помогают людям быстрее обрабатывать информацию и более эффективно ее запоминать. Это означает, что изображения могут сделать контент вашего сайта более мощным и привлекательным.
Изображения играют большую роль в том, как мы воспринимаем веб-страницу. Это важно для SEO, потому что алгоритм Google обращает внимание на поведенческие показатели, которые отражают пользовательский опыт, такие как показатель отказов и количество времени, которое посетители проводят на веб-странице.
Кроме того, изображения можно оптимизировать для более прямого повышения SEO. В то время как большинство посетителей вашей страницы увидят только само изображение, сканеры поисковых систем увидят текст за изображением, который вы можете заполнить, чтобы сообщить им, что вы хотите, чтобы они увидели.
12 советов по улучшению SEO для изображений
Следуйте этим советам, чтобы оптимизировать изображения на вашем веб-сайте для поисковых систем.
1. Используйте релевантные высококачественные изображения.
Это имеет решающее значение для пользовательского опыта SEO. Изображение, не имеющее отношения к содержимому страницы, будет сбивать с толку пользователя, а изображение, размытое или плохо обрезанное, просто сделает вашу страницу плохой и непрофессиональной. Убедитесь, что каждое изображение, которое вы используете, имеет четкую связь с тем, что находится на странице, и выглядит хорошо.
Вы должны быть осторожны, чтобы не использовать изображения, на которые у вас нет прав, но вы можете найти множество ресурсов в Интернете, которые предоставляют бесплатные изображения, которые могут использовать предприятия.
А инструменты для самостоятельного проектирования, такие как Canva, теперь делают создание оригинальной графики доступным, быстрым и простым даже для недизайнеров.Выделите некоторое время для каждой создаваемой вами страницы и публикации в блоге, чтобы определить хотя бы одно хорошее изображение для включения — бонусные баллы, если вы сможете найти несколько.
2. Настройте имя файла.
Это один из тех шагов, которые настолько просты, что просто удивительно, как никто этого не делает.
Прежде чем добавить изображение на свой веб-сайт, уделите время настройке имени файла. Измените его на то, что имеет отношение к изображению и, если возможно, включает одно из ваших целевых ключевых слов для страницы. Например, если ваша веб-страница посвящена рюкзаку, который вы продаете, изображение можно назвать, например, brandname-backpack.jpg.
Большинство посетителей никогда не увидят имя файла, но это дает вам возможность предоставить поисковым системам немного больше информации о том, что находится на странице, и о том, какие ключевые слова лучше всего с ней связать.
3. Используйте замещающий текст.
Это еще одна часть веб-страницы, которую большинство посетителей не увидят, но увидят сканеры поисковых систем. Вы можете предоставить альтернативный текст для каждого изображения, которое вы добавляете на свой веб-сайт, которое будет отображаться вместо вашего изображения, если у браузера возникнут проблемы с его загрузкой или если посетитель использует программу чтения с экрана.
Этот текст является еще одной частью страницы, которую вы можете использовать, чтобы сообщить поисковым системам, о чем эта страница. Всегда обновляйте альтернативный текст для ваших изображений. Включите основное ключевое слово для страницы и описание самого изображения. Если вы используете WordPress, для этого вы можете заполнить альтернативное текстовое поле.
Если вы предпочитаете использовать HTML, вы можете добавить alt=»your alt text» к тегу изображения.
Альтернативный текст полезен для SEO, но, что не менее важно, это хороший способ улучшить доступность вашего сайта.
Таким образом, те несколько минут, которые вы тратите на повышение эффективности SEO, также могут сделать ваш сайт более привлекательным для посетителей.4. Добавьте подписи к изображениям.
Подписи — это еще одно текстовое поле, которое вы можете включить для каждого изображения на своем веб-сайте, но на этот раз это то, которое посетители можно посмотреть. Когда это имеет смысл, используйте поле подписи, чтобы добавить пояснение к изображению или предоставить дополнительную информацию о нем зрителю.
Подписи к изображениям потенциально могут быть еще одной возможностью добавить целевое ключевое слово на страницу, но не форсируйте это. Включайте заголовок только в том случае, если есть естественный способ сделать это, который не отнимет у посетителя впечатления.
В целом добавление подписей — хорошая идея, но нет единого четкого правила, как их лучше использовать. В некоторых случаях подписи могут быть хорошей возможностью добавить немного индивидуальности или вставить шутку.
Если это улучшит взаимодействие с пользователем больше, чем добавление ключевого слова улучшит SEO, то это лучший вариант. Используйте свое лучшее суждение здесь.5. Уменьшите размер файла изображения.
Вы выполняете тяжелую работу по поиску или созданию изображения, следующим шагом является загрузка его на ваш сайт, верно? Еще не совсем.
Часто размер файла изображения намного больше, чем необходимо для размера, который он будет отображаться на вашем веб-сайте. Если вы потратите несколько секунд перед загрузкой, чтобы уменьшить размер файла, это не замедлит работу вашего сайта. Скорость сайта является фактором ранжирования SEO, поэтому, если вашим посетителям приходится некоторое время ждать загрузки страницы на вашем сайте, это плохо для пользовательского опыта и вашего SEO.
Если вы используете CMS, такую как WordPress, изменить размер изображения на вашем веб-сайте после его загрузки в CMS очень просто, но это означает, что у вас все еще будет большой размер файла, который замедляет работу серверной части.
Вы можете ускорить работу своего веб-сайта, по-прежнему отображая изображения с высоким разрешением, изменив размер файлов изображений перед их загрузкой на веб-сайт. Часто это легко сделать с помощью программ, которые входят в стандартную комплектацию большинства компьютеров, таких как программа Mac Preview или Microsoft Paint. Или, если у вас есть Adobe Photoshop, вы можете использовать команду «Сохранить для Интернета», чтобы помочь вам найти файл наименьшего размера, который по-прежнему обеспечивает хорошее разрешение.
После изменения размера вы все равно можете уменьшить размер файла изображения без ущерба для качества путем сжатия. Воспользуйтесь такими инструментами, как TinyPNG и JPEGmini, чтобы упростить этот процесс.
6. Найдите правильное соотношение качества и размера.
Эта часть немного сложна, потому что вы хотите, чтобы ваши изображения выглядели действительно хорошо (см. «Высокое качество» в части № 1), но вы не хотите, чтобы они были достаточно большими, чтобы замедлить работу вашего сайта.
Поэтому, выполняя шаги, описанные выше, следите за тем, чтобы изображение не стало внезапно размытым или не стало таким маленьким, что вы не можете сказать, что это такое.
Проверьте каждое изображение на своем веб-сайте на различных типах устройств и размеров экрана, чтобы убедиться, что оно по-прежнему выглядит нормально даже после уменьшения размера. Иногда нужно найти золотую середину между размером файла и качеством изображения.
7. Выберите правильный тип файла.
Вы, наверное, заметили, что существует три основных типа файлов изображений, но вы, возможно, не совсем понимаете разницу между ними. Понимание различных типов файлов может помочь вам выбрать лучший для ваших нужд:
- JPG является одним из наиболее распространенных форматов файлов, поскольку он использует файлы небольшого размера и широко поддерживается. Но качество изображения не всегда такое хорошее, как у файлов PNG, а формат не поддерживает прозрачный фон, поэтому в некоторых случаях JPG не работает.
- PNG — это формат файла для изображений, обеспечивающий высокое разрешение и поддерживающий текстовое описание изображения, что хорошо для SEO. Основным недостатком PNG является то, что для него требуются файлы большего размера, чем для JPG и GIF. Часто это лучше всего подходит для сложных изображений и изображений, содержащих текст.
- GIF не поддерживает такой широкий цветовой диапазон, как два других, но может быть хорошим выбором для более простых изображений. Он поддерживает небольшие размеры файлов и прозрачный фон.
Для фотографий часто хорошо подходит формат JPG. Для разработанной графики более распространены GIF и PNG, и если вам нужна версия более высокого качества, вам подойдет PNG.
8. Добавьте изображения на карту сайта.
Google рекомендует владельцам веб-сайтов отправлять им карту сайта, чтобы помочь им лучше сканировать ваши страницы и добавлять их в индекс. Они также позволяют включать изображения в карту сайта или, наоборот, создавать отдельную карту сайта для изображений.
Если вы используете WordPress, есть плагины, которые вы можете использовать для создания карты сайта для изображений, например Google XML Sitemap для изображений и Undira All Image Sitemap. Если вы предпочитаете делать это самостоятельно, Google предоставляет информацию о создании карты сайта для изображений здесь.
Предоставляя Google четкую информацию об изображениях на вашем веб-сайте, вы увеличиваете вероятность их появления в поиске картинок Google, что увеличивает общую возможность поиска вашего веб-сайта.
9. Используйте адаптивные изображения.
К настоящему моменту вы, наверное, уже все слышали об адаптивных веб-сайтах. Адаптация — лучший способ убедиться, что ваш веб-сайт хорошо выглядит на всех типах устройств, независимо от размера экрана, и при этом убедиться, что все пользователи видят одну и ту же информацию. Использование адаптивных изображений является частью этого.
Когда вы добавляете изображение на свой веб-сайт, вы можете сделать его адаптивным с помощью HTML-кода srcset .
Это позволяет браузерам автоматически выбирать размер файла изображения, наиболее подходящий для размера экрана, на котором находится пользователь, и загружать его. Это очень удобный инструмент, который позаботится об адаптивном размере за вас, поэтому вам не нужно об этом беспокоиться.Если вы услышали «HTML-код» и начали отключаться, не волнуйтесь. Если ваш сайт работает на WordPress, CMS позаботится об этом за вас. Пока вы используете WordPress 4.4 или более позднюю версию (что вам определенно следует сделать сейчас), к вашим изображениям будет автоматически применяться код srcset, и вам не нужно ничего делать.
10. Используйте ленивую загрузку.
Быть ленивым не всегда плохо, особенно когда речь идет о ленивой загрузке.
Ленивая загрузка — это метод, который может увеличить скорость загрузки вашего веб-сайта, заставляя ваш веб-сайт ожидать загрузки изображений, расположенных ниже на странице в последнюю очередь. Посетители не будут застревать в ожидании контента, пока их браузер пытается загрузить все на всей странице, вместо этого они могут начать видеть самые важные элементы страницы и быть уверенными, что все остальное загрузится к тому времени, когда они туда доберутся.
Эта тактика может быть особенно полезна для веб-сайтов с длинными страницами. Если для просмотра полной страницы на вашем сайте требуется много прокрутки, то почему посетители должны ждать загрузки изображений внизу страницы, прежде чем они смогут прочитать текст вверху?
Если вы используете WordPress, самый простой способ реализовать ленивую загрузку — это плагин. Ленивая загрузка — одна из многих функций, включенных в плагин JetPack, если вы хотите пойти по этому пути. Или вы можете рассмотреть тот, который просто обеспечивает ленивую загрузку, например a3 Lazy Load или Lazy Load.
11. Используйте схемы для продуктов и рецептов, где это уместно.
Разметка схемы — это еще один инструмент, с помощью которого вы сообщаете Google, что находится на странице. Для определенных типов контента он предоставляет поисковым системам данные, которые помогают им предоставлять пользователям полезную информацию прямо в поисковой выдаче.
Когда вы ищете рецепт или продукт и рядом с результатом в Google видите звездный рейтинг, калории, цены или информацию об инвентаре, это происходит потому, что веб-сайт использует микроразметку.
Разметка Schema актуальна только для некоторых типов контента, но если ваш веб-сайт включает такие типы контента, то это разумный способ дальнейшей оптимизации вашего сайта. Использование соответствующей разметки схемы потенциально может сделать некоторые из ваших страниц более заметными в результатах поиска за счет включения вашего изображения рядом с результатом. А в поиске изображений Google часто использует схему для отображения значка в результатах, сообщающего пользователям, для какого типа контента предназначено изображение.
12. Размещайте изображения на своем сайте.
Хотя может показаться заманчивым разместить свое изображение на стороннем веб-сайте, таком как Imgur, для экономии места, это сопряжено с реальным риском. В любое время, когда эти сайты перегружены трафиком, ваши изображения могут не загружаться, создавая путаницу на вашем веб-сайте и ухудшая внешний вид вашего бренда.
Будет лучше, если вы разместите изображения на своем собственном веб-сайте и воспользуетесь приведенными выше советами, чтобы уменьшить размер файла изображения, чтобы они не замедляли работу веб-страниц больше, чем это необходимо.
И когда вы выбираете надежного хостинг-провайдера, вы всегда будете знать, что ваши изображения (и остальная часть вашего веб-сайта) будут отображаться для ваших посетителей так, как должны.Уделите время SEO-оптимизации изображений
SEO-оптимизация изображений относительно проста, насколько это возможно. Потратив немного больше времени на поиск нужных изображений и оптимизацию их для поиска каждый раз, когда вы добавляете страницу на свой веб-сайт, вы можете дать своим страницам дополнительное преимущество в поисковых системах.
Кристен Хикс
Кристен Хикс — внештатный писатель из Остина и постоянно учится, постоянно стремясь узнавать что-то новое. Она использует это любопытство в сочетании со своим опытом работы в качестве внештатного владельца бизнеса, чтобы писать о темах, ценных для владельцев малого бизнеса, в блоге HostGator. Вы можете найти ее в Твиттере по адресу @atxcopywriter.
Лучшие практики для SEO-дружественных URL › Возможности дизайна
SEO
Автор Эмили Краузе
Что такое URL?
Унифицированный указатель ресурсов (URL) — это веб-адрес, который мы вводим в браузере для доступа к веб-странице.
Пример нашего URL в результатах поиска Google
URL-адреса в Интернете также называются ссылками. Многие люди нажмут на ссылку, чтобы получить прямой доступ к вашему сайту. Так имеет ли значение URL-адрес страницы? Да, это так! То, как выглядит ваша ссылка, имеет значение.
Что такое структура URL?
URL-адрес — это адрес в Интернете. Он состоит из протокола, доменного имени и пути.
Структура URL-адреса
Протокол — это то, как браузер получает информацию об этой странице, http:// или https:// («s» означает «защищенный»).
Субдомен — это часть домена, предшествующая основному «корневому» домену. Вы можете создать несколько поддоменов, но это, по сути, разные веб-сайты, поэтому вам не нужно иметь много поддоменов, если они вам действительно не нужны. Субдомены создаются для организации контента на вашем сайте.
Вы можете использовать любую строку символов для поддомена, а не только www.Доменное имя — это уникальный адрес, по которому расположен веб-сайт.
Домен верхнего уровня (TLD), например, com, org, net и многие другие!
Путь относится к точному расположению страницы, сообщения или файла.
Структуры URL-адресов могут быть разными
Не все веб-сайты используют одинаковую структуру URL-адресов. И это нормально.
Структура URL-адреса веб-сайта зависит от уникальных потребностей веб-сайта.
Например, URL-адрес международного сайта, скорее всего, будет структурирован для нескольких языков или местоположений. Структура URL для веб-сайта блога может отличаться от структуры электронной коммерции или членского сайта. И структура URL-адреса правительственного веб-сайта, скорее всего, будет отличаться от структуры URL-адреса социальной сети.
В зависимости от цели веб-сайта структуры URL-адресов будут различаться, но независимо от того, какая структура выбрана, основные рекомендации по-прежнему применяются для поддержания правильной структуры URL-адресов.
Почему структура URL важна для SEO?
URL-адреса — это организация содержимого вашего веб-сайта. Они являются связующим звеном между вашим контентом и пользователем. Структура URL важна по двум основным причинам:
1. Взаимодействие с пользователем
Отличный пользовательский опыт — самый важный фактор, когда дело доходит до SEO.
Улучшите взаимодействие с пользователем, используя логическую структуру URL-адресов с иерархией страниц. Интуитивно организованный контент упрощает навигацию по сайту для людей.
Вы хотите сделать свой веб-сайт как можно более удобным для просмотра, чтобы люди могли перемещаться по сайту с уверенностью, а не смущаться.
Помимо логической организации URL-адресов, используйте SEO-дружественных URL-адресов . URL-адреса, которые являются простыми, легко читаемыми и включают ключевые слова, описывающие содержимое веб-страницы, оптимальны для SEO.
Например, если вы ищете информацию о блинах, URL-адрес типа https://en.wikipedia.org /wiki/pancake поможет вам выбрать эту ссылку.
URL-адрес типа https://www.example.com /index.php?id_wca=470&clcp27sap не объясняет четко, о чем целевая страница, и не является дружественным.
Простые URL-адреса обеспечивают наилучшее взаимодействие с пользователем. Оптимизируйте URL-адреса с помощью описательных ключевых слов, которые дают четкое представление о содержании страницы.
Вы хотите оптимизировать свои URL-адреса, потому что это помогает поисковым системам предоставлять пользователям релевантные результаты, и поэтому они точно знают, что они увидят, если перейдут по ссылке.
2. PageRank
Структуры URL сообщают Google, о чем разные страницы веб-сайта и как они соотносятся друг с другом. Внутренние ссылки (ссылки на страницы вашего сайта) тоже помогают в этом.
Когда вы оптимизируете свои URL-адреса для людей, вы также облегчаете роботам поисковых систем сканирование и индексацию вашего веб-сайта, чтобы предоставить пользователям релевантное содержание.
URL-адреса являются фактором ранжирования в Google.
Это означает, что оптимизированные структуры URL продвигают Google PageRank (PR). PageRank — это способ, с помощью которого Google измеряет ценность веб-страницы и ее релевантность поисковому запросу.
Корневые домены обычно имеют наибольший PageRank, и хотя использование ключевых слов на ваших корневых страницах может улучшить ваш рейтинг, вы не хотите полагаться только на ключевые слова URL для ранжирования. Избегайте заполнения URL-адресов каждым ключевым словом и включайте только то, что полезно.
URL-адреса, оптимизированные для SEO, повышают вероятность перехода по ссылке, что также может повысить ваш PageRank.
После запуска вашего сайта и в любое время, когда вы редактируете URL-адрес страницы, (повторно) отправьте карту сайта в Google Search Console. Вы хотите отправить свою карту сайта, чтобы поисковые системы немедленно сканировали и индексировали ваши страницы, чтобы поддерживать SERPS (страницы результатов поисковой системы) в актуальном состоянии с вашим сайтом.
12 лучших практик SEO для URL-адресов
1. Следуйте правильной структуре URL-адресов
9Иерархию URL-адресов 0004 необходимо выяснить до того, как вы начнете создавать свой веб-сайт.Не существует установленного правила для наилучшей структуры URL. И URL-адреса могут быть разными в зависимости от цели сайта.
Но структура URL, которая проста, логична, легко запоминается и передает значение с помощью используемых слов, считается лучшей.
Сделайте структуру URL-адреса интуитивно понятной, чтобы пользователи и поисковые системы могли быстро и легко понять связи между различными страницами на вашем сайте. После того, как ваша структура URL-адреса создана, довольно просто выбрать правильные ключевые слова URL-адреса для каждой страницы.
2. Использовать протокол HTTPS
HTTPS — это безопасная версия протокола HTTP.
Secure Sockets Layer (SSL) шифрует связь между вашим браузером и веб-сайтом, поэтому даже если хакерам удастся перехватить данные, они не смогут их прочитать.HTTPS повышает доверие к вашему веб-сайту, поскольку вызывает доверие у пользователей — они чувствуют себя в большей безопасности, делая покупки, используя данные своей кредитной карты, адрес и номер телефона.
Этот кажется прямым, но только 69% всех веб-сайтов, которые в настоящее время перенаправляют на HTTPS.
Не знаю, как вы, но лично я НИКОГДА не покупаю на незащищенных сайтах. Если ваш сайт только HTTP, вы, вероятно, теряете потенциальный бизнес от технически подкованных пользователей.
HTTPS также является сигналом ранжирования Google и предпочитает веб-сайты с SSL. В браузере Chrome значок замка в адресной строке указывает, имеет ли этот веб-сайт безопасное соединение или нет. Нажмите на значок, чтобы получить более подробную информацию о подключении.
3. Скрыть префикс www
com/embed/Zlnjdu4pkcJTW?wmode=opaque» data-embed=»true»>
Префикс www используется для предотвращения путаницы, потому что совершенно очевидно, что он означает домен веб-сайта. Но в настоящее время нет необходимости включать его.
И если вы включите его, он будет выглядеть устаревшим, дольше набираться и занимать больше места в адресной строке. Фактически, браузер Chrome скрывает WWW и HTTPS:// в своей адресной строке, потому что эта информация не так уж важна для отображения, поскольку у них есть индикатор значка безопасного замка. Если вы хотите его увидеть, просто дважды щелкните внутри адресной строки, он все еще там.
Скройте префикс www, чтобы сделать ваш домен «голым» и чище. Перенаправьте версию с www на голый домен.
4. Отредактируйте URL-адрес страницы, чтобы он соответствовал
Когда вы публикуете страницу на своем сайте, она должна иметь четкую цель. Не используйте случайно сгенерированные числа, которые сбивают с толку и не имеют никакого отношения к делу.
Настройте URL-адреса страниц вашего веб-сайта, чтобы они описывали содержимое страницы. Это улучшит ваш пользовательский опыт и может повысить рейтинг кликов.
5. Говорите кратко и просто
Большинство URL-адресов автоматически используют заголовок страницы или сообщения в качестве URL-адреса по умолчанию, но иногда заголовок может быть излишне длинной строкой символов для URL-адреса. Чем короче URL-адрес, тем лучше — короткие URL-адреса также имеют более высокий рейтинг.
6. Используйте значимые ключевые слова
Используйте 1-2 релевантных ключевых слова в своем URL-адресе и сообщите Google, по какой странице должна отображаться в результатах поиска. Не заполняйте свой URL-адрес чем-то большим, потому что это может быть воспринято как спам. Используйте ключевое слово, которое находится в заголовке страницы или поста.
В дополнение к URL вы также хотите добавить эти ключевые слова в метаописание своей страницы, потому что Google выделяет эти слова жирным шрифтом в результатах поиска, и это делает вашу страницу более заметной.
7. Используйте дефисы для разделения слов
URL-адреса не используют пробелы для разделения слов. Также не используйте символы подчеркивания.
Лучшие практики SEO используют дефисы между словами, потому что это сообщает Google и пользователям, где находятся разрывы между словами, и их намного легче читать, чем все слова, сложенные вместе.
Вот пример разницы между дефисами: designpowers.com/blog/ urlstructureseobestpractices designpowers.com/blog/ url-structure-seo-best-practices
8. Удалите стоп-слова
Стоп-слова (the, and, or, of, a, an, to, for и т. д.) не обязательно должны быть в вашем URL-адресе. Удалите эти слова из своего URL, чтобы сделать его короче и читабельнее. Вы можете видеть в URL-адресе этого поста, что я удалил слово «для», потому что оно короче и его легче читать и запоминать.
9. Используйте строчные буквы
URL-адресачувствительны к регистру для всего, что следует после имени домена. Это означает, что DesignPowers.com по-прежнему приведет вас к designpowers.com, но designpowers.com/Contact приведет вас на страницу 404 вместо нашей страницы контактов.
Всегда используйте строчные буквы для ваших URL-адресов, и если вы использовали прописные буквы, обновите свои ссылки и перенаправьте на новые.
Squarespace автоматически по умолчанию использует строчные буквы, поэтому, если это платформа вашего веб-сайта, вам не о чем беспокоиться, когда дело доходит до чувствительности к регистру.
10. Перенаправить старые URL-адреса
Вполне вероятно, что со временем вы будете вносить изменения в свой сайт, и вы можете выбрать структуру URL-адреса, а затем решить изменить ее позже, чтобы повысить удобство использования.
В этом случае рекомендуется добавлять постоянные перенаправления.Редиректы гарантируют отсутствие битых ссылок для людей и ботов.
Каждый раз, когда вы редактируете или изменяете URL-адрес, добавляйте перенаправление 301, чтобы, если кто-то нажмет на старый URL-адрес, он автоматически перешел на новый URL-адрес и не увидел неработающую страницу с ошибкой 404.
Однако избегайте слишком большого количества переадресаций, поскольку они могут замедлить работу вашего сайта. Одно или два перенаправления — это нормально, но лучше сделать страницу доступной без циклов перенаправления. Вот почему так важно выбрать хорошую структуру URL-адресов в начале жизни вашего сайта — чтобы избежать перенаправлений!
11. Удалить даты из сообщений блога
Удаление дат публикации из URL-адреса сообщения в блоге сохраняет актуальность контента для пользователей, выполняющих поиск, поскольку людям всегда нужен самый последний контент.
URL-адреса без дат могут повысить рейтинг кликов в поисковых системах и повысить рейтинг контента в течение многих лет.Если сообщение не относится к определенному событию или дню, нет необходимости форматировать ваши сообщения с датой, и это может даже привести к снижению рейтинга кликов, потому что люди с меньшей вероятностью захотят читать устаревшее сообщение из 2013, чем текущий источник.
Он также позволяет использовать вечнозеленый контент, поэтому вы можете вернуться и обновить высокоэффективные публикации новым контентом, а затем повторно опубликовать публикацию с новой датой без перенаправления старого URL-адреса. Обновление и повторная публикация старого контента — сильная SEO-стратегия.
Но в целом лучше удалить дату публикации для удобства пользователей! Отсутствие даты публикации упрощает навигацию по URL-адресу для пользователей.
Например, с датой окончания (она всегда длиннее на 11 символов):
vetcare.com/blog/2018/10/18/obesity-in-our-pets-an-oz-of-prevention-is- worth-a-pound-of-cure — с датой поста и полным заголовком поста.
vetcare.com/blog/pet-obesity-prevention — без постдаты и упрощенного URL с ключевыми словами, которые все равно поясняют, о чем пост (это то, что вам нужно!).
12. Расшифровывать числа (иногда)
Цифры могут вызвать некоторую путаницу, но не всегда.
Если в названии вашей компании и в корневом домене есть номер, примите меры предосторожности, а также приобретите расшифрованную версию доменного имени.
Затем перенаправьте его на основной домен. Таким образом, если кто-то запутается или просто не знает правописания, он гарантированно попадет на ваш сайт.
Например, seveneleven.com перенаправляет на свой домен https://www.7-eleven.com
Старайтесь не использовать все номера после корневого домена. Подумайте о том, как люди пишут. При поиске чего-либо в Интернете 4 можно легко перепутать вместо «для» или 2 вместо «для», поэтому лучше просто избегать путаницы.