Chapterبەش 4 · Lectureوانە 4.5

Kurdish and Bilingual Websites: Right to Leftتۆڕگەکانی کوردی و دووزمانە: ڕاست بۆ چەپ

How to build Kurdish (Sorani) pages that read right to left, and sites in Kurdish and English: lang and dir in the HTML, the right language code (ckb), layouts that flip by themselves with flexbox, grid and logical properties, mixed Kurdish–English text and numbers with <bdi>, dir="auto" and Unicode isolates, the Kurdish letters that must not be replaced by Arabic look-alikes, which icons to mirror and which not, digits and dates, bilingual sites with hreflang and a language switch, and how to test a right-to-left page.

چۆن لاپەڕەی کوردیی (سۆرانی) و بە کوردی و ئینگلیزی دروست بکەیت: lang و dir لە ، دروست ⁦(ckb)⁩، کە بە ، grid و خۆی پێچەوانە دەبێتەوە، دەق و ژمارەی تێکەڵی کوردی و ئینگلیزی بە ⁦<bdi>⁩، ⁦dir="auto"⁩ و جیاکەرەوەکانی ، ئەو پیتە کوردییانەی نابێت پیتی عەرەبیی هاوشێوە جێیان بگرێتەوە، کام ئاوێنە دەکرێن و کامیان نا، ژمارە و ڕێکەوت، دووزمانە بە hreflang و گۆڕەری زمان و تاقیکردنەوەی لاپەڕەیەکی .

23 min read22 خولەک خوێندنەوە · 19 stepsهەنگاو

What you will learnچی فێر دەبیت

  • Mark a Kurdish page and its English parts with lang and dir in the HTML, and choose ckb — not ar-IQ or ku — as its language code.
  • Build layouts that flip by themselves with flexbox, grid and logical properties instead of left and right.
  • Keep mixed Kurdish–English text, numbers and visitors' names in order with <bdi>, dir="auto" and <span dir="ltr">.
  • Use the Kurdish letters ک ی ە instead of Arabic look-alikes, and decide which icons to mirror.
  • Plan a bilingual Kurdish–English site with hreflang links and a language switch, and test a right-to-left page.
  • لاپەڕەیەکی کوردی و بەشە ئینگلیزییەکانی بە lang و dir لە نیشانە بکەیت و ckb — نەک ar-IQ یان ku — وەک هەڵبژێریت.
  • دروست بکەیت کە بە ، grid و لەبری چەپ و ڕاست خۆی پێچەوانە دەبێتەوە.
  • دەقی تێکەڵی کوردی–ئینگلیزی، ژمارە و ناوی سەردانکەران بە <bdi>، dir="auto" و <span dir="ltr"> بە ڕیزبەندیی دروست بهێڵیتەوە.
  • پیتە کوردییەکانی ک ی ە لەبری هاوشێوە عەرەبییەکان بەکاربهێنیت و بڕیار بدەیت کام ئاوێنە بکرێن.
  • دووزمانەی کوردی–ئینگلیزی بە hreflang و گۆڕەری زمان پلان بکەیت و لاپەڕەیەکی تاقی بکەیتەوە.

Right to left: the whole page turns roundڕاست بۆ چەپ: هەموو لاپەڕەکە هەڵدەگەڕێتەوە

Central Kurdish (Sorani) is written in the Arabic script, from right to left; Kurmanji in Latin letters is written left to right, like English. On a right-to-left page more than the text changes. The reader starts at the top right, so the logo, the menu, the first column and the 'back' arrow move there too: the page turns round as in a mirror. Numbers, English words and code still read left to right inside it.

کوردیی ناوەندی (سۆرانی) بە پیتی عەرەبی و لە ڕاستەوە بۆ چەپ دەنووسرێت؛ کرمانجی بە پیتی لاتینی و وەک ئینگلیزی لە چەپەوە بۆ ڕاست دەنووسرێت. لە لاپەڕەیەکی تەنیا دەقەکە ناگۆڕێت. خوێنەر لە سەرەوەی لای ڕاستەوە دەست پێدەکات، بۆیە لۆگۆ، ، یەکەم ستوون و تیری «گەڕانەوە»ش دەچنە ئەوێ: لاپەڕەکە وەک ئاوێنە هەڵدەگەڕێتەوە. ژمارە، وشەی ئینگلیزی و کۆد لەناویدا هەر لە چەپەوە بۆ ڕاست دەخوێنرێنەوە.

You can watch this on CêIT itself: open any lesson and press کوردی at the top — the menu jumps to the right, the arrows turn round and the code boxes stay left to right (A language switch that keeps the page shows both).

دەتوانیت ئەمە لە خودی CêITـدا ببینیت: هەر وانەیەک بکەرەوە و لە سەرەوە EN دابگرە — باز دەداتە لای چەپ، تیرەکان هەڵدەگەڕێنەوە و سندووقەکانی کۆد هەر دەمێننەوە (گۆڕینی زمان بێ ونکردنی لاپەڕەکە هەردووکیان پیشان دەدات).

Animation in three steps. First, an English page with <html lang="en" dir="ltr">: the CêIT logo, the back arrow and the side menu are on the left, the menu links and the Next button on the right, and the text starts at the left. Then the attributes change to lang="ckb" dir="rtl" and a double arrow shows the layout swapping sides. Last, the Kurdish page: logo, back arrow pointing right and side menu on the right, the menu links and the Next button with its arrow pointing left on the left, the text aligned right — while the CSS code box still reads left to right.
Animation in three steps. First, an English page with <html lang="en" dir="ltr">: the CêIT logo, the back arrow and the side menu are on the left, the menu links and the Next button on the right, and the text starts at the left. Then the attributes change to lang="ckb" dir="rtl" and a double arrow shows the layout swapping sides. Last, the Kurdish page: logo, back arrow pointing right and side menu on the right, the menu links and the Next button with its arrow pointing left on the left, the text aligned right — while the CSS code box still reads left to right.
Two attributes on <html>; flexbox, grid and logical properties do the rest.دوو لەسەر <html>؛ ، grid و ئەوەی تر دەکەن.CêIT

lang and dir: what the page is and which way it runslang و dir: لاپەڕەکە بە چ زمانێکە و بە کام ئاڕاستەدا دەڕوات

Two attributes on the root element tell the browser what it is reading (A page in Kurdish, The same page in Kurdish):

دوو لەسەر ڕەگ بە دەڵێن چی دەخوێنێتەوە (لاپەڕەتۆڕێکی کوردی، هەمان لاپەڕە بە کوردی):

HTML
<html lang="ckb" dir="rtl">
  • lang="ckb" — the language. Screen readers choose a Kurdish voice; browsers choose fonts, spell-checking and line breaking for Kurdish; search engines and translation tools know the language ( 3.1.1). Mark English parts inside a Kurdish page too, for example <span lang="en"> (3.1.2).
  • dir="rtl" — the base direction: lines start at the right and the layout follows. lang never sets the direction, so you always need both.
  • lang="ckb" — زمانەکە. دەنگێکی کوردی هەڵدەبژێرن؛ ، پشکنینی ڕێنووس و شکاندنی دێڕ بۆ کوردی هەڵدەبژێرن؛ و ئامرازەکانی وەرگێڕان زمانەکە دەناسن ( ⁦3.1.1⁩). بەشە ئینگلیزییەکانی ناو لاپەڕەیەکی کوردیش نیشانە بکە، بۆ نموونە <span lang="en"> ⁦(3.1.2)⁩.
  • dir="rtl" — ئاڕاستەی بنەڕەت: دێڕەکان لە ڕاستەوە دەست پێدەکەن و شوێنیان دەکەوێت. lang هەرگیز ئاڕاستە دیاری ناکات، بۆیە هەمیشە هەردووکیانت پێویستە.

Why in the HTML and not with the CSS direction: rtl? The direction belongs to the content, like the words: it must still be right when the CSS does not load, or when the text is copied, translated or shown in a reader app (W3C). Put dir on <html> once, and on another element only where the direction changes: <blockquote lang="en" dir="ltr">.

بۆچی لە و نەک بە direction: rtlـی ؟ ئاڕاستە بەشێکە لە ناوەڕۆک، وەک وشەکان: دەبێت هەر دروست بێت کاتێک بار نابێت، یان کاتێک دەقەکە کۆپی دەکرێت، وەردەگێڕدرێت یان لە ئەپێکی خوێندنەوەدا پیشان دەدرێت ⁦(W3C)⁩. dir یەک جار لەسەر <html> دابنێ و لەسەر تر تەنیا لەو شوێنەی ئاڕاستە دەگۆڕێت: <blockquote lang="en" dir="ltr">.

The tag <html lang="ckb" dir="rtl">. From lang="ckb", which language, arrows lead to three boxes: screen readers choose a Kurdish voice; fonts and spell-checking for Kurdish; search engines and translation tools. From dir="rtl", which direction, arrows lead to three boxes: lines start at the right; flex rows and grid columns start at the right; text-align: start means the right side. Below: lang never sets the direction, write both attributes.تاگی <html lang="ckb" dir="rtl">. لە lang="ckb"ـەوە، کام زمان، تیرەکان دەچن بۆ سێ سندووق: خوێنەرەوەکانی شاشە دەنگێکی کوردی هەڵدەبژێرن؛ فۆنتەکان و پشکنینی ڕێنووسی کوردی؛ بزوێنەرەکانی گەڕان و ئامرازەکانی وەرگێڕان. لە dir="rtl"ـەوە، کام ئاڕاستە، تیرەکان دەچن بۆ سێ سندووق: دێڕەکان لە ڕاستەوە دەست پێدەکەن؛ ڕیزی flex و ستوونی grid لە ڕاستەوە دەست پێدەکەن؛ text-align: start واتە لای ڕاست. لە خوارەوە: lang هەرگیز ئاڕاستە دیاری ناکات، هەردوو خەسڵەتەکە بنووسە.
lang says which language; dir says which way.lang دەڵێت کام زمان؛ dir دەڵێت کام ئاڕاستە.CêIT

