طراحی وب سایت یک کار کاملا تخصصی است. اگر تصمیم دارید بدون داشتن دانش و تخصص کافی وب سایتی طراحی کنید، حتما باید از یک طراح سایت حرفه‌ای مشورت بگیرید و یا این کار را به کمک یک سایت ساز حرفه‌ای انجام دهید تا نتیجه مطلوب برای شما حاصل شود. به عنوان مثال طراحی هدر وب سایت را در نظر بگیرید.
حتما تا به حال اسم هدر وب سایت به گوشتان خورده و دیده‌اید که همه سایت‌ها این بخش را در بالاترین قسمت صفحه خود دارند. اما آیا از اهمیت این قسمت از معماری سایت باخبر هستید؟!
ساخت هدر فراتر از آنچه تصور میکنید تخصصی و حائز اهمیت است. هنگام طراحی وب سایت همواره به خاطر داشته باشید که هدر اولین چیزی است که بازدیدکنندگان به محض ورود به صفحه اصلی شما با آن روبرو می‌شوند.
درست مانند همه قسمت‌های دیگر سایتتان پشت طرح هدر باید تفکر استراتژیک و خلاقانه‌ای وجود داشته باشد تا به خوبی بتواند تصویر برند منحصر به فردتان را به دیگران نشان دهد.
فرقی نمی‌کند که تازه می‌خواهید وب سایت خود را طراحی کنید و یا اینکه قصد دارید تا در طرح قبلی سایت خود تغییراتی به وجود آورید، سیتی سایت در این مقاله به شما یاد خواهد داد که چگونه می‌توانید با کمک یکی از روش‌ها، مناسب‌ترین هدر را برای وب سایت خود ایجاد کنید.
هدر سایت چیست؟
همانطور که از نامش پیداست هدر به قسمت بالای صفحه وب سایت اشاره دارد. این قسمت شامل نواری است که مستقیماً به بالا صفحه پین میشود و بدین ترتیب به طور مداوم در هر صفحه از سایت شما نشان داده میشود.
به غیر از زمانی که از صفحه اسپلش استفاده میکنید، هدر سایت اولین چیزی است که کاربران در سایت شما مشاهده می‌کنند.
هدف اصلی یک هدر، ارائه خلاصه‌ای از محتواهای اصلی وب سایت به بازدیدکنندگان و دعوت از آنها برای مشاهده مطالب بیشتر می‌باشد.
عملکرد این بخش از سایت به عنوان یک ابزار ناوبری از اهمیت زیادی برخوردار است. برای بازدیدکنندگانی که از یک صفحه به صفحه دیگر سایت می‌روند، هدر می‌تواند راهنمایی باشد برای پیدا کردن مسیر درست.
این بخش از سایت نقش تعیین کننده‌ای در مشخص کردن بخش‌های دیگر سایت ایفا می‌کند و جای تعجب نیست که طراحان وب سایت بر زیباسازی آن تاکید زیادی می‌کنند.
در نتیجه چیزی که در طراحی هدر باید در نظر گرفت، نحوه نمایش آن در یک وب سایت است.
چه مواردی را باید در هدر وب سایت قرار دهید؟
هدر وب سایت با وجود اینکه فضای زیادی را اشغال نمی‌کنند، قسمت مهمی‌از طراحی سایت شما را شامل میشود.
این خود شما هستید که تصمیم می‌گیرید چه عناصری را در آن قسمت کوچک و البته ارزشمند قرار دهید.
اما به این نکته توجه کنید که هدف اصلیتان افزایش تعامل بازدیدکنندگان با سایت باشد. بنابراین هنگامی که انتخاب میکنید چه مواردی را در هدر قرار دهید، در حقیقت آن بخش از وب سایت خود را که می‌خواهید بیشتر از بقیه قسمت‌ها دیده شود برجسته می‌سازید.
پس این فضای کوچک باید کاربران را به مطالعه آن بخش دعوت کند.
در این مقاله سیتی سایت به محبوبترین عناصر موجود در هدر صفحه سایت اشاره خواهیم کرد. گرچه لازم نیست همه این موارد را به طراحی هدر وب سایت خود اضافه کنید.
نام تجاری
به زبان ساده‌تر اگر بخواهیم بگوییم، درج نام تجاری یک روش خوب است که به بازدیدکنندگان کمک می‌کند تا بفهمند به مقصد صحیحی رسیده‌اند.
وجود نام تجاری شما در بالای وب سایتتان می‌تواند هویت برندتان را تقویت سازد.
به عبارت دیگر وجود نام تجاریتان در بالای سایت ارزشی افزوده است که هویت برند شما را برجسته‌تر می‌کند.
لوگو
ایجاد لوگو یا آرم تجاری یک نیاز اساسی برای هر کسب و کار کوچکی به حساب می‌آید که به مخاطبان نمادی را نشان می‌دهد که از این پس قرار است شما را با آن بشناسند.
مهم نیست که به کدام صنعت تعلق دارید و کسب و کارتان چیست، لوگوی شما قسمت مهمی از دارایی‌های مارکتینگ شما به حساب می‌آید.
افزودن لوگو برندتان به هدر وب سایت، روش عالی دیگری برای تقویت هویت نام تجاری شما است.
اگر می‌خواهید بدانید که لوگوی خود را دقیقاً در کجای سایت قرار دهید، باید بگوییم که هیچ روش استانداردی برای این منظور وجود ندارد.
بسیاری از طراحان وب سایت آن را در مرکز هدر و برخی دیگر آن را در کنار سایت قرار می‌دهند.
یک مطالعه جالب نشان داده است که کاربران با دیدن لوگو در سمت چپ هدر یک وب سایت، احتمال بیشتری دارد که آن برند را به خاطر بسپارند.
بنابراین بهتر است به جای اینکه پیرو نظر شخصی خود باشید، با توجه به نظرات طراحان و متخصصان با تجربه این حوزه تصمیم بگیرید که لوگو خود را در کدام نقطه از سایت قرار دهید.
نکته مهمی که می‌بایست به آن توجه کنید این است که اگر نگران بزرگ بودن لوگوی خود برای فضای کوچک هدرتان هستید، می‌توانید یک لوگوی متغیر ایجاد کنید که نسخه ساده تر و کوچکتری از لوگو اصلیتان باشد.
منوی ناوبری
هدر سایت به عنوان یک مکان پیش فرض برای قرار دادن منوی ناوبری سایت شما در نظر گرفته میشود.
به عبارت دیگر منو ناوبری فهرستی از صفحات وب سایت شماست (مانند صفحه درباره ما) که هر یک از گزینه‌هایش به آن صفحه مورد نظر پیوند داده شده و مخاطب با کلیک بر روی آن به مقصد دلخواهش می‌رسید.
قرار دادن یک منو در هدر وب سایت تصمیمی منطقی است که به بازدیدکنندگان امکان پیمایش مستقیم در قسمت‌های مختلف وب سایتتان را می‌دهد و باعث بهبود تجربه کاربریشان می شود.
سبد خرید
قبل از اینکه هدر سایتتان را طراحی کنید باید این موضوع را مشخص کنید که قصد دارید کاربر به کدام قسمت سایت و به انجام چه اقدامی باید هدایت شود.
اگر وب سایت شما یک فروشگاه آنلاین است، افزودن سبد خرید به هدر وب سایت، روند تسویه حساب خریدار شما را ساده کرده و تجربه کاربری را برای او بهبود می‌ببخشد. زمانی که کاربران به گشت و گذار و افزودن موارد به سبد خرید خود ادامه می‌دهند، ایکون سبد خرید باید همه جا به عنوان یک مکان قابل پرداخت و قابل شناسایی در دسترس باشد.
نوار جستجو
افزودن یک نوار جستجو در هدر سایت می‌تواند برای شما یک نقطه قوت به حساب بیاید.
نوار جستجو به کاربران این امکان را می‌دهد که جستجو در سایت شما را انجام دهند.
این قسمت یک ابزار ویژه هوشمندانه برای افزودن به وبلاگ می‌باشد. چراکه به کاربران کمک می‌کند پست‌های مربوط به موضوعات مورد علاقه خود را جستجو کنند.
اگر می‌خواهید عنصری مانند نوار جستجو را به وب سایت خود اضافه کنید، بهتر است آن را در هدر وب سایت خود قرار دهید.
این کار باعث میشود تا بازدیدکنندگان هرگز آن را از دست ندهند و احتمالاً از دسترسی آسان به نوار جستجو در بالای صفحه شما قدردان خواهند بود.
لاگین
معمولاً یک وب سایت برای ورود کاربرانی که قبلا عضو آن شده‌اند، به دکمه لاگین نیاز دارد. توجه داشته باشید که کاربران این حق را دارند تا از برخی اطلاعات شخصی خود که نمی‌خواهد در معرض عموم قرار بگیرد محافظت کنند و این وظیفه شماست که این امکان را در سایت خود برای آنها فراهم کنید. همچنین بد نیست که برخی از اطلاعات و محصولاتتان انحصاری باشد و فقط برای اعضا نمایش داده شود.
اعضا سایت خواه هزینه اشتراک را پرداخت كنند یا نه، برای داشتن دسترسی، باید مجوزهای لازم را از طرف شما دریافت کرده باشند.
بنابراین، کاربران باید مکان مشخصی برای ورود به سیستم داشته باشند و بهترین مکان برای نشان دادن لاگین، هدر صفحه اصلی شما می‌باشد که همه می‌توانند آن را به راحتی پیدا کنند.
لینک‌های شبکه‌های اجتماعی
مگر کسی هم پیدا میشود که دوست نداشته باشد فالوور‌های بیشتری در شبکه‌های اجتماعی داشته باشد؟ افزودن آیکون‌های شبکه‌های اجتماعی به یک وب سایت راه خوبی برای افزایش فالوورها می‌باشد.
لینک دادن شبکه‌های اجتماعی به کانالهای دلخواه شما، باعث تبدیل بازدیدکنندگان وب سایتتان به فالوور و لایک کردن مطالب توسط آنها میشود.
معمولاً لینک‌های شبکه‌های اجتماعی در طراحی هدر یا پاورقی وب سایت گنجانده می‌شوند.
قرار دادن این لینک‌ها در بالای وب سایت شما قطعاً باعث میشود سریعتر توسط کاربران دیده شوند.
با این حال، اگر فضا در طراحی هدر شما دارای محدودیت است، برای قرار دادن آنها در اینجا استرس نداشته باشید.
بیشتر کاربران می‌دانند که آیکون‌های شبکه‌های اجتماعی در پاورقی یک وب سایت نیز نشان داده میشود و احتمالاً آنها را در آنجا هم بررسی خواهند کرد.
زبان‌ها
این نکته که مطالب وب سایت شما به چند زبان مختلف قابل خوانده شدن و فهمیده شدن باشند موضوع حائز اهمیتی است.
شاید ایجاد یک وب سایت چند زبانه تلاش بلند پروازانه‌ای به نظرتان بیاید، اما اگر منابع لازم را داشته باشید، این نوع عملکرد به طور قابل توجهی باعث رشد مخاطبانتان میشود و شما را قادر می‌سازد تا محتوای لوکال خود را به طور گسترده‌تر و حرفه‌ای تر انتشار دهید.
پس از کامل شدن ترجمه‌ها و بارگذاری محتوا، وظیفه بعدی شما این است که مطمئن شوید بازدیدکنندگان بین المللی می‌توانند به زبان مورد نظر خود به محتوایتان دسترسی داشته باشند.
افزودن منوی زبان به هدر سایت بهترین راه برای نشان دادن گزینه‌های بیشتر زبان است.
بهترین روش ها برای طراحی هدر وب سایت
اگر منوی پیمایش افقی قدیمی سایتتان وفادارانه به اهدافتان عمل می‌کند و جذابیت لازم را هم دارد دیگر نیازی نیست تغییر خاصی به آن بدهید.
اما بد هم نیست که به جز منوی افقی که بسیار مرسوم است به سبک‌های دیگر طراحی آن نیز فکر کنید.
طراحی هدر وب سایت نیازمند فکر و تلاش زیادی می‌باشد. به خصوص اینکه لازم است برای گنجاندن اطلاعات در یک فضای محدود به دنبال راه‌های هوشمندانه مختلفی باشید.
از فونت‌های واضح و خوانا استفاده کنید
از آنجا که هدر در بالای صفحه شما قرار دارد و از جمله مهمترین المان‌های اطلاعاتی وب سایت شما محسوب میشود، باید تا جای ممکن خوانا باشد.
وقتی هدر خود را ایجاد میکنید، یک فونت مناسب برای آن انتخاب کنید که نمایانگر هویت برند شما باشد و از آن مهمتر توجه کنید که حتما خوانایی لازم را داشته باشد.
از آنجا که متن شما برای راهنمایی مخاطبان تولید شده است، در صورت خوانا نبودن توجه مخاطب را از دست می‌دهد و شما هرگز به هدف اصلی خود دست نخواهید یافت.
هدر باید طراحی سازگار داشته باشد
با وجود اینکه اندازه، رنگ یا حتی شکل استانداردی برای هدر یک وب سایت وجود ندارد، این نکته را باید در نظر بگیرید که هدرتان باید حتما از تعادل، بیان واضح، ظرافت و در عین حال منسجم بودن برخوردار باشد.
به عبارت دیگر، هرگز نباید در هنگام طراحی به هدر به چشم یک عنصر جداگانه نگاه کنید، بلکه باید آن را در قالب یک جزء مهم از کلیت ظاهری سایت خود در نظر بگیرید و به همخوانی و تناسب آن با کلیت سایت اهمیت دهید.
برای اینکه یک هدر مناسب و جذاب طراحی کنید، خوب است تا از قوانین ساخت آن پیروی کنید.
به عنوان مثال، سعی کنید اندازه هدرتان با نوع تجربه کاربری که برای سایتتان در نظر گرفته‌اید، تداخلی نداشته باشد.
همچنین، عناصر بصری که در آن به کار می‌برید، مانند پالت رنگ و فونت‌ها را با بقیه قسمت‌های وب سایت خود مطابقت دهید تا همخوانی لازم را داشته باشد.
کال تو اکشن مناسب ایجاد کنید
اگر برایتان موفقیت شغلی مهم است، باید در هدر خود یک دکمه کال تو اکشن تاثیرگذار و جذاب قرار دهید. در غیر این صورت شانس موفقیت شما کاهش پیدا می‌کند.
به عنوان مثال، اگر وب سایت رستوران دارید، یک دکمه کال تو اکشن در هدر خود قرار دهید که روی آن نوشته شده است “در اینجا سفارش دهید”.
یا در مورد یک وب سایت سازمان مردم نهاد به درج دکمه‌ای با عنوان، “اکنون کمک کنید” نیاز دارید.
اطمینان حاصل کنید که پیام شما فریبنده، واضح و خلاصه شده در یک یا دو کلمه باشد.
تصویر یا انیمیشن اضافه کنید
در صورت داشتن فضای کافی، هیچ دلیلی وجود ندارد که چند المان طراحی و یا یک انیمیشن به هدر وب سایت خود اضافه نکنید.
به لطف فناوری‌های شگفت انگیز دنیای دیجیتال امروز، افزودن عناصر گرافیک وب سایت با کیفیت بالا از جمله تصاویر یا انیمیشن‌ها آسان شده است.
تلفیق تصویرسازی و انیمیشن‌سازی با اضافه کردن جزئیاتی پویا به روشی خاص و غیر منتظره، تجربه ای شگفت‌آور برای بازدیدکنندگان به وجود می‌آورد.
امکانات هدر را متنوع انتخاب کنید
همه هدرها نباید شبیه هم باشند! با توجه به نوآوری‌هایی که با پیشرفت طراحی وب به وجود آمده است، بسیاری از وب سایت‌ها از رویکردهای جدید و جالب توجهی در هدر خود استفاده می‌کنند.
قبل از اینکه هدر وب سایتتان را طراحی کنید، برخی از تغییرات منحصر به فرد موجود را در نظر بگیرید.
انواع هدر وب سایت
با توجه به نوع سایتتان و هدفی که از آن دارید باید هدر مناسبتان را انتخاب نمایید. حال ببینیم رایجترین هدرهایی که میتوان استفاده کرد دارای چه ویژگی‌هایی هستند.
هدر ثابت وب سایت
یک هدر ثابت وب سایت در بالای هر صفحه وب سایت پین شده است. بنابراین، کاربران هر کجا که می‌روند آن را مشاهده خواهند کرد.
این یک روش بسیار ساده برای این است که کاربران در هر زمان و در هر جایی از سایتتان که باشند دسترسی خوبی داشته باشند و میتوان گفت که یک تجربه ناوبری فوق العاده را برای آنها فراهم می‌سازد.
پیمایش پنهان (منوی همبرگری)
بسیاری از طراحان از منوی همبرگری در وب سایت خود استفاده می‌کنند. منو همبرگری نسخه کوچک شده‌ای از یک منوی پیمایش است که توسط یک نماد متشکل از سه خط افقی که روی هم قرار گرفته‌اند، نشان داده میشود. به احتمال زیاد، شما تا الان آن را در سایت‌ها مختلف دیده‌اید.
اگر به طراحی وب سایت مینیمالیستی علاقه دارید، این نوع منو در هدر انتخاب بسیار ایده‌آلی خواهد بود، زیرا به شما این امکان را می‌دهد تا با صرفه جویی در فضا، گزینه‌های زیادی را به کاربران ارائه دهید.
به علاوه، بازی با نماد همبرگر بسیار سرگرم کننده و جالب است.
هدر موبایل
این روزها، بیشترین مرور وب سایت‌ها بر روی موبایل صورت می‌گیرد. از این رو، ایجاد یک سایت موبایل پسند از اهمیت زیادی برخوردار است.
موبایل پسند بودن هدر فقط به این معنا نیست که تلاش کنیم تا در دستگاه تلفن همراه اجزاء هدر به طور کامل و درست نمایش داده شود، بلکه باید آن را مناسب با تجربه کاربری در گوشی‌های موبایل طراحی نماییم.
تنظیم اندازه و محتوای موجود در طرح هدر و حتی استفاده از یک منوی همبرگری در نسخه تلفن همراه به شما کمک می‌کند تا به موفقیت بیشتری از وب سایت خود دست پیدا کنید و کاربران را راضی‌تر نگه دارید.
هدر کوچک شده
فرض کنید که یک تصویر پس زمینه زیبا دارید که تمایل به نشان دادنش دارید. همچنین می‌خواهید یک عنوان را در طراحی وب سایت خود بیاورید.
راه حل مناسب این است که تصویر پس زمینه زیبا را با کوچک کردن هدر به وب سایت خود اضافه کنید.
یک هدر کوچک شده که به صورت محو در پس زمینه وب سایت شما طراحی شده است موجب میشود تا کاربران با پیمایش به سمت پایین بتوانند هم متوجه هدر باشند و هم تجربه بصری آنها بر روی قسمت‌های دیگر سایت مخدوش نشود.
هدر کوچک شده جدای از ارزش عملی که دارد، تاثیر خیره کننده‌ای در وب سایت شما ایجاد می‌کند و اگر به صورت سه بعدی نمایش داده شود بسیار قوی‌تر هم عمل خواهد کرد.
هدر حاوی پیام
افزودن متن به هدر وب سایت شما راهی عالی برای نشان دادن پیام شخصی یا حرفه‌ایتان به مخاتبانتان می‌باشد.
تنها در مورد هدر صفحات یا نام تجاری شما صحبت نمی‌کنیم، بلکه در مورد متن‌های انگیزشی صحبت می‌کنیم که می‌تواند ارتباط عمیق‌تری میان شما و مخاطبانتان به وجود بیاورد.
به عنوان مثال، می‌توانید از فضای هدر خود برای نقل قول جملات الهام بخش مربوط به برند یا خدماتتان استفاده کنید.
روش دیگر این است که می‌تواند با ارسال یک پیام خوشامدگویی و استقبال از بازدیدکنندگان هنگام ورود به وب سایتتان تجربه اولیه خوبی برای آنها ایجاد نمایید.
