رویکرد ما به توسعه وب‌سایت‌های دوزبانه فارسی و انگلیسی

تیم ما در کنار محصولات خود، وب‌سایت نیز طراحی و توسعه می‌دهد. دو نمونه از آن‌ها اکنون در دسترس‌اند و هر دو به فارسی و انگلیسی ارائه می‌شوند: ستاره زاگرس، شرکت مشاوره بازرگانی بین‌المللی در تهران، و تولید دارو، تولیدکننده و واردکننده داروهای دامپزشکی. ظاهر این دو وب‌سایت شباهتی به هم ندارد، اما بر پایه تصمیم‌های یکسانی ساخته شده‌اند. اجرای درست دو زبان بسیار فراتر از ترجمه متن است: چیدمان برعکس می‌شود، فونت‌ها رفتار متفاوتی دارند، اعداد و تاریخ‌ها شکل خاص خود را دارند و موتورهای جست‌وجو باید بدانند هر صفحه برای چه مخاطبی است. در ادامه رویکرد خود را توضیح می‌دهیم.

آدرس مستقل برای هر زبان

مهم‌ترین تصمیم: هر زبان آدرس مستقل خود را دارد. صفحات فارسی ستاره زاگرس زیر /fa/ و صفحات انگلیسی زیر /en/ قرار دارند. تولید دارو نسخه فارسی را در ریشه وب‌سایت و نسخه انگلیسی را زیر /en/ قرار داده و هر صفحه یک نسخه متناظر در زبان دیگر دارد: هر یک از ۵۶ محصول آن یک صفحه فارسی و یک صفحه انگلیسی دارد. دکمه‌ای که فقط با جاوااسکریپت متن را روی همان آدرس تغییر می‌دهد ظاهر جذابی دارد، اما موتورهای جست‌وجو برای هر آدرس یک نسخه از صفحه را نمایه می‌کنند؛ بنابراین زبان دوم عملاً از نتایج جست‌وجو حذف می‌شود.

وقتی آدرس‌ها مستقل باشند، هر صفحه موتورهای جست‌وجو را از نسخه متناظر خود در زبان دیگر مطلع می‌کند:

• یک پیوند hreflang برای هر نسخه زبانی، از جمله خود صفحه، به‌علاوه یک x-default برای بازدیدکنندگانی که زبانشان هیچ‌کدام نیست. مشتریان هر دو وب‌سایت عمدتاً فارسی‌زبان‌اند؛ به همین دلیل در هر دو، x-default صفحه فارسی است.
• یک پیوند canonical که به خود صفحه اشاره می‌کند، نه به زبان دیگر. اگر canonical صفحه فارسی را صفحه انگلیسی قرار دهید، به گوگل اعلام کرده‌اید که این دو صفحه تکراری‌اند و ممکن است صفحه فارسی از نتایج حذف شود.
• همین جفت‌ها در نقشه سایت نیز ثبت می‌شوند تا این رابطه در دو جا اعلام شود. نقشه سایت تولید دارو ۱۳۰ آدرس دارد و نسخه متناظر هر کدام در کنار آن آمده است.

راهنمای گوگل درباره نسخه‌های محلی صفحات مرجع اصلی این بخش است و ارزش مطالعه کامل را دارد. بقیه نکات فنی یک وب‌سایت فارسی (عنوان صفحه، حروف فارسی، سرعت با فونت فارسی و میزبانی) را در چک‌لیست سئوی سایت فارسی نوشته‌ایم.

تغییر زبان به نسخه متناظر صفحه

بازدیدکننده‌ای که درباره یک محصول مطالعه می‌کند و «EN» را انتخاب می‌کند، باید به همان محصول به انگلیسی برسد، نه به صفحه اصلی انگلیسی. در وب‌سایت تولید دارو، دکمه تغییر زبان، نسخه متناظر همان صفحه را باز می‌کند. زبان بازدیدکننده را نیز هرگز از روی IP حدس نمی‌زنیم: این حدس اغلب نادرست است (مسافران، VPN) و خزنده‌های موتورهای جست‌وجو را نیز سردرگم می‌کند، زیرا معمولاً از یک کشور مشخص خزش می‌کنند. انتخاب زبان با خود بازدیدکننده است.

طراحی راست‌به‌چپ فراتر از تراز متن

قرار دادن dir="rtl" روی تگ <html> صفحه فارسی، جهت متن را برعکس می‌کند و با CSS امروزی بخش عمده چیدمان نیز از آن پیروی می‌کند: گرید و ردیف‌های flex به‌طور خودکار راست‌به‌چپ می‌شوند. مشکل از جایی آغاز می‌شود که یک ویژگی، نام یک سمت فیزیکی را به کار می‌برد.

• از ویژگی‌های منطقی استفاده کنید. margin-inline-start و padding-inline-end از جهت متن پیروی می‌کنند، اما margin-left نه. CSS ستاره زاگرس به همین روش نوشته شده و یک مجموعه قاعده برای هر دو جهت کافی است.
• مشخص کنید چه چیزی نباید برعکس شود. پیکان‌ها و نوار پیشرفت باید جهت خواندن را نشان دهند. لوگو، تصویر، کد، شماره تلفن و نام‌های لاتین نباید برعکس شوند.
• متن‌های ترکیبی را جدا کنید. یک کلمه یا عدد لاتین در میان جمله فارسی ممکن است باعث جابه‌جایی علائم نگارشی شود. قرار دادن آن داخل <bdi> یا استفاده از unicode-bidi: isolate آن را در جای خود نگه می‌دارد.

