Навигация по сайту

Популярные статьи

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

1хбет
  Для торжества зла необходимо только одно условие —  чтобы хорошие люди просто промолчали! Привет друзья! Сегодня очень серьёзная статья от первого лица (непосредственного участника

Льготы для пенсионеров в 2017-2018 году
С 1 февраля 2017 года пенсии российских пенсионеров проиндексируют (повысят) на 5,4%. Такое постановление подписал премьер-министр РФ Дмитрий Медведев. Единовременную компенсацию в размере 5000 руб.

Понятие и виды пособий и компенсационных выплат
Общие положения Заключение Понятие и виды пособий и компенсационных выплат Общие

Налоговый вычет за обучение в 2016-2017 годах. Как получить возврат налога (ндфл) на ребёнка (документы)
Указанный социальный налоговый вычет представляет собой возможность возврата части средств, истраченных на обучение, как свое, так и близких родственников. Условиями получения данного вида вычета является

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

Страхование вкладов
Создание системы обязательного страхования банковских вкладов населения (ССВ) является специальной государственной программой, реализуемой в соответствии с Федеральным законом «О страховании вкладов физических

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

Выплаты социального характера
К выплатам социального характера, в частности, относятся: 1) выходное пособие при прекращении трудового договора; 2) суммы, выплаченные уволенным работникам на период трудоустройства в связи с реорганизацией

Алименты расчет и выплата
После развода (2 года назад) мы с бывшим мужем договорились между собой, без суда, о выплате алиментов в размере 3-х тысяч рублей. Деньги он выплачивает каждый месяц, но их катастрофически не хватает.

Облако меток

Разработка справа налево в мобильном дизайне

  1. Об авторах Роберт Додис является разработчиком внешнего интерфейса в SteelKiwi Inc. Он настоящий...
  2. 1. Использование атрибута dir или CSS
  3. 2. Использование Flexbox
  4. Кодировка символов
  5. Иконки
  6. Порядок цифр
  7. Положение кнопок управления
  8. Положение других символов
  9. Отдельный файл RTL CSS
  10. Календари
  11. хиджры
  12. Еврейский календарь
  13. Инструменты для отображения календарей
  14. Сокращения (дни недели)
  15. интернационализация
  16. Примеры родных арабских сайтов
  17. Поделитесь своим опытом!

Об авторах

Роберт Додис является разработчиком внешнего интерфейса в SteelKiwi Inc. Он настоящий художник всех проектов, ориентированных на RTL, и часами ищет лучшее и…

Подробнее о Роберте Додисе ...

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

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

Хотя это может показаться не таким уж большим делом, разработка ИТ для языков с написанием справа налево (RTL) влечет за собой внимание к ряду особенностей. Это еще более усложняется тем фактом, что рынок RTL является относительно новым, и не так много ресурсов, доступных для помощи разработчикам.

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

Листать интерфейс

Прежде всего, интерфейс должен быть перевернут справа налево. Вы могли бы подумать, что это скорее совет "D'uh", но мы просто не могли игнорировать его, потому что это на самом деле самое первое, что нужно сделать.

Вот пример дизайна слева направо (LTR) Facebook:

Страница входа в Facebook в дизайне LTR. (Источник изображения: facebook ) ( Посмотреть большую версию )

А вот и RTL-версия Facebook:

Страница входа в Facebook в дизайне RTL. (Источник изображения: facebook ) ( Посмотреть большую версию )

Есть несколько способов добиться этого.

1. Использование атрибута dir или CSS

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

Для дизайна LTR , обратите внимание на стили. В этом случае ссылка с логотипом будет зафиксирована слева, а логин-контейнер - справа.

