اندی راتلج را می‌توان به عنوان نظریه پرداز گرافیک وب سایت شناخت. او مدیر سایت unti  است و در مقاله‌ای ساختار دو وب سایت CNN و USA TODAY را به چالش کشیده است.

مثل خيلي‌های ديگر وقتي دیدم سايت CNN طراحي‌اش را عوض كرد تعجب كردم. چون معتقدم كمتر وب سايتي توانسته با تغيير ساختار خود در جذب مخاطب موفق‌تر عمل كند.

عرضه واضح اطلاعات، آن چيزي است كه سايت هاي خبري به واقع به آن نياز دارند.در حقیقت اجزا و المان‌هایی که در طراحی جدید CNN بکار رفته ، ساختاری را شکل می‌دهد که دوست دارم آن را ساختار آرام معرفی کنم.

 ساختار آرام هنگامی شکل می‌گیرد که شما بر المان‌های ساختار توجه کنید. المان‌های ساختاری که شامل؛ باکس‌ها، خطوط، بولت‌ها، رنگ المان‌ها و ....

بکارگیری این ساختار در نمایش بهتر محتوا موثر است.

با يك نگاه سريع به اجزا و طراحي جديد سايت CNN مي‌توان ساختار آرام را در آن دید. وقتي محتوا براي شما ارزشمند است و دوست داريد كه مخاطب شما جلب محتوا شود، بهتر از ساختار آرام استفاده كنيد.

براي ساختن صفحاتي با اين ساختار بايد از اجزا و المان‌هایی با وضوح پايين در صفحات استفاده كنيم. در حقيقت موارد فراواني هستند كه در كنار يكديگر اين ساختار را بوجود مي‌آورند. در اين مطلب به برخي از آنها اشاره می‌كنيم.

براي مقايسه از دو سايت CNN  و USA TODAY كه به بازنگري تازه‌ای در ساختار خود داشته‌اند استفاده می‌کنیم. CNN در اين تغيير به موفقيت خوبي دست پيدا كرده است.

به صفحه اصليCNN نگاه كنيد و بعد به صفحه خانگي USA TODAY . شايد به نظر شما صفحه اصلي USA TODAY با تركيب‌بندي شلوغ و به هم ريخته اين صفحه خيلي وحشتناك نباشد. اما به این نکات توجه کنید:

- اول از همه به ساختار و ترکیب بندی هدر صفحات توجه کنید.  توجه کنید که CNN به چه چیزی تاکید دارد: راهنمايي و جستجوي خبر. در عوض هدر USA TODAY ترکیبی شلوغ و خسته کننده را انتخاب کرده است.

- سه بخش در هدر USA TODAY قرار دارد. راهنمایی ، جستجو و عضویت در سایت. چیزی که باعث شده هدر این سایت ناکارآمد تر از هدر سایت CNN باشد.

- USA TODA-  در بخش‌هاي مختلف از تركيب متن و عكس استفاده كرده كه در بخش‌هايي اين تركيب عمودي است و در بخش‌هايي افقي. شايد اين اتفاق خيلي مشكل ساز نباشد ولي استفاده مكرر از تركيب متن و عكس با حالات متفاوت در بخش‌هاي مختلف صفحه از نمايش خوب مطالب كاسته است.

در عوض CNN در ترکیب متن و عکس بهتر عمل کرده است. آنها بیشتر به سازگاری محتوا و عناصر ساختار توجه کرده‌اند. این ترکیب ظاهری برای CNN نمایش واضح‌تری در پی‌داشته است.

در مثال زیر نشان داده شده چطور ترکیب های عکس و متن می‌توانند در خواندن متن کمک کنند یا چشم را خسته کنند.

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

فضای سفید

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

برای آنکه به تفاوت این دو ساختار در نمایش محتوا بییشتر پی ببرید به مثال زیر توجه کنید.

به کنتراست بالا، فواصل نامساوی و بافت‌های USA TODAY توجه کنید که چه میزان با ساختار CNN با کنتراست پایین و فضاهای سفید مساوی متفاوت است.

به نظر می رسد که در USA TODAY ساختار و محتوا برای دیده شدن با هم رقابت می‌کنند در حالی که در CNN تلاش می‌شود که متن بیشتر از هر چیزی از صفحه دیده شود و جدا باشد.

mafi@hamshahrionline.ir