جلسه هشتاد و ششم – آموزش طراحی سایت فروشگاهی با وردپرس

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

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

به این دلیل که از بوت استرپ استفاده کردیم میتوان گفت بیش از 80% راه رسپانسیو را رفتیم . کافیست کمی روی جزئیات و البته بخش Media کار کنیم تا طرح نهایی و مدنظر حاصل شود . قسمت Media برای تمامی قالب ها کم و بیش نیاز است ( جدا از این موضوع که فریمورک رسپانسیو بوت استرپ با دستورات مدیا فعال هستند )  . کسانی که Css کار می کنند با بخش Media آشنایی لازم را خواهند داشت . پس قسمت هایی که قادر نیستیم توسط بوت استرپ کامل کنیم را توسط دستورات Media تنظیم خواهیم کرد .

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

اهمیت رسپانسیو سایت در سئو و تجربه کاربری

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

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

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

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

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

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