<! doctype html> <html lang = "en"> <head> <meta charset = "utf-8"> <title> Пример </ title> <style> .float-left {float: left; } .float-right {float: right; } body [dir = "rtl"] .float-left {float: right; } body [dir = "rtl"] .float-right {float: left; } </ style> </ head> <body> <header class = "clearfix"> <a href="#" class="float-left logo"> <img src = "static / logo.png"> </ a> <nav class = "float-right login-container"> </ nav> </ header> <main> </ main> <footer> </ footer> </ body> </ html> < Лучшая панель входа в Facebook в дизайне LTR. (Источник изображения: facebook ) ( Посмотреть большую версию )

Для дизайна RTL , как только вы назначите тег body для атрибута dir = "rtl, вся разметка будет зеркально отображена, поместив логотип справа и контейнер входа в систему слева. Противоположные свойства будут применены к блокам с классом float-left или float-right.

<body dir = "ltr">

Атрибут dir указывает направление и отображение текста (слева направо или справа налево). Обычно браузеры распознают направление, потому что оно назначено в наборе символов Unicode, но с атрибутом dir вы можете установить любое направление, которое вы хотите.

Возможные варианты: dir = "ltr", dir = "rtl" и dir = "auto". Этот атрибут также можно переписать с помощью свойства direction CSS.

Поскольку направление текста семантически связано с контентом, а не с представлением, мы рекомендуем, чтобы, когда это возможно, веб-разработчики использовали атрибут dir, а не свойства CSS, связанные с ним. Таким образом, текст будет отображаться правильно даже в браузерах, которые не поддерживают CSS (или в тех, где поддержка CSS отключена).

Лучшая панель входа в Facebook в дизайне RTL. (Источник изображения: facebook ) ( Посмотреть большую версию )

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

2. Использование Flexbox

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

Для LTR :

<div class = "flex-container"> <div class = "flex-item"> 1 </ div> <div class = "flex-item"> 2 </ div> <div class = "flex-item"> 3 </ div> <div> <div class = flex-container> <div class = flex-item> 1 </ div> <div class = flex-item> 2 </ div> <div class = flex-item> 3 </ div> <div>   Пример компоновки flexbox в дизайне LTR Пример компоновки flexbox в дизайне LTR. (Источник изображения: SteelKiwi ) ( Посмотреть большую версию )

Для RTL :

<div class = "flex-container" style = "direction: ltr;"> <div class = "flex-item"> 1 </ div> <div class = "flex-item"> 2 </ div> <div class = "flex-item"> 3 </ div> <div> <div class = flex-container style = direction: ltr;> <div class = flex-item> 1 </ div> <div class = flex-item> 2 </ div> <div class = flex-item> 3 </ div> <div>   Пример макета flexbox в дизайне RTL Пример макета flexbox в дизайне RTL. (Источник изображения: SteelKiwi ) ( Посмотреть большую версию )

Расположение сетки также полезно здесь. Мы устанавливаем grid-template-area в содержащем блоке с помощью свойства {display: grid;} (представьте, что это таблица с двумя столбцами и тремя строками). Сверху: верхний колонтитул занимает всю ширину экрана, боковая панель находится слева, а основное содержимое и нижний колонтитул - справа, один под другим.

Для LTR :

<div class = "grid" style = "grid-template-area:" header header ";" главная боковая панель "" нижний колонтитул боковой панели ";"> <div class = "item-1" style = "grid-area: header; "> header </ div> <div class =" item-2 "style =" grid-area: sidebar; "> sidebar </ div> <div class =" item-3 "style =" grid-area: main; "> main </ div> <div class =" item-4 "style =" grid-area: footer; "> footer </ div> </ div> <div class = grid style = grid-template-area: header header ; главная боковая панель  нижний колонтитул боковой панели ;> <div class = item-1 style = grid-area: header; > header </ div> <div class = item-2 style = grid-area: sidebar; > sidebar </ div> <div class = item-3 style = grid-area: main; > main </ div> <div class = item-4 style = grid-area: footer; > footer </ div> </ div>   Пример основного направления расположения сетки в дизайне LTR Пример основного направления расположения сетки в дизайне LTR. (Источник изображения: SteelKiwi )

Для RTL путем изменения атрибута dir горизонтальная ось с классом сетки и свойством {display: grid;} будут корректироваться в указанном направлении. Матрица макета затем инвертируется:

<div class = "grid" style = "grid-template-area:" header header "" main боковой панели "" нижний колонтитул боковой панели "; dir =" rtl "> <div class =" item-1 "style =" grid-area : header; "> header </ div> <div class =" item-2 "style =" grid-area: sidebar; "> sidebar </ div> <div class =" item-3 "style =" grid-area : main; "> main </ div> <div class =" item-4 "style =" grid-area: footer; "> footer </ div> </ div> <div class = grid style = grid-template-area: header header  main боковой панели  нижний колонтитул боковой панели ; dir = rtl > <div class = item-1 style = grid-area : header; > header </ div> <div class = item-2 style = grid-area: sidebar; > sidebar </ div> <div class = item-3 style = grid-area : main; > main </ div> <div class = item-4 style = grid-area: footer; > footer </ div> </ div>   Пример перевернутой матрицы компоновки сетки в дизайне RTL Пример перевернутой матрицы компоновки сетки в дизайне RTL. (Источник изображения: SteelKiwi )

Несмотря на то, что использование таблиц для создания макетов уже давно не популярно, они все равно будут строить направление потока как компонент, как в предыдущих примерах, то есть при добавлении тега dir = "rtl" столбцы начнут работать. справа и двигайтесь справа налево. Все элементы таблицы будут следовать за этим, если направление не будет заранее определено заранее.

Кодировка символов

Сохраните свой файл, используя кодировку символов, которая включает в себя нужные вам символы (UTF-8 - хорошая ставка). Объявите, что вы собираетесь использовать такие символы в теге head вашей HTML-страницы с:

<meta charset = "utf-8" />

UTF-8 - это кодировка символов, способная кодировать все возможные кодовые точки Unicode, и она охватывает практически все языки, символы и знаки пунктуации. Использование UTF-8 также устраняет необходимость в серверной логике при индивидуальном определении кодировки символов каждой страницы или каждой входящей отправки формы. Кодирование помогает конвертировать все в двоичные числа. Например, «привет» в UTF-8 будет храниться так (в двоичном виде): 01101000 01100101 01101100 01101100 01101111.

Старайтесь изо всех сил, чтобы избежать использования жирным шрифтом и курсивом . Жирный текст сделает читаемость чрезвычайно трудной в большинстве языков RTL (особенно в арабском), а курсив просто не используется. Кроме того, заглавные буквы почти всегда игнорируются на языках RTL.

Пример пропуска заглавных букв в языках RTL. (Источник изображения: SteelKiwi ) ( Посмотреть большую версию )

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

<h1> مثال </ h1> h1 {text-ornament: overline; } <h1> مثال </ h1> h1 {text-ornament: overline;  }   Пример выделения арабского текста Пример выделения арабского текста. (Источник изображения: SteelKiwi )

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

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

Если ваш клиент не является носителем языка продукта или не может вам помочь, всегда есть простой вариант использования одного из Google Noto шрифты (есть один для каждого языка, и все они бесплатны). В качестве альтернативы, Арабнет рекомендует 10 арабских шрифтов (список за 2014 год, но за последние три года ситуация в этой области не сильно изменилась). Тем не менее, имейте в виду, что ваш клиент всегда лучше знает, какой вариант языка используется в его регионе, и если у вас есть возможность проконсультироваться с ним об этом, сделайте это прямо сейчас.

Также помните, что слова в языках RTL часто намного короче слов в английском. Таким образом, отрегулируйте, чтобы сохранить баланс в том, как текст отображается на странице.

Иконки

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

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

Нет необходимости зеркально отображать симметричные значки. (Источник изображения: SteelKiwi )

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

Зеркальные значки, которые указывают на сторону. (Источник изображения: SteelKiwi ) <span class = "back-icon"> </ span> body [dir = "rtl"] {transform: scale (-1, 1); }

