همان‌طور که اطلاع دارید، شرکت گوگل یک مرورگر اینترنتی جدید با نام Google Chrome ساخته‌است که یک مرورگر بسیار سریع و با فناوری‌های جدید است. این مرورگر بر پایه‌ی سیستم WebKit ساخته‌شده‌است. سیستم WebKit یکی از قدیمی‌ترین سیستم‌های مرورگرهای وب است که این موضوع طراح‌های وب‌سایت‌های اینترنتی را نگران کرده‌است. اما شرکت گوگل در ساختار این سیستم بسیار دست‌کاری کرده تا مروگر Chrome بسیار متفاوت باشد. در واقع این مرورگر تنها ساختار کلی خود را از WebKit گرفته و سایر امکانات آن کاملا جدید هستند. برنامه‌نویسان گوگل بسیار سعی کرده‌اند تا ساختار Chrome را خلاف ساختار سایر مروگرهایی که برپایه‌ی WebKit هستند، بسازند. یکی از این تلاش‌ها، سازگاری مرورگر Chrome با سبک RTL یا راست‌به‌چپ نویسی است که برای فارسی زبان‌ها بسیار اهمیت دارد. همه‌ی ما می‌دانیم که سایر مرورگر های برپایه‌ی WebKit با RTL مشکل دارند اما در Chrome این مشکل برطرف شده‌است. در این نوشته سعی دارم تا یک راهنمای ساده برای سازگار کردن وب‌سایت‌ها با مرورگر Chrome  بنویـسم.

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

1. برنامه‌ها را از سایت‌ها جدا کنید:

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

اگر سایت شما یک نرم‌افزار تحت وب است این کدها را به <Head> سایت خود اضافه کنید:

<meta name=”application-name” content=”APPLICATION-NAME”>
<meta name=”description” content=”APPLICATION-DESCRIPTION”>
<meta name=”application-url” content=”APPLICATION-URL”>
<link rel=”icon” href=”APPLICATION-ICON” sizes=”32×32″>
<link rel=”icon” href=”APPLICATION-ICON” sizes=”64×64″>

و در هر قسمت که به حروف بزرگ نوشته شده‌است اطلاعات نرم‌افزار خود را قرار دهید. مثلا در APPLICATION-NAME نام نرم‌افزار تحت وب خود را بنویسید و سایر قسمت‌ها را هم به همین صورت پر کنید.

اما در صورتی که سایت شما یک وب‌سایت یا وب‌لاگ است، نیازی به اضافه کردن کد خاصی ندارید.

2. در وب‌سایت خود از Form های رنگی و فرم‌های همراه با استایل استفاده نکنید. مرورگر گوگل به این نوع فرم‌ها حساس است و ممکن است کل سایت شما دچار اختلال شود. فرم‌های استایل‌دار در حدی که فقط به فرم زیبایی بدهند ایرادی ندارند اما گاهی اوقات در مروگر ها دچار مشکل نمایشی می‌شوند.

3. فرم‌های خود را به صورت Flexible طراحی کنید:

نمی‌دانم دقت کرده‌اید یا نه؟ مرورگر Chrome  به فیلدهای فرم‌ها خاصیت بزرگ‌تر و کوچک‌تر شدن می‌دهد. یعنی کاربر می‌تواند به دل‌خواه خود textbox ها را بکشد تا بزرگ‌تر جلوه بدهند. پس شما باید فرم‌های خود را به صورت انعطاف‌پذیر بسازید تا در این مرورگر دچار مشکل نشوند.

4. برای هر فیلد در فرم‌ها یک Label اختصاص دهید.

5. XML های Valid استفاده کنید:

همیشه مواظب باشید که فایل‌های xml سایت شما (مخصوصا در سایت‌های وب 2) قابل خواندن و شناخته‌شدن باشند یعنی در کل Valid باشند تا Chrome به آن‌ها شک نکند.

6. در کدهای سایت خود نوع HTML را ذکر کنید:

برای نمایش بهتر سایت شما در Google Chrome باید نوع HTML سایت خود را در همان ابتدای کدها ذکر کنید. مثلا به این صورت:

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN”
“http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>

7. حتما از favicon استفاده کنید.

8. در ساختار سایت خود به هیچ‌وجه از frame های قدیمی استفاده نکنید:

مروگر کروم با frame های قدیمی که توسط نرم‌افزارهای طراحی سایت بسیار قدیمی ساخته می‌شوند رابطه‌ی خوبی ندارد و معمولا آن‌ها را درهم و شکسته نشان می‌دهد.

9. به جای table از تگ های <DIV> استفاده کنید.

تمامی این ده نکته 9 نکته را که در این نوشته ذکر کردم، به صورت آزمون و خطا و آزمایش روی این مروگر فهمیده‌ام. اگر شما هم به نکته‌های خاصی رسیده‌اید که می‌تواند به طراحی وب و نمایش آن در Chrome کمک کند، حتما با من در میان بگذارید.