تایپوگرافی متناسب با هر زبان

• از یک فونت واقعاً فارسی استفاده کنید و برای آن جفت مناسب انتخاب کنید. فونت‌هایی که برای خط لاتین طراحی شده‌اند، اغلب حروف عربی را به‌صورت حاشیه‌ای و با شکل‌هایی که برای فارسی مناسب نیستند اضافه کرده‌اند. هر دو وب‌سایت متن فارسی را با IRANSansX، فونتی که برای فارسی طراحی شده، نمایش می‌دهند و انگلیسی فونت‌های مخصوص خود را دارد: Playfair Display و Montserrat در ستاره زاگرس و Sora در تولید دارو. هر زبان به گونه‌ای خوانده می‌شود که گویی وب‌سایت از ابتدا برای همان زبان طراحی شده است.
• به سطرها فضای بیشتری بدهید. حروف فارسی نقطه و علامت‌هایی در بالا و پایین دارند. فاصله سطری که برای انگلیسی مناسب است، این علامت‌ها را قطع می‌کند. متن فارسی به فاصله سطر بازتری نیاز دارد.
• هرگز فاصله حروف اضافه نکنید. حروف فارسی به یکدیگر متصل‌اند و فاصله انداختن میان آن‌ها اتصال‌ها را از بین می‌برد. حروف بزرگ نیز همین‌طور: فارسی حروف بزرگ ندارد؛ بنابراین text-transformی که برای برچسب‌های انگلیسی تعریف شده باید غیرفعال شود.
• تراز دوطرفه بدون کشیده. حروف‌چینی سنتی فارسی برای تراز کردن سطر، کلمات را با کشیده (ـ) امتداد می‌دهد. مرورگرها به‌جای آن فاصله‌ها را باز می‌کنند. این روش کار می‌کند، اما آن را روی صفحه باریک تلفن همراه بررسی کنید.

جست‌وجو متناسب با شیوه نگارش کاربران

فارسی بسیار بیش از آنچه به نظر می‌رسد به شکل‌های گوناگون تایپ می‌شود. برخی صفحه‌کلیدها به‌جای ی و ک فارسی، ي و ك عربی تایپ می‌کنند. کاربران در جایی که نیم‌فاصله لازم است فاصله کامل می‌گذارند، یا برعکس. اعداد نیز به شکل فارسی، عربی یا لاتین تایپ می‌شوند. همه این‌ها تقریباً شبیه یکدیگرند، اما نویسه‌های متفاوتی هستند و یک جست‌وجوی سخت‌گیر هیچ نتیجه‌ای پیدا نمی‌کند.

جست‌وجوی محصول در وب‌سایت تولید دارو، پیش از مقایسه، هم عبارت جست‌وجو و هم کاتالوگ را به یک شکل تبدیل می‌کند: حروف عربی به شکل فارسی تبدیل می‌شوند، نیم‌فاصله مانند فاصله در نظر گرفته می‌شود، همه شکل‌های عدد یکسان می‌شوند و اعراب حذف می‌شوند. افزون بر این، جست‌وجو خطاهای تایپی کوچک را نیز می‌پذیرد؛ بنابراین اگر نام یک محصول را با خطا بنویسید، باز هم آن را در هر دو زبان پیدا می‌کند. سایر بخش‌های این وب‌سایت، از جمله کاتالوگ و کادر سفارش، در مطالعه موردی تولید دارو آمده است.

اعداد و تاریخ

خواننده فارسی انتظار اعداد فارسی (۱۲۳) و تقویم شمسی را دارد. مرورگرها هر دو را پشتیبانی می‌کنند: Intl.NumberFormat('fa-IR') اعداد را قالب‌بندی می‌کند و Intl.DateTimeFormat با زبان‌محل fa-IR-u-ca-persian بدون نیاز به هیچ کتابخانه‌ای تاریخ شمسی تولید می‌کند. داده اصلی را به یک شکل استاندارد نگه دارید (اعداد لاتین و تاریخ ISO) و فقط هنگام نمایش آن را تبدیل کنید تا مرتب‌سازی، جست‌وجو و داده‌های ساختاریافته یکدست بمانند.

ارائه کامل محتوای صفحه

موتورهای جست‌وجو و پیش‌نمایش پیوندها، HTMLی را می‌خوانند که سرور ارسال می‌کند. در هر دو وب‌سایت، متن هر صفحه به زبان خود در همان HTML وجود دارد: صفحات محصول تولید دارو از یک منبع واحد اطلاعات محصولات، به هر دو زبان و به شکل صفحه ایستا تولید می‌شوند؛ بنابراین اصلاحی که یک بار انجام شود به هر دو نسخه می‌رسد. هر وب‌سایت شرکت خود را نیز با داده ساختاریافته و به هر دو زبان به موتورهای جست‌وجو معرفی می‌کند.

نگارش طبیعی در هر زبان

و در پایان، بخشی که هیچ کدی آن را اصلاح نمی‌کند: صفحه‌ای که شبیه ترجمه است، مانند ترجمه خوانده می‌شود. نسخه فارسی و انگلیسی را بر اساس اطلاعات یکسان و هر کدام به شیوه‌ای بنویسید که اهل آن زبان واقعاً می‌نویسند، و هر نسخه را به یک فرد با زبان مادری همان زبان بسپارید تا بخواند. موتورهای جست‌وجو به صفحاتی امتیاز می‌دهند که کاربران مایل به خواندن آن‌ها هستند و کاربران این تفاوت را تشخیص می‌دهند.