پرش به محتوا

ساخت وب‌سایت‌های دوزبانه راست‌به‌چپ

۲ دقیقه مطالعهi18nrtlcss

ساخت وب‌سایتی که هم انگلیسی و هم یک زبان راست‌به‌چپ مانند فارسی را ارائه می‌دهد، کارِ جابه‌جا کردن یک ویژگی dir در لحظهٔ آخر نیست؛ مجموعه‌ای از تصمیم‌های کوچک و عمدی است که در سراسر کدبیس اثر می‌گذارند.

اصل بنیادین: ویژگی‌های منطقی

مهم‌ترین قانون این است که هرگز یک ویژگی جهت‌دار فیزیکی ننویسید. به‌جای margin-left بنویسید margin-inline-start. مرورگر در بافت چپ‌به‌راست، inline-start را به «چپ» و در بافت راست‌به‌چپ به «راست» ترجمه می‌کند؛ پس یک فایل استایل هر دو زبان را پوشش می‌دهد.

یک نمونهٔ واقعی

همین قانون، یک کارت را در هر دو زبان درست جای‌گذاری می‌کند:

styles/box.csscss
.box {
  margin-inline-start: 1rem;
  padding-inline: 1.5rem;
  border-inline-start: 1px solid var(--border);
}

محتوا روی فایل‌سیستم زندگی می‌کند

یک نوشتهٔ دوزبانه یک پوشه است، نه یک ردیف در پایگاه داده:

  • content/blog/slug/en.mdx ترجمهٔ انگلیسی است
  • content/blog/slug/fa.mdx ترجمهٔ فارسی است
  • نبودِ fa.mdx یعنی «نسخهٔ فارسی وجود ندارد»

خط لوله محتوای نوع‌امن توضیح می‌دهد که اعتبارسنجی چگونه از پیوندهای شکسته جلوگیری می‌کند.

جهت یک ویژگیِ محتواست، نه ویژگیِ سیستم طراحی. آن را در مبدأ درست کنید تا هر مصرف‌کننده‌ای آن را به ارث ببرد.

برای آشنایی بیشتر با ابزارها، مستندات Shiki را ببینید.