بیست نمونه از بهترین طراحی صفحه اصلی وب سایت ها-قسمت دوم

الگوهای طراحی وب سایت: ۲۰ نمونه از بهترین طراحی صفحه اصلی وب سایت ها

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

۱- Fresh Books

بهترین نمونه های صفحه اصلی

چرا عالی است؟

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

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

♦ عنوانی که در دکمه کال تو اکشن نوشته شده است”رایگان شروع کنید” بسیار متقاعد کننده است.

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

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

۲- Airbnb

 بهترین نمونه های صفحه اصلی

چرا عالی است؟

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

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

♦ کال تو اکشن اولیه (“search”) با رنگ پس زمینه سایت کنتراست ایجاد کرده است که آن را برجسته می سازد؛ اما دومین کال تو اکشن برای میزبان ها (hosts) نیز دربالای وب سایت به چشم می خورد

♦ پیشنهادهای گشت و گذار و بیرون رفتن ها را، در همین سایت ارائه می کند و کاربران می توانند از انتخاب خود در سایت هیجان زده شوند. همچنین به کاربران نشان می دهد کدامیک از پیشنهادات بین بقیه کاربران سایت محبوب تر بوده است.

۳- Mint

بهترین نمونه های صفحه اصلی

چرا عالی است؟

♦ طراحی بسیار ساده، به همراه تیتر و زیر تیترهای قدرتمند و بدون کلمات قلمبه سلمبه است.

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

♦ حاوی کال تو اکشن ساده، مستقیم و متقاعد کننده ی “رایگان ثبت نام کنید” می باشد. همچنین طراحی خود دکمه کال تو اکشن با قرار گرفتن آیکن قفل امنیتی سبب شده تا پیام امنیت مجدداً به کاربر مخابره گردد.

