43 web design mistakes

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

زمان مطالعه 8 دقیقه
43 اشتباهات رایج در طراحی سایت

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

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

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

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

محتوای قابل اسکن

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

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

فونت های عجیب و غیرقابل خواندن

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

استفاده از فونت های کوچک

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

باز کردن لینک ها در صفحه جدید

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

تغییر سایز پنجره مرورگر کاربر

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

تا زمان الزام، دوری از ثبت نام کاربر

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

عدم ثبت نام کاربر بدون رضایت

هیچ وقت، زمانی که کاربر در سایت ثبت نام کرد، به طور خودکار برای او خبرنامه نفرستید. فرستادن ایمیل هایی ناخواسته، روش خوبی برای دوست شدن با کاربران نیست.

استفاده از فلش

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

پخش موسیقی

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

شروع ویدیو و فایل صوتی با انتخاب کاربر

فرض کنید شما باید برای کاربر سخنرانی کرده یا با استفاده از فایل صوتی او را هدایت کنید. این مسئله مشکلی ندارد. تنها مطمئن شوید که کاربر کنترل امور را در دست دارد. بگذارید او کلید پخش”play” را دست داشته باشد. شما نباید موسیقی را سریعا پس از ورود به صفحه به سمت او پرتاب کنید.

نمایش تصاویر نشانها در صفحات

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

استفاده از ساختارهای پیچیده در صفحه اصلی

هر چه مراحل کمتری برای دسترسی به محتوا برای کاربر وجود داشته باشد، بهتر است.

جزییات ناکافی تماس با ما

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

دکمه کلیدی بازگشت برای کاربر (back)

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

از متون چشمک زن (blinking)

مگر اینکه کاربر شما به سال 1385 در زمان سفرکرده باشد .

ساختارهای URL پیچیده

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

ترجیخ CSS نسبت به جداول HTML

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

مطمئن شوید که کاربر می تواند کل وب سایت را بگردد

به همین دلیل است که موتورهای جستجو باعث ایجاد تحول در اینترنت شده اند. احتمالاً حدس زده اید دلیل چیست؟ بلی به خاطر اینکه باعث می شود کاربر راحت تر اطلاعاتی را که بدنبالش می گردد پیدا کند. این مسئله را در سایت خود نادیده نگیرید. 

خودداری از منوهای دراپ داون

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

سیستم ناوبری متنی

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

لینک فایل pdf

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

ورژن های متفاوت، گیج کردن بازدیدکننده

سعی نکنید بازدیدکننده را با ایجاد ورژن های بسیار متفاوت از سایت گیج کنید.

ترکیب تبلیغات با محتوا

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

ساختار ساده ناوبری

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

خودداری از intro اینترو معرفی ها

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

استفاده از Frontpage

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

نمایش مشابه در همه مرورگرها

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

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

من اعتراف می کنم که این اشتباه را تا چند وقت پیش بسیار تکرار می کردم. استفاده از عبارت “click here (اینجا کلیک کنید)” بسیار ساده است، اما کافی نیست. مطمئن شوید که متن های انکور مرتبط را در لینک خود قرار می دهید. این کار به خواننده اطمینان می دهد که مقصد نهایی این لینک چیست و فواید سئو نیز برای سایت های خارجی (مقصد لینک) به همراه دارد.

پنهان سازی لینک ها

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

لینکها باید قابل مشاهده باشند

بازدیدکننده باید بفهمد کدام لینک ها قابل کلیک کردن بوده و کدام این طور نیستند. مطمئن شوید که لینک ها رنگی متضاد با سایر متن ها دارند ( رنگ آبی استاندارد در اکثر اوقات بهتر است). می توانید در زیر لینک ها خط نیز بکشید.

رنگی کردن متن و زیرخط لینک ها

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

هاور و اکیتو لینک ها

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

گیف و تصاویر متحرک

مگر اینکه بنرهای تبلیغاتی به انیمیشن نیاز داشته باشند. این GIF ها باعث غیر حرفه ای جلوه کردن سایت شده و توجه افراد به محتوا را کم می کنند.

تگ آلت تصاویر

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

استفاده از رنگ های شارپ

اگر کاربر بعد از مشاهده سایت شما به مدت 10 دقیقه سر درد می گیرد، احتمالا شمای رنگی سایت شما مناسب نیست. رنگ بندی شما باید هدفمند باشد (یعنی یک حالت روحی ایجاد کرده و باعث شود کاربر بر محتوا تمرکز کند.)

استفاده از پاپ آپ

این نکته در تمام پاپ آپ ها صدق می کند. حتی پاپ هایی که بعد از تأییدیه کاربر بروز می کنند نیز ایده بدی هستند و باعث تخریب اعتبار سایت می شوند.

استفاده از لینک های جاوااسکریپت

وقتی کاربر روی این لینک ها کلیک می کند، لینک ها مقدار کمی جاوا اسکریپت را اجرا می کنند. از این لینک ها دوری کنید زیرا معمولا باعث بروز مشکلات برای کاربر می شوند.

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

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

خودداری از صفحات طولانی

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

خودداری از اسکرول افقی صفحه

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

اشتباهات املایی و انشایی

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

کپچا واضح

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

دیدگاه شما چیست؟