طراحی سایت

اشتباهات رایج در طراحی سایت ریسپانسیو

اشتباهات رایج در طراحی سایت ریسپانسیو

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

سایت ریسپانسیو

واژه ریسپانسیو یک کلمه لاتین و به معنی واکنش­گرا است. سایت ریسپانسیو به سایتی گفته می‌­شود که در مقابل پیمایش صفحه در هر نوع دستگاهی بر اساس اندازه و رزولیشن صفحه آن دستگاه واکنش نشان دهد. تغییرات لحاظ شده در آن به تناسب صفحه نمایشگر است.

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

اهمیت طراحی ریسپانسیو سایت

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

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

اشتباهات رایج در طراحی سایت ریسپانسیو

اشتباهات رایج در طراحی ریسپانسیو سایت

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

نامنظم بودن منو

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

تصاویر ثابت

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

قرارگیری نادرست ستون ­ها

تصور کنید با تغییر اندازه صفحه نمایش چه اتفاقی برای ستون­‌های قرار گرفته در سایت می‌­افتد. ممکن است با کوچک­ترین اشتباه تمام نظم سایت بابت جای­گیری نادرست ستون‌ها به هم بریزد. در بیشتر سایت‌ها مطالب به صورت ستونی قرار گرفته‌اند. پس بهتر است این اشتباه رایج را در نسخه ریسپانسیو سایت خود برطرف کنید.

مطالب طولانی

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

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

اشتباهات رایج در طراحی سایت ریسپانسیو

طراحی سایت برای دسکتاپ

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

URL جداگانه برای تلفن همراه

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

توسعه ندادن وب سایت برای تلفن های لمسی

امروزه اکثر دستگاه ها دارای صفحات لمسی هستند، حتی بسیاری از لپ تاپ ها دارای قابلیت لمسی در دسترس هستند. از این رو مهم است که هنگام ایجاد یک طراحی ریسپانسیو از اهمیت کنترل لمسی غافل نشوید. اندازه انگشت کاربران برای کلیک در نظر داشته باشید.

سخن پایانی

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

الان وقتشه!

جهت مشاوره و ساخت طراحی سایت حرفه ای و بهینه سازی سایت و تولید محتوا تماس بگیر

نویسنده

مدیر سایت

حمیده عابدی کارشناس کامپیوتر رشته نرم افزار هستم و مشغول کار در در زمینه طراحی سایت با وردپرس و آشنا به سئو و بهینه سازی سایت، تولید محتوا، برنامه نویسی HTML, CSS هستم.

پیام بگذارید