احتمالا با هزار امید و آرزو سایتتون رو ساختید و کلی هم پول براش هزینه کردید و حالا پیش خودتون فکر میکنید که قراره جریان پول و درآمد، خود به خود راه بیفته!
اما این اتفاق نمیافته!
چرا؟ چون توی سایتتون یه سری اشتباهات ریز دارید که شاید حتی کشف اونها خیلی سخت باشه، ولی آسیبشون بیشتر از حد تصوره و باعث میشه کاربرها از سایت فرار کنن!
این اشتباهات، انواع مختلفی دارن و پیدا کردنشون، گاهی اوقات واقعا تخصص میخواد و کار هر کسی نیست.
اما توی این مطلب، سعی میکنم تعداد زیادی از این اشتباهات رایج در طراحی سایت رو براتون لیست کنم تا اگه شما هم دچارش هستید، سریعتر حلش کنید!
این اشتباهات رو توی چندتا دسته تقسیم کردم و به ترتیب، بررسیشون میکنم:
- طراحی و ساخت
- تایپوگرافی و فونت
- اشتباهات محتوایی
- مشکلات مربوط به کاربردپذیری
- اشتباهات در هدایت کاربران
- ایرادات گرافیکی و محتوای بصری
- اشتباهات فنی
اشتباهات رایج در طراحی سایت؛ بخش اول: ایرادات در طراحی و ساخت
-
واکنشگرا نبودن
مهمترین بلایی که میتونه سر سایتتون بیاد، اینه که واکنشگرا یا ریسپانسیو responsive نباشه! قبلا توی مقاله راه های افزایش بازدید سایت، اشاره کرده بودم که تقریبا ۵۲ درصد ترافیک وب در دنیا، از طریق موبایله!
از طرف دیگه، شما نمیدونید کاربر ممکنه با چه وسیلهای به سایتتون سر بزنه: مک بوک یا موبایل سونیاریکسون K310! بنابراین، باید طوری سایت رو طراحی کنید که تا حد امکان، روی همه دستگاهها نمایش خوبی داشته باشه.
سایت هایی که ریسپانسیو هستن، سه نوع مختلف دارن:
- در نوع اول، آدرس (URL) و کدهای HTML سایت توی هر دو نسخه موبایل و دسکتاپ یکیه و فقط از طریق کدهای استایل CSS، واکنشگرا بودن اتفاق میافته.
گفته میشه که این نوع طراحی، مورد علاقه موتور جستجوی گوگل هم هست و به سایتهایی با این ساختار، بیشتر بها میده! - نوع دوم، سایت هایی هستن که آدرس اونها در نسخه دسکتاپ و موبایل یکیه، اما ساختار HTML و CSS اونها متفاوته
- نوع سوم هم اونایی هستن که برای موبایل و دسکتاپ، کلا دو تا نسخه جداگانه دارن!
-
نداشتن فایوآیکن Favicon (آیکون کوچیک کنار اسم سایت در تب مرورگر)
خیلی از کاربرا (از جمله خود من!) معمولا تعداد زیادی پنجره رو توی مرورگرشون باز میکنن و یهویی، به تعداد زیادی سایت سر میزنن.
حالا فرض کنید که کاربر یه بار سایت شما رو باز کرده، و حالا توی تبهایی که توی مرورگرش هست، داره دنبال شما میگرده.
وقتی که Favicon نداشته باشید، کاربر خیلی سختتر میتونه شما رو توی اون شلوغی پیدا کنه و حتی ممکنه قید برگشت به سایت رو بزنه.
علاوه بر این، Favicon بخشی از هویت سایت و برند شماست و نداشتن اون، جزو اشتباهات رایج در طراحی سایت محسوب میشه!
-
نساختن صفحات ۴۰۴ مخصوص
توی یکی از مقالاتی که میخوندم، اسم صفحات ۴۰۴ رو گذاشته بودن قاتل خاموش ترافیک! (silent traffic killer)
حالا ممکنه که کاربر آدرس رو اشتباه وارد کرده باشه، یا اینکه از گوگل، وارد یه صفحهای شده که شما قبلا حذفش کردید، اما هنوز توی نتایج جستجوی گوگل وجود داره!
به این ترتیب، نباید صفحات ۴۰۴ رو به حال خودشون رها کرد، چون خیلی از کاربرا، به محض مواجه شدن با این صفحه، سایتتون رو میبندن و کلا بیخیال شما میشن!
در این موارد، باید با توجه به سیاستهای شرکت یا مجموعهتون، مخاطب رو به جاهای دیگه از سایت هدایت کنید و نذارید که از دستتون فرار کنن، چون ممکنه دیگه هیچوقت برنگردن!
برای طراحی صفحه ۴۰۴، زیبایی بصری و ترغیب کنندهبودن لینکهای موجود در صفحه خیلی خیلی مهمن!
-
استفاده از اسلایدرهای متحرک در صفحه اول!
اسلایدرهای متحرک، یه چاقوی دوکاره محسوب میشن. یعنی هم میتونن سایت شما رو بکشن، هم میتونن براتون یه سلاح خوب باشن! بستگی به این داره که چجوری ازشون استفاده کنید.
اما سعی کنید حداقل توی صفحه اصلی، اسلایدرهای متحرک نداشته باشید.
کوری بنری، اینطوریه که چشم کاربرا، یه بخشایی از سایت رو کلا نمیبینه و به صورت خودکار، اونا رو نادیده میگیره، مثل بخشای تبلیغات!
به این ترتیب، چون اسلایدرهای متحرک هم یه جورایی شبیه بنرهای تبلیغاتی هستن، چشم کاربرها از اونا بدون توجه عبور میکنه و پیام شما نادیده گرفته میشه!
به این ترتیب، استفاده از این نوع اسلایدرها، که دزد توجه هستن، یکی از اشتباهات رایج در طراحی سایت محسوب میشه و بهتره ازش دوری کنید.
-
کند بودن سایت
حتی اگه “آهنگ جدید هایده در سال ۹۸” رو هم توی سایتتون داشته باشید، بازهم کسی زیاد منتظر بالا اومدن سایت شما نمیمونه!
همیشه گزینههای دیگهای برای کاربر وجود داره که در صورت کند بودن سایت شما، سراغ اونها میرن!
بنابراین، باید خیلی مراقب باشید که سایتتون سریع بالا بیاد. قبلا توی مقاله سریعترین روشهای بالا بردن بازدید سایت، در مورد اینکه چجوری سرعت رو آنالیز کنید و اونو بالا ببرید، نکاتی رو نوشتم که بدردتون میخوره.
اما بعنوان توضیحات تکمیلی، باید بگم که برای گوگل، سرعت سایت شما خیلی مهمه و این فاکتورها رو برای امتیازدهی در نظر میگیره:
سرعت اولین بایت اطلاعات: زمانی که یه آدرس URL رو در مرورگرتون وارد میکنید، یه درخواست برای سرور ارسال میشه تا اطلاعات اون صفحه رو براتون بفرسته. هر چقدر که پاسخ به درخواست شما سریعتر باشه، یعنی ادامه پیج هم سریعتر لود میشه!
- شروع به نمایش و رندر Render: کدها توسط مرورگر دریافت میشه و شروع به ساختن ظاهر سایت میکنه. این زمان، کاربر میبینه که یه اتفاقاتی رو صفحه نمایش داره میافته که خبر از لود شدن سایت میده.
- کامل شدن از لحاظ بصری: در این زمان، سایت کامل لود شده، کاربر میتونه اونو کامل ببینه و تقریبا همه چی در دسترسه.
- کامل بارگذاری شدن اسناد صفحه Documents: درسته که کاربر میتونه سایت رو کامل ببینه، اما هنوز یه سری فایلها در پشتصحنه سایت دارن بارگزاری میشن. زمانی که از سرعت بالا اومدن یه سایت صحبت میکنیم، باید این زمان رو هم در نظر بگیریم.
- تعداد درخواستها برای بارگذاری فایلهای مختلف: وقتی یه سایت در حال لود شدنه، درخواستهای متعددی برای سرور میفرسته تا فایلهای مختلف مثل استایل CSS، جاوااسکریپیت و تصاویر رو دریافت کنه. هرچقدر تعداد این درخواستها بیشتر باشه، سرعت بارگذاری سایت پایینتر میاد.
-
پایین بودن سرعت پاسخگویی سرور
فرض کنید که کلی وقت گذاشتید و سرعت بارگذاری سایتتون رو بالا بردید و ایراداتش رو رفع کردید. اما اینجا یه مشکل دیگه هست: سرعت سروری که سایت شما روی اونه، پایینه!
این یعنی خانه از پایبست ویران است!
در این مواقع، یا باید شرکتی که ازش هاست Host خریدین رو عوض کنید، یا اینکه به پشتیبانی اون شرکت زنگ بزنید و ازشون بخواین یه فکری به حالتون بکنن. کار دیگهای از دستتون برنمیاد!
-
سایت شما مثل بقیه سایتها کار نمیکنه!
خاص بودن، به نظر ماها چیز جذابیه و همیشه فکر میکنیم که نباید شبیه بقیه باشیم، در حالیکه این قاعده درمورد طراحی سایت، چندان درست نیست.
معنی حرفم اینه که وبسایت شما، باید بخشهای مختلفی که یه سایت معمولی داره رو داشته باشه: مثل نوار پیمایش Navigation Bar و فیلد جستجو!
اگه مخاطبین شما، برای استفاده از سایت دچار چالش بشن، احتمالش زیاده که کلا شما رو ترک کنن.
معمولا کسی حوصله نداره برای خوندن یه مطلب یا خرید یه کالا، معما حل کنه و درگیر چالش بشه! خرید و دسترسی، باید تا حد ممکن ساده و شبیه بقیه سایت های پرطرفدار باشه.
اشتباهات رایج طراحی سایت؛ بخش دوم: تایپوگرافی و فونت
-
استفاده از فونت ناخوانا
یکی دیگه از اشتباهات رایج در طراحی سایت، استفاده از فونت بده!
حتی مواردی رو دیدم که شرکتی، هزینه زیادی رو برای سایتش صرف کرده و واقعا هم طراحی قشنگی رو تحویل گرفته، اما کل سایت فونت بدی داره (توی یکی از مثالایی که دیدم، فونت سایت Tahoma بود!)
مهم نیست که طراحی شما چقدر از لحاظ گرافیکی یا فنی خوبه، اگه فونت خوبی نداشته باشید، بازی رو حتی قبل از شروع باختین.
همونطور که قبلا هم اشاره کردم، همه چیز برای کاربر باید تا حد امکان ساده باشه و مخاطب برای خوندن متونی که توی سایته دچار چالش و دردسر بشه، چون به راحتی پنجره مرورگر رو میبنده!
خود من برای سایت اکتااسکریپت، فونت وزیر رو استفاده میکنم که هم زیباست و هم رایگان!
گزینه خوب بعدی هم فونت ایران سنس هست که ظاهر فوقالعادهای داره و برای استفاده باید هزینهش رو پرداخت کنید و به نظر من ارزش هزینه کردن رو داره.
-
توجه نکردن به فاصلهها
فرض کنید که بهترین فونت موجود رو برای سایتتون فعال کردید. اما وقتی که فاصلهها رعایت نشه، باز هم فایدهای نداره.
وقتی داریم از فاصلهها صحبت میکنیم، منظورمون اینه:
- فاصله بین کلمات: هر کلمه، با کلمات قبل و بعدش، باید یک فاصله منطقی داشته باشه.
- فاصله بین حروف: اگه فاصله بین حروف، کم یا زیاد باشه، خوندن متون خیلی سخت میشه
- فاصله بین خطوط: مهمترین چالش برای سایتهای مختلف همینجاست. دو مورد قبلی، معمولا به طور پیشفرض توسط طراح فونت حل شدن، اما مورد سوم، کاملا بستگی به دقت طراح سایت داره. فاصله کم بین خطوط در یک صفحه وب، باعث میشه که کاربر از خوندن مطلب خسته بشه و خیلی زود از سایت خارج بشه.
-
استفاده از فونت های متعدد
استفاده از چند فونت، یکی دیگه از اشتباهات رایج در طراحی سایت محسوب میشه. اینکار، حواس مخاطب رو پرت میکنه و باعث به هم خوردن تمرکزش میشه. به این ترتیب، دیگه نمیتونه پیامی که میخواین بهش منتقل کنید رو به خوبی متوجه بشه.
به این ترتیب، خودتون با دست خودتون، حواس کاربر رو پرت کردید و ازش خواستین که بهتون توجه نکنه!
توی بخش طراحی، همیشه میگن که نباید بذارید مطالب در یک صفحه دچار یکنواختی بشه و باید بهش تنوع بدید. اما ایجاد تنوع به وسیله تغییر مداوم فونت، ایده خوبی نیست و ضررش، بیشتر از منفعتشه!
تا اینجای کار، دو مورد از ۶ مورد اشتباهات رایج در طراحی سایت رو بررسی کردیم و برای اینکه متن خیلی طولانی نشه، باقی موارد رو در قسمت دوم این مجموعه مینویسم.
آخرین دیدگاهها