CSS-функция scale (x, y), используемая в приведенном выше примере, изменяет размер элемента. Если установлено значение 1, оно ничего не делает, но когда отрицательно, оно выполняет функцию «точечного отражения» и может изменять размер.

Значки, содержащие символы или слова из не-RTL языков, не нужно отражать. Вы должны, однако, локализовать их при необходимости.

Вы должны, однако, локализовать их при необходимости

Значки, содержащие слова или символы из не-RTL языков, не нужно переводить, но при необходимости их следует локализовать. (Источник изображения: SteelKiwi )

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

Избегайте неуместных в культурном отношении значков. (Источник изображения: SteelKiwi )

Логотипы, кнопки навигации и меню должны быть расположены в верхнем правом углу для дизайна RTL. Два последних элемента также должны отображаться в обратном порядке. Однако вам не нужно отражать все, что связано с управлением медиа-контентом (например, кнопки воспроизведения и паузы).

Пример использования YouTube кнопок управления медиа-контентом в дизайне RTL. (Источник изображения: YouTube ) ( Посмотреть большую версию )

Порядок цифр

Порядок цифр в числах не должен изменяться для RTL. Обратите внимание на номер телефона ниже. Цифры отображаются в одинаковом порядке как в LTR, так и в RTL, но значок телефона меняет положение. Это же правило применяется к другим цифрам (таким как адреса и другие числовые строки).

Это же правило применяется к другим цифрам (таким как адреса и другие числовые строки)

Порядок цифр не должен меняться для дизайна RTL. (Источник изображения: SteelKiwi ) ( Посмотреть большую версию )

Положение кнопок управления

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

Например, если оранжевая кнопка, показанная ниже, расположена слева, людям было бы крайне трудно достать ее правым большим пальцем, держа устройство в одной руке:

Размещение оранжевой кнопки слева будет неудобным для пользователей. (Источник изображения: SteelKiwi ) ( Посмотреть большую версию )

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

Размещение оранжевой кнопки в середине страницы решит все проблемы, связанные с удобством. (Источник изображения: SteelKiwi ) ( Посмотреть большую версию )

Элементы в нижней панели вкладок ниже должны располагаться справа налево. RTL также существует на персидском языке - см. Пример ниже:

В дизайне RTL элементы в нижней панели вкладок должны располагаться справа налево. (Источник изображения: SteelKiwi )

Навигационные ящики должны появиться с правой стороны.

В дизайне RTL выдвижные ящики должны появляться с правой стороны. (Источник изображения: SteelKiwi )

Положение других символов

Положение символов, которые можно использовать как для RTL, так и для LTR (например, знаков препинания), будет зависеть от направления текста в целом. Это связано с тем, что браузеры обрабатывают слова RTL в направлении RTL, даже если формат данных начинается с самого начала. Пунктуация преобразуется только в указанном направлении.

Следующий пример должен лучше проиллюстрировать проблему:

Вам нужно преобразовать строки RTL и LTR в отдельные элементы, чтобы символы пунктуации появлялись в правильном направлении. (Источник изображения: SteelKiwi ) ( Посмотреть большую версию )

Чтобы решить эту проблему, вы можете преобразовать строки RTL и LTR (или текстовые фрагменты) в отдельные элементы. Затем укажите их направление либо с помощью атрибута dir, либо свойства CSS direction. В первом случае вы бы сделали это:

<p dir = "rtl" class = "rtl-text">? سوف أعطي مثالا على ذلك. لا تمانع </ p> <p dir = "ltr" class = "ltr-text"> Я приведу пример. Ты не против? </ P>

И во втором, это:

.rtl-text {direction: rtl; } .ltr-text {direction: ltr; }

Кроме того, вы также можете использовать тег bdi, чтобы избежать этого типа проблемы. Однако это поддерживается только в Chrome (16) и Firefox (10).

Отдельный файл RTL CSS

Для базовых стилей CSS вы должны создать отдельный RTL-файл и установить там горизонтальные свойства (плавающие влево и вправо, отступы влево и вправо, поля и т. Д.), А также переопределить их соответствующим образом:

