هر هنری ریشههای کهنی دارد و ریشه وبسایت ها، روزنامه ها هستند. با نگاهی کلی به طراحی وب متوجه این مسیر از طراحی اخبار و روزنامهها خواهید شد.
هر کسی که به طراحی وب علاقهمند است، میتواند از نکات رعایتشده در طراحی صفحات روزنامه و اینکه چرا سالیان متمادی جواب داده منتفع شود.
نیمتای بالا، تیتر اول
اگر طراح وب باشید، احتمالا اصطلاح «نیمتای بالا» یا «above the fold» برایتان آشناست. منظور از آن، محتوایی است که در نگاه اول با فرود (land) به یک صفحه میبینید.
این اصطلاحی از روزنامه نگاری است که چند قرن سابقه دارد! اغلب روزنامهها به خاطر اندازهشان اغلب از وسط تا میشوند و روی هم چیده میشوند. بر همین اساس، «نیمتای بالا» واقعا به معنای محتوایی است که وقتی صفحه را از میانه تا کنید، در قسمت بالا مشاهده میشود.
محتوای نیم تای بالا نخستین چیزی است که خواننده بالقوه روزنامه میبیند و به همین دلیل اولین و تنها شانس تاثیرگذاری بر مخاطب برای خرید روزنامه و خواندن ادامه مطلب به شمار میرود. اگر روزنامهای نیمتای بالای جذاب و در ادامه، صفحه اول جذابی نداشته باشد، برای برداشتن و خواندن آن چه دلیلی وجود خواهد داشت؟
تیتر اول روزنامهها هم به همین خاطر مهمترین تیترشان به حساب میآید. شما اگر بخواهید در یک عبارت کوتاه مهمترین ماجرای یک روز را بگویید، میگردید جذابترین و کلیدیترین نکته را پیدا کرده و به اثرگذارترین شکل بیان میکنید.
همین اصل نیمتای بالا و تیتر اول در وب امروز هم دقیقا تکرار میشود: نیمتای بالا محتوایی است که مخاطب در نگاه اول مشاهده میکند و به همراه تیتر اول باید مهمترین چیز را در مورد آن وبسایت به کاربر بگوید. به عنوان یک نمونه عالی، نگاهی به سایت apple.com بیندازید تا متوجه شوید در مورد چه صحبت میکنیم!
اصل گوتنبرگ
حالا که موفق شدهاید توجه مخاطبتان را جلب کنید، پس وقتش است در مورد اصل گوتنبرگ (The Gutenberg Principle) یا الگوی زی (Z-pattern) هم بدانید. اصل گوتنبرگ که توسط ادموند آرنولد، پدر طراحی روزنامه ایجاد شده، قاعده دم دستی خوبی است که کمک میکند متوجه شوید مردم چگونه با یک صفحه محتوا، چه کاغذی و چه پیکسلی، ارتباط میگیرند.
اصل گوتنبرگ میگوید هنگامی که ما با یک محتوای یکنواخت (homogeneous) مواجه هستیم، از گوشه بالا سمت چپ (برای زبانهای چپبهراست مانند انگلیسی) یا سمت راست (برای زبانهای راستبهچپ مثل فارسی) شروع میکنیم و در گوشه مخالف پایین به اتمام میرسانیم. در طول خواندن هم به صورت زیگزاگ مطلب را دنبال میکنیم. این اصل ریشه در قاعدهای به نام «جاذبه خواندن» (Reading gravity) دارد.
همین اصل در طراحی وب هم به کار میرود و محتوای صفحه بر اساس اصل گوتنبرگ چیده میشود. در صفحات وب این نکته حتی اهمیت بیشتری نسبت به روزنامهها پیدا میکند. چرا که خوانندهها از کشورهای مختلف نسخههای مختلف یک وبسایت را میبینند (بر خلاف محلی بودن روزنامهها)، بنابراین محتوا نیز باید بر پایه اصل گوتنبرگ و تطبیق آن بر جهت زبان پیاده شود.
سرصفحه
هر روزنامهای سرصفحه (Nameplate) دارد که شماره به شماره عوض نمیشود! سرصفحه قسمتی در بالا وسط (گاهی در کنار) است که از نام روزنامه یا ترکیب آن با لوگو تشکیل میشود.
سرصفحهها اکثرا بسیار خاص و نمادین هستند و در ذهن خوانندگان آن روزنامه حک میشوند. روزنامهها خودشان را با سرصفحهشان به مخاطب میشناسانند و به وسیله آن خود را از دیگران متمایز میکنند.
با این توضیحات، سرصفحه در سایتها برایتان آشنا نیست؟ در وب به آن میگوییم «سربرگ» یا Header. تقریبا هر سایتی که فکرش را بکنید سربرگ با لوگو دارد. اگر به سایتی برخورد کنید که هدر نداشته باشد یا در تمام صفحاتش تکرار نشده باشد حتما تعجب میکنید.
شبکهبندی و قطعههای محتوا
روزنامهها پر از محتوا و اطلاعات متنوع هستند و این اطلاعات باید خوب و منظم ارائه شود. سیستم شبکهبندی (Grid system) از مبانی طراحی یک روزنامه است و مانند آبی که به قالب ظرف درمیآید، محتوا نیز در شبکه روزنامه شکل میگیرد.
مهمترین مورد در این سیستم ستونها (Columns) هستند. بسته به آن، روزنامه میتواند بین ۴ تا ۱۴ ستون داشته باشد و بسیار نادر است که در روزنامهای محتوا در قالب ستونبندی قرار نگرفته باشد. محتوا از بالا به پایین یک ستون جریان پیدا میکند و سپس در ستون بعد ادامه دارد. تصاویر میتوانند در یک ستون باشند یا اگر چشمگیر هستند، چند ستون را بگیرند.
شبکهبندی یکی از اساسیترین قواعد طراحی وب نیز به شمار میآید. در این زمینه، سیستم شبکهای روزنامه نه تنها میتواند به ما در چیدمان منظم محتوا کمک کند، که ارتباط قطعههای (block) محتوا با یکدیگر و همچنین با قطعههای تبلیغات را نشان میدهد. چیدمان اشتباه کل روند خواندن را به هم میریزد، ولی چیدمان صحیح لذت خواندن را به خواننده اهدا میکند.
البته باید توجه کرد که تفاوتهای مهمی هم میان این دو رسانه در بحث شبکهبندی وجود دارد. برای مثال در وبسایتها به ندرت مطلب در ابتدای ستون بعد ادامه پیدا میکند، چراکه در یک صفحه وب حرکت از بالا به پایین است.
برای کاربر عجیب خواهد بود که محتوایی را با اسکرول به پایین دنبال کرده، بعد مجبور شود برای ادامه آن دوباره به بالای صفحه برگردد! پرشهای کوچک ممکن است در ساختار یک وبسایت وجود داشته باشد، اما نه در ابعاد ستونهای محتوایی.
به جلو بنگرید اما از گذشته غافل نشوید!
قواعد طراحی روزنامه در طول تجربه سالیان طولانی شکل گرفتهاند و یک اصل به شدت ساده را دنبال میکنند: اطلاعات را طوری نمایش دهید که تا حد امکان واضح، جذاب و در دسترس باشند. این یک هدف عالی برای هر وبسایتی هم خواهد بود. همانطور که آرنولد ادموند خطاب به طراحان جوان میگوید: «شما میتوانید بهتر عمل کنید، ولی تنها راهی که تواناییتان را به عمل دربیاورید این است که به عقب برگردید و اصول را درک کنید. این به نظر کسلکننده میآید، اما واقعیت است.»
محمود صادقی - محقق سیستمهای تعاملی / ضمیمه کلیک روزنامه جام جم
در یادداشتی اختصاصی برای جام جم آنلاین مطرح شد
در یادداشتی اختصاصی برای جام جم آنلاین مطرح شد
سید رضا صدرالحسینی در یادداشتی اختصاصی برای جام جم آنلاین مطرح کرد
در یادداشتی اختصاصی برای جام جم آنلاین مطرح شد
سیر تا پیاز حواشی کشتی در گفتوگوی اختصاصی «جامجم» با عباس جدیدی مطرح شد
حسن فضلا...، نماینده پارلمان لبنان در گفتوگو با جامجم:
دختر خانواده: اگر مادر نبود، پدرم فرهنگ جولایی نمیشد
درگفتوگو با رئیس دانشکده الهیات دانشگاه الزهرا ابعاد بیانات رهبر انقلاب درخصوص تقلید زنان از مجتهد زن را بررسی کردهایم