Веб-услуги · Арабский язык

Разработка арабских сайтов в Дубае, выстроенная справа налево начиная с кода

Настоящая сборка справа налево меняет атрибут направления, логику таблиц стилей, типографику, формы и URL, а не только текст. Эта страница разбирает те технические детали, которые отличают настоящую арабскую сборку от английского сайта с подменёнными словами.

  • рейтинг 4.7 в Google
  • 200+ клиентов
  • В Дубае с 2018 года
45 минутдо фиксированной цены в письменном виде

Большинство сайтов в Дубае, которые называют себя двуязычными, это английский сайт с включённым плагином перевода. Навигация переворачивается, текст меняет язык, и на первый взгляд кажется, что разработка арабского сайта состоялась. Но под капотом номера телефонов читаются задом наперёд внутри арабских предложений, стрелки всё ещё смотрят не в ту сторону, форма всё ещё проверяется по английским строкам ошибок, а Google индексирует одну скудную, наполовину готовую страницу вместо двух настоящих. Правильная разработка арабского сайта в Дубае это решение на уровне кода, а не языковой переключатель, и эта страница подробно разбирает, что именно меняется: направление, логика вёрстки, типографика, цифры, смешанный контент, формы, индексация в поиске и постоянный процесс работы, который держит два языка действительно в шаге друг с другом.

Эта страница относится к нашей более широкой работе по разработке сайтов и уходит глубже общего брифа на сборку, в конкретную механику сайта справа налево. Там, где вопрос именно в самом арабском тексте, наша страница переводческих услуг напрямую разбирает эту работу.

Основа

Что на самом деле означает «справа налево» в разработке арабского сайта для Дубая

Разработка арабского сайта начинается с одного атрибута, который определяет всё, что следует за ним. Документация MDN по атрибуту dir описывает его как способ, которым элемент объявляет своё базовое направление текста, и установка dir="rtl" на элементе html вместе с lang="ar" это то, что сообщает собственному двунаправленному текстовому алгоритму браузера, в каком порядке располагать всё на странице, а не только в какую сторону визуально переворачивать вёрстку. Этот единственный атрибут выполняет реальную работу: он управляет тем, как располагаются нейтральные символы вроде знаков препинания и пробелов, как браузер по умолчанию выстраивает блочные элементы, и какой край экрана становится начальной точкой для текста.

Сайт, который лишь отзеркаливает CSS, переворачивая отступы и float через переопределение стилей, но при этом оставляет базовое направление в разметке незаданным или противоречивым, борется с собственным текстовым движком браузера, а не работает вместе с ним. Именно из этого несоответствия обычно и рождаются мелкие, трудно диагностируемые баги на якобы двуязычном сайте.

Что на самом деле контролирует dir=”rtl”

  • Базовое направление порядка, которое алгоритм bidi браузера использует для страницы
  • Направление блочного потока по умолчанию, до применения любого переопределения CSS
  • Как располагаются нейтральные символы, знаки препинания, пробелы и скобки
  • Начальный край для выравнивания текста, когда явное выравнивание не задано
  • Наследуемое направление для любого дочернего элемента, который не задаёт собственное

Логика вёрстки

Логические свойства CSS в разработке арабского сайта

Ошибка вёрстки, которая чаще всего встречается в разработке арабского сайта, это сначала построить английский сайт с фиксированными значениями CSS для левой и правой стороны, а затем написать второй, параллельный набор правил, переворачивающий каждое из них для арабского. Технически это работает, и это же означает, что любое будущее изменение дизайна придётся вносить дважды, правильно, в двух направлениях, и так вечно. Документация MDN по логическим свойствам CSS напрямую объясняет более правильный подход: такие свойства, как margin-inline-start или padding-inline-end, описывают позицию относительно потока текста, а не фиксированную физическую сторону, поэтому одна и та же строка CSS автоматически даёт верный результат в обоих направлениях, если направление контейнера задано правильно.

Строить на логических свойствах с самой первой строки CSS, а не встраивать их задним числом, когда таблица стилей только для английского уже существует, это единственное решение, которое сильнее всего влияет на то, сколько будет стоить поддержка арабской версии на протяжении всей жизни сайта.

Логические свойства, которые стоит знать

  • margin-inline-start / margin-inline-end вместо отступов слева и справа
  • padding-inline-start / padding-inline-end вместо внутренних отступов слева и справа
  • inset-inline-start / inset-inline-end вместо фиксированного позиционирования слева и справа
  • text-align: start / end вместо выравнивания слева и справа
  • border-inline-start для границы, которая должна располагаться на ведущем крае