div.class {width: 150px; высота: 100 пикселей; плыть налево; отступы: 0 15px 0 10px; }

И в файле rtl.css:

html [dir = "rtl"] div.class {float: right; отступы: 0 10px 0 15px; }

Если вам нужно исключить некоторые другие функции, ориентированные на LTR, вы всегда можете создать и прикрепить другой отдельный файл rtl.css.

Если этот подход не удовлетворяет вашим потребностям достаточно хорошо, вы можете создать два отдельных файла стилей для LTR и RTL. Различные утилиты могут применяться для автоматизации их сборки. Одна такая программа CSS-флип (создано Twitter). С его помощью вы можете легко скомпилировать файл со свойствами, переопределенными для RTL, из существующего исходного файла.

В input.css:

p {padding-left: 1em; }

И в output.rtl.css:

p {padding-right: 1em; }

Вы также можете использовать замены и исключения, основываясь на директивах в исходном файле. Например, в input.css:

p {/ @replace: -32px -32px / background-position: -32px 0; / @replace: ">" / content: "<"; / @noflip / float: left; }

И в output.rtl.css:

p {background-position: -32px -32px; содержание: ">"; плыть налево; }

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

Вы также можете использовать плагины для сборочных инструментов, в том числе для Глоток , хрюкать а также Webpack ,

Например, в input.css:

.example {transform: translateY (10px) / * rtl: append: scaleX (-1) * /; семейство шрифтов: "Helvetica Neue", Arial / * rtl: prepend: "арабские шрифты", * /; размер шрифта: 1.3em / * РТЛ: 1.2em * /; / * rtl: удалить * / text-украшение: подчеркивание; / * rtl: begin: ignore * / margin-left: 15px; обивка налево: 20px; / * rtl: end: ignore * /}

И в output.rtl.css:

.example {transform: translateY (10px) scaleX (-1); font-family: "арабские шрифты", "Helvetica Neue", Arial; размер шрифта: 1.2em; Левое поле: 15px; обивка налево: 20px; }

Вы также можете сделать настройки для переименования селекторов. Опять же, в input.css:

/ * rtl: begin: options: {"autoRename": true, "stringMap": [{"name": "prev-next", "search": ["prev"], "replace": ["next"] , "options": {"ignoreCase": false}}]} * / slide-prev {content: ''; } / * rtl: end: options * /

И в output.rtl.css:

slide-next {content: ''; }

Календари

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

хиджры

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

Еврейский календарь

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

Инструменты для отображения календарей

Одним из популярных инструментов является FullCalendar , потому что он рассчитывает время на основе Moment.js. Однако он не может преобразовывать календари разных типов и полезен только для локализации дат и отображения содержимого RTL.

Dijit / Календарь может отображать не-григорианские календари, но имеет довольно ограниченный круг задач.

Конструктор DateTimeFormat является бесценным свойством для международных объектов. Это позволяет передавать дополнительные параметры в строку аргумента при указании точного форматирования для времени и даты.

Ниже вы можете увидеть, как нужно конвертировать дату из григорианского календаря в исламский:

var sampleDate = new Intl.DateTimeFormat ("ru-RU-u-ca-islamicc"). format (new Date ()); // => "26.03.2017" console.log (sampleDate); // => "27.06.1438 АХ"

Сокращения (дни недели)

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

Вместо этого просто отобразите их целые имена и уменьшите размер шрифта

Все названия дней недели начинаются с одной буквы на арабском языке, что означает, что вы не можете сокращать их, как на английском языке. (Источник изображения: SteelKiwi ) ( Посмотреть большую версию )

интернационализация

Если ваш продукт требует интернационализации, рассмотрите интерфейс ECMAScript Internationalization. Он поставляется с чувствительным к языку сравнением строк и соответствующим форматированием чисел, дат и времени.

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

Также имейте в виду, что использование восточных и западно-арабских цифр может зависеть от языкового варианта. В некоторых регионах могут использоваться восточно-арабские цифры (123), а в других - западные (١٢٣).

