Пирлиев К., Нурмаммедова О., Велигылыджова М.
ВЕБ-ИНКЛЮЗИВНОСТЬ: КАК УСОВЕРШЕНСТВОВАТЬ СКОРОСТЬ ЗАГРУЗКИ И ОПТИМИЗИРОВАТЬ WEB-САЙТ *
Аннотация:
в современном мире разработка веб-сайтов и их продвижение являются достаточно сложной задачей. Одним из факторов ранжирования сайтов, является его доступность и скорость загрузки. Сайт должен быть оптимизирован таким образом, чтобы загрузка сайта происходила быстро как на персональных компьютерах, так и на мобильных устройствах. К сожалению, в настоящее время существует большое количество сайтов, которые не оптимизированы должным образом. Это относится как к русскоязычному, так и к англоязычному сегментам Интернета. В настоящей статье, мы обращаем внимание на то, что доступность сайта и время его загрузки – это важные факторы, с которыми необходимо проводить определенные действия, направленные на оптимизацию сайта.
Ключевые слова:
разработка сайтов, продвижение сайтов, скорость загрузки сайта, доступность сайта, оптимизация сайтов
Доступный веб-сайт разработан таким образом, чтобы каждый мог без труда им пользоваться. В процессе разработки веб-сайта вы хотите убедиться, что конечный пользователь имеет лучший пользовательский опыт. И это включает людей с ограниченными возможностями или тех, кто сталкивается с проблемами при использовании веб-сайта. [8, с. 81] К сожалению, все еще есть веб-сайты, которые не используют передовые методы доступности. Но вы можете убедиться, что ваш работает. Если вы будете помнить о нескольких вещах в процессе веб-разработки, вы сможете улучшить взаимодействие с пользователем для всех пользователей, включая пользователей с ограниченными возможностями. Ниже приведены несколько полезных советов, которые можно использовать для улучшения доступности веб-сайта. Добавить замещающий текст к изображениям. Возможно, вы слышали о важности добавления альтернативного текста в теги изображений в HTML5. Итак, как вы их используете? Предоставляете ли вы альтернативный текст для каждого изображения на вашей веб-странице? Замещающий текст изображения облегчает понимание содержимого веб-страницы людьми с нарушениями зрения. Но вы должны включать замещающий текст только для информационных изображений, которые помогают понять контент. Декоративные изображения должны иметь пустой альтернативный текст. Это сообщает программам чтения с экрана, что информация, предоставляемая изображением, не важна и может фактически отвлекать внимание пользователя. Информационные изображения - это изображения, которые передают важную информацию, связанную с контентом. Вы должны быть в состоянии описать то, что они показывают, в нескольких словах альтернативного текста. [4, с. 163] Предположим, мы ведем фитнес-блог и работаем над созданием статьи о том, как тренироваться дома, и мы используем следующее изображение в нашей статье. /Рисунок 1. Изображение для сайта (фитнес-блог).Это изображение должно передать сообщение читателям блога о вещах, которые вам нужны для упражнений на скручивание. Альтернативный текст для этого изображения может быть примерно таким: img src="crunch_exercise.png" alt=«У вас должен быть качественный коврик для упражнений и спортивная одежда, чтобы избежать травм спины и кожных аллергий».Альтернативный текст, который мы предоставили для нашего изображения, ясно сообщает пользователям с нарушениями зрения сообщение, которое передает наше изображение. Декоративные изображения, с другой стороны, служат единственной цели украшения веб-страницы - возможно, они просто разбивают контент или дополняют общие описания в тексте. [1, с. 123] Изображения, используемые в качестве иконок, являются отличным примером декоративных изображений. На главной странице Airbnb есть панель навигации с несколькими значками (например, в красном кружке), указывающими на различные типы жилых помещений, доступных на Airbnb. Значки, используемые на панели навигации, предназначены для украшения, и мы можем оставить их альтернативный текст пустым. /Рисунок 2. Главная страница Airbnb.Поддерживать иерархию заголовков. Если вы не используете заголовки в правильной иерархии (от h1 - самого большого - до h6 - самого маленького), программы чтения с экрана могут предположить, что не хватает некоторого контента. По этой причине лучше всего использовать h1 только для основного заголовка, h для заголовков, следующих за заголовком, h3 для подзаголовков и так далее. [10, с. 129] Рассмотрим пример ниже: у нас есть веб-страница с несколькими заголовками. h1 используется для заголовка документа, h2 - для заголовка документа второго уровня, h3 - для подзаголовков и h4 - для мини-заголовков (заголовки, идущие после h3).
Номер журнала Вестник науки №1 (70) том 3
Ссылка для цитирования:
Пирлиев К., Нурмаммедова О., Велигылыджова М. ВЕБ-ИНКЛЮЗИВНОСТЬ: КАК УСОВЕРШЕНСТВОВАТЬ СКОРОСТЬ ЗАГРУЗКИ И ОПТИМИЗИРОВАТЬ WEB-САЙТ // Вестник науки №1 (70) том 3. С. 710 - 715. 2024 г. ISSN 2712-8849 // Электронный ресурс: https://www.вестник-науки.рф/article/12531 (дата обращения: 19.05.2024 г.)
Вестник науки СМИ ЭЛ № ФС 77 - 84401 © 2024. 16+