چطور یک Footer بزرگ طراحی کنیم؟

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

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

برای footer هدفی تعیین کنید

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

پس یک پاصفحه خوب در همان ابتدا ایده ایی دارد که برای رسیدن به هدفی مشخص طراحی شده است، مانند سایر بخش های وب سایت.

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

• نقشه سایت یا لیست صفحات و لینک های معروف
• اطلاعات تماس
• فرم ثبت اطلاعات
• دکمه CTA برای آخرین تلاش
• نقشه محل (که برای کسب و کارهای غیر مجازی بسیار مهم است)
• محتوای مرتبط (بخصوص در وبلاگ ها)

ساخت یک Footer واکنش گرا یا Responsive

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

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

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

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

اضافه کردن اطلاعاتی که کاربران انتظار دارند

اکثر کاربران انتظار دارند که نوع خاصی از اطلاعات را در پایین صفحه وب پیدا کنند. اضافه کردن مواردی که در مکان خاصی کاربر انتظار آن را دارد می تواند طراحی را بسیار کاربردی و ساده تر کند.

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

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

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

• اطلاعات حق مولف
• پیوند به صفحه قوانین و یا یک سیاست حفظ حریم خصوصی
• عضویت یا وابستگی حرفه ای به انجمن ها

سازمان دادن لینک ها در Footer

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

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

هماهنگی پاصفحه و برند

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

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

فضای زیادی به Footer اختصاص دهید

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

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

محتوای Footer را جدا کنید

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

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

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

اما چه زمانی یک footer زیادی بزرگ است؟

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

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