Стилизация по направлению

Псевдокласс :dir() в разработке арабского сайта для Дубая

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

ПодходЧто он на самом деле проверяет
[dir="rtl"] селектор атрибутаСовпадает только с элементом, который явно несёт сам атрибут dir, и пропускает всё, что полагается на унаследованное направление
:dir(rtl) псевдоклассСогласно документации MDN, совпадает с реальным вычисленным направлением элемента, включая направление, унаследованное от родителя или заданное через dir="auto", то есть с тем, как компонент реально отрисовывается

Практическая разница важна для компонента, созданного один раз и переиспользуемого и на арабской, и на английской странице, например карточки или кнопки, где правильное направление зависит от того, где именно он оказался, а не от значения, записанного в самом компоненте. Разработка арабского сайта для бизнеса в Дубае, которая полагается только на селекторы атрибутов, обычно упускает именно такие переиспользуемые компоненты.

Типографика

Типографика арабского сайта это отдельное дизайнерское решение, а не подмена шрифта

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

Соответствие насыщенности начертания это деталь, которую упускают чаще всего. Арабская и латинская гарнитуры, описанные как одинаковое начертание, обычное или полужирное, редко несут одинаковую визуальную плотность на экране, поэтому заголовок, который выглядит сбалансированным по-английски, может выглядеть либо слишком тяжёлым, либо слишком тонким, когда арабская версия отрисовывается в эквивалентном начертании. Это деталь, которую разработка арабского сайта в Дубае должна проверять визуально каждый раз, а не предполагать, что она автоматически переносится из английского дизайна. Разработка арабского сайта в Дубае должна рассматривать это как этап проверки дизайна, сравнивая реальные абзацы бок о бок на обоих языках, а не как то, что замечают впервые уже после запуска.

Чек-лист арабской типографики

  • Гарнитура с настоящими арабскими глифами, а не латинский шрифт с обычным запасным вариантом
  • Начертания проверены визуально в сравнении с латинской гарнитурой на совпадающих размерах
  • Увеличенный межстрочный интервал для арабского основного текста, поскольку диакритике нужно больше вертикального пространства
  • Межбуквенный интервал оставлен без изменений; арабская письменность не использует его так, как латинский акцидентный шрифт
  • Выключенный по ширине текст проверен внимательно, поскольку арабское выравнивание может неравномерно растягивать слова, если у шрифта нет поддержки кашиды

Цифры

Цифры в разработке арабского сайта

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

Западноарабские цифры: 0123456789

Формы цифр, использованные во всём этом предложении, и те, что большинство государственных и деловых цифровых сервисов ОАЭ показывают в арабских интерфейсах. Несмотря на название, именно эти цифры чаще всего встречаются в повседневном арабском цифровом контенте по всему Персидскому заливу.

Восточноарабские (индийские) цифры: ٠١٢٣٤٥٦٧٨٩

Другой набор цифр, больше ассоциирующийся с печатью, некоторыми государственными документами и контентом, нацеленным на определённые другие арабоязычные регионы. Аудитория ОАЭ в целом больше привыкла читать западноарабские цифры на экране.

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

Смешанный контент

Смешанный арабский и латинский текст в разработке сайтов Дубая

Номер телефона, адрес электронной почты, код товара или английское название бренда, вставленные в середину арабского предложения, это то место, где двунаправленный алгоритм браузера чаще всего путается, потому что эти фрагменты читаются слева направо внутри текста, который в остальном читается справа налево. Руководство W3C по алгоритму двунаправленного текста Unicode объясняет, что без явной разметки нейтральные символы вроде цифр, запятых или скобок, находящиеся на границе между двумя направлениями, могут быть расставлены в неверном порядке, поскольку алгоритму приходится угадывать, к какой стороне они относятся.

Решение состоит в том, чтобы изолировать исключение, а не надеяться, что алгоритм угадает верно. Обёртывание латинского фрагмента, номера телефона, кода отслеживания, адреса электронной почты, в строчный элемент с dir="ltr", либо в HTML-элемент bdi для текста, направление которого заранее неизвестно, например собственное имя клиента, введённое через форму, сохраняет этот фрагмент стабильным независимо от того, что его окружает.