۴- (Dropbox (Business

بهترین نمونه های صفحه اصلی

چرا عالی است؟

♦ دراپ باکس طراحی ساده و برند خود را از جایی به جای دیگر انتقال می دهد. این صفحه فقط حاوی موارد مهم می باشد: یک تصویر بزرگ مرتبط به همراه عنوان و تیتر حمایتی و دکمه کال تو اکشن “تست ۳۰ روزه رایگان”

♦ صفحه اصلی دراپ باکس و وب سایت آن نمونه ای در نهایت سادگی به شمار می روند. در استفاده از تیتر و آیتم های بصری محدود شده و فضای سفید را در آغوش کشیده است.

♦ زیر تیتر آن ساده است و در عین حال قدرتمند:”راه حل امن برای انتشار فایل و ذخیره آن که کارمندان و ادمین های آی تی به آن اعتماد دارند.”

۵-  ۴Rivers Smokehouse

بهترین نمونه های صفحه اصلی

چرا عالی است؟

♦ دهن شما رو آب میندازد! این چیزی است که وقتی به این سایت رسیدم به ذهنم رسید.ترکیبی از عکس های عالی و تیتر “گوشت سینه.از ۱۸ سالگی تا پیری.چشیدنش مال شماست”.انگار صدایی به شما میگه که ارزش امتحان کردن داره.

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

♦ تنها نقطه منفی؟به اندازه کافی به محل آن ها نزدیک نیستم!

۶-  Cobb Pediatric Therapy Services

بهترین نمونه های صفحه اصلی

چرا عالی است؟

♦ تیتر و زیر تیتر بخش عاطفی بازدید کنندگان رو جذب خود می کند: “با شرکتی کار کنید که آن ها را می فهمد”؛ “به ما اعتماد کنید. ما آنجا هم خواهیم بود! ما شغل هایی پیدا می کنیم که شما بتوانید موفق به انجامش بشوید.” ارزش پیشنهاد شده منحصر به فرد و متقاعد کننده می باشد.

♦ به وسیله تصویر بالا شاید کمی سخت باشد توضیح داد اما تیتر نوشته شده روی اسلایدهای متحرک، هر کدام برای اشخاص خاص مدنظر از متقاضی کار تا مردمی که دنبال یک درمانگر برای مدارسشان میگردند، تهیه شده است.

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

۷-Jill Konrath

بهترین نمونه های صفحه اصلی

چرا عالی است؟

♦ ساده و مستقیم اشاره به هدف میکند. با توجه به تیتر و زیر تیتر کاملاً واضح است که دقیقاً خانم جیل کنراث چه کاری انجام می دهد (و چگونه او می تواند به کسب و کار شما کمک کند).

♦ همچنین دسترسی راحتی برای مشاهده افکار و نظرات رهبری او (که بسیار در اعتبار او به عنوان سخنران اصلی مهم است) در سایت قرار داده شده است.

♦ عضویت در خبرنامه بسیار راحت صورت می پذیرد و تماس با او دومین کال تو اکشن مورد استفاده در سایت می باشد.

♦ صفحه کال تو اکشن عضویت در خبرنامه که به صورت pop up (صفحه در صفحه) باز می شود از گواهی جامعه هزاران نفری اعضای سایت برای جلب نظر شما و پیوستن به آن ها استفاده می کند.

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

۸-  Evernote

چرا عالی است؟

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

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

♦ دنبال کردن تیتر ساده “همه چیز را به یاد آورید” در مسیر دنبال کردن چشمی شما را ناخودآگاه به کال تو اکشن ” رایگان ثبت نام کنید” می رساند.

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

۹-  Telerik by Progress

چرا عالی است؟

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

♦ من سادگی و نشان دادن سریع شش محصول آن ها را دوست دارم.این راه بسیار ساده ای است که که شرکت چه کاری انجام می دهد و چگونه مردم می توانند بیشتر درباره شان بدانند.

♦ عنوان سبک و ساده ای برای خواندن انتخاب شده است. با زبان خود مشتریان با آن ها حرف میزند.

۱۰- ewedding

چرا عالی است؟

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

♦ زیر تیتر ” بیش از ۸۰۰٫۰۰۰ وب سایت عروسی تا حالا ساخته شده” یک تایید اجتماعی بزرگ محسوب می شود.

♦ شامل تصاویر گرافیک عالی از محصول، تیتر خوب و کال تو اکشنی است که با عنوان آن (“وب سایت را شروع کنید”) اختلاف کمی دارد.

۱۱-Basecamp

بهترین نمونه های صفحه اصلی

چرا عالی است؟

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

♦ کال تو اکشن بزرگنمایی شده و در بالای بخش هدر سایت قرار دارد.

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

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

۱۲-      charity: water

چرا عالی است؟

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

♦ تصویر متحرک هدر آن راه عالی برای جلب توجه می باشد

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

۱۲- TechValidate

چرا عالی است؟

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

♦ تیتر واضح و متقاعد کننده ای مانند کال تو اکشن آن استفاده شده است.

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

۱۳-Chipotle

بهترین نمونه های صفحه اصلی

چرا عالی است؟

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

♦ عکاسی غذا زیبا و با جزییات و نگاه کردن به آن واقعاً مرا گرسنه می کند. این یک روش موثر استفاده از تصاویر در سایت است.

۱۴- Medium

چرا عالی است؟

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

♦ مدیوم ثبت نام را راحت نموده است. روی سایت یا با یک پیامک ساده که موبایل شما ارسال می کند. من خیلی با پیامک راحت ترم تا با ایمیل چراکه این استراتژی عالی برای درگیر سازی بازدید کننده با مرحله ثبت نام می باشد.

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

۱۵- Digiday

چرا عالی است؟

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

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

۱۶- KIND Snacks

بهترین نمونه های صفحه اصلی

چرا عالی است؟

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

♦ کال تو اکشن “کایند® بخرید” هوشمندانه است. بازدیدکننده را وادار به کلیک برای دانستن بیشتر درباره آن می کند در حالی که با کلمه کایند در ذهن خود بازی میکند.بکارگیری آن انتخاب خوبی برای خرید از ان جاست.

♦ شعار کایند عالی به نظر می رسد به طوری  که وقتی آن را می خوانم پیام مستقیماً در ذهنم طنین انداز می شود و کاری می کند که میخواهم برچسب های اسنک بارها را بخوانم.

۱۷- Ahrefs

چرا عالی است؟

♦ تضاد رنگی بین آبی، سفید و نارنجی چشمگیر می باشد و سرتیتر و کال تو اکشن را برجسته ساخته است.

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

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

۱۸- A24 Films

چرا عالی است؟

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

♦ در بالای صفحه اصلی آ۲۴ راه های فراوانی برای در تماس بودن با شما از جمله از طریق شبکه های اجتماعی و ایمیل پیشنهاد می دهد؛ چیزی که برای من به عنوان یک بازدید کننده قابل تحسین است وقتی که دیگر سایت ها اطلاعات تماس را در انتهای صفحه دفن می کنند.

۱۹-Ellevest

چرا عالی است؟

♦ “مثل یک خانم سرمایه گذاری کنید: بخاطر اینکه پول برابر با قدرت است”.این تیترها قدرتمندند و من (نگارنده مقاله) میخواهم که بیشتر درباره محصول آن ها بدانم.هم به عنوان یک خانم و هم شخصی که به انخاب های مالی هوشمند علاقمند است.

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

♦ “شروع کنید” یک کال تو اکشن فوق العاده است.در حقیقت، ما اینجا (در هاب اسپات) از آن استفاده می کنیم.وقتی دیده شود، بازدید کننده را به چندگام ساده و کوتاه برای تنظیم پروفایل و شروع سرمایه گذاری می برد.

۲۰- HubSpot

چرا عالی است؟

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

♦ یک کال تو اکشن دیگر که به چشم می آید هم در آن هست (“شروع کنید”) به همراه یک عنوان ریز که که جزییات نحوه استفاده کاربران از نسخه رایگان را و امکان استفاده از به روز رسانی حسابشان در آینده را برای آن ها توضیح می دهد

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

درباره این صفحات اصلی که معرفی شد چه فکری می کنید؟ کدام یک مورد علاقه تان بود؟ با ما در میان بگذارید.

منبع: Hubspot

خواندن این مقالات نیز به شما پیشنهاد می شود.

بیست نمونه از بهترین طراحی صفحه اصلی وب سایت ها-قسمت اول

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

۱۴ / تیر / ۱۳۹۶
بدون دیدگاه

آیا می خواهید بدانید چه کسانی از وب سایت شما بازدید می کنند؟

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

۱۴ / تیر / ۱۳۹۶
بدون دیدگاه

وب سایت چیست؟ انواع وب سایت ها کدامند؟

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

۱۴ / تیر / ۱۳۹۶
بدون دیدگاه

دیدگاه ها

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

*
*