var sampleNumber = new Intl.NumberFormat ('ar-EG'). format (12345); console.log (sampleNumber); // => ١٢ ٬ ٣٤٥

Например, в Тунисе восточно-арабские цифры обычно используются:

var sampleNumber = new Intl.NumberFormat ('ar-TN'). format (12345); console.log (sampleNumber); // => 12345

Примеры родных арабских сайтов

Arageek

посвящен всем новостям хип-хика по всему миру. (Источник изображения: Arageek ) ( Посмотреть большую версию ) посвящен всем новостям хип-хика по всему миру Хаваа Форум это интернет-сообщество для женщин. (Источник изображения: Hawaaworld.com ) ( Посмотреть большую версию ) Саудовская лига посвящен футболу в Саудовской Аравии, с новостями, турнирными днями, информацией о командах и многим другим. (Источник изображения: Saudileague.com ) ( Посмотреть большую версию )

Поделитесь своим опытом!

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

Если вы столкнулись с какими-либо препятствиями, связанными с разработкой RTL, опишите их (вместе с найденными решениями) в разделе комментариев ниже. Чем больше разработчики делятся своими знаниями и опытом, тем легче всем нам будет разбираться в особенностях разработки RTL.

Похожие

Нужно ли устанавливать 32-разрядную или 64-разрядную версию Office / Outlook?
Я только что установил Windows 10 на свой компьютер и сейчас собираюсь установить Office. Он предлагает установить 32-битную версию, но я знаю, что есть также 64-битная версия. Кажется, я вспоминаю, что Microsoft рекомендовала устанавливать 32-разрядную версию даже на 64-разрядную версию Windows, но это было несколько лет назад. Microsoft все еще рекомендует установить 32-разрядную версию? Каковы недостатки или преимущества при установке 64-разрядной версии?
Используйте телефон в качестве мыши или клавиатуры Bluetooth в Android P
Код разработки в Android P указывает на функцию, позволяющую использовать телефон в качестве беспроводной клавиатуры или мыши. Вы можете сделать это в настоящее время в Android, но только если вы сначала рутируете свое устройство.
Методы для преобразования GIF в видео для Instagram - Как
хотите ли вы опубликовать видео в Instagram ? И это видео в формате Gif? Не беспокойся Теперь очень просто опубликовать GIF в Instagram, но не напрямую в формате GIF. Тогда как? Знаете ли вы, что анимированные GIF-файлы можно превратить в видео? Да! Вы правильно поняли. Теперь вы можете конвертировать GIF (.gif) в видео формат. Это очень легко с этими инструментами. Если вы хотите узнать, как начать работу
Google Docs использует меньше людей, чем посещает сеть Spider
... все видят. Гегемон интернет. Полностью. Особенно в Польше, где нет конкуренции в качестве поисковой системы. Как обстоят дела с другими сервисами Google? Оказывается, это не так уж и хорошо. Хорошо, давайте начнем с самого важного. 96,3 процента Поляки, которые используют Интернет, знают и используют поиск Google. Я не знаю, где информация для оставшихся 3,7 процента. Поляки. Может быть,
Просмотр PDF файлов - БЕСПЛАТНО онлайн PDF Reader & Viewer
Открывайте, просматривайте и читайте PDF-файлы с помощью лучшего PDF Reader & Viewer Online Загрузка .... Размер загруженных вами файлов превышает 2 МБ, загрузка может занять больше времени. Пожалуйста, будьте терпеливы. ОТМЕНИТЬ 1 Шаг 1: Загрузить файл PDF Перетащите файл PDF в указанную выше зону или нажмите «Загрузить», чтобы выбрать файл на своем компьютере.
Как получить сообщения Android на ПК
Текстовые сообщения быстро уступают место интернет-приложениям для обмена сообщениями. Тем не менее, SMS по-прежнему чрезвычайно полезен для получения обновлений от вашего банка и коммунальных компаний, а также для поддержания связи с поколением не-смартфонов. Недостатком этой полезной функции является то, что она традиционно была доступна только на устройствах с SIM-чипом. такие как смартфоны. К счастью, есть способы доступа и отправки SMS-сообщений с вашего настольного компьютера.
Обмен файлами, ручная синхронизация и советы по Bluetooth для Windows Phone 8
Реклама Пользуясь платформой Windows Phone с 2010 года, меня поразило то, насколько сложно Microsoft изначально делала доступ к файлам с вашего телефона. С оригинальной Windows Phone 7 требовалось взломать реестр,
Сделать GIF из видео на Linux с помощью Gifcurry
... использование HTML5-видео. Но как вы делаете анимированный GIF из видео на Linux? Мое приложение выбора - Gifcurry. Создать GIF из видео с Gifcurry Gif curry - это простое в использовании приложение GIF Maker с открытым исходным кодом. Он использует ffmpeg и imagemagic для обработки видео и конвертации в GIF. Он имеет как интерфейс командной строки (CLI), так и графический интерфейс пользователя (GUI), хотя в этом посте мы рассматриваем только
... весеннего марта на YouTube перешло в ритм хип-хопа. Среди 10 самых популярных видео в прошлом мес...
... весеннего марта на YouTube перешло в ритм хип-хопа. Среди 10 самых популярных видео в прошлом месяце семь - музыкальные клипы в стиле хип-хоп. Три других фильма - это не удивительно - они произведены SA Wardęgi. В марте пользователи более охотно подписывались на каналы - количество новых подписок увеличилось на 2,9% по сравнению с февралем. Может ли YouTube проснуться от зимней летаргии? Мы приглашаем вас ознакомиться
4 наиболее распространенные ошибки в A / B или многофакторных тестах
Если хорошо мы запланировали наши A / B или многомерные тесты с большой вероятностью мы сможем избежать самых распространенных ошибок. Однако наибольшее внимание следует уделить четырем наиболее распространенным ошибкам: 1. «Тестирование абсолютно бесплатно! Вам не нужно об этом думать - вы должны действовать »
Lexip - инновационная мышь с двумя джойстиками
В декабре 2016 года инновационное устройство под названием Lexip появилось на веб-сайте краудфандинга Indiegogo и Kickstarter. Что это? На первый взгляд, это выглядит как обычная мышь. Ну, может быть, не совсем обычный, потому что это определенно игровой джем. Что отличает