lang and dir: what the page is and which way it runslang و dir: لاپەڕەکە بە چ زمانێکە و بە کام ئاڕاستەدا دەڕوات

ckb, not ar-IQ: choosing the language codeckb، نەک ⁦ar-IQ⁩: هەڵبژاردنی کۆدی زمان

follow the standard BCP 47 and are listed in the IANA registry. Kurdish has several:

شوێن ستانداردی ⁦BCP 47⁩ دەکەون و لە تۆماری IANAـدا ڕیز کراون. کوردی چەند کۆدێکی هەیە:

Language codes for Kurdish بۆ کوردی
CodeکۆدLanguageزمانScript and directionپیت و ئاڕاستە
ckbCentral Kurdish (Sorani)کوردیی ناوەندی (سۆرانی)Arabic script, right to leftپیتی عەرەبی،
ku (ku-Latn)Kurdish; most systems use it for Northern Kurdish (Kurmanji)کوردی؛ زۆربەی سیستەمەکان بۆ کوردیی باکووری (کرمانجی) بەکاری دەهێننLatin script, left to rightپیتی لاتینی،
sdhSouthern Kurdishکوردیی باشووریArabic script, right to leftپیتی عەرەبی،
ar-IQArabic as used in Iraq — not Kurdishعەرەبیی عێراق — کوردی نییەArabic script, right to leftپیتی عەرەبی،

Use ckb for Sorani, as Kurdish Wikipedia (ckb.wikipedia.org) does. ar-IQ would make a screen reader read your Kurdish with an Arabic voice and a browser write dates in Arabic. ku alone is too vague: the shared language data of browsers and phones (Unicode CLDR) treats it as Kurmanji, which is why W3C advises ku-Latn for Kurmanji. Add a region only when it matters, and keep the code as short as possible.

بۆ سۆرانی ckb بەکاربهێنە، وەک ویکیپیدیای کوردی ⁦(ckb.wikipedia.org)⁩. ar-IQ وا دەکات کوردییەکەت بە دەنگی عەرەبی بخوێنێتەوە و ڕێکەوت بە عەرەبی بنووسێت. ku بە تەنیا زۆر گشتییە: داتای زمانی هاوبەشی و مۆبایلەکان (CLDRـی ) ئەم کۆدە بە کرمانجی دادەنێت، بۆیە ⁦W3C⁩ بۆ کرمانجی ku-Latn پێشنیار دەکات. ناوچە (بۆ نموونە IQ) تەنیا کاتێک زیاد بکە کە گرنگ بێت و کۆدەکە هێندەی دەکرێت کورت بهێڵەوە.

A small tree. At the top, ku: Kurdish, all varieties. Below it three boxes: ckb, Central Kurdish (Sorani), the sample word کوردی with an arrow pointing left, Arabic script, right to left — highlighted and ticked; ku · ku-Latn, Northern Kurdish (Kurmanji), the sample word Kurdî with an arrow pointing right, Latin script, left to right; sdh, Southern Kurdish, Arabic script, right to left. Use lang="ckb" for Sorani pages. Apart, crossed: ar-IQ, Arabic as used in Iraq — on a Kurdish page it gives an Arabic voice, Arabic dates and the wrong language for search.دارێکی بچووک. لە سەرەوە ku: کوردی، هەموو شێوەزارەکان. لە ژێریدا سێ سندووق: ckb، کوردیی ناوەندی (سۆرانی)، وشەی «کوردی» بە تیرێکی ڕوو لە چەپ، پیتی عەرەبی، ڕاست بۆ چەپ — دیار کراوە و ✓ـی لەسەرە؛ ku · ku-Latn، کوردیی باکووری (کرمانجی)، وشەی Kurdî بە تیرێکی ڕوو لە ڕاست، پیتی لاتینی، چەپ بۆ ڕاست؛ sdh، کوردیی باشووری، پیتی عەرەبی، ڕاست بۆ چەپ. بۆ لاپەڕەی سۆرانی lang="ckb" بەکاربهێنە. بە جیا، بە ✗: ar-IQ، عەرەبیی عێراق — لەسەر لاپەڕەیەکی کوردی دەنگی عەرەبی، ڕێکەوتی عەرەبی و زمانی هەڵە بۆ گەڕان دەدات.
Sorani is ckb.سۆرانی ckbـە.CêIT

Layouts in Kurdish: what flips by itselfڕێکخستنی لاپەڕە بە کوردی: چی خۆی پێچەوانە دەبێتەوە

In a page with <html lang="ckb" dir="rtl"> flexbox and grid flip by themselves: the first flex item and the first grid column are on the right, because they follow the text direction ("start" is on the right) — see Main axis and cross axis and Lines in a Kurdish page. Floats, left/right offsets and margin-left do not flip. So for Kurdish sites prefer flexbox, grid and the logical properties: margin-inline-start, padding-inline-end, text-align: start, float: inline-start.

لە لاپەڕەیەکدا بە <html lang="ckb" dir="rtl"> و grid خۆیان پێچەوانە دەبنەوە: یەکەم و یەکەم ستوونی grid لە لای ڕاستن، چونکە شوێن ئاڕاستەی دەق دەکەون («سەرەتا» لە لای ڕاستە) — بڕوانە تەوەرەی سەرەکی و تەوەرەی ئاوەڵ و هێڵەکانی grid لە لاپەڕەیەکی کوردیدا. float، شوێندانان بە left/right و margin-left پێچەوانە نابنەوە. بۆیە بۆ کوردی ، grid و باشترن: margin-inline-start، padding-inline-end، text-align: start، float: inline-start.

Two panels, both pages with dir="rtl". Flips by itself, ticked: a flex row whose items 1, 2, 3 start at the right (display: flex); a grid whose column 1 is on the right (display: grid); lines of text aligned to the right (text-align: start). Stays where it is, crossed: a box with float: left stuck on the left with the text beside it; a box pushed by margin-left: 2rem, the gap still on the left; a badge with position: absolute; left: 0 stuck in the top left corner.دوو پانێڵ، هەردووکیان لاپەڕەی dir="rtl". خۆی پێچەوانە دەبێتەوە، بە ✓: ڕیزێکی flex کە دانەکانی ١، ٢، ٣ لە ڕاستەوە دەست پێدەکەن (display: flex)؛ gridـێک کە ستوونی ١ـی لە لای ڕاستە (display: grid)؛ دێڕی دەق کە بەلای ڕاستدا ڕێکخراون (text-align: start). لە شوێنی خۆی دەمێنێتەوە، بە ✗: سندووقێک بە float: left کە لە لای چەپ چەقیوە و دەقەکە لە تەنیشتیەتی؛ سندووقێک کە margin-left: 2rem پاڵی پێوەدەنێت، بۆشاییەکە هێشتا لە لای چەپە؛ نیشانەیەک بە position: absolute; left: 0 کە لە گۆشەی سەرەوەی لای چەپ چەقیوە.
Flexbox, grid and start/end follow dir; left and right never do.، grid و ⁦start/end⁩ شوێن dir دەکەون؛ چەپ و ڕاست هەرگیز.CêIT

Layouts in Kurdish: what flips by itselfڕێکخستنی لاپەڕە بە کوردی: چی خۆی پێچەوانە دەبێتەوە

Worked example: a Kurdish page with flex and gridنموونەی کارپێکراو: لاپەڕەیەکی کوردی بە flex و grid

