پشت پرده طراحی وب سایت بوستون گلاب

چهارشنبه 2 فروردين 1391

وب سایت روزنامه آمریکایی بوستون گلوب، در آستانه چهلمین سال تاسیس خود، با تغییرات چشمگیر خود، تحسین وب نگارها و طراحان وب را برانگیخته است...

طراحی سایت Boston Globe

Boston Globe تغییرات بسیار جذابی در وب سایت خود داده است. این شرکت عنوان کرده که هدفش از این تغییرات، ایجاد تجربه‌ای شیرین‌تر برای کاربران، در خواندن خبرها بوده است. مدلی که اینجا، توسط این شرکت مورد استفاده قرار گرفته، سبب می‌شود که خواندن اخبار طولانی، برای بازدیدکنندگان راحت‌تر و لذت بخش تر شود.

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

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

 

صاحبان بوستون گلوب : «نتایج طراحی جدید حتی فراتر از انتظارات و ایدءال های خود ما شده است. »

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

سیستم navigation وب سایت، فضای بسیار کمی را به خود اختصاص داده و در عین حال بسیار موثر عمل می‌کند. برخی خبرنگاران وب، که از طراحی این وب سایت بسیار مشعوف و شگفت زده بودند – و نتوانستند حس فضولی! ببخشید کنجکاوی خود را کنترل کنند- با برخی از دست اندر کارن آن به گفتگو پرداختند.

طی این گفتگو مطرح شد که طراحی بصری وب سایت توسط Miranda Mulligan پایه ریزی شده و یک تیم طراحی نیز به عنوان همکار در این کار شرکت داشتند که سرپرستی آن‌ها را Tito Bottitta بر عهده داشت.

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

طراحی تطبیقی

نوار ناوبری در وب سایت Boston Globe بسیار باریک و جمع و جور و تبدیل به یک نواری کشویی شده که فضای بسیار کم را اشغال کرده و اطلاعات مفیدی را در خود گنجانیده است. تمامی بخش‌های وب سایت بر مبنای طراحی تطبیقی یا طراحی واکنشی ساخته شده‌اند؛ بدین معنی که از نظرات کارشناسانی همچون Ethan Marcotte و مقالات نوشته شده‌ی آنان به بهترین شکل استفاده شده تا این طراحی به نحو مطلوب پیاده سازی شود.

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

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

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

در ادامه مشکلاتی که مجریان این پروژه با آن مواجه بوده‌اند را از زبان خودشان می‌شنویم :

چالش‌های طراحی

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

یکی از اهداف طراحی واکنشی در این وب سایت، توانایی پشتیبانی از مرورگرهایی همچون Explorer 6, 7, 8 بود که قابلیت خواندن CSS3 را ندارند. بنابراین مجبور شدیم فایل‌های ضمیمه‌ای Java Script استفاده کنیم تا به این مرورگرها توانایی خواندن وب سایت جدید را بدهیم.

طراحان : «ما فقط بر روی تطبیق پذیر بودن ابعاد صفحه وب سایت بر روی پلت فرم‌های مختلف تمرکز داشتیم. نتیجه کار ما در این زمینه خود را به خوبی نشان داده است»

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

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

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

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

 


گریک گرانل
 
تعداد مقالات 32 عدد
حسن چلونگر
 
تعداد مقالات 243 عدد
       
کپی رایت