برای اینکه با اصول طراحی هدر آشنا بشیم میخوام براتون یه مثال ساده بزنم، تا حالا شده برای خرید لباس به یه مرکز تجاری بزرگ برین که پر از مغازه های لباس فروشی، برای اینکه وارد هر کدوم از اون مغازه ها بشین به سردر مغازه ها و ویترینشون نگاه میکنین و هر کدوم براتون جذاب تر باشه وارد اون میشن هدر هم مثل سردر و ویترین مغازه میمونه هر چقدر جذاب تر طراحی بشه احتمال اینکه کاربر وارد سایت بشه و در اون بمونه و وارد صفحات دیگر سایت بشه بیشتر میشه. در ادامه متن با هم یاد میگیریم که موقع طراحی هدر سایتمون از چه عناصر و اصولی استفاده کنیم تا هدر ما بتونه کاربری که وارد سایت میشه رو جذب کنه و به سئو سایت ما کمک زیادی بکنه.
به طور کلی هدرسایت بالاترین قسمت سایت که معمولا در تمامی صفحات وب سایت وجود دارد ولی لزوما هدر در تمامی صفحات با هم یکسان نیست. هدری که در صفحه اصلی طراحی میشه بسیار مهم است زیرا زمانی که کاربر وارد سایتتون میشه در ابتدا با آن مواجه میشه و بنابراین بهتره طوری طراحی شده باشه که به صورت هم زمان موضوع ذهنی کاربر و موضوع سایتتون رو نمایش بده.
هدر ها میتونن از یک یا دو و یا سه بخش تشکیل شوند. در انواع سه بخشی یک نوار در بالای صفحه قرار میگیره که به آن ( Top Bar ) گفته میشه و یک نوار در وسط که به آن Main Bar گفته میشه، که معمولا در این قسمت از یک تصویر یا تصاویری مرتبط با موضوع و هدف سایت استفاده میشه که کاربر با دیدن آن به صورت بصری در عرض چند ثانیه متوجه نوع کسب و کار و موضوع سایت شما بشه و یک نوار پایینی در که به آن Botton Bar گفته میشه که طراح باید با استفاده از نیازی که برای سایت حس میکنه از یک یا هر سه بخش در طراحی هدر وب سایت استفاده کنه. در گذشته برای ساخت هدر وب سایت معمولا از یک نوار باریک در بالای صفحه اصلی استفاده میشد ولی جالب بدونین که امروزه دیگه اون طراحی خیلی مرسوم نیست و بیشتر سعی میشه که در طراحی هدر از کل فضای صفحه اصلی استفاده بشه.
با توجه به موضوع و نوع فعالیت سایتتون میتونین از این عناصر در طراحی هدر سایتتون استفاده کنین:
همان طور که میدانید هر کسب و کار یا تجارتی برند یا یک شعار تبلیغاتی مختص به خودش داره، با قرار دادن لوگو تجارتتون در هدر هم باعث میشین که موتورهای جستجوی گوگل سریع تر متوجه موضوع سایت شما بشن و هم باعث ماندگاری بشتردر ذهن مخاطب سایتتون میشین.
قابلیت جستجو برای کاربر خیلی مهم است چون کاربر شما دو ست داره مطلب یا صفحه ای که دنبالش میگرده رو زود پیدا کنه.
این قسمت معمولا در نوار سربرگ قرار داده میشه مثلا اگه در حوزه مشاور سئو فعال هستید میتونین این قسمت یعنی مشاوره سئو را در نوارسربرگ قرار دهید و یا اگر خدمات دیگری مانند خرید هاست یا خدمات سئو دیگری هم دارین میتوانین اگر نوار سربرگ شما شلوغ نیست این قسمت ها را هم در نوار سربرگ قرار دهید. و یا به عنوان زیر گزینه های طراحی سایت قرار بدید.
کاربری که وارد سایت شما شده به هر دلیلی ممکن نیاز داشته باشه با شما تماس بگیره به همین خاطر باید حواستون باشه که اطلاعات تماستون مثل شماره اصلی، ایمیل در صورت امکان آدرستون رو در فهرست ناوبری قرار بدین یا اینکه یه گزینه تحت عنوان تماس با ما در فهرست ناوبری داشته باشین که کاربر با رفتن به اون صفحه بتونه به اطلاعات تماس با شما دسترسی پیدا کنه.
همون طور که میدونین شبکه های اجتماعی در دنیای تجارت امروز اهمیت ویژه ای دارند و جایگاه خودشون رو در بین مردم پیدا کردن پس بهتره آیکون شبکه های اجتماعی تون رو درهدر قرار بدین تا اگه کاربر میخواد شما رو از اون طریق پیگیری کنه این امکان براش فراهم باشه.
یک سری از سایت ها قسمت مقالات و اخبار دارند و کاربر با ثبت نام در سایت این امکان رو پیدا میکنه از طریق ایمیلی که براش فرستاده میشه از آخرین مقالات و اخبار اطلاع پیدا کنه.
اگه سایتی که دارین طراحی میکنین فروشگاهی، میتونین موقع طراحی هدر آیکون سبد خرید در هدر تمامی صفحات قرار بدید اینجوری نرخ تبدیل سایتتون هم افزایش پیدا میکنه که این از نظر سئو و بهینه سازی خیلی برای سایتتون خوبه در این مورد تو مقاله های بعدیمون بیشتر براتون توضیح میدیم.
اگه سایتی که دارین فقط مخاطب های فارسی زبان نداره و اصطلاحا سایتتون چند زبانه است میتونین موقع طراحی فوتر یک تب با عنوان تغییر زبان در آن قرار بدین اینطوری همون اول کاربر میتونه زبان سایت عوض کنه و گیج نشه.
موقع طراحی فوتر میتونین در قسمت میانی فوتر یه عکس از مدیر عامل یا صاحب سایت و یا یه تصویر خوب از نمونه کاراتون قرار بدین اینطوری میتونین بیشتر نظر مخاطبتون جلب کنین.
این گزینه هایی که عنوان کردیم مثل شبکه های اجتماعی، تماس با ما، خانه ( صفحه اصلی )، سوییچ ( تغییر زبان )، گزینه ثبت نام را میتونین در این نوار قرار بدین.
وقتی دارین هدر سایتتون رو طراحی میکنین لزومی نداره تمام این مواردی که گفتیم رو در هدر قرار بدین، چون هدر سایت شلوغ میشه و این مورد علاوه بر اینکه ظاهر زیبایی نداره ممکن است باعث گیجی و سردرگمی کاربر بشه به علاوه تاثیرات فنی منفی هم داره یکیش این که، باعث سنگین شدن سایت میشه و سرعت لود شدن این قسمت بالا میبره و این مورداز نظر گوگل یک امتیاز منفی برای سایت شما در نظر گرفته میشه، زیرا به احتمال زیاد کاربر منتظر لود شدن سایت نمیمونه و سایت شما رو ترک میکنه و این خروج همان طور که می دونین به لحاظ سئو به سایت شما آسیب میزنه و امتیاز ساییتون رو پایین میاره. پس سعی کنین تا جایی که امکان داره اصول طراحی فوتر رو رعایت کنین.
هدر اولین قسمتی است که وقتی کاربر وارد سایت میشه با آن مواجه میشه بنابراین علاوه بر فاکتور زیبایی شناختی که در طراحی گرافیکی آن باید رعایت کنید، بهتره هدر طوری طراحی بشه که در عرض چند ثانیه موضوع و زمینه فعالیت سایت رو به کاربر نشون بده. هدر در طراحی سایت بسیار مهم است، زیرا هر چقدر زیباتر و در عین حال ساده تر طراحی بشه می تونه کاربر رو، بیشتر جذب کنه و باعث بشه که کاربر وارد سایر صفحات وب سایت شما بشه. به این ترتیب مدت زمانی که کاربر در سایت شما میمونه بیشتر میشه و این میتونه به سئو سایت شما و خدمات سئو که دریافت می‌کنید کمک کنه.
اگه تصمیم دارین که هدر سایتتون رو خودتون طراحی کنین بعد از نصب افزونه المنتور پرو به راحتی میتونین اینکار رو انجام بدین فقط کافیه قدم به قدم با ما پیش بیاین.
بعد از نصب افزونه المنتور پرو قسمتی در پیشخوان به نام قالب ها اضافه میشه، اگه روی تب قالب ها قرار بگیرین از قسمت theme builder این تب میتونین وارد محیط پوسته ساز المنتور بشین.
بعد از اینکه وارد محیط پوسته ساز المنتور شدین با زدن دکمه افزودن جدید وارد صفحه قالب ها بشین، و با زدن دکمه + قالب هدر خودتون رو انتخاب کنین.
اگه نخواستین از قالب های آماده استفاده کنین و تصمیم گرفتین اینکار رو به صورت دستی انجام بدین بعد از اینکه وارد محیط پوسته ساز شدین و افزودن جدید را زدین از قالب های آماده استفاده نکنین به این شکل پیش برین:
با زدن + ابتدا یک سکشن جدید ایجاد کنین و تنظیمات آن را روی تمام عرض قرار بدین و بعد از قسمت استایل رنگ پس زمینه رو انتخاب کنین و از قسمت پیشرفته پدینگ این ستون رو روی صفر قرار بدین.
بعد یه بخش داخلی دیگه درون این سکشن قرار میدیم و به تعداد ستون های دلخواه تعداد ستون های این بخش داخلی رو زیاد می کنیم. ما سه ستون رو در این سکشن داخلی ایجاد می کنیم.
در ستون اول این سکشن باید لوگو سایت را قرار بدیم پس المان سایت لوگو رو به اولین ستون اضافه می کنیم بعد لوگو مورد نظر خودمون رو برای این ستون آپلود می کنیم.
در ستون بعدی از ابزارک یا المان nav menu استفاده می کنیم تا بتونیم منو سایتمون رو در این ستون با کمک گرفتن از این المان بسازیم
در ستون سوم برای قرار دادن شماره تلفن از ابزارک تیتر استفاده می کنیم و در زیر ابزارک تیتر ابزارک جعبه رو قرار میدیم تا بتونیم یه حساب کاربری در این قسمت ایجاد کنیم فقط کافیه به جای آیکون جعبه آیکونی مناسب با حساب کاربری آپلود کنیم. بعد از قسمت ویرایش یک سری تنظیمات شامل رنگ و تایپوگرافی و غیره رو تغییر میدیم.
به این ترتیب ما می توانیم هدر وب سایت را به صورت اصولی و مطابق با آنچه که سلیقه ماست طراحی کنیم.
اگر نیاز به قیمت سئو تضمیمی هم دارید می‌توانیدبه خدمات ما نگاهی بیندازید.
ما در این مقاله سعی کردیم تا در مورد اصول طراحی هدر، اهمیت طراحی هدر مناسب برای سایت، و چگونگی طراحی هدر با استفاده از افزونه المنتور رو با هم یاد بگیریم امیدواریم که این آموزش براتون مفید باشه ما در مقاله های بعدی در وبلاگ نبض مارکتینگ سعی می کنیم راجع به بقیه موارد مهم در زمینه طراحی سایت و سئو داخلی مطالبی را عنوان کنیم پیشنهاد می کنیم در مقاله های بعدی هم با ما همراه باشین.
+ میتونی این مطلب رو با دوستات هم به اشتراک بذاری...
محتوای این بلاگ توسط کارشناسان تایید شده است.
با تشکر از شما برای زمانی که صرف مطالعه این نوشته کردید.
+ ممکنه به این مطالب هم علاقه‌مند شی...
+ میتونی دیدگاهت رو با بقیه به اشتراک بذاری...
دسته‌بندی مقالات
دوست داری سایتت تو صفحه اول نتایج گوگل دیده بشه؟!
