Headers | هدرها

هدر در زبان رابط کاربری معمولاً به نوار یا منطقهٔ بالای صفحه یا بخش گفته می‌شود؛ اسکلت جهت‌یابی که برند، ناوبری، جستجو، و کنترل حساب را حمل می‌کند. این معنا با «سرفصل» یا عنوان بخش فرق دارد: هدر چارچوب صفحه است، سرفصل برچسب محتوای داخل صفحه. همچنین در گفتگوی فنی شبکه، headerهای HTTP فرادادهٔ درخواست و پاسخ‌اند؛ طراح محصول کمتر آن‌ها را می‌کشد، اما باید بداند برخی تصمیم‌های کش، امنیت و نوع محتوا از همان لایه می‌آیند. این مدخل روی هدر به‌عنوان کروم صفحه و بخش تمرکز می‌کند و سرفصل تایپوگرافی را جدا می‌گذارد.

هدر صفحه؛ نوار جهت‌یابی همیشه در دسترس

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

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

اجزا: برند، ناوبری، جستجو، حساب و اقدام

بلوک برند معمولاً چپ یا راست مطابق جهت زبان می‌نشیند و به خانه پیوند دارد. ناوبری اصلی باید کوتاه و قابل اسکن باشد؛ بیش از هفت پیوند هم‌سطح اغلب نشانهٔ نیاز به گروه‌بندی یا مگامنو است. جستجو وقتی موجودی یا محتوا بزرگ است اهرم حیاتی می‌شود و جای ثابت در هدر پیدا می‌کند. منطقهٔ حساب—ورود، آواتار، اعلان—باید از ناوبری محتوا جدا و قابل پیش‌بینی باشد تا کاربر مسیر «خودم» را با مسیر «بخش‌ها» قاطی نکند.

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

رفتار چسبان، جمع‌شونده و واکنش به عرض

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

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

هدر بخش، هدر کارت و مرز با سرفصل محتوا

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

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

نشانهٔ landmark، ثبات و هدرهای HTTP در حاشیهٔ محصول

از نظر دسترس‌پذیری، منطقهٔ بنر صفحه باید قابل شناسایی باشد تا کاربر صفحه‌خوان بتواند به ناوبری یا رد کردن کروم بپرد. ترتیب تب منطقی از لوگو به ناوبری و بعد به محتوا، بدون تلهٔ فوکوس، ضروری است. پیوند «پرش به محتوا» مکمل هدر خوب است. ثبات مکان عناصر میان صفحات بار شناختی را کم می‌کند؛ جابه‌جایی تصادفی دکمهٔ حساب میان صفحات حس ناامنی می‌سازد.

در لایهٔ شبکه، هدرهای پاسخ ممکن است سیاست کش، امنیت قاب، و نوع محتوا را تعیین کنند؛ روی تجربه اثر غیرمستقیم دارند—مثل تأخیر یا محدودیت جاسازی. محصول‌منجر لازم نیست مقادیر خام را حفظ کند، اما وقتی صفحه «گاه کهنه می‌ماند» یا «در iframe نمی‌آید»، ریشه ممکن است در هدر HTTP باشد نه در پیکسل هدر سایت. جدا نگه داشتن این واژه‌ها در گفتگوی تیم از سوءتفاهم تیکت جلوگیری می‌کند.

سنجش شلوغی و الگوی طراحی پایدار

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

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

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

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