اشتباهات رایج در طراحی سایت – بخش دوم

آموزش طراحی سایت

طراحان وب و برنامه نویسان اشتباهات رایج و مشترکی دارند. که ۱۰ مورد از آنها در این مقاله بررسی می شود. در قسمت قبلی به بررسی ۵ مورد از اشتباهات رایج و روشهای اجتناب از آنها پرداختیم. در این مقاله ۵ مورد بعدی را بررسی خواهیم کرد. با ما همراه باشید.

  • نوشتن کد انشعابی

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

تاپیر منفی: همچنان که نسخه های جدید مرورگرها به روز رسانی می شوند، فایل های کد نیز بزرگ می شوند و مدیریت را دشوار می کند.

چگونگی جلوگیری از این مشکل: پیاده سازی کد به صورت feature detection به جای browser/version detection است. روش های feature detection به طور چشمگیری میزان کد را کاهش می دهند، و خواندن و مدیریت آن را بسیار آسان تر می کنند. یک راه حل برای پیاده سازی به صورت feature detection استفاده از کتابخانه هایی از قبیل Modernizr است. این کتابخانه همچنین کمک می کند تا مرورگرهای قدیمی ، به طور خودکار HTML5 و یا CSS3 را پشتیبانی کنند.

  • طراحی غیر واکنشگرا

اشتباه: توسعه دهندگان یا طراح سایت فرض میکند همه بینندگان سایت،  سایت را در مانیتوری همان اندازه  مانیتور طراح یا توسعه دهنده مشاهده می کنند.

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

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

  • ساخت صفحات بی معنی

اشتباه: تولید صفحات عمومی با محتوا که ممکن است بسیار مفید باشد، اما هیچ نکته ای برای جذب موتورهای جستجو ارائه نمی دهد.

تاثیر منفی: صفحات از طریق موتورهای جستجو قابل کشف و دسترسی نخواهند بود. بنابراین ممکن است بازدیدکننده کمی داشته باشد یا اصلا بازدیدی نداشته باشد. محتوای صفحه ممکن است از دید کاربران مخفی بماند.

چگونگی جلوگیری از این اشتباه: استفاده از SEO (بهینه سازی موتور جستجو) و پشتیبانی دسترسی در HTML. با توجه به SEO، لازم است تا تگ <META>  با کلمات کلیدی و توضیحات به صفحه اضافه شود. برای تجربه بهتر در دسترس بودن، ویژگی  ALT = “توضیحات تصویر خود ” در هر تگ <IMG> یا <area> تعیین کنید. البته، روش ها و پیشنهادات زیادی در این زمینه وجود دارد که در بهینه سازی سایت آورده شده است.

  • تولید سایت های که نیاز به بارگذاری مجدد (refresh) زیادی دارند

اشتباه: ایجاد سایتی که برای هر تعاملی  نیاز به بارگذاری کامل صفحه دارد.

تاثیر منفی: مشابه با صفحات با حجم بالا (اشتباه شماره ۴)، زمان بارگذاری صفحه وقتی که برای هر تعاملی نیاز به بارگذاری مجدد باشد، تحت تاثیر قرار خواهد گرفت. تجربه کاربر از سایت شما زمان زیاد بارگذاری آن و نیاز آن برای بارگذاریهای مجدد خواهد بود.

چگونگی جلوگیری: یک راه سریع برای جلوگیری از این مشکل، تعیین این موضوع است که ارسال به سرور واقعا مورد نیاز است. به عنوان مثال، اسکریپت های سمت سرویس گیرنده می توانند برای ارائه نتایج فوری، زمانی که هیچ وابستگی به منابع سمت سرور وجود ندارد، استفاده شوند. شما همچنین می توانید از تکنیک های AJAX و یا”SPA”  ( single-page application)  یا کتابخانه های  محبوب جاوا اسکریپت، مانند JQuery, KnockoutJS, and AngularJS. برای حل این مشکل استفاده کنید.

  • کار بیش از حد

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

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

چگونگی اجتناب از این اشتباه: گزینه های موجود را دوباره بررسی کنید واز ابزار های جدید و یا تکنیک های فرآیند جدید برای هر مرحله از توسعه استفاده کنید . به عنوان مثال، ویرایشگر کد فعلی خود را با ویژوال استودیو یا Sublime Text مقایسه کنید؟ شاید صرف وقت اندک برای بررسی ویرایشگر کد سپس باعث صرفه جویی زیاد در زمان خواهد شد. به عنوان مثال، توجه داشته باشید که چگونه ویژوال استودیو می تواند بهره وری برای توسعه دهندگان وب را افزایش می دهد.

ابزارهای موجود در وب به شما کمک خواهد کرد. به عنوان مثال، ابزار dev.modern.ie  تست (در سراسر سیستم عامل های مختلف و دستگاه) و عیب یابی را انجام می دهد.

شما همچنین می توانید زمان و اشتباهات را توسط فرآیندهای خودکار مانند GRUNT کاهش دهید.

امیدوارم بتونیم در طراحی های خودمون از این اشتباهات دوری کنیم .

سایت آموزش برنامه نویسی | آموزش وردپرس | آموزش طراحی سایت

برچسب ها

ممکن است به این موارد نیز علاقه مند باشید:

0 دیدگاه در “اشتباهات رایج در طراحی سایت – بخش دوم”

پاسخ دهید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

کد امنیتی را در کادر زیر بنویسید *