Что нуждается в явной изоляции направления

  • Номера телефонов и WhatsApp внутри арабских абзацев
  • Адреса электронной почты и URL сайтов, написанные латинскими символами
  • Коды товаров, номера заказов и номера отслеживания
  • Английские названия брендов или товаров, намеренно оставленные без перевода
  • Текст, введённый пользователем, чей язык заранее неизвестен

Визуальные детали

Иконки и графики в разработке арабского сайта

Не всё визуальное должно переворачиваться, и понимание того, что относится к какой половине, это оценочное решение, которое отзеркаленная сборка обычно ошибочно принимает сразу в обе стороны.

Направленные иконки переворачиваются

Стрелки, шевроны, кнопки назад и вперёд, и всё, что подразумевает продвижение вперёд по процессу, должны отзеркаливаться вместе с вёрсткой.

Иконки статуса остаются на месте

Галочка, предупреждающий треугольник, кнопка воспроизведения или иконка часов несут смысл независимо от направления и не должны отзеркаливаться только потому, что отзеркалена сама страница.

Графики требуют решения

Столбчатая диаграмма, где «больше» визуально расположено правее, читается арабской аудиторией наоборот, если только ось не развёрнута намеренно или диаграмма не использует подписанные значения вместо подразумеваемого направления.

Фотографии и логотипы остаются как есть

Фотографии товаров, снимки команды и сам логотип никогда не отзеркаливаются; переворачивание фотографии или словесного знака не передаёт направление, а просто выглядит неправильно.

Формы

Формы и сообщения валидации в разработке арабского сайта для Дубая

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

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

Чек-лист арабской формы

  • Подписи и поля построены на логических свойствах, а не отзеркалены вручную
  • Поля телефона и электронной почты остаются слева направо внутри формы справа налево
  • Сообщения валидации написаны на арабском, а не переведены буквально с английских строк
  • Длина сообщений проверена на реальной вёрстке, поскольку арабский текст часто оказывается длиннее
  • Текст-заполнитель отличается от текста подписи, и оба по-настоящему полезны на арабском

Поиск

Структура URL и hreflang для разработки арабского сайта

Арабскому и английскому языкам нужны отдельные, индексируемые URL, на практике проще всего в виде подкаталога вроде слэш ar слэш путь, чтобы поисковая система воспринимала их как две отдельные, способные ранжироваться страницы, а не одну страницу, которая просто меняет текст. Собственная документация Google по локализованным версиям описывает hreflang как механизм, связывающий эти URL друг с другом, сообщая Google, какие страницы являются альтернативными языковыми версиями друг друга, с кодом языка вроде ar или en, и указывает, что отсутствующая обратная ссылка, когда арабская страница не ссылается обратно на свой английский аналог, приводит к тому, что Google игнорирует эту пару.

Ничто из этого не заменяет настоящий контент. Собственное руководство Google по управлению многоязычными сайтами ясно говорит, что определение языка происходит по реальному тексту страницы, а не по атрибуту lang, шаблону URL или самому hreflang, поэтому технически безупречная настройка hreflang, обёрнутая вокруг скудного, наполовину переведённого арабского контента, не будет восприниматься как настоящая арабская страница ни Google, ни посетителем, который на неё попадёт.

Как добиться правильной индексации арабской версии

  • Арабский язык в собственном подкаталоге, а не в параметре запроса или тексте, подменённом поверх английского URL
  • Взаимный hreflang между каждой парой арабской и английской страницы
  • Полный, настоящий арабский контент на странице, а не частичная или временная версия
  • Запись арабской версии в XML-карте сайта наряду с английской
  • Видимый переключатель языка, поскольку Google не рекомендует автоматические редиректы по местоположению

Постоянный контент

Процесс работы с арабским контентом, когда его пишет кто-то другой

Сборка это лишь половина проекта. Более сложная, долгоиграющая часть разработки арабского сайта для бизнеса в Дубае это удерживать два языка в шаге друг с другом, как только за редактирование сайта берутся живые люди.

  1. Одна модель контента, два языковых поля

    Каждая страница хранит и английский, и арабский контент в одной и той же базовой записи, поэтому переводчик или копирайтер всегда точно видит, с каким английским источником он работает.

  2. Видимый статус перевода

    У каждой пары страниц есть простой статус: совпадает или устарел. В тот момент, когда кто-то редактирует английскую сторону, этот статус должен помечаться автоматически, а не полагаться на чью-то память.

  3. Арабская версия проверяется на реальной вёрстке

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

  4. Новые страницы строятся двуязычными с первого дня

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