Комментарии

Если это верно для обычной статической картинки, то как насчет картинки, содержащей движение или анимацию?
Если это верно для обычной статической картинки, то как насчет картинки, содержащей движение или анимацию? Анимация имеет гораздо большее влияние, чем обычная картинка. Он предлагает гораздо больше возможностей для создателей / художников, позволяя им донести до пользователей больший смысл. Анимированный формат также может содержать намного больше контента, что практически невозможно для обычного статического изображения.
Как вы думаете, ваша целевая аудитория будет смотреть «Грэмми» или содержать фанатов Тейлор Свифт?
Как вы думаете, ваша целевая аудитория будет смотреть «Грэмми» или содержать фанатов Тейлор Свифт? GIF-поиск в Twitter может быть отличным способом связи с ними. через GIPHY Взаимодействовать и веселиться Если вы заметили тему, это значит, что в социальных сетях для некоммерческих организаций определенно есть место для развлечения, даже если к вашему делу
Черное и белое или цветное?
Черное и белое или цветное? Какие люди представляют вашу целевую демографию? Что должны делать эти люди? Некоторые компании даже определяют тип собак для использования на основе их исследования рынка. Создайте библиотеку фотографий и убедитесь, что у вас есть права на использование всех изображений, которые вы используете.
Или это ваш выбор для новой покупки?
Или это ваш выбор для новой покупки? Как всегда: до встречи в комментариях! Я Мальте, главный редактор здесь, в DeathMetalMods.de. Я работаю юристом и живу в этом блоге своим стремлением к технологиям, цифровому миру и гаджетам. Я пишу большинство статей здесь и организую работу в фоновом режиме. Вы также можете найти меня в частном порядке мастодонт и щебет ,
Или вы?
Или вы? В прошлом мы показали вам, как создать PDF-файл статей Wikpedia Вы могли бы взять с собой. Что ж, мы столкнулись с еще одним изящным решением, где вы можете создать собственную автономную версию, используя WikiTaxi. Что такое WikiTaxi? WikiTaxi это
Для чего нужен блог и как много он значит для блоггера?
Для чего нужен блог и как много он значит для блоггера? Блогосфера частично может выполнять функции социальных сетей, позволяя восстанавливать и поддерживать прервавшиеся социальные связи. Большинство людей, ведущих и комментируют блоги, делают это ради общения с интересными людьми и расширения своей аудитории. Блогер может найти в сети одного или слушателя. С помощью блога можно заявить о себе, поделиться своими разными мнениями, идеями, творениями. Любой блог, в той или иной
Не могли бы вы опубликовать известные / популярные / ваши любимые игры на основе гироскопа для iPhone, iPad или Android Phone?
Не могли бы вы опубликовать известные / популярные / ваши любимые игры на основе гироскопа для iPhone, iPad или Android Phone? (Насколько я понимаю, игра на основе гироскопа будет включать вращательное движение контроллера для ввода, а не просто касание или линейное движение) Хорошо. Сейчас я попытаюсь объяснить, что происходит. Я прошу прощения, если предыстория кажется немного разреженной или расплывчатой ​​- есть много вещей, о которых я не могу говорить из-за характера и сроков
Вы когда-нибудь пытались купить лицензию Windows у Amazon или Newegg?
Вы когда-нибудь пытались купить лицензию Windows у Amazon или Newegg? Если бы это было так просто. Вы столкнетесь с более дешевыми System Builder (OEM) и более дорогими лицензиями Full Version (Retail). Но разница не сразу очевидна. Лицензии System Builder доступны как для «основные» и профессиональные выпуски Windows , Другими словами, есть четыре различных потребительских
Каковы недостатки или преимущества при установке 64-разрядной версии?
Каковы недостатки или преимущества при установке 64-разрядной версии? Где я могу скачать 64-битную версию Office? Начиная с выпуска Office 2019, Microsoft теперь
Доступно в виде графического интерфейса пользователя из меню «Настройки» / «Телефон» 5005 * 4433 # крутится колесо около секунды ?
Доступно в виде графического интерфейса пользователя из меню «Настройки» / «Телефон» 5005 * 4433 # крутится колесо около секунды ??? 5005 * ART # "Артемида?" 5005 * CORE # Состояние CoreDump (по умолчанию отключено) 5005 * MA # Состояние MobileAnalyzer (по умолчанию отключено) 5005 * MA255 # Состояние MobileAnalyzer (FullTrace?) (По умолчанию отключено) 5005 * STATE # Журналы дампов основной полосы («Пожалуйста, добавьте описание») для этого захвата ") 5005 * TRACE # tracing?
Является ли регулярное выражение таким же, как регулярное выражение?
Является ли регулярное выражение таким же, как регулярное выражение? В основном да, с небольшим количеством нет. На данном этапе это семантический вопрос - он зависит от того, что подразумевается под регулярным выражением . Эта тема и другие сочные детали обсуждаются на странице о Регулярные выражения и регулярные выражения , Об этом сайте Прежде чем мы углубимся - и только если у вас есть

Ты не против?
Microsoft все еще рекомендует установить 32-разрядную версию?
Каковы недостатки или преимущества при установке 64-разрядной версии?
И это видео в формате Gif?
Тогда как?
Знаете ли вы, что анимированные GIF-файлы можно превратить в видео?
Как обстоят дела с другими сервисами Google?
Но как вы делаете анимированный GIF из видео на Linux?
Может ли YouTube проснуться от зимней летаргии?
Что это?