
اقتصادی ترین طراحی برای سایت خود را از ما بخواهیدمشاهده دمو
امروزه طراحی رسپانسیو یک موضوع بسیار بسیار مهم است . امروزه اکثر کاربران که سایت های مختلف را در سطح اینترنت جستجو می کنند با استفاده از تلفن های همراه این کار را انجام میدهند.
با توجه به پیشرفت روز افزون تکنولوژی ها در زمینه تلفن همراه و پیشرفت روز به روز سیستم عامل های موبایل ، درصد کاربرانی که جذب این تکنولوژی ها می شوند هم افزایش می یابد.
درنتیجه تلفن همراه یک وسیله برای پاسخگویی به تمام خواسته های کاربران شناخته شده است. به همین دلیل به طور متوسط 50% جستجو های سطح اینترنت در سای های مختلف از طریق گوشی های تلفن همراه صورت می گیرد.
به همین خاطر وب سایت هایی که طراحی و پیاده سازی می شوند باید در بستر موبایل هم از کیفیت لازم برخوردار باشند.
برای این منظور باید قالب سایت ها واکنش گرا یا اصطلاحا رسپانسیو طراحی گردد.
مظور از رسپانسیو بدین معنی است که در تمامی دستگاه ها چه موبایل ، چه تبلت ، چه لپ تاپ و چه سیستم های خانگی به شکل درست و بدون ایراد نمایش داده شود .
در گذشته رسپانسیو کردن سایت مقداری مشکل تر بود چرا که طراحان قالب یا به اصطلاح fronend کارها باید برای رسپانسیو کردن مقدار زیادی کد برای دستگاه های مختلف و اصطلاحا Device Width های مختلف می نوشتند تا در تمامی عرض های دستگاه های مختلف ، وب سایت ها درست نمایش داده شوند.
هم چنین در طراحی رسپانسیو باید چیدمان عناصر را هم مرتب می کردند تا به شکل منظم و در قالب درست نمایش داده شود .
اما هم اکنون با وجود فریم ورک هایی مثل Bootstrap , w3c , Uikit و… که جزو معروف ترین چارچوب های رسپانسیو هستن این کار به راحتی و با سرعت زیادی انجام می گیرد.
امروزه اگر پارامتر های کلی سئو را بررسی کنیم میبینم که قسمت Mobile Friendly یکی از شاخصه های سئو داخلی یا همان On Page Seo می باشد که حتما یک وب سایت برای کسب نمره خوب در سئو باید آن را داشته باشد.
امروزه از نظر موتور های جستجو و مخصوصا موتور جستجوی محبوب گوکل ، باید سایت ها برای موبایل آماده شده باشند و وب سایت هایی که رسپانیسو نباشند نمره خیلی پایین تری در سئو خواهند گرفت.
اندازه متون که در بحث تایپوگرافی هم مطرح می شود باید به اندازه ای تنظیم شود که در حالت موبایل خوانا باشد و بسیار ریز نباشد . در صورت ریز بودن متن ها خزنده ها این خطا را تشخص داده و حتما برای ما خطا ارسال خواهند کرد.
اگر دکمه ها یا لینک هایی که داخل وب سایت شما هستند و کاربر قرار است روی آنها کلیک کند بسیار کوچک باشند ، و یا نحوه قرار گرفتن آنها به گونه ای باشد که به هم چسبیده باشند و نتوان روی لینک مورد نظر کیلک کرد دوخطای بسیار وحشتناک برای سایت هستند که باید رفع شوند.
مجموع این ابرادات کاربر را از هداف خود دور کرده و باعث ترک سایت شما می شود.
تصاویر اگر در ابتدای مطالب شما قرار می گیرند باید به گونه ای باشند تا تمام صفحه موبایل یا تبلت را نپوشانند به طوری که کاربر احساس نکند فقط تصویر محتوای این صفحه است و متنی وجود ندارد . بنابراین همیشه اندازه تصاویر را متناسب انتخاب کنید و یا درصد عرض و ارتفاع آن ها را در حالت موبایل تنظیم کنید.
برای اینکه کدهای رسپانسیو داخل سایت اعمال شوند و صفحه ما بعنوان یک صفحه رسپانسیو با تمام عرض ها باشد باید خصوصیت زیر که یک تگ متا است به صفحه مورد نظر اضافه شود تا متناسب با عرض هردستگاهی باشد که داخل آن نمایش داده می شود.
—-meta name=”viewport” content=”width=device-width, initial-scale=1.0“—
این تگ که به آن viewport هم گفته می شود یکی از پارامتر های سئو داخلی نیز می باشد و حتما باید داخل هدر صفحه درج شود.
در برخی وب سایت ها به دلیل اینکه در ابتدای آنها از اسلایدر های بزرگ استفاده می شود ، و این اسلایدر ها با کدهای اسکریپت کار می کنند عموما در انتهای همه کد ها اجرا می شوند.
یعنی پس از اینکه تمامی متون و تصاویر لود شدند سپس کدهای اسکریپت اجرا می شوند و عناصری مثل اسلایدر بارگزاری می شوند.
درحالت موبایل عموما این عناصر را مخفی می کنند تا زودتر محتوای مورد نظر صفحه بارگزاری شود و کاربر سریع تر از محتوای آن استفاده کند.
به همین ترتیب عناصری که حس میکنیم در حالت موبایل نیازی به نمایش آنها نیست را می توان از دید کاربر مخفی کرد.
همان طور که از مطالب گفته شده تا اکنون دریافتید موضوع رسپانسیو کردن سایت ها یا وب اپلیکیشن های ما از لحاظ سئو بسیار مهم است . چرا که می توان گفت نیمی از کاربران سایت های مختلف با تلفن همراه در حال استفاده هستند ، و درصورت عدم داشتن طراحی رسپانسیو کاربران از سایت ما فراری خواهند شد!
با ما در تماس باشید