Доказательство, а не предположение

Правильное тестирование разработки арабского сайта для Дубая

Сайт может пройти беглый визуальный осмотр и всё равно провалить каждый пункт, разобранный выше. Настоящее тестирование проверяет механику, а не только отражение.

Инструменты разработчика в браузере

Переключение вычисленного направления страницы и осмотр отдельных элементов выявляет компоненты, стилизованные фиксированными значениями слева и справа, а не логическими свойствами.

Реальные устройства, оба языка

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

Свободно читающий человек, а не только разработчик

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

Пунктуация

Пунктуация и кавычки в разработке арабского сайта для Дубая

У арабского языка свои собственные соглашения о пунктуации, и отношение к арабскому тексту как к английскому с другими буквами источник множества мелких, легко упускаемых ошибок. Арабские запятая и вопросительный знак визуально отличаются от английских аналогов и обращены в противоположную сторону, чтобы соответствовать направлению чтения, а арабские кавычки отличаются от английской пары, которую большинство сайтов используют по умолчанию в настройках CSS или CMS. Сайт, который берёт кавычки из одного глобального правила стиля, написанного под английский, часто отображает арабские кавычки в форме, которую носитель языка сразу замечает как неправильную, даже если не всегда может точно сказать почему. Разработка арабского сайта в Дубае должна стилизовать их отдельно, а не оставлять унаследованными от английских настроек по умолчанию.

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

Детали пунктуации, которые стоит проверить

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

Данные и таблицы

Таблицы и насыщенные данными макеты в разработке арабского сайта

Таблица одно из самых очевидных мест, где отзеркаленная сборка выдаёт себя, потому что порядок столбцов несёт настоящий смысл. В вёрстке справа налево первый столбец, с которым встречается читатель, крайний правый, а не крайний левый, поэтому сравнительной таблице, листу характеристик или сетке цен, построенным для английского, а затем перевёрнутым через CSS, нужно пересмотреть реальный порядок столбцов, а не только направление текста. Таблица, где заголовки строк по привычке из английской сборки визуально закреплены слева, а основной текст читается справа налево, создаёт вёрстку, которая борется сама с собой каждый раз, когда взгляд читателя пытается проследить строку. Разработка арабского сайта в Дубае должна проверять по этому принципу каждую таблицу на сайте, а не только те, что построены специально для арабского запуска.

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

Структурированный контент, который стоит проверить отдельно

  • Сравнительные таблицы и таблицы цен, проверенные на настоящий порядок столбцов справа налево
  • Пошаговые процессы и пронумерованные этапы
  • Хронологии и индикаторы прогресса
  • Таблицы данных, подтянутые из таблицы или поля CMS без проверки вёрстки
  • Любой компонент, скопированный напрямую из английской сборки без проверки направления

CMS и конструкторы страниц

Где CMS тихо ломает разработку арабского сайта

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

Настройки конструктора страниц по умолчанию

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

Пробелы в плагинах и виджетах

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

Кастомным полям тоже нужно направление

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

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

Бриф для переводчика

Работа с вашим собственным автором или переводчиком арабского сайта

У многих бизнесов в Дубае уже есть доверенный автор арабских текстов, коллега по маркетингу, агентство или переводчик-фрилансер, и они хотят, чтобы сайт был построен под получение этого контента, а не под написание его нами. Это хорошо работает при условии, что бриф, который получает переводчик, охватывает больше, чем просто английский исходный текст. Глоссарий терминов бренда, которые должны оставаться непереведёнными, выбранный тон (формальный или разговорный, который в арабском маркетинговом тексте варьируется сильнее, чем в английском), и указания по длине символов для всего, что появляется в фиксированном пространстве, кнопки, заголовка карточки, подписи поля формы, всё это должно быть в этом брифе. Разработка арабского сайта в Дубае проходит намного глаже, когда такой бриф уже существует, поскольку это убирает большую часть переписки, которая иначе понадобилась бы переводчику.

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

Что входит в хороший бриф на арабский контент

  • Глоссарий названий бренда и товаров, которые остаются без перевода
  • Выбранный тон голоса, согласованный конкретно для арабского языка
  • Указания по длине символов для кнопок, подписей и заголовков карточек
  • Кто даёт финальное согласование и проверяет ли он его на живом шаблоне
  • Отметка о формальном или разговорном арабском, поскольку аудитория ОАЭ читает оба варианта

Доступность

Доступность в разработке арабского сайта

