اصول طراحی صفحه اول وب سایت

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

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

چرا باید روی صفحه اصلی وب سایت تمرکز کنم

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

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

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

صفحه اصلی موثر و تاثیر گذار چگونه است

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

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

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

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

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

چه محتوایی باید در صفحه اصلی قرار گیرد

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

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

به بیان خیلی ساد، طراحی صفحه اصلی شما به دو قسمت ذیل تقسیم می شود:

بالای صفحه (above-the-fold): این عبارت به صورت سنتی برای صفحه اول روزنامه استفاده می شود و منظور محتوایی که شما بدون اسکرول کردن در صفحه و پایین آمدن می توانید آن را مشاهده کنید

پایین صفحه (below-the-fold) محتوایی که برای دیدن آن نیاز دارید به سمت پایین اسکرول کنید.

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

چه نوع محتوایی در قسمت بالای صفحه (above the fold) قرار گیرد

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

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

عنوان اصلی

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

عنوان جزئی

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

دکمه Call to Action

یک Call to Action به مشتری جهت می دهد و از او می خواهد که کاری انجام دهد تا به مرحله بعدی برود. از مرسوم ترین call to action ها می توان به "باماتماس بگیرید" یا" کلیک کنید تا به صورت مجانی قیمت رادریافت کنید" باشد.

دکمه call to action را می توان به نشان دهنده جهت در تابلوهای راهنمایی رانندگی تشبیه کرد

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

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

از تصاویر و ویدئو جهت رساندن پیغام استفاده کنید

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

لوگو

لوگوی شما باید به صورت بسیار ظریفی زمینه فعالیت کسب و کار شما را منتقل نماید. لوگو اشاره ای به DNA کسب وکار شماست.

منو

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

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

چه نوع محتوایی در قسمت پایین صفحه (below the fold) قرار گیرد

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

محتوای ثانویه: محتوایی هستند که آنقدر مهم نبودند که در قسمت بالای سایت (above the fold) قرارگیرند، اما از درجه اهمیتی برخوردار هستتند که بازدیدکنندگان را جذب کرده و به مشتری تبدیل کند

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

محتوای ثانویه چیست

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

مزایای محتوای ثانویه

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

سوال اصلی که بازدیدکنندگان شمامی پرسند، این است که چه نفعی به من می رسد؟ چرامن در رستوران شماغذا بخورم؟ چرا شما را به عنوان عکاس خودم استخدام کنم؟ اگر شما به یک وب سایت مراجعه کنید و آنچه که می بینید یک لیست بزرگ از ویژگی ها باشد مانند " ما20 ساندویچ داریم، 15 نوع سالاد، 5 نوع سوپ...." یا "ما به شما 100 عکس برروی یک dvd و یک آلبوم فیزیکی ارائه می دهیم" در نهایت منتهی می شود به اینکه شما یک رستوران دیگر یا کسب وکار عکاسی مبنی بر وب هستید و هیچ چیز بیشتری نسبت به سایر کسب و کارها ندارید که بازدیدکننده از شما بشنود.

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

چگونه اعتماد کاربران را جلب کنیم

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

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

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

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

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

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

2) محتوای اضافی چیست

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

آناتومی 5 طرح موثر برای صفحه اول وب سایت

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

طرح شماره یک

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

طرح شماره دو

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

طرح شماره سه

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

طرح شماره چهار

این طرح بندی مناسب کسب وکارهای خلاق است. (عکاسان، طراحان، هنرمندان، موزیسین ها و تصویرگران)

طرح شماره پنج

این طرح بندی بسیار مناسب کسب وکارهایی است با مزیت بصری خود با بیننده ارتباط برقرار می کنند (رستوران ها، سالن ها و کافه ها)

نتیجه گیری

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