The same CSS ideas in a Kurdish pageهەمان بیرۆکەکانی CSS لە لاپەڕەیەکی کوردیداrtl-layout.htmlHTMLRuns in the browserلە ناو تۆڕگەڕ کار دەکات
<!DOCTYPE html>
<html lang="ckb" dir="rtl">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>پەڕەی بەش</title>
  <style>
    * { box-sizing: border-box; }
    body { font-family: "Noto Naskh Arabic", "Noto Sans Arabic", Vazirmatn, sans-serif; margin: 8px; }
    h1, h2 { margin: 0; }
    h2 { font-size: 1rem; }
    .menu { display: flex; gap: 6px; margin-bottom: 8px; }
    .menu a { padding: 6px 12px; background-color: #1f4e79; color: white; text-decoration: none; }
    .page {
      display: grid;
      grid-template-columns: 160px 1fr;
      grid-template-areas:
        "header header"
        "side   main"
        "footer footer";
      gap: 8px;
    }
    header { grid-area: header; background-color: #b5dcb3; padding: 8px; }
    .side  { grid-area: side;   background-color: #aaaaaa; padding: 8px; }
    main   { grid-area: main;   background-color: #eeeeee; padding: 8px; min-height: 120px; }
    footer { grid-area: footer; background-color: #b5dcb3; text-align: center; }
  </style>
</head>
<body>
  <nav class="menu">
    <a href="index.html">سەرەکی</a>
    <a href="courses.html">وانەکان</a>
    <a href="contact.html">پەیوەندی</a>
  </nav>
  <div class="page">
    <header><h1>بەشی تەکنەلۆجیای زانیاری</h1></header>
    <nav class="side">
      <h2>لیستی سەرەکی</h2>
      <ul><li>HTML</li><li>CSS</li><li>JavaScript</li></ul>
    </nav>
    <main><p>بەخێربێن بۆ لاپەڕەی بەشەکەمان.</p></main>
    <footer><p>هەموو مافەکان پارێزراون</p></footer>
  </div>
</body>
</html>

Look at the preview: the menu starts on the right, and the 160 px side column is on the right — the CSS says nothing about right or left.

سەیری پێشبینینەکە بکە: لە ڕاستەوە دەست پێدەکات و ستوونە لاتەنیشتە ١٦٠ لە ڕاستە — CSSـەکە هیچ باسی ڕاست یان چەپ ناکات.

Logical properties: start and end instead of left and rightتایبەتمەندییە لۆجیکییەکان: سەرەتا و کۆتایی لەبری چەپ و ڕاست

A names a side by the direction of the text, not by the compass. margin-inline-start is the margin where a line starts: on the left in English, on the right in Kurdish. Write your CSS once with logical properties and the same file works in both directions.

لایەک بەپێی ئاڕاستەی دەق ناو دەبات، نەک بەپێی قیبلەنما. margin-inline-start ئەو کە دێڕ لێیەوە دەست پێدەکات: لە ئینگلیزیدا لای چەپ، لە کوردیدا لای ڕاست. یەک جار بە بنووسە و هەمان بۆ هەردوو ئاڕاستە کار دەکات.

The runs along a line of text — left to right in English, right to left in Kurdish. The runs the way paragraphs stack — top to bottom in both. inline-start, inline-end, block-start and block-end are the four logical sides.

بە درێژایی دێڕێکی دەق دەڕوات — لە ئینگلیزیدا لە چەپەوە بۆ ڕاست، لە کوردیدا لە ڕاستەوە بۆ چەپ. بەو ئاڕاستەیەدا دەڕوات کە بڕگەکان لەسەر یەک کەڵەکە دەبن — لە هەردووکیاندا لە سەرەوە بۆ خوارەوە. inline-start، inline-end، block-start و block-end چوار لا لۆجیکییەکەن.

Two columns: an English page with dir="ltr" and a Kurdish page with dir="rtl". At the top of each, the inline axis runs from inline-start to inline-end — left to right in English, right to left in Kurdish — and the block axis runs down from block-start to block-end. Below, a box with margin-left: 2rem has its gap on the left in both pages: ticked in English, crossed in Kurdish. A box with margin-inline-start: 2rem has its gap on the left in English and on the right in Kurdish, ticked in both.دوو ستوون: لاپەڕەیەکی ئینگلیزی بە dir="ltr" و لاپەڕەیەکی کوردی بە dir="rtl". لە سەرەوەی هەریەکەیان، تەوەرەی ناودێڕ لە inline-startـەوە بۆ inline-end دەڕوات — لە ئینگلیزیدا لە چەپەوە بۆ ڕاست، لە کوردیدا لە ڕاستەوە بۆ چەپ — و تەوەرەی بلۆک لە block-startـەوە بۆ block-end بەرەو خوارەوە دەڕوات. لە خوارەوە، سندووقێک بە margin-left: 2rem لە هەردوو لاپەڕەکەدا بۆشاییەکەی لە لای چەپە: لە ئینگلیزیدا ✓، لە کوردیدا ✗. سندووقێک بە margin-inline-start: 2rem بۆشاییەکەی لە ئینگلیزیدا لە لای چەپ و لە کوردیدا لە لای ڕاستە، لە هەردووکیاندا ✓.
start and end follow the text; left and right stay where they are.start و end شوێن دەق دەکەون؛ چەپ و ڕاست لە شوێنی خۆیان دەمێننەوە.CêIT

Logical properties: start and end instead of left and rightتایبەتمەندییە لۆجیکییەکان: سەرەتا و کۆتایی لەبری چەپ و ڕاست

From left and right to start and endلە چەپ و ڕاستەوە بۆ سەرەتا و کۆتایی

Every physical property has a logical twin. They are all widely available — float: inline-start, the last of them, since April 2026 — so use them in every new style sheet:

هەموو فیزیکی جووتێکی لۆجیکی هەیە. هەموویان بە فراوانی بەردەستن — float: inline-start، دوایینیان، لە نیسانی ٢٠٢٦ەوە — بۆیە لە هەموو نوێدا بەکاریان بهێنە:

Physical properties and their logical twins و جووتە لۆجیکییەکانیان
PhysicalفیزیکیLogicalلۆجیکی
margin-left / margin-rightmargin-inline-start / margin-inline-end
margin-left + margin-rightmargin-inline (margin-inline: auto centres a box)margin-inline (margin-inline: auto سندووقێک دەخاتە ناوەڕاست)
padding-left / padding-rightpadding-inline-start / padding-inline-end
border-leftborder-inline-start
left: 0 / right: 0inset-inline-start: 0 / inset-inline-end: 0
top: 0inset-block-start: 0
text-align: left / righttext-align: start / end
float: left / rightfloat: inline-start / inline-end
width / heightinline-size / block-size
A note box for both directionsسندووقێکی تێبینی بۆ هەردوو ئاڕاستەstyle.cssCSSRuns in the browserلە ناو تۆڕگەڕ کار دەکات
/* one style sheet for English and Kurdish pages */
.note {
  border-inline-start: 4px solid #0d6b62;
  padding-inline-start: 1rem;
  text-align: start;
}

Mixed text: English words and numbers in Kurdishدەقی تێکەڵ: وشەی ئینگلیزی و ژمارە لە کوردیدا

Kurdish sentences are often : they hold English words, code, web addresses and numbers. The browser puts them in order with the Unicode Bidirectional Algorithm, which works roughly like this:

ڕستە کوردییەکان زۆرجار : وشەی ئینگلیزی، کۆد، ناونیشانی وێب و ژمارەیان تێدایە. بە دووئاڕاستەی ڕیزیان دەکات، کە نزیکەی بەم شێوەیە کار دەکات:

  • Letters have a strong direction: Kurdish letters run right to left, Latin letters left to right.
  • A number is always written left to right — the biggest place first, as in 2026 — but as a whole it takes its place in the sentence.
  • Spaces and punctuation such as + - . , : ( ) have no direction of their own: they take the direction of their neighbours. That is where things go wrong.
  • پیتەکان ئاڕاستەیەکی بەهێزیان هەیە: پیتی کوردی دەڕوات، پیتی لاتینی .
  • ژمارە هەمیشە دەنووسرێت — گەورەترین پلە یەکەم، وەک ٢٠٢٦ — بەڵام وەک یەک پارچە شوێنی خۆی لە ڕستەکەدا دەگرێت.
  • بۆشایی و خاڵبەندیی وەک + - . , : ( ) ئاڕاستەی خۆیان نییە: ئاڕاستەی دراوسێکانیان وەردەگرن. ئێرەیە کە شتەکان تێک دەچن.
The Kurdish sentence «من 12 وانەی CSS دەخوێنم.», meaning I am studying 12 CSS lessons, as five boxes numbered in reading order from the right: 1 من, 2 12, 3 وانەی, 4 CSS, 5 دەخوێنم. A long arrow under the sentence points from right to left; small arrows under 12 and CSS point from left to right: inside the sentence, the number and the Latin letters are still read left to right.ڕستە کوردییەکەی «من 12 وانەی CSS دەخوێنم.» وەک پێنج سندووق کە بە ڕیزبەندیی خوێندنەوە لە ڕاستەوە ژمارە کراون: ١ من، ٢ 12، ٣ وانەی، ٤ CSS، ٥ دەخوێنم. تیرێکی درێژ لە ژێر ڕستەکەدا لە ڕاستەوە بۆ چەپ ئاماژە دەکات؛ تیری بچووک لە ژێر 12 و CSS لە چەپەوە بۆ ڕاست ئاماژە دەکەن: لەناو ڕستەکەدا ژمارەکە و پیتە لاتینییەکان هەر چەپ بۆ ڕاست دەخوێنرێنەوە.
A sentence that runs right to left, with left-to-right islands.ڕستەیەک کە دەڕوات، بە دوورگەی .CêIT

Mixed text: English words and numbers in Kurdishدەقی تێکەڵ: وشەی ئینگلیزی و ژمارە لە کوردیدا

Three classic bugs and their fixesسێ هەڵەی باو و چارەسەرەکانیان

When the neighbours disagree, the order breaks. You will meet these three on real sites:

کاتێک دراوسێکان ڕێک ناکەون، ڕیزبەندییەکە تێک دەچێت. ئەم سێیانە لە ڕاستەقینەدا دەبینیت:

  1. C++ in a Kurdish sentence shows as ++C: the two plus signs take the Kurdish direction. Fix: <bdi>C++</bdi> or <span dir="ltr">C++</span>.
  2. A phone number +964 750 123 4567 comes out as 4567 123 750 964+: its groups are reversed. Fix: <span dir="ltr">…</span>, or dir="ltr" on its tel: link (Phone, e-mail and download links).
  3. In an English list, a Kurdish user name followed by : 3 posts pulls the 3 to the wrong side of the name. Fix: wrap the name in <bdi> — this is the example of the HTML standard itself.
  1. C++ لە ڕستەیەکی کوردیدا وەک ++C دەردەکەوێت: دوو نیشانەی + ئاڕاستەی کوردی وەردەگرن. چارەسەر: <bdi>C++</bdi> یان <span dir="ltr">C++</span>.
  2. ژمارەی تەلەفۆنی +964 750 123 4567 وەک 4567 123 750 964+ دەردەچێت: کۆمەڵە ژمارەکانی پێچەوانە دەبنەوە. چارەسەر: <span dir="ltr">…</span>، یان dir="ltr" لەسەر tel:ـەکەی (بەستەری تەلەفۆن، ئیمەیڵ و دابارکردن).
  3. لە لیستێکی ئینگلیزیدا، ناوێکی کوردی کە : 3 postsـی بەدوادا دێت ژمارە 3 بۆ لای هەڵەی ناوەکە ڕادەکێشێت. چارەسەر: ناوەکە بخەرە ناو <bdi> — ئەمە نموونەکەی خودی ستانداردی .
Three rows, without isolation on the left and isolated on the right. 1: the Kurdish sentence «من C++ فێر دەبم.» shows ++C on the left, crossed, and C++ on the right, ticked, with <bdi>C++</bdi>. 2: «تەلەفۆن:» with the phone number shown as 4567 123 750 964+, crossed, and as +964 750 123 4567, ticked, with <span dir="ltr">. 3: the English line User سۆران: 3 posts shows the 3 before the colon and the name, crossed, and in the right place, ticked, with User <bdi>سۆران</bdi>: 3 posts.سێ ڕیز، لای چەپ بەبێ جیاکردنەوە و لای ڕاست جیاکراوە. ١: ڕستە کوردییەکەی «من C++ فێر دەبم.» لای چەپ پێچەوانە پیشان دەدرێت (✗) و لای ڕاست بە <bdi>C++</bdi> دروستە (✓). ٢: «تەلەفۆن:» لەگەڵ ژمارەکە، لای چەپ بە کۆمەڵەی پێچەوانەوە (✗) و لای ڕاست بە <span dir="ltr"> بە ڕیزبەندیی دروست (✓). ٣: دێڕە ئینگلیزییەکەی User سۆران: 3 posts، لای چەپ ژمارە 3 پێش دوو خاڵەکە و ناوەکەیە (✗) و لای ڕاست بە <bdi> لە شوێنی دروستدایە (✓).
Isolate the piece whose direction differs.ئەو پارچەیە جیا بکەرەوە کە ئاڕاستەکەی جیاوازە.CêIT

Mixed text: English words and numbers in Kurdishدەقی تێکەڵ: وشەی ئینگلیزی و ژمارە لە کوردیدا

Text you did not write: bdi, dir="auto" and isolatesئەو دەقەی تۆ نەتنووسیوە: bdi، ⁦dir="auto"⁩ و جیاکەرەوەکان

Names, comments and search words come from your visitors, so you do not know their direction in advance:

ناو، بۆچوون و لە سەردانکەرەکانتەوە دێن، بۆیە پێشتر ئاڕاستەکەیان نازانیت:

  • <bdi> isolates a piece of text and finds its direction from its first strong letter (HTML Living Standard). Put it around every inserted name or number.
  • dir="auto" does the same on an element you already have — the paragraph of a comment, an <input> or a <textarea> — so the text turns round as the visitor types. It looks only at the first strong letter: a Kurdish sentence that begins with an English word is treated as left to right.
  • Where no markup is allowed — inside <title> or an attribute such as alt — the invisible Unicode isolates do the same job: &#x2066;C++&#x2069; (left to right) or &#x2068;…&#x2069; (first strong letter). W3C advises markup wherever you can use it.
  • <bdi> پارچەیەک دەق جیا دەکاتەوە و ئاڕاستەکەی لە یەکەم پیتی بەهێزی دەدۆزێتەوە (ستانداردی زیندووی ). لە دەوری هەموو ناو یان ژمارەیەکی تێخراو دایبنێ.
  • dir="auto" هەمان کار لەسەر دەکات کە هەتە — بڕگەی بۆچوونێک، <input> یان <textarea> — بۆیە دەقەکە لە کاتی نووسیندا ئاڕاستەی خۆی دەگرێت. تەنیا سەیری یەکەم پیتی بەهێز دەکات: ڕستەیەکی کوردی کە بە وشەیەکی ئینگلیزی دەست پێدەکات دادەنرێت.
  • لەو شوێنانەی ڕێگەپێدراو نییە — لەناو <title> یان وەک alt — جیاکەرەوە نەبینراوەکانی هەمان کار دەکەن: &#x2066;C++&#x2069; () یان &#x2068;…&#x2069; (یەکەم پیتی بەهێز). ⁦W3C⁩ پێشنیار دەکات لە هەر شوێنێک توانیت بەکاربهێنیت.
Mixed text, broken and fixedدەقی تێکەڵ، تێکچوو و چاککراوmixed.htmlHTMLRuns in the browserلە ناو تۆڕگەڕ کار دەکات
<!DOCTYPE html>
<html lang="ckb" dir="rtl">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>دەقی تێکەڵ</title>
  <style>
    body { margin: 12px; font-family: Vazirmatn, "Noto Sans Arabic", Tahoma, sans-serif; line-height: 1.8; }
    .bad { color: #b4530f; }
    .good { color: #0d6b62; }
    input { font: inherit; padding: 4px 8px; }
  </style>
</head>
<body>
  <p class="bad">١. من C++ فێر دەبم.</p>
  <p class="good">٢. من <bdi>C++</bdi> فێر دەبم.</p>
  <p class="bad">٣. تەلەفۆن: +964 750 123 4567</p>
  <p class="good">٤. تەلەفۆن: <a href="tel:+9647501234567" dir="ltr">+964 750 123 4567</a></p>
  <ul lang="en" dir="ltr">
    <li class="bad">User سۆران: 3 posts</li>
    <li class="good">User <bdi>سۆران</bdi>: 3 posts</li>
  </ul>
  <p><label>ناوی تۆ: <input name="name" dir="auto"></label></p>
</body>
</html>

Kurdish letters, not Arabic look-alikesپیتی کوردی، نەک هاوشێوە عەرەبییەکان

Some Kurdish letters look almost like Arabic ones but are different characters, with different in . Old keyboards, old fonts and text copied from Arabic documents bring in the wrong ones. The page then looks nearly right, but to a computer «كوردي» and «کوردی» are two different words: a search in your site, a sorted list and a spell-checker all fail.

هەندێک پیتی کوردی زۆر لە پیتی عەرەبی دەچن، بەڵام جیاوازن و جیاوازیان لە هەیە. و کۆن و ئەو دەقەی لە بەڵگەنامەی عەرەبییەوە کۆپی کراوە پیتە هەڵەکان دەهێنن. ئینجا لاپەڕەکە نزیکەی دروست دەردەکەوێت، بەڵام بۆ «كوردي» و «کوردی» دوو وشەی جیاوازن: گەڕان لە ، لیستێکی ڕیزکراو و هەموویان تێک دەچن.

Kurdish letters and their look-alikesپیتە کوردییەکان و هاوشێوەکانیان
Kurdish (use)کوردی (بەکاری بهێنە)Arabic look-alike (avoid)هاوشێوەی عەرەبی (خۆتی لێ بپارێزە)How to tellچۆن جیایان بکەیتەوە
ک U+06A9ك U+0643at the end of a word ك has a small mark insideلە کۆتایی وشەدا ك نیشانەیەکی بچووکی تێدایە
ی U+06CCي U+064Aي keeps two dots under it at the end of a word: «كوردي»ي لە کۆتایی وشەدا دوو خاڵی لە ژێرەوە دەمێنێت: «كوردي»
ە U+06D5ه + ZWNJ U+0647 U+200Cthe old trick: ه with an invisible “do not join” character after itڕێگە کۆنەکە: ه بە نەبینراوی «مەلکێنە» لە دوایەوە
A table of three pairs. On the left, the Kurdish letters to use: ک U+06A9 in the word کتێب, ی U+06CC in کوردی and ە U+06D5 in بەرنامە, each ticked. On the right, their Arabic look-alikes: ك U+0643, ي U+064A — the word ends in two dots — and ه with ZWNJ, U+0647 + U+200C, each crossed. Below: ZWNJ is an invisible character that stops two letters joining; کوردی ≠ كوردي, to a computer these are two different words; type with a Central Kurdish keyboard and search your files for ك and ي.خشتەیەکی سێ جووت. لای چەپ، ئەو پیتە کوردییانەی بەکاردێن: ک U+06A9 لە وشەی کتێب، ی U+06CC لە کوردی و ە U+06D5 لە بەرنامە، هەریەکە بە ✓. لای ڕاست، هاوشێوە عەرەبییەکانیان: ك U+0643، ي U+064A — وشەکە بە دوو خاڵ کۆتایی دێت — و ه لەگەڵ ZWNJ، U+0647 + U+200C، هەریەکە بە ✗. لە خوارەوە: ZWNJ نووسەیەکی نەبینراوە کە ناهێڵێت دوو پیت پێکەوە بلکێن؛ کوردی ≠ كوردي، بۆ کۆمپیوتەر ئەمانە دوو وشەی جیاوازن؛ بە کیبۆردێکی کوردیی ناوەندی بنووسە و لە فایلەکانتدا بەدوای ك و ي بگەڕێ.
Nearly the same shape, a different character.شێوەی نزیکەی وەک یەک، جیاواز.CêIT

Type with a Central Kurdish keyboard layout — Windows, macOS, Android and the iPhone (since iOS 13) all have one — and before publishing, search your files for ك and ي and replace them. For the h sound both ه and ھ are in use; choose one and keep to it, because a search treats them as different letters too. In HTML the invisible ZWNJ can be written &zwnj;; with ە you almost never need it.

بە کوردیی ناوەندی بنووسە — Windows، macOS، Android و iPhone (لە ⁦iOS 13⁩ـەوە) هەموویان یەکێکیان هەیە — و پێش بڵاوکردنەوە لە بەدوای ك و ي بگەڕێ و بیانگۆڕە. بۆ دەنگی h هەردوو ه و ھ بەکاردێن؛ یەکێکیان هەڵبژێرە و لەسەری بەردەوام بە، چونکە گەڕانیش بە دوو پیتی جیاوازیان دادەنێت. لە ZWNJـی نەبینراو دەتوانرێت بە &zwnj; بنووسرێت؛ لەگەڵ ە نزیکەی هەرگیز پێویستت پێی نابێت.

What to mirror and what notچی ئاوێنە بکرێت و چی نا

In a right-to-left interface, pictures that show direction are mirrored — this is — and pictures of things are not (Material Design, Mozilla):

لە ، ئەو وێنانەی ئاڕاستە پیشان دەدەن ئاوێنە دەکرێن — ئەمە — بەڵام وێنەی شتەکان ئاوێنە ناکرێن (Material Design، Mozilla):

  • Mirror: back and next arrows, the › between breadcrumb links, progress bars and sliders (they fill from the right), icons that show lines of text, a side-panel icon.
  • Do not mirror: logos and brand names, clocks and round “refresh” arrows, the ▶ button and the progress bar of a video (they follow the tape, not the text), check marks ✓, a magnifying glass and other things held in the right hand, numbers, phone numbers and code.
  • ئاوێنەی بکە: تیرەکانی گەڕانەوە و دواتر، نیشانەی › لە نێوان ، شریتی پێشکەوتن و سلایدەر (لە ڕاستەوە پڕ دەبن)، ئەو دێڕی دەق پیشان دەدەن، پانێڵی لاتەنیشت.
  • ئاوێنەی مەکە: لۆگۆ و ناوی بازرگانی، کاتژمێر و تیری بازنەیی «نوێکردنەوە»، ▶ و شریتی پێشکەوتنی ڤیدیۆ (شوێن شریتی ڤیدیۆکە دەکەون، نەک دەق)، نیشانەی ✓، زەڕەبین و شتی تر کە بە دەستی ڕاست دەگیرێن، ژمارە، ژمارەی تەلەفۆن و کۆد.
Two rows of six tiles, each showing an icon in a left-to-right page and in a right-to-left page. Mirror, they show direction: the back arrow and the next chevron turn round, a progress bar and a slider fill from the right, text-line icons and a side panel icon move their bullets and panel to the right. Do not mirror, things, time and media: the play button, a clock, a check mark, a magnifying glass, the CêIT logo and a phone number look the same in both. Below: the CSS :dir(rtl) .icon-next { transform: scaleX(-1); } mirrors a direction icon in one line.دوو ڕیز، هەریەکە شەش خانە، هەر خانەیەک ئایکۆنێک لە لاپەڕەیەکی چەپ بۆ ڕاست و لە لاپەڕەیەکی ڕاست بۆ چەپ پیشان دەدات. ئاوێنەی بکە، ئاڕاستە پیشان دەدەن: تیری گەڕانەوە و نیشانەی دواتر هەڵدەگەڕێنەوە، شریتی پێشکەوتن و سلایدەر لە ڕاستەوە پڕ دەبن، ئایکۆنی دێڕی دەق و پانێڵی لاتەنیشت خاڵ و پانێڵەکەیان دەبەنە لای ڕاست. ئاوێنەی مەکە، شت، کات و میدیا: دوگمەی لێدان، کاتژمێر، نیشانەی ✓، زەڕەبین، لۆگۆی CêIT و ژمارەی تەلەفۆن لە هەردووکیاندا وەک یەکن. لە خوارەوە: CSSـی :dir(rtl) .icon-next { transform: scaleX(-1); } بە یەک دێڕ ئایکۆنێکی ئاڕاستە ئاوێنە دەکات.
Mirror direction, not things.ئاڕاستە ئاوێنە بکە، نەک شتەکان.CêIT
Mirroring an arrow iconئاوێنەکردنی ئایکۆنێکی تیرstyle.cssCSSRuns in the browserلە ناو تۆڕگەڕ کار دەکات
/* one arrow picture for both directions */
:dir(rtl) .icon-next { transform: scaleX(-1); }

:dir(rtl) matches every element whose direction is right to left ( widely available since June 2026); [dir="rtl"] .icon-next works in older browsers too, and CêIT mirrors its own arrows that way: [dir='rtl'] .arrow { transform: scaleX(-1); }. Maths books follow the same rule: What is mirrored, and what never flips.

:dir(rtl) هەموو دەگرێتەوە کە ئاڕاستەکەی ( لە حوزەیرانی ٢٠٢٦ەوە بە فراوانی بەردەستە)؛ [dir="rtl"] .icon-next لە کۆنتریشدا کار دەکات و CêIT خۆی تیرەکانی بەو شێوەیە ئاوێنە دەکات: [dir='rtl'] .arrow { transform: scaleX(-1); }. کتێبی بیرکاریش هەمان ڕێسا پەیڕەو دەکەن: چی ئاوێنەیی دەبێت و چی هەرگیز ناگۆڕێت.

Digits, dates and phone numbersتاکژمارەکان، ڕێکەوت و ژمارەی تەلەفۆن

Kurdish text may use the ٠١٢٣٤٥٦٧٨٩ or the 0123456789 (Kurdish and English on one page explains the Persian look-alikes ۴ ۵ ۶). Either way a number is written left to right, the biggest place first: ٢٠٢٦ and 2026 are the same number. Choose one style for the whole site, and keep code, URLs and phone numbers in 0–9. Three more habits:

دەقی کوردی دەتوانێت ٠١٢٣٤٥٦٧٨٩ یان ⁦0123456789⁩ بەکاربهێنێت (کوردی و ئینگلیزی لە یەک لاپەڕەدا هاوشێوە فارسییەکانی ۴ ۵ ۶ ڕوون دەکاتەوە). هەرچۆنێک بێت ژمارە دەنووسرێت، گەورەترین پلە یەکەم: ٢٠٢٦ و ⁦2026⁩ هەمان ژمارەن. بۆ هەموو یەک شێوە هەڵبژێرە و کۆد، و ژمارەی تەلەفۆن بە ⁦0–9⁩ بهێڵەوە. سێ خووی تر:

  • Number a Kurdish list with list-style-type: arabic-indic (::marker and Kurdish numbers).
  • Wrap dates in <time datetime="2026-10-29">…</time>: people read the Kurdish date between the tags, and programs and search engines read the datetime value.
  • Keep phone numbers left to right: <a href="tel:+9647501234567" dir="ltr">+964 750 123 4567</a> (Phone, e-mail and download links).
  • لیستێکی کوردی بە list-style-type: arabic-indic ژمارە بکە (::marker و ژمارەی کوردی).
  • ڕێکەوت بخەرە ناو <time datetime="2026-10-29">…</time>: مرۆڤ ڕێکەوتە کوردییەکەی نێوان دەخوێنێتەوە و و بەهای datetime دەخوێننەوە.
  • ژمارەی تەلەفۆن بهێڵەوە: <a href="tel:+9647501234567" dir="ltr">+964 750 123 4567</a> (بەستەری تەلەفۆن، ئیمەیڵ و دابارکردن).
Three rows of the ten digits: Western Arabic 0 to 9 for code, URLs and maths; Eastern Arabic ٠ to ٩ for Kurdish and Arabic text; Persian ۰ to ۹, where 4, 5 and 6 look different — those three are highlighted in the last two rows. Below: every number keeps the biggest place on the left, 2026 = ٢٠٢٦, with an arrow pointing right under each; and <time datetime="2026-10-29">…</time>: people read the date between the tags, programs read datetime.سێ ڕیزی دە تاکژمارەکە: ژمارەی عەرەبیی ڕۆژئاوایی 0 تا 9 بۆ کۆد، URL و بیرکاری؛ ژمارەی عەرەبیی ڕۆژهەڵاتی ٠ تا ٩ بۆ دەقی کوردی و عەرەبی؛ فارسی ۰ تا ۹، کە ٤، ٥ و ٦ـی جیاوازن — ئەو سێیانە لە دوو ڕیزی کۆتاییدا دیار کراون. لە خوارەوە: هەموو ژمارەیەک گەورەترین پلەی لە لای چەپە، 2026 = ٢٠٢٦، بە تیرێکی ڕوو لە ڕاست لە ژێر هەریەکەیاندا؛ و <time datetime="2026-10-29">…</time>: مرۆڤ ڕێکەوتی نێوان تاگەکان دەخوێنێتەوە، بەرنامەکان datetime دەخوێننەوە.
Different shapes, the same left-to-right numbers.شێوەی جیاواز، هەمان ژمارەی .CêIT

Bilingual sites: one page, two languagesتۆڕگەکانی دووزمانە: یەک لاپەڕە، دوو زمان

A Kurdish–English site keeps every page in both languages and connects the twins:

کوردی–ئینگلیزی هەموو لاپەڕەیەک بە هەردوو زمان دەهێڵێتەوە و جووتەکان بە یەکەوە دەبەستێت:

  • One folder per language: /en/about.html and /ckb/about.html (or a subdomain such as ckb.example.com). Each page has its own lang and dir, and its own translated <title>, alt texts and description.
  • hreflang links in the <head> of both pages tell search engines about the twin. Every version lists all versions, itself included, and x-default names the page for everyone else. If two pages do not point to each other, Google ignores the pair.
  • Fonts for both scripts: a Latin and a Kurdish font in one stack (Kurdish and English on one page).
  • بۆ هەر زمانێک : /en/about.html و /ckb/about.html (یان وەک ckb.example.com). هەر لاپەڕەیەک lang و dirـی خۆی هەیە، هەروەها <title>، و وەسفی وەرگێڕدراوی خۆی.
  • hreflang لە <head>ـی هەردوو لاپەڕەکەدا باسی جووتەکە بۆ دەکەن. هەموو وەشانێک هەموو وەشانەکان ڕیز دەکات، خۆیشی لەگەڵیاندا. x-default ئەو لاپەڕەیە دیاری دەکات کە بۆ هەموو کەسانی ترە. ئەگەر دوو لاپەڕە ئاماژە بە یەکتر نەکەن، Google جووتەکە پشتگوێ دەخات.
  • بۆ هەردوو جۆرە نووسینەکە: لاتینی و کوردی لە یەک لیستدا (کوردی و ئینگلیزی لە یەک لاپەڕەدا).
In the <head> of both about pagesلە <head>ـی هەردوو لاپەڕەی لەبارەداHTML
<link rel="alternate" hreflang="ckb" href="https://example.com/ckb/about.html">
<link rel="alternate" hreflang="en" href="https://example.com/en/about.html">
<link rel="alternate" hreflang="x-default" href="https://example.com/en/about.html">
A folder tree: example.com/ with en/ holding index.html and about.html, and ckb/ holding index.html and about.html. Next to it two browser windows: /en/about.html shows About us, left to right, with a switch where English is selected; /ckb/about.html shows لەبارەی ئێمە, right to left, with کوردی selected. A double arrow labelled hreflang joins the two pages; under them <html lang="en"> and <html lang="ckb" dir="rtl">. At the bottom, the three link elements with hreflang en, ckb and x-default, which go in the head of both pages.دارێکی فۆڵدەرەکان: example.com/ لەگەڵ en/ کە index.html و about.htmlـی تێدایە و ckb/ کە index.html و about.htmlـی تێدایە. لە تەنیشتیەوە دوو پەنجەرەی تۆڕگەڕ: /en/about.html، About us پیشان دەدات، چەپ بۆ ڕاست، بە گۆڕەرێک کە English هەڵبژێردراوە؛ /ckb/about.html، «لەبارەی ئێمە» پیشان دەدات، ڕاست بۆ چەپ، بە کوردی هەڵبژێردراو. تیرێکی دووسەر بە ناوی hreflang هەردوو لاپەڕەکە بە یەکەوە دەبەستێت؛ لە ژێریاندا <html lang="en"> و <html lang="ckb" dir="rtl">. لە خوارەوە، سێ توخمەکەی link بە hreflangـی en، ckb و x-default، کە دەچنە ناو headـی هەردوو لاپەڕەکە.
Twin pages that point to each other.دوو لاپەڕەی جووت کە ئاماژە بە یەکتر دەکەن.CêIT

Bilingual sites: one page, two languagesتۆڕگەکانی دووزمانە: یەک لاپەڕە، دوو زمان

A language switch that keeps the pageگۆڕینی زمان بێ ونکردنی لاپەڕەکە

A language switch goes to the same page in the other language, not to the home page. Write each language in its own language — English, کوردی — never as a flag: a flag is a country, not a language. Mark each link with lang and hreflang, and the current one with aria-current="page":

گۆڕینی زمان دەچێتە هەمان لاپەڕە بە زمانەکەی تر، نەک . هەر زمانێک بە زمانی خۆی بنووسە — English، کوردی — هەرگیز وەک ئاڵا: ئاڵا وڵاتێکە، نەک زمانێک. هەر بە lang و hreflang نیشانە بکە و ئەوەی ئێستا بە aria-current="page":

The Kurdish about page with a language switchلاپەڕەی لەبارەی کوردی بە گۆڕەری زمانckb/about.htmlHTMLRuns in the browserلە ناو تۆڕگەڕ کار دەکات
<!DOCTYPE html>
<html lang="ckb" dir="rtl">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>لەبارەی ئێمە – نانەواخانەی شیلان</title>
  <link rel="alternate" hreflang="ckb" href="https://example.com/ckb/about.html">
  <link rel="alternate" hreflang="en" href="https://example.com/en/about.html">
  <link rel="alternate" hreflang="x-default" href="https://example.com/en/about.html">
  <style>
    body { margin: 0; font-family: Vazirmatn, "Noto Sans Arabic", Tahoma, sans-serif; line-height: 1.7; }
    header {
      display: flex; flex-wrap: wrap; gap: 0.5rem 1rem;
      align-items: center; justify-content: space-between;
      padding: 0.75rem 1rem; background-color: #dcefeb;
    }
    .site { font-weight: bold; color: #0a5a52; text-decoration: none; }
    .lang { display: flex; gap: 0.25rem; margin: 0; padding: 0; list-style: none; }
    .lang a { display: inline-block; padding: 0.25rem 0.75rem; border-radius: 1rem; color: #1b1d20; }
    .lang a[aria-current] { background-color: #ffffff; font-weight: bold; text-decoration: none; }
    main { padding: 1rem; }
  </style>
</head>
<body>
  <header>
    <a class="site" href="index.html">نانەواخانەی شیلان</a>
    <nav aria-label="زمان">
      <ul class="lang">
        <li><a href="/ckb/about.html" hreflang="ckb" lang="ckb" aria-current="page">کوردی</a></li>
        <li><a href="/en/about.html" hreflang="en" lang="en">English</a></li>
      </ul>
    </nav>
  </header>
  <main>
    <h1>لەبارەی ئێمە</h1>
    <p>لە ساڵی ٢٠١٨ەوە هەموو بەیانییەک نانی تازە لە هەولێر دەبرژێنین.</p>
  </main>
</body>
</html>

CêIT itself works a little differently: each lesson has one address, and the buttons EN, کوردی and Both switch the language on the spot. The choice is remembered, and ?lang=ckb at the end of an address opens a page in Kurdish. Before the page is drawn, a small JavaScript sets <html lang="ckb" dir="rtl">, and every Kurdish paragraph carries lang="ckb" dir="rtl" itself — open the developer tools on this page and look.

CêIT خۆی تۆزێک جیاواز کار دەکات: هەر وانەیەک یەک ناونیشانی هەیە و EN، کوردی و هەردووک لە جێی خۆیدا زمانەکە دەگۆڕن. هەڵبژاردنەکە لەبیر دەکرێت و ?lang=ckb لە کۆتایی ناونیشانێکدا لاپەڕەیەک بە کوردی دەکاتەوە. پێش ئەوەی لاپەڕەکە بکێشرێت، کۆدێکی بچووکی <html lang="ckb" dir="rtl"> دادەنێت و هەموو بڕگەیەکی کوردی خۆی lang="ckb" dir="rtl"ـی هەیە — لەسەر ئەم لاپەڕەیە بکەرەوە و سەیر بکە.

This site in both directions: one lesson, one address.ئەم بە هەردوو ئاڕاستە: یەک وانە، یەک ناونیشان.CêIT

Testing a right-to-left pageتاقیکردنەوەی لاپەڕەیەکی ڕاست بۆ چەپ

Before you publish a Kurdish page, check it as a Kurdish reader would:

پێش ئەوەی لاپەڕەیەکی کوردی بڵاو بکەیتەوە، وەک خوێنەرێکی کورد بیپشکنە:

  1. Flip itهەڵیبگەڕێنەوە

    In the developer tools, change dir="ltr" to "rtl" on <html> (or the other way round). A page built with flex, grid and logical properties turns round by itself; whatever stays behind is a left/right leftover.

    لە dir="ltr" بگۆڕە بۆ "rtl" لەسەر <html> (یان بە پێچەوانەوە). لاپەڕەیەک کە بە flex، grid و دروستکرابێت خۆی هەڵدەگەڕێتەوە؛ هەر شتێک لە شوێنی خۆی بمێنێتەوە پاشماوەیەکی چەپ/ڕاستە.

  2. Search the CSSCSS بپشکنە

    Look for left, right, margin-left, padding-right, float: left and text-align: left.

    بەدوای left، right، margin-left، padding-right، float: left و text-align: left بگەڕێ.

  3. Read the mixed sentencesڕستە تێکەڵەکان بخوێنەرەوە

    English words, code, numbers, phone numbers, punctuation at the ends of lines, and names typed by visitors.

    وشەی ئینگلیزی، کۆد، ژمارە، ژمارەی تەلەفۆن، خاڵبەندی لە کۆتایی دێڕەکاندا و ئەو ناوانەی سەردانکەران نووسیویانن.

  4. Check the formsفۆرمەکان بپشکنە

    Kurdish fields right to left, e-mail and web-address fields left to right, and dir="auto" where either can come.

    خانە کوردییەکان ، خانەکانی و ناونیشانی وێب و dir="auto" لەو شوێنانەی هەردووکیان دەکرێت بێن.

  5. Check icons, letters and fontsئایکۆنەکان، پیت و فۆنتەکان بپشکنە

    Direction arrows mirrored, logos and ▶ not; no ك or ي in Kurdish words; a font that has ڕ ڵ ێ ۆ ە.

    تیرەکانی ئاڕاستە ئاوێنە کراون، لۆگۆ و ▶ نا؛ هیچ ك یان ي لە وشە کوردییەکاندا نییە؛ کە ڕ ڵ ێ ۆ ەـی تێدایە.

A Kurdish page with six numbered bugs and a legend. 1: the CêIT logo in the header is mirrored and reads backwards — never flip a logo. 2: the back link گەڕانەوە has an arrow pointing left — on a Kurdish page it points right. 3: the side menu sits on the left because of float: left. 4: the sentence shows ++C instead of C++ — wrap it in <bdi>. 5: the phone number in the footer has its groups reversed — use dir="ltr". 6: the check mark next to a finished lesson is mirrored — a check mark never flips.لاپەڕەیەکی کوردی بە شەش هەڵەی ژمارەدار و ڕوونکردنەوەیەک. ١: لۆگۆی CêIT لە سەرپەڕەدا ئاوێنە کراوە و پێچەوانە دەخوێنرێتەوە — هەرگیز لۆگۆ ئاوێنە مەکە. ٢: بەستەری «گەڕانەوە» تیرێکی ڕوو لە چەپی هەیە — لە لاپەڕەی کوردیدا ڕوو لە ڕاستە. ٣: مێنیوی لاتەنیشت بەهۆی float: leftـەوە لە لای چەپە. ٤: ڕستەکە C++ پێچەوانە پیشان دەدات — بیخەرە ناو <bdi>. ٥: کۆمەڵە ژمارەکانی تەلەفۆن لە ژێرپەڕەدا پێچەوانە بوونەتەوە — dir="ltr" بەکاربهێنە. ٦: نیشانەی ✓ لە تەنیشت وانەیەکی تەواوبوو ئاوێنە کراوە — نیشانەی ✓ هەرگیز ئاوێنە ناکرێت.
Spot the six right-to-left bugs.شەش هەڵەکەی بدۆزەرەوە.CêIT

Common mistakesهەڵە باوەکان

Mistakes to avoidئەو هەڵانەی دەبێت خۆتیان لێ بپارێزیت
MistakeهەڵەWhat happensچی ڕوودەداتFixچارەسەر
margin-left / float: left in a Kurdish layoutmargin-left / float: left لە کوردیداDoes not flip for right-to-left.لە پێچەوانە نابێتەوە.Logical properties, flex or grid.، flex یان grid.
direction: rtl in the CSS onlyتەنیا direction: rtl لە Wrong when the CSS does not load, and in copied or translated text.کاتێک بار نابێت و لە دەقی کۆپیکراو یان وەرگێڕدراودا هەڵەیە.dir="rtl" on <html>.dir="rtl" لەسەر <html>.
lang="ar" or lang="ar-IQ" on a Kurdish pagelang="ar" یان lang="ar-IQ" لەسەر لاپەڕەیەکی کوردیAn Arabic voice, Arabic dates, the wrong language for search.دەنگی عەرەبی، ڕێکەوتی عەرەبی، زمانی هەڵە بۆ گەڕان.lang="ckb".lang="ckb".
text-align: right for Kurdish texttext-align: right بۆ دەقی کوردیBreaks when the same CSS serves an English page.کاتێک هەمان بۆ لاپەڕەیەکی ئینگلیزی بەکاردێت تێک دەچێت.text-align: start.text-align: start.
letter-spacing on Kurdish textletter-spacing لەسەر دەقی کوردیThe joined letters come apart, or the browser ignores it.پیتە لکاوەکان لێک دەبنەوە، یان پشتگوێی دەخات.Leave it out (Text properties on Kurdish text).لایببە (تایبەتمەندییەکانی دەق لەسەر دەقی کوردی).
Arabic ك and ي in Kurdish wordsك و يـی عەرەبی لە وشە کوردییەکانداSearch, sorting and spell-checking fail.گەڕان، و پشکنینی ڕێنووس تێک دەچن.ک and ی; a Central Kurdish keyboard layout.ک و ی؛ کوردیی ناوەندی.
Mirroring logos, ▶, ✓ or clocksئاوێنەکردنی لۆگۆ، ▶، ✓ یان کاتژمێرThey look wrong or change their meaning.هەڵە دەردەکەون یان واتاکەیان دەگۆڕێت.Mirror only icons that show direction.تەنیا ئەو ئاوێنە بکە کە ئاڕاستە پیشان دەدەن.
Names and comments without <bdi> or dir="auto"ناو و بۆچوون بەبێ <bdi> یان dir="auto"Numbers and punctuation jump to the wrong side.ژمارە و خاڵبەندی بۆ لای هەڵە باز دەدەن.<bdi> around inserted text, dir="auto" on fields.<bdi> لە دەوری دەقی تێخراو، dir="auto" لەسەر خانەکان.
Flags as language buttons, or a switch that always goes to the home pageئاڵا وەک زمان، یان گۆڕەرێک کە هەمیشە دەچێتە Readers lose their page; a flag is a country, not a language.خوێنەران لاپەڕەکەیان ون دەکەن؛ ئاڵا وڵاتێکە، نەک زمانێک.Language names, linking to the same page.ناوی زمانەکان، بە بەستەر بۆ هەمان لاپەڕە.

Exercisesڕاهێنانەکان

ExerciseڕاهێنانFrom English to Kurdish with logical propertiesلە ئینگلیزییەوە بۆ کوردی بە تایبەتمەندییە لۆجیکییەکان

This CSS was written for an English page. Rewrite it with logical properties so the same file works for the Kurdish page too, and say what changes in the HTML.

ئەم بۆ لاپەڕەیەکی ئینگلیزی نووسراوە. بە دووپاتە بینووسەوە بۆ ئەوەی هەمان بۆ لاپەڕە کوردییەکەش کار بکات و بڵێ چی لە دەگۆڕێت.

English-only CSSCSSـی تەنیا ئینگلیزیstyle.cssCSSRuns in the browserلە ناو تۆڕگەڕ کار دەکات
.card {
  margin-left: 1rem;
  padding-right: 2rem;
  border-left: 4px solid #0d6b62;
  text-align: left;
}
.badge { position: absolute; top: 0; right: 0; }
.photo { float: left; margin-right: 1rem; }
Hintئاماژە

Use the table in From left and right to start and end.

خشتەکەی لە چەپ و ڕاستەوە بۆ سەرەتا و کۆتایی بەکاربهێنە.

Show answerوەڵامەکە پیشان بدە
The same rules for both directionsهەمان ڕێسا بۆ هەردوو ئاڕاستەstyle.cssCSSRuns in the browserلە ناو تۆڕگەڕ کار دەکات
.card {
  margin-inline-start: 1rem;
  padding-inline-end: 2rem;
  border-inline-start: 4px solid #0d6b62;
  text-align: start;
}
.badge { position: absolute; inset-block-start: 0; inset-inline-end: 0; }
.photo { float: inline-start; margin-inline-end: 1rem; }

Every left or right became start or end: on the Kurdish page the border, the badge and the photo move to the right by themselves. top could stay as it is — up and down are the same in both languages — but inset-block-start keeps the style consistent. In the HTML, only <html lang="ckb" dir="rtl"> changes.

هەموو چەپ و ڕاستێک بوون بە start یان end: لە لاپەڕە کوردییەکەدا ، نیشانەکە و وێنەکە خۆیان دەچنە لای ڕاست. top دەیتوانی وەک خۆی بمێنێتەوە — سەرەوە و خوارەوە لە هەردوو زمانەکەدا وەک یەکن — بەڵام inset-block-start شێوازەکە یەکدەست دەهێڵێتەوە. لە تەنیا <html lang="ckb" dir="rtl"> دەگۆڕێت.

ExerciseڕاهێنانThe English twin of the about pageجووتە ئینگلیزییەکەی لاپەڕەی لەبارە

Write /en/about.html, the English twin of the Kurdish page in A language switch that keeps the page: the right lang, the same three hreflang links, and a switch in which English is the current page.

/en/about.html بنووسە، جووتە ئینگلیزییەکەی ئەو لاپەڕە کوردییەی لە گۆڕینی زمان بێ ونکردنی لاپەڕەکەدا هەیە: langـی دروست، هەمان سێ hreflang و گۆڕەرێک کە English تێیدا لاپەڕەی ئێستایە.

Show answerوەڵامەکە پیشان بدە
The English about pageلاپەڕەی لەبارەی ئینگلیزیen/about.htmlHTMLRuns in the browserلە ناو تۆڕگەڕ کار دەکات
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>About us – Shilan's Bakery</title>
  <link rel="alternate" hreflang="ckb" href="https://example.com/ckb/about.html">
  <link rel="alternate" hreflang="en" href="https://example.com/en/about.html">
  <link rel="alternate" hreflang="x-default" href="https://example.com/en/about.html">
  <style>
    body { margin: 0; font-family: Arial, Vazirmatn, "Noto Sans Arabic", sans-serif; line-height: 1.6; }
    header {
      display: flex; flex-wrap: wrap; gap: 0.5rem 1rem;
      align-items: center; justify-content: space-between;
      padding: 0.75rem 1rem; background-color: #dcefeb;
    }
    .site { font-weight: bold; color: #0a5a52; text-decoration: none; }
    .lang { display: flex; gap: 0.25rem; margin: 0; padding: 0; list-style: none; }
    .lang a { display: inline-block; padding: 0.25rem 0.75rem; border-radius: 1rem; color: #1b1d20; }
    .lang a[aria-current] { background-color: #ffffff; font-weight: bold; text-decoration: none; }
    main { padding: 1rem; }
  </style>
</head>
<body>
  <header>
    <a class="site" href="index.html">Shilan's Bakery</a>
    <nav aria-label="Language">
      <ul class="lang">
        <li><a href="/en/about.html" hreflang="en" lang="en" aria-current="page">English</a></li>
        <li><a href="/ckb/about.html" hreflang="ckb" lang="ckb" dir="rtl">کوردی</a></li>
      </ul>
    </nav>
  </header>
  <main>
    <h1>About us</h1>
    <p>Since 2018 we have baked fresh bread in Erbil every morning.</p>
  </main>
</body>
</html>

The head has exactly the same three link elements as the Kurdish page. The page needs no dir, because left to right is the default; the Kurdish link carries lang="ckb" dir="rtl" so that کوردی is read and shown as Kurdish.

<head>ـەکە ڕێک هەمان سێ <link>ـی لاپەڕە کوردییەکەی تێدایە. لاپەڕەکە پێویستی بە dir نییە، چونکە بنەڕەتە؛ کوردییەکە lang="ckb" dir="rtl"ـی لەسەرە بۆ ئەوەی «کوردی» وەک کوردی بخوێنرێتەوە و پیشان بدرێت.

ExerciseڕاهێنانFix the comments listلیستی بۆچوونەکان چاک بکە

On a Kurdish page (dir="rtl") these comments come out in the wrong order: the colon jumps away from the English name, and the English comment gets its “!” at the wrong end. Fix them with <bdi> and dir="auto".

لە لاپەڕەیەکی کوردیدا (dir="rtl") ئەم بۆچوونانە بە ڕیزبەندیی هەڵە دەردەکەون: دوو خاڵەکە لە ناوە ئینگلیزییەکە دوور دەکەوێتەوە و نیشانەی «!»ـی بۆچوونە ئینگلیزییەکە دەچێتە سەرەکەی تر. بە <bdi> و dir="auto" چاکیان بکە.

Comments in a right-to-left pageبۆچوون لە لاپەڕەیەکی ڕاست بۆ چەپداHTML
<p class="comment">Aram K.: ٣ بۆچوون</p>
<p class="comment">شیلان: ٥ بۆچوون</p>
<p class="comment">This page helped me a lot!</p>
<p class="comment">زۆر سوودی هەبوو، سوپاس.</p>
Show answerوەڵامەکە پیشان بدە
Comments that keep their orderبۆچوونەکان ڕیزبەندیی خۆیان دەپارێزنcomments.htmlHTMLRuns in the browserلە ناو تۆڕگەڕ کار دەکات
<!DOCTYPE html>
<html lang="ckb" dir="rtl">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>بۆچوونەکان</title>
  <style>
    body { margin: 12px; font-family: Vazirmatn, "Noto Sans Arabic", Tahoma, sans-serif; line-height: 1.8; }
    .comment { margin-block-end: 0.5rem; padding: 0.5rem 0.75rem; border-inline-start: 4px solid #0d6b62; background-color: #f3f1ec; }
    .who { font-weight: bold; }
  </style>
</head>
<body>
  <h1>بۆچوونەکان</h1>
  <p class="comment"><bdi class="who">Aram K.</bdi>: ٣ بۆچوون</p>
  <p class="comment"><bdi class="who">شیلان</bdi>: ٥ بۆچوون</p>
  <p class="comment" dir="auto">This page helped me a lot!</p>
  <p class="comment" dir="auto">زۆر سوودی هەبوو، سوپاس.</p>
</body>
</html>

<bdi> isolates each name, so the colon and the count stay where they belong. dir="auto" gives every comment the direction of its first letter: the English one is laid out left to right and even gets its border on the left, because border-inline-start follows the paragraph's own direction.

<bdi> هەر ناوێک جیا دەکاتەوە، بۆیە دوو خاڵەکە و ژمارەکە لە شوێنی خۆیان دەمێننەوە. dir="auto" ئاڕاستەی یەکەم پیتی هەر بۆچوونێک دەداتێ: بۆچوونە ئینگلیزییەکە ڕێکدەخرێت و تەنانەت دەچێتە لای چەپ، چونکە border-inline-start شوێن ئاڕاستەی خودی بڕگەکە دەکەوێت.

ExerciseڕاهێنانFind the wrong lettersپیتە هەڵەکان بدۆزەرەوە

This line was copied from an old document. It looks Kurdish, but some letters are Arabic look-alikes. Which ones, and how many?

ئەم دێڕە لە بەڵگەنامەیەکی کۆنەوە کۆپی کراوە. کوردی دەردەکەوێت، بەڵام هەندێک لە پیتەکانی هاوشێوەی عەرەبین. کامانەن و چەندن؟

Copied textدەقی کۆپیکراوTEXT
كتێبخانەی زانكۆ: سەرچاوەی كوردي بۆ خوێندكاران
Hintئاماژە

Look at every ک and at the last letter of each word.

سەیری هەموو پیتێکی ک و دوایین پیتی هەر وشەیەک بکە.

Show answerوەڵامەکە پیشان بدە
CorrectedچاککراوTEXT
کتێبخانەی زانکۆ: سەرچاوەی کوردی بۆ خوێندکاران

Four times ك (U+0643) instead of ک (U+06A9) — in کتێبخانە, زانکۆ, کوردی and خوێندکاران — and once ي (U+064A) instead of ی (U+06CC), at the end of کوردی, where its two dots give it away. A find-and-replace for ك → ک and ي → ی fixes the whole file.

چوار جار ك ⁦(U+0643)⁩ لەبری ک ⁦(U+06A9)⁩ — لە کتێبخانە، زانکۆ، کوردی و خوێندکاران — و جارێک ي ⁦(U+064A)⁩ لەبری ی ⁦(U+06CC)⁩، لە کۆتایی کوردی، کە دوو خاڵەکەی ئاشکرای دەکەن. دۆزینەوە و گۆڕینی ك ← ک و ي ← ی هەموو چاک دەکات.

Summaryپوختە

  • Kurdish pages: <html lang="ckb" dir="rtl"> — the direction in the HTML, not only in CSS; lang and dir on parts in another language.
  • Sorani is ckb, never ar-IQ; ku is used for Kurmanji.
  • Flex and grid follow dir; floats and left/right do not — use logical properties (margin-inline-start, inset-inline-end, text-align: start).
  • Mixed text: isolate what you insert — <bdi>, dir="auto", <span dir="ltr"> — and keep phone numbers left to right.
  • Kurdish letters ک ی ە, not Arabic ك ي ه‌; one style of digits for the whole site.
  • Mirror arrows, progress bars and sliders; never logos, ▶, ✓, clocks or numbers.
  • Bilingual sites: twin pages joined by hreflang, and a switch that keeps the reader on the same page.
  • لاپەڕەی کوردی: <html lang="ckb" dir="rtl"> — ئاڕاستە لە ، نەک تەنیا لە ؛ lang و dir لەسەر ئەو بەشانەی بە زمانێکی ترن.
  • سۆرانی ckbـە، هەرگیز ar-IQ نا؛ ku بۆ کرمانجی بەکاردێت.
  • flex و grid شوێن dir دەکەون؛ float و ⁦left/right⁩ نا — بەکاربهێنە (margin-inline-start، inset-inline-end، text-align: start).
  • دەقی تێکەڵ: ئەوەی تێی دەخەیت جیای بکەرەوە — <bdi>، dir="auto"، <span dir="ltr"> — و ژمارەی تەلەفۆن بهێڵەوە.
  • پیتە کوردییەکانی ک ی ە، نەک ك ي ه‌ـی عەرەبی؛ یەک شێوەی ژمارە بۆ هەموو .
  • تیر، شریتی پێشکەوتن و سلایدەر ئاوێنە بکە؛ بەڵام هەرگیز لۆگۆ، ▶، ✓، کاتژمێر یان ژمارە ئاوێنە مەکە.
  • دووزمانە: لاپەڕەی جووت کە بە hreflang بەیەکەوە دەبەسترێن و گۆڕەرێک کە خوێنەر لەسەر هەمان لاپەڕە دەهێڵێتەوە.

Next: Project: Building and Styling Pages puts all of this together in complete practice projects.

دواتر: پڕۆژە: دروستکردن و ڕازاندنەوەی لاپەڕە هەموو ئەمانە لە پڕۆژەی ڕاهێنانی تەواودا بەکار دەهێنێت.

Lesson complete!وانەکە تەواو بوو!

Well done. Review the key terms, then go on to the next lesson.دەستخۆش. سەیرێکی زاراوە سەرەکییەکان بکەرەوە، پاشان بڕۆ بۆ وانەی داهاتوو.

Key termsزاراوە سەرەکییەکان

Next lessonوانەی داهاتوو

Project: Building and Styling Pagesپڕۆژە: دروستکردن و ڕازاندنەوەی لاپەڕە

References and further readingسەرچاوەکان و خوێندنەوەی زیاتر

This lecture is a first edition. The Kurdish text and terminology are waiting for review by Kurdish IT teachers.ئەم وانەیە چاپی یەکەمە. دەقە کوردییەکە و زاراوەکانی چاوەڕێی پێداچوونەوەی مامۆستایانی کوردی بواری IT ن.

Appearanceڕووکار

Modeدۆخ
Styleشێواز
Coloursڕەنگەکان

Saved on this device only.تەنیا لەسەر ئەم ئامێرە پاشەکەوت دەکرێت.