Программа чтения с экрана полагается на те же атрибуты, что браузер использует для вёрстки, поэтому правильная разметка языка и направления работает сразу вдвойне.

Правильное переключение языка

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

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

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

Это тесно пересекается с изначально правильной настройкой атрибутов dir и lang, разобранной ранее на этой странице. Сборка справа налево, в которой верно заданы базовые основы на уровне кода, как прямое следствие, оказывается и более доступной.

Сроки

Что настоящая разработка арабского сайта добавляет к срокам в Дубае

Разработка арабского сайта это не функция, добавленная к английской сборке в последнюю неделю. При честном подходе она меняет форму всего проекта.

  1. Дизайн проверяется сразу на обоих языках

    Решения по вёрстке и компонентам проверяются на реальном арабском тексте рано, а не утверждаются на английском в расчёте на то, что перевод пройдёт гладко.

  2. Разработка на логических свойствах с первого же компонента

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

  3. Контент создаётся параллельно, а не последовательно

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

  4. Тестирование по-настоящему удваивается

    Каждая проверка на устройстве и в браузере проходит на обоих языках, а не один раз на английском с предположением, что арабский поведёт себя так же.

Как распознать разницу

Десять признаков того, что сайт был отзеркален, а не построен как настоящая разработка арабского сайта

На что обратить вниманиеЧто это обычно значит
Номера телефонов читаются в неверном порядке цифр внутри арабского текстаНет изоляции направления на смешанных латинских фрагментах
Все иконки отзеркалены, включая галочки и предупреждающие символыСплошной переворот через CSS вместо осознанного решения для каждой иконки
Арабский и английский на одном URL, подменяются скриптомНет настоящего арабского URL, который могли бы найти поисковые системы или посетители
Ошибки формы это буквальный, неуклюжий перевод английского слово в словоСтроки валидации никогда не проверялись носителем арабского языка
Основной арабский текст визуально тесный, буквы накладываются друг на другаМежстрочный интервал оставлен как в английском по умолчанию, слишком тесный для арабской диакритики
Кнопки и карточки с неровными отступами только в арабской версииФиксированные значения CSS слева и справа вместо логических свойств
Арабская страница заметно короче своего английского эквивалента по контентуК переводу отнеслись как к запоздалой мысли, а не как к параллельной сборке
Нет видимого переключателя языка, либо он ведёт не на ту страницуHreflang и навигация построены без проверки реальных пар страниц
Английские названия брендов или коды переносятся на новую строку посреди словаНет изоляции или контроля направления на встроенном латинском тексте
График или диаграмма читаются арабским глазом наоборотВизуализация данных скопирована напрямую из английской версии без проверки

Диалект и регистр

Современный стандартный арабский и аудитория Дубая, которая его читает

Текст сайтов в ОАЭ почти всегда пишется на современном стандартном арабском, форме, используемой в официальной письменной речи, СМИ и деловом общении по всему арабскому миру, а не на эмиратском диалекте, на котором говорят, но который редко записывают официально. Это по-настоящему другой вопрос, чем тон: страница может быть написана на правильном современном стандартном арабском и при этом читаться либо тепло и располагающе, либо формально и по-корпоративному, и выбор этого регистра важен в арабском маркетинговом тексте не меньше, чем в английском, а возможно и больше, поскольку несоответствие между непринуждённым брендом и жёстким, чрезмерно формальным арабским текстом заметно носителю языка, даже когда каждое предложение технически правильно.

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

Стоит решить до начала написания текста

  • Современный стандартный арабский в качестве базового варианта, подтверждённый с клиентом
  • Регистр: тёплый и прямой, либо формальный и корпоративный
  • Есть ли термины, которые лучше оставить на английском ради узнаваемости бренда
  • Единообразие тона, проверенное на каждой странице, а не только на главной
  • Назначенный утверждающий за арабский текст, отдельный от английского утверждающего при необходимости

Частые ошибки

Что мы обычно находим при аудите существующей разработки арабского сайта

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

После запуска

Как не дать разработке арабского сайта разъехаться после запуска

Двуязычный сайт, хорошо построенный на момент запуска, не остаётся таким без осознанного ухода. Правка главной страницы, новая страница услуги, обновлённый ответ в FAQ, каждое из этих изменений сначала делается на английском, а арабское обновление следует спустя дни или недели, а иногда не следует вовсе. Это редко осознанное решение кого-либо; так происходит потому, что у английской стороны есть очевидный ответственный, а у арабской часто нет, особенно после того как исходный проект сборки завершён и сайт перешёл в режим рутинного редактирования внутренней командой.

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

