طراحی وب سایت

[آبجی]

طراحی وب سایت

نويسنده : سعید رستگار

کامپیوتر - مقالات
پروسه طراحی وب نیز مانند اکثر پروسه های طراحی و تولید نرم افزاری و غیر نرم افزاری دیگر از مراحل مجزایی تشکیل شده است که در صورت پیروی درست و منظم آنها روند طراحی ساده تر و طراحی بهتری خواهیم داشت. این مقاله سعی دارد با جمع آوری مهمترین نکات موچود در چندین مقاله معتبر منبعی جامع در خصوص برنامه ریزی برای پروسه طراحی وب در اختیار مخاطب قرار دهد.
● مقدمه:
طراحی وب فرآیندی مبتنی بر خلاقیت (Creativity) و مهارت فنی (Technical skills) است. توجه بیش از حد به این دو عامل طراحان را از برنامه ریزی برای پروسه طراحی غافل کرده است.بسیاری از مردم با شنیدن کلمه تهیه پروسه منظم برای انجام کاری به وحشت می افتند در حالی که اکثر ما بصورت خود آگاه یا نا خود آگاه در انجام کارها و پروژه ها از پروسه خاصی پیروی می کنیم.کاهش بار حافظه طراح و در نتیجه کاهش زمان و افزایش کارآیی از اولین نتایج طراحی پروسه ای مدون برای پروژه بحساب می آید.از دیگر مزایای داشتن چنین پروسه ای می توان به تسهیل روند هدایت و آموزش مشتری و حتی حفاظت از طراح در برابر مشتری و انتقادات و ایرادات وی اشاره کرد.در رابطه میان طراح و مشتری نیز مانند هر رابطه ی دیگری ، ارتباطات (Communication) نقشی کلیدی ایفا می کند و داشتن یک پروسه خوب طراحی سنگ ، زیر بنای یک ارتباط خوب بحساب می آید.چنین پروسه ای در رسیدن به تفاهم ، همفکری و درک متقابل میان طراح و مشتری بسیار موثر است. در این مقاله به بررسی مراحل مختلفی که باید در پروسه طراحی و ساخت یک وب سایت انجام پذیرد، می پردازیم.
● گام نخست؛ شناخت:
در پروسه ساخت یک وب سایت ابتدا باید شناختی کلی از موضوع ، هدف ،مخاطب و امکانات موجود بدست آوریم.احتمالا اطلاعات و منابعی در خصوص موضوع سایت در اختیار داریم.حال باید هدف خود(یا مشتری) از ایجاد وب سایت را مشخص کنیم.در این مرحله مشخص می شود که از چه زاویه ای و تا چه حد به کدام جنبه های موضوع خواهیم پرداخت.مورد سوم که بسیاری از وبمستر ها به آن توجه نمی کنند، بدست آوردن شناخت از مخاطب و نیاز های اوست. شناخت امکانات موجود نیزشامل مهارت های اعضای تیم طراحی و بودجه وزمان لازم برای اجرای پروژه می شود.در این مرحله باید پاسخ پرسش های زیر را بطور دقیق بدست آورده و مطابق اولویت طبقه بندی کنیم:
١) پس زمینه
▪ اهداف: اهداف خاص شما (یا مشتری شما) از ساخت سایت چیست؟این اهداف می تواند شامل موارد زیر باشد:
ـ اطلاع رسانی در مورد شرکت / نام تجاری
ـ اطلاع رسانی در مورد کالا / خدمات
ـ فروش کالا / خدمات
ـ ساختن یک جامعه (Community)
ـ سرگرمی
ـ به اشتراک گذاشتن دانش و اطلاعات
ـ ارتباطات داخلی
▪ زمانبندی و مهلت انجام پروژه: برنامه زمانبندی و ضرب الاجل شما برای طراحی و ساخت سایت چیست؟
▪ بودجه بندی: حداکثر بودجه برای انجام پروژه چقدر است؟
▪ ارزیابی: میزان موفقیت سایت را در چه حدی پیش بینی می کنید؟
سپس:
١) یک لیست طبقه بندی شده (از مهمترین به غیر مهمترین) از اهداف اصلی تهیه کنید.
٢) ماموریت اصلی سایت را در یک جمله خلاصه کنید.
۳) با توجه به اهداف و جهت گیری های کلی شرکت یا نهاد سفارش دهنده اهداف کوتاه مدت را از بلند مدت مشخص کنید.
الف) مخاطب:
▪ مخطبان خارجی: مخاطبان شما چه کسانی هستند؟
ـ مخاطبان فعلی
ـ مخاطبان بالقوه
ـ تامین کنندگان
ـ نهاد ها، سازمانها و تجار
ـ سرمایه گذاران
ـ رقبا
ـ کودکان
ـ دانش آموزان / دانشجویان
ـ افراد دارای نقص در بینایی
▪ مخاطب داخلی شما کیست؟
ـ کل کارمندان
ـ مدیریت
ـ بخش های بازاریابی و فروش
▪ زیر گروه ها:زیرگروه هایی از مخاطبان ذکر شده تهیه کنید.
▪ شناخت: علائق، مهارت های تکنیکی، موارد خاص و ... را برای هر گروه معین کنید.
سپس:
١) یک لیست از مخاطبان اصلی به صورت درجه بندی شده تعیین کنید.
٢) ارتباط هایی میان فهرست اهداف اصلی و فهرست مخاطبتن اصلی ایجاد نمایید.
٣) بر پایه این ارتباطات سناریو هایی مبنی بر مورد استفاده تهیه کنید.
ب) منابع:
▪ معین کردن نقش ها در پروژه:منابعی که مسئ.ل مدیریت محتوا، پشتیبانی تکنیکی سایت هستند را مشخص کنید.(شامل: نام، عنوان، نقش، و اطلاعات تماس)
▪ مهارت های اعضای تیم:مهارت های تکنیکی هر کدام از اعضا در چه حدی است؟
ج) رقابت:
▪ شناخت رقبا:سایت های رقیب و سایت هایی که می توانند در جهت گیری های سایت شما موثر باشند را بشناسید.
▪ عناصر مهم: عناصر مهم موجود در سایت رقبا را بشناسید:
ـ قابلیت های بدردبخور
ـ تکنولوژی های مورد استفاده
ـ ظاهر سایت
ـ تازگی محتوا
سپس:
یک تحلیل مقایسه ای که شامل عناصر مهم سایت رقبای اصلی و اینکه کدام ها باید در سایت مورد استفاده قرار گیرند و یا از کدام ها باید اجتناب شود ، تهیه کنید.این تحلیل را با مراجعات بعدی در بازه های زمانی مشخص بروز کنید.
د) محتوا:سایت چه قابلیت ها و ویژگی هایی باید داشته باشد:از جمله می توان به موارد زیر اشاره کرد:
▪ تجارت الکترونیک / سبد خرید
▪ خدمات / پشتیبانی مشتری
▪ پشتیبانی فنی
▪ انجمن های تبادل آرا
▪ خبرنامه
▪ کاتالوگ / اطلاعات
▪ فرم های سفارش
▪ فرم نظرسنجی
▪ ورود اعضا
▪ بخش های تحت حفاظت پسورد
▪ بخش هایی که با استفاده از سرور های SSL ایمن می شوند
ه) اطلاعات:سایت شما باید شامل چه عناصر اطلاعاتی شود/
ـ صفحه درباره ما
ـ صفحه تماس با ما
ـ اطلاعیه های مربوط به حقوق مولف
ـ اطلاعات مربوط به حفظ و نگهداری اطلاعات شخصی کاربر
● گام دوم؛ تهیه خلاصه طرح:
گام دوم در طراحی یک وب سایت تهیه خلاصه طرح است.در این مرحله باید بخش های اصلی و فرعی وب سایت را مشخص کنیم.در قالب خلاصه طرح باید نحوه ارتباط بین موضوعات اصلی و فرعی وب سایت را نشان دهیم.تهیه خلاصه طرح در سازمان دهی محتوای گردآوری شده برای سایتبسیار موثر است.
● گام سوم؛ تهیه Storyboard :
حال باید یک نقشه کلی یا Storyboard برای وب سایتمان طراحی کنیم. Storyboard شکلی است که ارتباط میان اجزای گوناگون سازنده وب سایت (مانند صفحات html، عکس ها و تصاویر گرافیکی و ...) راروشن می کند. Storyboard بر پایه خلاصه طرح تهیه می شود و برای رسم آن می توانیم از برگه های یادداشت Sticky که بر روی آن موضوعات مختلف وب سایت نوشته شده و یا برای سادگی بیشتر از نرم افزار های مخصوص سازماندهی نمودار استفاده کنیم.
● گام چهارم؛ تنظیم ساختار ناوبری اولیه:
گام چهارم تنظیم ساختار ناوبری اولیه سایت بر پایه Storyboard و خلاصه طرح است.این ساختار مشخص می کند که سایت شامل چند بخش اصلی است.این بخش های اصلی همان بخش هایی هستند که از صفحه خانگی (homepage) شما قابل دسترسی اند و معمولا هر یک دارای صفحه مقدماتی (Intro) مربوط به خود هستند.در این مرحله برای تهیه فولدر های مختلف که هر یک شامل اجزای یک بخش اصلی (شامل صفحات وب ، فایل های گرافیکی و ...) آماده ایم.پوشه بندی فایل ها در سازماندهی مطالب و محتوای سایت بسیار موثر است.
● گام پنجم؛ طراحی قالب اولیه سایت:
در طول این مرحله باید تصمیمات کلی در مورد نحوه نمایش صفحات سایت گرفته شود..صفحه الگوی ما باید شامل موارد زیر باشد:
عکس یا رنگ پس زمینه صفحات ، رنگ متون و پیوند ها ، نوار های ناوبری و دکمه ها (در صورت وجود) ، طرح اولیه و آرایش کلی صفحه (Layout)، یک بخش پاورقی همراه با آدرس پست الکترونیک و...
یک طراحی خوب به صورت زیر توصیف می شود:
▪ ارضا کننده مشتری: طراحی خوب در بر دارنده احتیاجات مخاطبین یا مشتریان است و به مشتری آنچه را که می خواهد و در زمانی که به آن احتیاج دارد و به فرمی که قابل استفاده برای وی باشد عرضه می کند.
▪ تمرکز بر سادگی: سادگی همیشه بهتر از درهم بر همی است.همیشه می توان یک طراحی را پیچیده ساخت ولی کنار گذاشتن موارد زلید در جهت سادگی کار دشواریست.
▪ ایجاد حس ساختیافتگی:استفاده از طراحی ساخت یافته و منطقی که بر پایه جداول باشد ، به طراحی نظم و ترتیب بخشیده و عناصری که در شکل اولیه ممکن است مبهم به نظر برسند را حذف می کند.
▪ ایجاد حس یگانگی: استفاده از عناصر یگانه ساز اجزا را به هم مرتبط می سازد.این عناصر می توانند شامل شکلها، رنگه، متن یا تصاویر باشند.
▪ حس هماهنگی: در طراحی خوب، رنگها، متن، شکل ها و مکان ها با دقت با هم ترکیب شده اند.
▪ حس تضاد: یک طراحی خوب از تضاد بین عناصر (متن، گرافیک و فضا) برای هدایت بیننده استفاده می کند.این تضاد می تواند با قرار کوچک در مقابل بزرگ، روشن در برابر تاریک، خشن در مقابل ظریف و هماهنگ در مقابل نا هماهنگ ایجاد شود.
● گام ششم؛ افزودن محتوا:
در مرحله آخر محتوای خاص هر صفحهرا به الگوی کلی اضافه کرده و صفحه را با نام خود ذخیره می کنیم.این روند را تا پایان ساخت تمام صفحات ادامه می دهیم.
● نتیجه گیری:
با انجام مراحل فوق وب سایت ما تکمیل است ولی قبل از تحویل به مشتری و Upload کردن آن باید آزمایش ها و تست هایی از جنبه های مختلف و ترجیحا به وسیله افرادی خارج از تیم طراحی بر روی آن انجام شود.این تست ها می تواند شامل موارد زیر باشد: مقاصد و اهداف ، ارتباط محتوا و ساختار صفحات، و در آخر عملیات وب سایت به این معنی که تمام ارتباطات ، تصاویر و رسانه ها در محل خود و به درستی کار کنند.