Что обычно расходится первым

  • Новые страницы публикуются на английском, а арабский добавляется неделями позже, если вообще добавляется
  • Мелкие правки текста вносятся на одном языке и никогда не переносятся на другой
  • Новые компоненты или секции добавляются без проверки справа налево
  • Новый плагин или виджет установлен без проверки его поведения на арабском
  • Сезонный или кампанийный контент, который существовал только на английском

Почему это важно

Что правильно построенный арабский сайт на самом деле приносит бизнесу в Дубае

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

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

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

С чего начать

Что нам нужно, чтобы начать разработку арабского сайта в Дубае

Ваш план арабского контента

Существует ли уже арабский контент, нужно ли его адаптировать с английского или писать с нуля, и кто отвечает за его утверждение после подготовки черновика.

Что сайт реально должен уметь делать

Формы, оформление заказа, бронирование или любая интерактивная функция, которую арабская версия должна полностью поддерживать, а не только отображать на арабском.

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

Избранные работы

Двуязычные сайты, которые мы построили

HMS FMCE website designed by our team

Сайт · Медицина · Дубай

HMS FMCE

Центр реабилитации и физиотерапии в Дубае с одним полноценно двуязычным сайтом на английском и арабском.

hmsfmce.com
Diyafah International School website designed by our team

Сайт · Образование · Дубай

Diyafah International School

Одна из самых многонациональных школ Дубая: более 2 400 учеников и 40 национальностей в нескольких кампусах.

aldiyafah.com
Hanayen website designed by our team

Интернет-магазин · Мода · Дубай

Hanayen

Дом роскошных абай в Дубае, работающий с 1990 года, перенёс своё мастерство в быстрое мобильное оформление заказа.

hanayen.com

Из блога

Руководства по теме

Все статьи

Прямые ответы

Частые вопросы

Разработка арабского сайта это просто английский сайт с отзеркаленной вёрсткой?

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

Как понять, действительно ли существующий арабский сайт построен справа налево?

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

Вы пишете арабский контент, или его предоставляем мы?

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

Нужно ли переводить арабский контент у сертифицированного переводчика?

Для маркетингового текста сайта нет. В ОАЭ сертифицированный или присяжный перевод для контрактов, судебных документов и подачи в государственные органы должен выполнять переводчик, лицензированный Министерством юстиции. Арабские страницы сайта это обычный коммерческий контент, и такая лицензия для них не требуется, хотя текст всё равно должен быть по-настоящему грамотным, а не черновиком.

Будут ли арабские страницы ранжироваться в результатах поиска Google?

Могут, при условии что арабский контент настоящий и содержательный, расположен на собственном индексируемом URL и связан со своим английским эквивалентом через hreflang. Google определяет язык страницы по её реальному тексту, а не по атрибуту lang или шаблону URL, поэтому скудный или частично переведённый арабский контент не будет ранжироваться как настоящая арабская страница, даже при правильной технической настройке вокруг него.

Насколько дольше занимает двуязычная сборка на арабском и английском по сравнению только с английским?

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

Источники

  1. MDN Web Docs: dir global attribute дата обращения 25 сентября 2026 г.
  2. MDN Web Docs: CSS logical properties and values дата обращения 25 сентября 2026 г.
  3. MDN Web Docs: :dir() pseudo-class дата обращения 25 сентября 2026 г.
  4. W3C Internationalization: Unicode Bidirectional Algorithm basics дата обращения 25 сентября 2026 г.
  5. Google Search Central: Tell Google about localized versions of your page дата обращения 25 сентября 2026 г.
  6. Google Search Central: Managing multi-regional and multilingual sites дата обращения 25 сентября 2026 г.

Фиксированная цена в письменном виде

Пришлите бриф. Получите объём работ и цену в течение 45 минут.

  • Одна фиксированная сумма, согласованная письменно до начала работ
  • Без обязательств и без давления
  • Работа на английском и арабском с правильной вёрсткой справа налево
  • Одна команда для дизайна, маркетинга, сайтов, медиа и текстов

Получите фиксированную цену

Объём работ и цена письменно в течение 45 минут в рабочее время. Без обязательств.

Отправляя форму, вы соглашаетесь, что мы свяжемся с вами по вашему запросу. Политика конфиденциальности

Позвонить WhatsApp Запросить цену