تحقیق درباره طراحي صفحات وب
مقدمه
طراحي صفحات وب موضوعي كاملاً سليقه اي است اينطور به نظر مي رسد كه بيشتر مردم دقيقاً مي دانند كه سليقه شان چه چيزي را مي پسندد و چه چيزي را رد مي كند .
اما زيبايي و ظاهر يك سايت فقط نيمي از داستان است و اغلب مشكلاتي نظير قابليت استفاده مشكلات اجراي فني ، و صفحاتي كه به كندي بارگذراي مي شوند نيمه ديگر آن است كه من سعي كرده ام آن را در اين پروژه بيشتر مورد بررسي قرار دهم
در اينجا هدف آن است مه مباحثي فراتر از رفتار هاي بصري مورد بحث قرار گيرند ، مواردي كه باعث مي شوند سايت ها به درستي كار كنند . قابليت استفاده مطمئناً يكي از اين موارد خواهد بود . من تلاش كرده ام تجربياتي كه از ساخت سايت ها در طي چندين سال كسب كرده ام را در اختيار تان بگذارم ، برخي پروژه هايي كه كار كرده ام موفقيت آميز بوده اند و برخي ديگر با شكست روبه رو شده اند و من نه تنها از موفقيتهاي ، بلكه از شكستها نيز درس گرفته ام و البته در صنعتي به جواني طراحي وب ، تجربه بهترين معلم است ، من در اين پروژه سعي كرده ام توازني بين خواسته هاي طراح و نياز هاي كاربر ، شكل ظاهري و عملكرد و منحصر به فرد بودن و انسجام بر قرار كنم ، البته با توجه به آنچه كه در رسانه آشفته اي به نام وب قابل اجرا است .
بعد از مطالعه اين پروژه بي خوبي درك خواهيد كرد كه طراحي وب تركيبي از هنر علم و ، الهام و اجرا ، و در نهايت ناكامي و سربلند است ، شما ممكن است در زمينه طراحي و زيبا سازي سايت تبحر داشته باشيد ولي در ز مينه تكنولوژي و يا تحويل سايت با مشكل مواجه باشيد . حقيقت آن است كه طراحي وب اين دو جنبه را با هم احاطه كرده است و سرمايه گذاري در شناخت عميقتر رسانه و مشكلات فني در پروژه هاي آتي سودمند خواهد بود
با اين حال هنگامي كه اين كتاب را مي خوانيد ممكن است تمام توصيه هاي ارائه شده از جانب من موافق نباشيد و حتي شايد در يابيد كه بعضي قوانين و توصيه ها از انسجام كافي برخوردار نيستند . اما همانها نيز ممكن است جرقه اي را در ذهن شما باعث شوند و نقطه شروعي براي كشف هاي تازه به حساب بيايند . بنابراين قبل از آنكه چنين قوانين و توصيه هايي را فراموش كنيد بهتر است آنها را بسنجيد . طراحان بزرگ ، صرفنظر از رسانه اي كه حوزه كاري آنها محسوب مي شود ، سعي مي كند ابتدا قوانين وضع شده را به خوبي شناخته ، سنجيده و سپس در صورت لزوم تغيير دهند . پيشرفتهاي واقعي به ندرت به خاطر ناداني يا خود بيني اتفاق مي افتند .
متأسفانه يك فرآيند گام به گام ثابت و تضمين شده جهت ساخت يك سايت وب عالي وجود ندارد . برخي چيز ها واقعاً نياز به تجربه دارند . ايجاد يك سايت مطلوب و كامل نيازمند ساختن سايت هاي بي شماري و حتي مرور كردن سايت هاي ساخته شده است . با اين حال مي توانم بگويم كه اگر شما اين پروژه را بخوانيد ، حداقل نصف آنچه كه براي سا ختن سايت هاي عالي نياز داريد را فرا خواهيد گرفت . باقي كار به عهده شما و خلاقيت شماست .
باتشكر،
بهنام ناطق
ماهيت وب
بيشتر طراحان وب از نقطه نظر نگاه خود به طراحي وب مي پردازند ، آنها علاقمند هستند كه خودشان را با استعارات مشخص و با تبليغات فراوان نشان دهند . به هر جهت اينترنت براي شما ايجاد تجارت و نيز قابليتي براي ارتباط نزديك ارائه مي دهد .كاربران ميتوانند اطلاعات و محصولاتي را كه در خور نيازشان ميباشد را پيدا كنند .
در اين اينجا شما با انواع ابزارهاي طراحي آشنا خواهيد شد و به طبيعت آنها نيز پي خواهيد برد . اينترنت معموليترين رسانه واسطهاي است كه كاربر را آماده ميسازد كه تصميم بگيرد كه چه رسانههاي انتشاري ، اينترنت يك رسانه تبادلي ( دو طرفه ) تلقي
شود .
اكثراً رسانهها تأثير گذار هستند و هدف آنها ايجاد علاقه كافي است تا اينكه سرانجام بتواند تبادل مطلوب را انجام دهند .
ماهيت خواندن يك مجله و يا ديدن برنامههاي تلويزيون ذاتي و بالفطره نيست و معمولاً كار انفردي است . در اصل عمل خواندن مطبوعات يا تماشاي برنامههاي تلويزيوني بالفطره عملي تبادلي نيست و در حقيقت بين عمل خواندن يا تماشاي تلويزيون با عمل تبادل تفاوت وجود دارد . تنها تبادل انجام شده در مورد خوانندگان و بينندگان ، گرفتن اطلاعات از طريق خواندن يك كتاب يا مجله يا تماشاي برنامه تلويزيون است . ( بصورت يك طرفه )
بنابراين ايجاد اطلاعات جهت رسانههاي گروهي به راهكارهاي متفاوتتري نسبت به ايجاد اطلاعات مربوط به اينترنت نياز دارد .
مشاهدات بي عيب اينترنت مانند ثبت رويداد بر روي مرورگر وب ، دلالت بر درخواست كاربران و واكنش سرور دارد . به عبارت ديگر انجام يك داد و سند و تبادل مي باشد .
بعلاوه با اين طبيعت ، اينترنت نمي تواند بصورت خطي عمل كند . اگر كاربر تصميم به انجام داد و ستد و تبادل داشته باشد ، ابتدا بايد به سايت راهنمايي و هدايت شود، و سپس براي تجارت در سايت بماند و گردش كند و در پايان دوباره به سايت بازگردد و نيز بايد در نظر داشت كه كاربر ميتواند براي انجام داد و ستد در هر لحظه به هر سايت ديگري مراجعه نمايد .
هدايت و توسعه وب جاري
پيشرفت وب از چند سال پيش شروع شد اضافه شدن چند رسانهاي ها در وب ، دلالت بر پيشرفت وب دارد . اين نوع جديد از اطلاعات در حال حاضر در اينترنت قابل دسترس ميباشد . محتواي اطلاعات عبوري در اينترنت به عنوان جزء اصلي خيلي از پروژهها و برنامهها محسوب ميشود . مزيت عبور اطلاعات در بازتاب اطلاعات و آمار و ارقام ميباشد . به اين صورت كه در زماني كه كاربر آن را در خواست كند از پايگاه دادهها عبور ميكند و بدست كاربر ميرسند . اينترنت دومين پيشرفت خود را بعد از ايجاد تجارت الكترونيك در تاريخچه توسعه وب انجام داد . كارمندان شركتها و صنايع مي توانند با اين توانايي عبور اطلاعات تجاري خود را از خانه انجار سال و دريافت كنند و نتيجه آن خيلي كارآمدتر و پربارتر از حضور در محيط كاري ميباشد . شبكه داخلي شركت با بكارگيري وب براي فروشندگان بيروني و شركاي تجاري ميتواند اطلاعات درخواست شده را سريعتر از بيرون انتقال دهند و سلسله مراتب يك تجارت را به پيش ببرند .
براي مثال شركت A براي شركت B كاغذ توليد ميكند اگر كمپاني A بخواهد به شركت B دسترسي پيدا كند اين امر با بكارگيري شبكه داخلي شركت امكانپذير ميباشد . بنابراين شركت A ميداند كه چه موقع شركت B به محمولهاي ديگري نياز دارد و نيز شركت A ميتواند نخستين قدم براي تهيه محموله قبل از درخواست از طرف شركت B را بردارد .
ابزارها و تكنولوژي
سالها مذاكرات زيادي درباره اينكه چه ابزارهاي خاصي در فرآيند گسترش وب استفاده ميشود ، وجود داشت . به هر جهت امروزه خيلي از ابزارهاي ويرايشگر وب در ردههاي چهارم و پنجم قرار گرفتند .
مذاكرات بيشتر پيرامون آن بود كه طراحان وب از كدام ابزارها استفاده كنند نه اينكه صرفاً بخواهند از ا بزاري خاص استفاده كنند . بطور ايدهآل تركيب كد هاي دستي و WYSIWYG بهترين گزينه از نقطه نظر توسعه امروزي است . انجام اين عمل ساده زمان زيادي براي توسعه يك سايت HTML با كد نويسي را ميگيرد . احتياجات به روز رساني اطلاعات مستلزم آن است كه بين صفحه وب و يك سايت محلي اتحاد و پيوستگي ايجاد شود . امروزه WYSIWYG از استاندارد خارج شده است .
و از Dream Wearer , Front Page استفاده ميشود . در آينده ميتوانيد تشكيلات خود را به آخرين درجه پيشرفت برسانيد و همواره با زمان جلو رويداين ابزارهاي قدرتمند كه در صنعت نيز قابل رقابت هستند در دوره CIW ارائه خواهند شد . اين ابزارها با هم هماهنگي خاصي دارند .
رسانههاي واسط
طراحان وب بايد در مورد ديگر تفاوتها و مشكلاتي كه در طراحي وب در مقايسه با رسانههاي ديگر بخصوص چاپ پيش ميآيد آگاه شوند . در ابتداي زمان طراحي وب ، بسياري از سايتها بصورت HTML ساده و بصورت بروشورولي باخاصيت وب توزيع ميشدندو اين شيوه باعث شد كه كمپانيها خيلي سريع اطلاعات خود را بر روي وب ارسال كنند . بعلاوه وب به عنوان قلمرو جديد بود كه نه سنديتي براي آن وجود داشت و نه اطلاعات معتبري براي تأئيد اعتبار آن بود .
بيشتر كمپانيها خيلي زود آموختند كه ارسال بروشور بر روي وب موثر تر از استفاده از رسانههاي ديگر نيست . به طور كلي در يك جمله ميتوان گفت صفت چاپ خاصيت خطي دارد يعني از يك خط به خط ديگر و از يك صفحه به صفحه ديگر . ....
ولي وب يك رسانه خطي نيست و به همين سبب خواص متفاوتتري دارد و هنگامي كه در داد و ستد از آن به عنوان يك قالب خطي استفاده شود خواص متفاوتي از خود بروز ميدهد . بيشترين ويژگي متفاوت وب در برقراري ارتباط دو طرفه با كاربران ميباشد . صنعت چاپ نميتواند مشاهدات كاربران را بصورت فرم تخصصي در آورد . و در يك جمله ديگر ميتوان گفت رسانه وب ميتواند امكانات ارتباط دو طرفه را به بهترين صورت انجام دهد و براي كاربر فرم شخصي ايجاد كند . و اين پديده يك ارتباط مستقيم بين تجار و كاربران ( خريداران ) را برقرار ميكند . در طي اين كتاب شما با ابزارهاي زيادي در توسعه صفحات وب آشنا خواهيد شد اما توجه داشته باشيد كه هدف از اين پروژه آگاهي شما از امكاناتي است كه هر كدام از اين ابزارها به شما ميدهندو اين شما هستيد كه در نهايت تصميم گيرنده اصلي خواهيد بود كه كدام ابزار فوايد بيشتري براي نظام مند شدن مقاصدتان دارد .
محاسبه مهارتهاي HTML خود
در اين تمرين شما مهارت HTML خود را با ايجاد يك صفحه ساده محاسبه خواهيد كرد . شايان ذكر است كه مندرجاتي شما بكار ميبريد ميتواند متفاوت از مندرجات بكار برده شده در اين تمرين باشد .
تمرين ايجاد يك صفحه وب پايه :
در اين تمرين شما يك صفحه وب ساده ايجاد خواهيد كرد و توانايي HTML خود را محك ميزنيد.
1ـ از الگوي HTML براي ايجاد قالبهاي زير استفاده كنيد .
ـ Table
ـ Hyper Link ( استفاده از پروتكل HTTP )
ـ Font
ـ Image
در اين فصل شما با مفاهيم تكنولوژي و ابزارهاي مورد استفاده آن و مختصراًبا مشكلاتي كه براي بكارگيري اين تكنولوژي استفاده ميشود آشنا شديد و در نهايت مهارت HTML خود را محاسبه كرديد .
معرفي فصل
كيفيت مندرجات سايت شما و نمايش آن از عوامل موفقيتهاي اصلي سايت هستند . يكي از بزرگترين اشتباهاتي كه شما در ساخت و توليد و نمايش مندرجات روي وب داريد دخالت دادن استانداردها ، تمرينها و تعهدات رسانههاي ديگر مثل چاپ ميباشد . وب رسانه متفاوتتري از بقيه رسانههاي موجود است و بنابراين استانداردهاي متفاوتتري براي توسعه آن نسبت به بقيه رسانهها مثل چاپ ويدئو و ساير رسانههاي سنتي وجود دارد . اين فصل به شما خلاصهاي از بيشتر ملزوماتي كه شما نياز داريد براي توسعه كار آن آنها را در نظر بگيريد ارائه ميدهد .
كاربران وب و نكاتي در طراحي سايت
حدس ميزنيد كه چه مقدار از متن صفحه وب شما به طور واقعي توسط كاربر خوانده ميشود ؟ تمام آن ؟ بيشتر آن ؟ حقيقت آن است كه كاربران اغلب هيچ مقداري از آن را نميخوانند . به دنبال اين جمله بايد گفت كه درحدود 80% از مردم فقط در مندرجات سايت پويش ميكنندو به دنبال نكات و عبارت كليدي ميگردند . به طور متوسط 25% كاربراي در خواندن روي مانيتور نسبت به خواندن از روي چاپ آهستهتر عمل مي كنند . بنابراين ،اين واقعيت چگونه بر ساختار صفحه شما اثر ميگذارد؟ به عنوان يك طراح شما بايد صفحهاي ايجاد كنيد كه كاربران بتوانند سريع آن را كاوش كرده و اطلاعات مطالبه كرده را پيدا كنند . بخاطر آوريد كه يكي از تناقضات در طراحي وب اين است كه تصور كنيد كه وب فرم ديگري از رسانه چاپ است . هنگامي كه طرح يك صفحه با مندرجات مشابه به يك مجله و يا بروشور ايجاد ميكنيد كاربران به طور مسلم به سايت ديگري خواهد رفت چرا كه شما در نظر نگرفتيد كه ماهيت مطالب بر روي وب بايد با ديگر رسانهها به خصوص چاپ متفاوت باشد . هنگامي كه كاربران به سايت شما ميرسند اولين حسي كه در آنها ايجاد ميشود از ا هميت زيادي برخوردار است . مثلاً ممكن است سايت وب شما كه به قصد تجارت ايجاد شده است فقط يك پنجره داشته باشد ولي به هر حال اگر به نظر مشتري غير جذاب باشد شما مشتري خود را به رقيب خود واگذار كرديد . بنابراين اگر بدانيد كه بازديدكنندگان فقط سايت شما را مرور ميكنند متوجه خواهيد شد كه چرا نبايد كاربران رامجبور به خواندن مطالبي كنيد كه براي آنها جالب نيست . كاربران را راضي نگه داريد و آنچه را كه ميخواهند به آنها عطا كنيد ، حتماً آنها به سايت شما باز خواهند گشت . ( قابل ذكر است قواعد بازار يابي در سايتهاي تجاري متفاوت تر از دنياي واقعي ميباشد )
كاربران نميخواهند كه صفحات در هم و نامربوط را ببينند و ازطرفي محتويات و مندرجات سايت نيز ضروري است پس با اين وجود ساختار و انتشار آن هر دو با هم از اهميت برخوردار هستند . معمولاً كاربران سايت شما را براي اطلاعات ويژهاي كه در مورد جستجو و يا خريد و ... ميخواهند بازديد ميكنند .
هر چقدر اين عمل براي آنها آسانتر باشد ، كارشان را راحت و سريعتر انجام ميدهند. كاربران وب فقط علاقهمند به آنچه كه ميخواهند بيابند هستند . كساني كه در كارهاي تجارت خرده و جزئي هستند اعتقاد بر اين دارند كه مشتريها خود خواه هستند ، ولي آنها ميدانند كه پرداخت صورتحساب است كه درهاي تجارت را باز نگه ميدارد و اگر شما اين نكته را درك كنيد صفحهاي بوجود خواهيد آورد كه ساختار آن اهداف تجارت كاربران را تأمين كند .
سايتي نظير سايت www.xnn.com را در نظر بگيريد به محض ورود به سايت سريعاً ميتوانيد مرور كلي از كل سايت داشته باشيد و يا به عبارت ديگر شما ميتوانيد كل سايت را با نگاه از يك عبارت به عبارت بعدي مرور كنيد و آنچه را كه بخواهيد خيلي سريع بدست آوريد . بنابراين تمايل به ديدن مجدد سايت را داريد . سايت فوق از نمونه سايتهاي موفق در جهان ميباشد .
واقعيت در طراحي
يك طراح وب بايد براي فنآوري جديد و اينكه چگونه از ابزارها در طراحي استفاده كند آماده باشد و معمولاً طراحان جديدترين سخت افزارها و نرم افزارها را به كار ميگيرند . به هر جهت اين انگيزه ايجاد مي شود كه شما بايد صفحات دو طرفه ديناميكي ايجاد كنيد كه نرم افزارهاي جديد و قديم را حمايت كنند .اكثريت استفاده كنندگان وب به جستجوي طراحي عالي و پيشرفته نيستند و لي استثنائاتي هميشه در اين قواعد وجود دارند . به هر جهت يك راهنماي خوب در هنگام طراحي وجود دارد كه به قرار زير است :
1ـ بيشتر كاربران از مانيتورهاي Inch 17 يا كمتر استفاده مي كنند .
2ـ بيشتر كاربران با تنظيم تفكيكپذيري 640*480 كار ميكنند .
3ـ بيشتر كاربران داراي مودمهاي با سرعت K56 هستند .
4ـ اغلب كاربران مرورگرهاي وزن 4 به پايين دارند .
5ـ تعداد كمي از مردم زمان زيادي را براي بارگذاري فايلها صرف مي كنند .
همواره در طراحي وب نكات بالا را در نظر داشته باشيد .
ساختار متناسب براي صفحه
طراحي اصلي روزنامه مورد علاقه خود را در نظر بگيريد . در صفحه روي جلد خبر اصلي وجود دارد و بعلاوه متون حاشيهاي هم در آن قرار دارد كه خبرهاي ديگر روزنامه در آن ليست شده است . اين قضيه به چه نحوي در خواندن شما تأثير ميگذارد ؟ اين طرح كلي شما را وادار به خواندن يك خبر در روي صفحه اول نميكند . اگر خلاصه يك خبر كه درستي آن را دنبال ميكنيد ببينيد در آن شماره صفحهاي وجود دارد كه از طريق آن ميتوانيد وارد كل داستان شويد . يعني با يك اتصال شما را به كل مي رساند . اين ساختار اغلب با ساختار يك هرم مقايسه ميشود كه در نمودار شكل زير ترسيم شده است . در اين مدل در ابتدا خلاصه داستان براي شما ارائه ميشود سپس اتصال براي مأخذ و جزئيات آن براي كساني كه علاقهمند هستند قرار داده ميشود . وب ايدهآل ترين رسانه براي اين نوع انتشار است .
با استفاده از ابر اتصالات ميتوانيد كاربران خود را به شرح موضوعات در داستانها ، اخبار و محصولات و سرويسهايي كه داريد هدايت كنيد و نيز ميتوانيد پيش تاريخ و اطلاعات مبسوط و زمان و منابعي را كه روزنامهها به دليل فقدان جا نميتوانند ايجاد كنند را بوجود آوريد . اگر كاربران بخواهند اطلاعات را به طور كامل بخوانند ميتوانند به سمت جهت تعيين شده هدايت شوند . به عبارت ديگر ميتوانند براي پيگيري قضيه حركت كنند .
المانهاي طرح بندي يك صفحه
قبل از شروع به ساختن صفحه يك ديد كلي وساختار كلي از سايت را در نظر بگيريد. شما بايد المانهاي صفحه و نيز چگونگي فعل و انفعالاتي كه آنها با هم دارند را بدانيد . از نقطه نگاه بصري بايد المانهاي انتخابي را در داخل سايت ايجاد كنيد كه اين المانها عبارتند از طرح ، رنگ ،نوع قلم ، تصاوير و چند رسانهايها و ... طرح صفحه منوط به آن است كه طراح بتواند اطلاعات خود را به كاربر نشان دهد اين نوع قالببندي بايد براي درك آسانتر اطلاعات باشد مثل اسناد و گزارشها . اين نوع ساختار به دسته بندي و ساده كردن ، ويرايش و توزيع و پخش اطلاعات كمك ميكند به عنوان يك طرح وب بايد ساختار خود را توسعه دهيد و در اين مرحله تجربيات كاربران ميتواند براي شما بسيار مفيد واقع شود .
موارد زير را در هنگام طراحي يك صفحه در نظر بگيريد :
1ـ Frameset اجازه ميدهد كه صفحات چند گانه شما بصورت واحد ظاهر شود.
2ـ Margin كنترل ميكند كه مطالب چگونه و با چه فاصلهاي از كادر مانيتور شروع شوند .
3ـ Border براي Frame ها و جداول HTML استفاده مي شود .
4ـ رنگ ايجاد يك احساس گيرا و كلي از ساختار سايت و باعث ازدياد توانايي خواندن ميشود .
5ـ Space جدا كردن المانهاي صفحه
6ـ Navigation براي كنترل كاربران براي حركت در سايت
7ـ Rule مندرجات صفحه را به قسمتهاي جداگانه و و ابسته قسمت مي كند .
8ـ White Space باعث كم تر ك ردن بي نظمي المانهاي صفحه ميگردد .
9ـ Table توزيع المانهاي صفحه در جاهاي مختلف صفحه و شكل دادن اطلاعات در ستونهاي مخفي
10ـ Lists به طرح اجازه ميدهد تا اقلام را سازماندهي كنيم .
11ـ Paragraph گروهي از كاراكترهاي متني در صفحه ميباشد .
12ـ Heading level ايجاد سايزهاي گوناگون از متن و طراحي و سازماندهي آن.
13ـ Image مورد استفاده در ايجاد جاذبه ابعادي ، اطلاعات ، Navigation
تعيين كنيد كه سايت شما كداميك از اين عوامل را در بر دارد و شما را در روند توسعه ياري ميدهد و اگر به اين عوامل پرداخته نشود به تدريج منابع و نيروها و زمان خود را از دست خواهيد داد .
طرح معمول صفحه
وب سايتها از قالبهاي اصلي و پايه براي نمايش اجزاء صفحه استفاده ميكنند . شما ميتوانيد اين قالبهاي معمول را از خيلي از سايتها ايده بگيريد .براي مثال Navigator معمولاًدر قسمت چپ بالاي صفحه نمايش داده مي شود و رنگ اين المان اغلب كمي متفاوت تر از رنگ بقيه صفحه است همچنين المان Navigation ميتواند در پائين يك صفحه نيز قرار گيرد .
متن سياه بر روي زمينه سفيد و نيز قرار گرفتن تبليغات كمپاني در بالاترين گوشه سمت چپ صفحه نمايش نيز از قالبهاي متداول ميباشد كه اغلب بكار برده ميشود . اين قالبها و نيز قالبهاي ديگر براي تشخيص اينكه از كدام قالب بايد استفاده شود در عمل مي تواند كمك كند . كاربران هنگامي كه سايت شما را بازديد ميكنند ميدانند كه چه توقعي از آن دارند . در اينجا نمي خواهم بگويم كه كاربران بايد مندرجات و محصولات سايت شما را بدانند ولي بايد اساس و اصول استفاده از سايت شما را بداند و اين اصل شامل كاربردهاي مختلف Navigation و متون و عكسها مي باشد . طرح سايت شما مي تواند با جايگزين شده Navigation در قسمتهاي مختلف ردهبندي شود و نيز نوع قالب بندي به طوري زيادي وابسته به محتويات و مندرجاتي است كه داخل سايت شما قرار گيرد .
سرعت و سايز صفحات ( اسكرول كردن )
كاربران خواهان سرعت زياد هستند . شما اين خواسته آنها را مي توانيد با طراحي صفحاتي با سايزهاي محدود فايلها ميتوانيد تأمين كنيد . با 10 ثانيه مكث در سايت ، كاربران از سايت شما بريده خواهد شد و توجه آنها به سايت را از دست خواهيد و اين نكته بدان معني است كه طراح وب بايد از عكسهاي مقرون به صرفه استفاده كند و انتخاب فايلها بايد با دقت زيادي همراه باشد . بهينه سازي عكسها عامل مهمي در بارگذاري سريعتر آنها است كه بعداً به جزئيات آن ميپردازيم . جدول زير ماكسيمم سايز صفحهاي كه براي واكنش درخواست ارتباطات با سرعتهاي گوناگون مجاز است .
سايز صفحه به معناي سايز تمام فايلها و المانهاي بكار برده شده در صفحه شامل فايلهاي HTML و تمامي عناصر تعبيه شده (jpg , gif) مي باشد .
توجه داشته باشيد كه 1 ثانيه عكس العمل به كاربران اين اجازه را مي دهد كه آنها حس كنند كه به طور آزاد و راحت در ميان اطلاعات جابهجا ميشوند ولي زمان 10 ثانيه نياز دارد كه به توجه كاربر به سايت پرداخته شود . در اواسط سال 1997 مطالعات نشان مي داد كه متوسط سايز يك صفحه وب 44 كيلوبايت است يعني طبق جدول 5 برابر بيشتر از زمان معمول واكنش براي كاربراني كه از ISDN استفاده ميكنند . بنابراين بري بيشتر كاربراني كه از پهناي باند متوسط استفاده ميكنند سرعت بارگذاري بسيار كم خواهد بود . همچنين توجه داشته باشيد كه kb 44 ، 30 درصد بيشتر از بزرگترين حد سايز براي كاربران استفاده كننده از مودم خواهد بود .
دانستن چنين مطالعاتي شما را به سمت توسعه وب متمايل ميكند تا جايي كه كامپيوترها و ارتباطات آنها با يكديگر سريعتر شود . خيلي از وب سايتهايي كه منتشر شده صفحات كوچكي هستند كه از عكسهاي كم مصرف در آن استفاده شده است .
طراحي با دقت و توجه در كيفيت نمايش
توصيه ميشود كه براي طراحي از درجه تفكيك 480*640 استفاده كنيد تا جايي كه بدانيد كاربر از Resolution nd ديگري استفاده مي كند . با طراحي با اين Resolution اطمينان داريد كه كاربران براي ديدن تمام صفحه شما از Scroll استفاده مي كنند . براي پرهيز از ايجاد اسكرول افقي صفحه را از pix 600 پهن تر نكنيد و به خاطر داشته باشيد كه كاربران فقط سايت شما را مرور ميكنند و حاضر نيستند كه براي ديدن تمام صفحه شما از اسكرول استفاده كنند . كيفيت استاندارد و اصلي 480*640 مي باشد كه بيشتر در عمل به كار ميرود هنگامي كه شما با تفكيك 480*640 طراحي ميكنيد اين عدد اثر بيشتري نسبت به درجات تفكيكهاي بالاتر دارد . شكلهاي زير يك وب سايت را در انواع Resolution ها نشان مي دهد . با وجود اينكه هنوز همه از مانيتورهاي 480*640 استفاده ميكنند اما در سالهاي اخير Resolution هاي بيشتري بوجود آمدهاند و شما ممكن است كه بخواهيد تكنولوژي برتر را بدون رها كردن كاربران و با سخت افزار قديمي براي آنها تأمين كنيد . يك راه انجام اين عمل طراحي است كه بتواند سازگاري خوبي با كاربران داشته باشد . در صورت استفاده از Resolution زياد كاربران تصميم به بزرگتر كردن پنجره ميكنند .
سايتهاي www.altavista.com و www.amazon.com و www.cnet.com مثالهاي خوبي در اين زمينه هستند .
رنگ
المانهاي رنگي نقش مهمي را در اصول و نظام ارائه يك سايت دارند . سبك و روش و فرهنگ و آداب شركتها با ارائه رنگ در سايت و چگونگي هماهنگي و تركيب آنها با يكديكر به تصوير كشيده مي شود . به عنوان مثال يك وب سايت با رنگ بندي قوي مثل قرمز و صورتي و زردو سبز، برداشت هنري جذابي از ماهيتهاي صنعتي و فرهنگي مثل حالتي از يك نرم افزاري با تكنولوژي بالا يا يك واحد گرافيكي به بيننده ارائه ميدهد . و از نقطه نظر يك سايت با رنگهاي ملايم تري مثل سفيد و آبي روشن و يا خاكستري براي محافظهكاري و براي ارگانهاي سنتي مثل بانك و ياشركتهاي سرمايهگذاري به كار برده مي شود .
يكي از مسائلي كه در توسعه و پيشرفت طراحي سايت با آن مواجه مي شويد اين است كه چگون احساسها را در هنگام انتخاب رنگ براي وب سايت شركت خود منتقل كنيد . كدام رنگها بيشتر مكمل هستند چند رنگ به معرض نمايش گذاشته مي شود ؟ آيا شما از خطوط پايه افقي و عمودي استفاده مي كنيد؟ آيا سايت شما داراي اشكال هندسي مثل چند ضلعي و مربع مي باشد ؟ اين سئوال و نيز بقيه سئوالات بايد براي بهترين مدل به تصوير كشيدن عكس در يك كمپاني براي كاربران مطرح شود .
نمايش رنگ
يك مانيتور كامپيوتر شامل هزاران المان است كه پيكسل ناميده مي شود . هر پيكسل فقط يك رنگ را در يك زمان نشان مي دهد . هنگامي كه به يك عكس نگاه ميكنيد شما صدها يا هزاران پيكسل مي بينيد كه هر كدام يك رنگ ويژه دارد و تركيب آنها باعث ايجاد تصويري مي شود كه شما مي بينيد . رنگهايي كه وقتي با يكديگر تركيب ميشوند رنگ سفيد را مي سازند به عنوان يك رنگ افزودني تلقي ميگردند . اصل اين رنگ شامل رنگهاي قرمز و سبز و آبي است كه RGB ناميده مي شود . مانيتور كامپيوتر رنگهاي افزودني را نشان مي دهد . اضافه كردن رنگهاي بيشتري به اين تركيب در سيستم RGB باعث جابهجايي رنگ به سمت رنگ سفيد مي شود .
قالبهاي رنگ
رنگها با دو قالب عددي استاندارد شدهاند :
1ـ درجات قرمز و سبز و آبي (RGB)
2- هگزا دسيمال
يك طراح براي انجام يك طراحي وب دقيق بايد منحصراً از كدهاي هگزا دسيمال استفاده كند . ولي به هر جهت براي بحث در مورد اهداف خود هر دو مورد را در نظر ميگيريم
سيستم RGB و هگزا دسيمال يا هر دو ( با هررنگي كه د رمحدوده ديد و بينايي قرار دارندو با خواص گوناگون با يكديگر تركيب ميشوند معرفي مي شوند . ) قالبهاي اين رنگها توانايي نمايش 16772216 رنگ را دارد .
RGB
مقدار RGB در مبناي 10 در رنج عددي 0 تا 255 . در سيستم مبناي 10 از ارقام بين 0 تا 9 استفاده مي شود . وقتي رقم 1 در دسترس قرار ميگيرد مقدار از 0 به 1 افزايش مييابد وهمينطور R=255,G=255,B=255 بنابراين مقدار RGB براي رنگ سفيد R=255,G=255,B=255 كه نمايش ماكسيمم درجه قرمز و سبز و آبي است ) مي باشد .
مقدار درجه RGB براي رنگ سبز به اينگونه است :
R=0,G=255,B=0
بنابراين مقدار RGB براي رنگ سبز 0 و 255 مي باشد كه نمايش %0 براي قرمز و آبي و بيشترين درصد براي رنگ سبز است .
شما ميتوانيد رنگ سبز را با كدهاي HTML به قرار زير دنبال كنيد :
المانهاي رنگي نقش مهمي را دراصول و نظام ارائه يك سايت دارند . سبك و روش و فرهنگ و آداب شركتها با ارائه رنگ در سايت و چگونگي هماهنگي و تركيب آنها با يكديگر به تصوير كشيده ميشود .
به عنوان مثال يك وب سايت با رنگبندي قوي مثل قرمز و صورتي و زرد و سبز ، برداشت هنري جذابي از ماهيتهاي صنعتي و فرهنگي مثل حالتي از يك نرم افزاري با تكنولوژي بالا يا يك واحد گرافيكي به بيننده ارائه ميدهد . و از نقطه نظر يك سايت با رنگهاي ملايمتري مثل سفيد و آبي روشن و يا خاكستري براي محا فظهكاري و براي ارگانهاي سنتي مثل بانك و يا شركتهاي سرمايهگذاري به كار برده مي شود . يكي از مسائلي كه در توسعه و پيشرفت طراحي سايت با آن مواجه ميشويد اين است كه چگونه احساسها را در هنگام انتخاب رنگ براي وب سايت شركت خود منتقل كنيد . كدام رنگها بيشتر مكمل هستند چند رنگ به معرض نمايش گذاشته مي شود ؟ آيا شما از خطوط پايه افقي و عمودي استفاده ميكنيد ؟ آيا سايت شما داراي اشكال هندسي مثل چند ضلعي و مربع مي باشد ؟ اين سئوال و نيز بقيه سئوالات بايد براي بهترين مدل به تصوير كشيدن عكس در يك كمپاني براي كاربران مطرح شود .
تذكر فني
براي كامل كردن سيستم رنگهاي RGB و درجات هگزا دسيمال ميتوانيد سايت مراجعه كنيد اين سايت توسط Lynda Weinman از مركز هنري Ojai Digital ايجاد شده است .
ارقام هگزا دسيمال
درجات ارقام هگزا دسيمال در بازه بين 00 تا FF بصورت زير است :
عدد در مبناي 10 با همان مقدار به مبناي 16 تبديل شده و نمايش داده مي شود . مقدار 00 هيچ درصدي را نمايش نميدهد و مقدار FF بيشترين درصد مقدار رنگ را نمايش ميدهد .
رنگ سفيد در مبناي 16 به اين صورت نشان داده ميشود :
اين مقادير بيشترين درصد رنگهاي قرمز و سبز و آبي را نشان ميدهد .
نمايش سبز در مبناي هگزا دسيمال به قرار زير است :
اين مقادير بيشتري درصد رنگ براي رنگ سبز و هيچ درصدي را براي رنگهاي آبي و قرمز نشان نميدهد . براي هر رنگ سبز و آبي و ... در مبناي 2,16 كاراكتر اختصاص داده شده است و با توجه به اين ميباشد كه اساس RGB از ارقامي ما بين 0 تا 255 براي هر مقدار آبي و قرمز و سبز استفاده ميكند .نمودار فوق را ملاحظه كنيد :
وقتي از مبناي 16 در HTML استفاده مي شود در ابتداي آن از علامت # استفاده ميشود كه لازم نيست اما قسمتي از ويژگيهاي رسمي HTML محسوب ميشود . در تك Body براي مثال كد رنگ پيش زمينه آن اگر سبز باشد ، خواهيم داشت :
هشدار
Netscape 4 در قرار دادن در اطراف ويژگيها اشكال ميگيرد . هنگامي كه از مقدار مبناي 16 در قسمت Style ها استفاده ميكنيد را برداريد .
تركيبات اصلي رنگها
هر مانيتور براي نمايش يك رنگ از 3 تفنگ الكترونيكي استفاده مي كند . هر تفنگ مسئول يك رنگ منفرد است ( قرمز ، سبز، آبي ) تركيبات گوناگوني از تفنگها و جريان زيادي از الكترونها يك رنگ را ايجاد ميكنند. در يك لحظه شخصي با شليك اين تفنگها رنگ سفيد بر روي صفحه توليد مي كند . شليك تفنگهاي قرمز و سبز رنگ سبز ايجاد ميكند . شليك تفنگهاي سبز و آبي رنگ فيروزهاي ايجاد ميكند . تركيب رنگهاي قرمز و آبي رنگ سرخابي ايجاد ميكند .
نمودار فوق مثالهايي از تركيبات اين رنگها و ارتباط بين آنها است :
با وجود آنكه هر مقدار ازRGB و هگزا دسيمال براي يك رنگ خاص استفاده ميشود ولي مهم است كه به خاطر داشته باشيد كه فقط 216 رنگ با ويندوز و مكينتاش و Internet Explorer , Netscape navigator حمايت ميشوند. هر8 بيت مانيتور هر مرورگر 256 رنگ را ميتواند به نمايش بگذارد كه تا حدود 40 مورد از اين رنگها توسط سيستم عامل استفاده ميشود . اين 216 مقدار حمايت مي شوندو بقيه رنگها شدت نورشان افزايش مي يابد .
افزايش شدت نور فرآيندي است كه مرورگر يك رنگ را به نزديكترين رنگي كه مرورگر قادر به حمايت از آن است تبديل مي كند . وقتي رنگي با كدهاي HTML ايجاد شود به رنگ ثابت و يكپارچه تبديل ميشود .
( اميدوار باشيد كه به رنگ اصلي كه شما مي خواستيد نزديك باشد ) اگر مرورگر نور رنگي كه در يك تصوير نشان داده مي شود را با تركيب 2 رنگي كه نزديك به يكي از آنهاست زياد كند توسط مرورگر حمايت نخواهد شد و بصورت لكه نشان داده مي شود .
جدول 3-2 سيستمي از مقادير RGB و هگزا دسيمال را كه بدون مشكل در مرورگرهاي متعدد و بر روي سيستمهاي متعدد ترجمه خواهد شد را نشان ميدهد . ( اگر مقادير ديگري به غير از اينها استفاده شود مرورگر نور آن را به نزديكترين مقدار تخميني افزايش ميدهد .
هر كدام از اين مقادير مطابق با مقدارواقعي است . براي مثال استفاده از مقدار 51 در سيستم RGB درست مانند استفاده از مقدار 33 در سيستم هگزا دسيمال است . به عبارت ديگر مقدار RGB (201,51,153) معدل با مقادير cc3399# در هگزا دسيمال است .
مرورگر ضامن هر تركيبي از اين مقادير است و بدون تناقض و مشكل در پايگاه دادهها مرورگر ترجمه ميشوند .
تركيبات هر كدام از رنگهاي قرمز و سبز و آبي شدت رنگي كه بايد نمايش داده شود را محاسبه ميكند ،جدول 2-4 درصد شدت رنگهايي كه توسط مرورگر از كمتر به بيشتر حمايت ميشوند را نشان ميدهد .
ليست كامل بالا را مي توانيد در سايت پيدا كنيد .
تذكر
مشكلاتي در ترجمه رنگ براي مانيتورهاي bit 16 وجود دارد . به دلايل رياضي 216 رنگي كه در مرورگرها حمايت ميشود در جدول رنگ اين كامپيوترها نشان داده ميشود و مرورگرها با استفاده از رنگهاي ديگري كه به آن رنگها نزديك است اين جابجايي را براي نمايش رنگ و به طور دقيق انجام مي دهند . اما مرورگرها جابجايي رنگ را به طرق مختلف ( منوط به اينكه آيا آن رنگ در يك عكس ارائه مي شود يا توسط HTML ايجاد مي شود) انجام مي دهند . براي بحث در مورد جزئيات بيشتر به آدرس زير مراجعه كنيد :
تمرين
كدام تركيب RGB توسط مرورگر هدايت ميشود .
انتخاب تركيب رنگ
تركيبات رنگ مي تواند مكمل همديگر باشند و نيز مشاهدات كاربران را آسان كند و به آنها اجاز دهد كه هر متني كه در صفحه وجود دارد را بخوانند . بيشتر طراحان عقيده دارند كه متن مشكي بر روي زمينه سفيد ايدهآل است . دليل آن اين است كه اين تركيب كي گيرائي خاص براي خواندن ارائه مي كند و براي كاربران خيلي راحت است زيرا همان متوني كه در رسانههاي ديگر قرار داده مي شوند .
قابليت موقعيتها به شما اجازه ميدهد كه از طرح مشكلي بر روي زمينه سفيد است فاده كنيد و تا جايي كه ممكن باشد نيز ، استفاده ميشود . خيلي از سايتها رنگهايي دارند كه يك كمپاني خاص را نشان مي دهد و يا رنگهاي پر زرق و برق دارند و هميشه از الگوي سياه بر روي مشكي تبعيت نخواهد كرد . دريك دسته بندي ، فقط مكانهايي كه در آنجا سايت جسارت دارد كه از مدل سياه وسفيد بدون آنكه لطمهاي به كارآيي آن سايت وارد شود استفاده كند Home page يا صفحه اول يك وب سايت است .مندرجات اطراف Home page فراوان هستند و سايت ميتواند اهداف خوبي را براي كاربر تأمين كند . اين تركيبات رنگها در المانهاي ديگر صفحه مثل عكسها و چهارچوبها مي تواند استفاده شود و باعث ايجاد انگيزه براي جستجو و درخواست اطلاعات براي كاربرد گردد .
تذكر فني
براي ايجاد تركيبات مختلفل از پيشزمينه و متن، از سايت زير ديدن كنيد :
گذارهاي رنگ
گذار رنگها روشي است كه در آن همجواري رنگها يا جدايي آنها را بيان ميكند . گذارهاي رنگ ما بين رنگ متن و پيش زمينه بسيار مهم و قابل توجه است و براي كمك به جدايي قسمتهاي مختلف صفحه به كار برده مي شود . گذارا هنگامي كه با عكس در صفحه ايجاد مي شوند مسائل زيادي را بوجود ميآورند . وقتي كه گذاراي رنگ هموار (صاف) يا يك عكس ايجاد ميشود كاربران نياز به درجه رنگ بالاتري براي حمايت از آن و نيز به زمان بيشتري براي بارگذاري نياز دارد .
قلمها
نظر به اينكه در ايجاد و انتشار وب ساختار آن نيز مانند ديگر تكنولوژيهاي آن به طور مداوم تغيير ميكنند، دو فونت معمول وجود دارند كه در اينترنت از آنها به كرات استفاده ميشود . اولين آن New Roman براي كامپيوترهاي PC است كه معادل آن Time بر روي سيستمهاي مكينتاش ميباشد ، فونت دوم ، Arial براي كامپيوترهاي pc و معادل با آن Helvetica بر روي سيستمهاي مكينتاش مي باشد . تكنولوژيايي نظير دايناميك و فونتهاي تعبيه شده و توكار براي ارائه سريع و انتخاب بهتر ظاهر ميشوند .
به هر جهت اين فونتهاي معمول يك سايت زيبا و جذاب ايجاد ميكنند ويك نمايش خوب را ارائه دهند .
و اگر گاهي از آن استفاده كنيد احتمالاً متوجه خواهيد شد كه فونتهايي كه به آنها نگاه ميكنيد از موقعيت خوبي برخوردار هستند . ممكن است به سايتي نگاه كنيد كه از فونت ديگري استفاده كرده كه چشمان شما را به آساني درگير ميكند زيرا در بسياري از موار د از آن استفاده نمي شود .
محدوديتها
يكي از محدوديتهايي كه در استفاده از فونت وجود دارد اين است كه فونتهاي انتخابي بادي روي سيستم كاربر نصب گردند تا در مرورگر ترجمه شود و اگر كاربر آن فونت را در سيستم خود نداشته باشد ، مرورگر آن را با فونت پيش فرض سيستم خود ترجمه مي كند. .براي pc ها فونت Time New Roman و Times براي مكينتاش . اگر قصد داريد كه از فونت ديگري استفاده كنيد ،اصل فونت بايد براي كاربران در دسترس باشد تا آنها بتوانند فونت را بارگذاري و سپس آن را بر روي سيستم خود نصب كنند و ا ين كار باعث مي شود كه شما را به تجارب وسرمايهگذاري بر روي سايت خود مطمئن ميكند .
فن چاپ
از آنجايي كه فونتها از اجزاء لازم هر سايتي محسوب مي شوند فونت و رنگي را انتخاب كنيد كه همراه با المانهاي ديگر صفحه بايد بتواند جملات بدون كلام ايجاد كند . خواندن متون زياد مانند چيزهاي ديگري كه مي خوانيد فشار زيادي وارد مي كند و خستهكننده مي باشد و باعث منحرف كردن توجه كاربر مي شود .يك فونت انتخابي خوب مي تواند در صفحه خوابيده شود و يا درخشش خود را براي كاربر تنظيم و ايجاد كند .
serifs
زوايد آرايشي كوچكي وجود دارند كه در انتهاي هر كاراكتر اضافه مي شوند كه در شكل زير وجود دارند .
در فونت Serif
اين زوايد به توانايي خواندن شما با هدايت چشمهاي كاربر در امتداد هر كاراكتر كمك ميكند ولي به هر جهت خواندن اين نوع قلم در سايزهاي خيلي كوچك يا خيلي بزرگ
( كوچكتر از 8 نقطه) مشكل ميباشد . با اين نوع نمايش فونتهاي Serif بايد بيشتر در بدنه سايت جايگزين شود . شكل ظاهري Serif 4 نوع ميباشد :
Sans Serif ( آرايشي )
Sans Serif زوايدي كه در انتهاي هر كاراكتر در فونت Serif وجود دارد را ندارند شكل زير را مشاهده كنيد :
در نمايش كاراكترها از اين زوائدي كه در انتهاي هر كاراكتر وجود دارد كاسته مي شود . فونت Sans Serif بايد كاراكتر به كاراكتر خوانده شود توصيه مي كنيم كه از اين فونت براي متون با اندازه كوچكتر از 8 نقطه و يا اندازههاي خيلي بزرگ استفاده كنيد . معمولاً استفاده از اين 2 نوع فونت با يكديگر در يك صفحه وب تركيب خوبي را ايجاد مي كند .
بايد از مجموعه فونتهايي در سايت استفاده كنيد كه موافق هم باشند و در تناقض با يكديگر نباشند . در يك صفحه وب مي توانيد از مجموعه اي از فونتهاي مختلف استفاده كنيد ولي بايد بدانيد كه براي نمايش موضوعاتي كه در سايت شبيه به هم هستند از فونتهاي شبيه بهم استفاده كنيد . براي مثال تمامي متنهاي Navigation بايد داراي فونت شبيه به هم باشند و يا تمامي پاراگرافهاي معمولي بايد دا رأي فونت نظير هم باشند ولي بعضي از متون ميباشند كه نياز به اين دارند كه با فونت متفاوتي نسبت به بقيه اجزاء صفحه ظاهر شوند مثل اعداد و رويدادها ...
از بكارگيري فونتهاي بزرگ در صفحه پرهيز كنيد چرا كه باعث شلوغ شدن صفحه و ايجاد مشكل براي خواندن آن مي شود . يك صفحه ايدهآل ساختار ثابت و با استحكام دارد و براي كاربر ديد و منظر خوبي ايجاد مي كند . رنگ فونتها نيز بايد مستحكم باشد و نيز كاربر بداند كه آن متن چه چيزي را مي خواهد به نمايش گذارد .
سايز فونت
سايز فونت نرمال براي بيشتر مرورگرها 3 مي باشد واندازههاي ديگر با اين مقدار فرضي اندازهگيري مي شوند . براي مثال اگر بخواهيد سايز فونت را به 5 افزايش دهيد كدي كه براي آن به كار مي بريد بصورت فوق است :
به جاي استفاده از
سايز فونت نرمال براي بيشتر مرورگرها 3 مي باشد و اندازههاي ديگر با اين مقدار فرضي اندازهگيري مي شوند . براي مثال اگر بخواهيد سايز فونت را به 5 افزايش دهيد كدي كه براي آن به كار ميبريد بصورت فوق است :
نوع صحيح TrueType
خيلي از فونتهاي شناخته شده به عنوان نوع صحيح هستند به اين معني كه آنها مي توانند در هر سايز نقطهاي بدون كم شدن كيفيت كاراكترها ترجمه شوند . True Type يك تكنولوژي ديجيتال است كه با كامپيوترهاي Apple توسعه يافته است و امروزه هم با سيستمهاي Apple و هم با سيستم هاي Microsoft استفاده مي شوند . Arial , Time new roman از نوع صحيح هستند .
بعضي از اين فونتها مثل Georgia , Verdena نسبتاً بيشتر ظاهر مي شوند و به زيبايي ترجمه مي شوند وي صفحه سنگين و پرمايه ايجاد ميكنند .
جلوگيري از اثرات بصري نامطلوب
اين فرآيند باعث جلوگيري از ناهمواري لبههاي متن يا نوشته مي شود . اغلب از تصاوير براي نمايش كاراكترها ، كلمات و جملات استفاده مي شود . اين فرآيند كنارههاي متن را بصورت هموار در ميآورد . با تيره كردن خطوط بين متن و پيشزمينه ( پركردن ناصافيهاي لبههاي متن ) لبههاي دندانهدار كنار فونت را از بين ميبرد . اين گزينه بيشترين اثر خود را در تايپ متن با سايزهاي بزرگ ظاهر مي كند .يكي از مضرات اين فرآيند اين است كه مقداري رنگ را به تصوير يا نوشته اضافه ميكند . مخصوصاً در سايزهاي بزرگ ممكن است براي بارگذاري مشكلاتي ايجاد گردد .
خطوط افقي با طول زياد
براي آسانتر خواندن متن از ايجاد متنهايي با خطوط طولاني كه در پنجرههاي مرورگر ايجاد مي شود پرهيز كنيد . خواندن بصورت خط به خط هر بار بازگشت به سمت چپ صفحه در هر زمان ( اگر خطوط داخلي طولاني باشد ) كاري مشكل است . اين نكته را متذكر مي شويم كه خطوط را بصورت پاراگراف ايجاد كنيد و بيشتر از 10 تا 12 كلمه براي مرورگرهاي معمولي را در يك پاراگراف قرار ندهيد . اگر مجبوريد كه متون زيادي در صفحه داشته باشيد دو قالب ستون براي آن ايجاد كنيد .
ملاحظات ديگر
براي يافتن بهترين فونتي كه خواستههاي شما را بهترين حالت برآورد كند نياز به تشخيص دامنه فونت و حدود عبارت براي تغييرات و دگرگوني آن داريد .
بايد همه اين تكنيكها و موارد را مورد آزمايش قرار دهيد . توصيههاي زير مي تواند در جلوگيري از اشتباهات معمول در هنگام توسعه يك سايت به شما كمك كند .
در نظر داشته باشيد كه تمامي فونتهاي مجزا باهم يكي مي شوند و نيز بدانيد كه چگونه فونتها به طراحي شما وابسته هستند .
هر فونتي به طور جداگانه مي تواند تمامي منظورات ما را در يك زمان برطرف سازد . طراحي المانها مثل ( سايز و فاصله خطوط و رنگ پيش زمينه و پس زمينه ، Margin ) همه و همه ميتوانند در محاسبه و ايجاد يك نتيجه مطلوب كمك ميكنند . متن فونتهاي نسبتاً بي اثر مانند Sansserif ميتواند تنوع و دگرگوني عميق در اشكال ساده ميان تركيبات گوناگون انجام دهد .
فونتهاي مرورگر Netscape
براي مرورگر Netscape در سايت www.bitstream.com اشكال كاراكترهايي كه در صفحات كاربر دارند وجود دارد وآنها در يك فايل فشرده (PFR) ذخيره شدهاند .
ميتوانيد فايل PFR را به عنوان يك مرجع براي صفحات HTML و اسناد Style Sheet خود قرار دهيد . وقتي كه صفحه توسط مرورگري مشاهده شد كه از اين فايل پشتيباني مي كرد مرورگر فايل PFR را ميخواند و كاراكترها را دوباره ايجاد مي كند . PFR قادر است كه كاراكترها را در اسناد اصلي براي همراهي اسناد در هرجايي به كار ببرد
فونتهاي ميكروسافت
فونتهاي وب اوليه ميكروسافت Open Type ناميده مي شوند سايت تلاش مشتركي بين ميكروسافت و Adobe مي باشد . از نقطه نظر نگاه وب Open Type مانند Truedoc عمل مي كند و كاراكترها را قادر مي سازد كه از ميان اسناد در فرم متراكم شدهاي عبور كنند .
open type پهناي ابتدائي دارد كه post script , true type نوع 1 را به عنوان يك قالب منفرد در هم ادغام كرده است .
گر چه Type Open , True Dec تكنولوژيهاي رقابتي با يكديگر هستند ولي آنها قادر خواهند بود ه با هم در يك كامپيوتر همجوار باشند و هر فونتي را در صفحه ظاهر كنند به شرط آنكه كاربران آن فونت را بر روي سيستمهاي خود Install كنند . اين قالب اين تعهد را ايجاد ميكند كه كاربراني كه از مرورگرهاي مختلف استفاده ميكنند هميشه هر دو اين تكنولوژيها را حمايت كنند .
بعضي كاربران مرورگرهاي قديمي دارند . به عنون يك طراح وب بايد بتواندي بين تقاضاي خود براي تناسب فونتها و نياز به جلب بيشترين مخاطب ارتباطي برقرار سازد . و اين حقيقت كوشش بيشتر شما را براي ايجاد يك صفحه با منظر خوب ( مستقل از نوع مرورگري كه اين صفحات با آن ديده ميشوند ) را ميطلبد .
فضاي سفيد
هنگامي كه در ابتدا صفحهاي بر روي مرورگر شما بارگذاري مي شود ، علاوه برآنكه در هر قسمت صفحه با مفاهيمي مواجه ميشويد ، نتايج مندرجات محدودي را كه به خوبي و با هماهنگي توزيع شدهاند مشاهده مينماييد . اولين حس شما از اين نوشتهها چيست ؟ اگر شما بمانند خيلي از كاربران هستيد صفحهاي باتوزيع هماهنگ المانها و مقداري فضاي خالي ( كه در انجمن توسعه به عنوان فضاي سفيد معروف است ) را ترجيح ميدهيد . توجه داشته باشيد كه كاربران به خاطر ايجاد صفحهاي با متنهاي زياد وشلوغ از شما قدرداني نخواهند كرد . آنها خيلي سريع صفحه شما را مرور مي كنند و اگر صفحه شما اينچنين بود ممكن است اطلاعات زيادي را ازدست بدهند اين نكته بدان معني نيست كه براي كاربران اطلاعات زياد ايجاد نكنيد بلكه به اين مفهوم است كه نبايد همه اين اطلاعات را در يك صفحه قرار دهيد . هر صفحه وب بايد حدوداً 50 درصد متن كمتري نسبت به يك صفحه مشابه چاپ شده آن داشته باشد . هر صفحه بايد براي ارائه اجمالي اطلاعات طراحي شود و بايد اتصالاتي براي رسيدن كاربران به جزئيات بيشتر و عميقتر ايجاد شود . همه كاربران به يك مقدار اطلاعات نياز دارند . به كاربر اين اختيار را بدهيد كه خود انتخاب كند كه آيا جزئيات را مي خواهد يا نه ؟
و نيز صفحه را به منظور كوتاه كردن آن قسمت نكنيد . مگر آنكه شكستن آن منطبق باشد . هر صفحه بايد مستقل بوده و و ابستگي به جايي نداشته باشد . بعضي از طراحان و انتشار دهندگان وب از جدوال و عكسهاي Gif براي اضافه كردن فضا به صفحه استفاده ميكنند . بعد از محاسبه اينكه كاربران چه چيزي را نياز دارند كه بدانند مي توانيد صفحهآرايي خود را با استفاده از جداول و حاشيهها HTML براي قرار دادن موفقيت سند و مندرجات صفحه در فضاهاي خالي شروع كنيد به عبارت ديگر جداول همه آن چيزهايي هستند كه شما به آنها نياز داريد .
ساختارها
ساختار صفحه با فايلهاي Gif شفاف
يك عكس شفاف مي تواند در صفحه به جاي اشغال كردن فضاهاي خالي وارد شود و نيز شما ميتوانيد طول و عرض آن را با بكار بردن ويژگي هاي در تگ <Image> براي ايجاد ابعاد فضاي درخواستي ، كنترل كنيد . براي مثال اگر بخواهيد پاراگرافي وارد كنيد بايد تگ زير را ايجاد كنيد ( عكس gif همرنگ با background صفحه است ) :
بادادن اين مقادير پارگراف با فاصله pix 15 از سمت چپ شروع ميشود . باهمان رويه ميتوانيد با دادن اين مقادير پاراگراف را با قرار دادن مقادير فوق افزايش دهيد .
عكسهاي Gif ميتوانند در صورت نياز در جداولي براي كنترل سايز ستونها وسطرها در صورت نياز قرار داده شوند . به خاطر داشته باشيد كه هدف ما كاهش بي نظميهاي صفحه ، به اين منظور كه كاربران را قادر به مرور مطالب و اسناد و نيز انتخاب اتصال ديگر كند ، مي باشد .
ساختار صفحه با جداول
طراحان وب بايد به خوبي ساختار صفحه را درك كنند و از جداول در ساختار صفحات استفاده كنند . به طور پيش فرض تمامي موارد در HTML از طرف چپ تراز مي شوند . طراحان وب از جداول براي توزيع مندرجات كل صفحه نمايش در مرورگر استفاده مي كنند . ساختار جدول مي توانند با مندرجات پر گردند نيز مي توان براي جداول قاب قرار نداد تا كاربران متوجه وجود جدول در صفحه نگردند .
Cascading Style Sheet-CSS مي تواند براي رفع جداول در ساختار HTML ايجاد شوند كه متأسفانه همه مرورگرها از آن حمايت نميكنند و فعلاً تا زماني كه CSS بصورت استاندارد جهانب در نيامده از جداول به عنوان استاندارد استفاده مي وشد .
ساختار صفحه با استفاده از فريمها
فريم ها نيز مي توانند براي ساختار صفحات مورد استفاده قرار گيرند با اين وجود آنها نقش مياني در Navigation ها را نيز دارند . فريمها ميتوانند در يك سايت استفاده شوند و بايد به زودي در بحث روند طرح و برنامه ريزي مطرح شوند . به اين خاطر كه فريمها به صورت نمايشي در طرح Navigation اثر دارند . فريم ها بر روي عاملهاي ديگر سايت نيز اثر ميگذارند و سايت را به خوبي آرايش ميكنند .
ساختار صفحه با استفاده از تعيين موقعيت
لايه ها با المانهاي پشتهاي ديگر بصورت عمودي در آمدند و بيشتر مرورگرها از آنها حمايت ميكنند . تا هماهنگي اصلي در لايهگذاري اين است كه Netscape Navigator از تگ <Layer> استفاده ميكند . در صورتيكه Explorer Internet با استانداردهاي V3C . موقعيت ياب CSS براي تمامي المانها مطابقت مي دهد . بنابراين دو فايل آغاز گر مجزا بايد براي اطمينان از مطلوبيت از عبور پايگاه داده استفاده شود . متأسفانه خيلي از ويراستارهاي HTML به طور اتوماتيك هر 2 ورژن را بصورت كد در آوردند .
خلاصه فصل
در اين فصل همه المانهايي كه بايد در يك صفحه وب به كار برده شوند و سپس درباره چگونگي كاربرد آنها بحث كرديم .
در مورد برنامه و قالبهاي گرافيكي و المانهايي كه ساختار صفحه را ميسازند و نيز درباره ساختار فونتها و انتخاب آنها نيز بحث شد و همچنين درباره ابن كه فضاي چيست و فريمها و جداول چگونه در صفحات مورد استفاده قرار ميگيرند .
مقدمه
شما ممكن است توانسته باشيد تمامي منابع طراحي در دنيا را براي سايت خود بكار گيريد ولي نتوانسته باشيد كه سايتي را ايجاد كنيد كه وظايفش را به خوبي انجام دهد ؟ چگونه ؟ زماني كه كارآيي كاربران و مخاطبين خود را در نظر نگرفتيد ، و اين امر يك حركت خودجوش نيست و بايد به تمامي نيازهاي كاربران پاسخ داده شود . اين فصل در مورد تمامي پارامترهايي كه كاربران شما ميخواهند بحث ميكند و به شما نشان ميدهد كه چگونه كارآيي سايت خود را آزمايش كنيد .
اهميت كارآيي مخاطبين ( كاربران )
يك طرح وب بايد از علم مخاطبين خود همراه با navigation مطلع باشد . دانستن حساسيتهاي مخاطبين عامل موفقيت سايت است براي مثال اگر شما براي كاربراني كه سيستمهاي قديمي دارند سايت طراحي مي كنيد و از چند رسانه اي هاي جديد استفاده ميكنيد ، مخاطبين خود را درك نكرديد . درك مخاطبين منوط به آموختن درباره جغرافياي افراد و سن ، تحصيلات ، موقعيت ، درآمد ميباشد ،بعلاوه شما نيازمند آن هستيد كه درباره تكنولوژي كه اين قشر از كاربران درسيستمهاي خود استفاده ميكنند بدانيد ونيز در نظر داشته باشيد كه اين اطلاعات شامل فاكتورهايي مثل سرعت ، ارتباطات ،مرورگراي با وزنهاي مختلف و plug-ins هاي در دسترس مي باشد . هنگامي كه شما اين فاكتورها را دانستيد و درك كرديد بهترين نوع حمايت را از كاربران خود را خواهيد داشت .
آزمايش كارآيي يك سايت ميتواند به المانهاي ممتازي تقسيم شود كه اين المانها در طراحي جزء مفاهيم اوليه هستند . اين المانها دستورات منحصر به فرد نيستند و همه آنها اهميت يكسان دارند ، زيرا تركيب آنها ميتواند قابليتهاي كارآيي سايت را محاسبه كند و حذف هر يك باعث كم شدن كارآيي مي شود .
كيفيت مندرجات : كيفيت مندرجات ارائه شده در يك سايت ارزش محصولات سايت را ارائه ميدهد .
Navigation آسان وكاربردي : كاربران بايد بتوانند خيلي راحت و آسان و با كوشش كم بوسيله Navigation سايت را بپيمايند و الا به سايت ديگري خواهند رفت .
اطلاعات ساختاري : توجه نكردن به ساختار سايت باعث كم كردن كيفيت مندرجات سايت مي شود تأثير مطلوبي بر روي كاربر ندارد و اين نكته بدان معني است كه اطلاعات سايت بايد در ساختارهاي منطقي سازماندهي شوند .
قابليت جستجو : همه كاربران در مورد استفاده از يك موتور جستجو شبيه به هم هستند . بنابراين توانايي ايجاد يك موتور جستجوگر بازيابي و هويت مندرجات شما را فراهم مي كند .
تكنولوژي نرم افزار
قبل از آزمايش
اولين مرحله از آزمايش كارآيي توسعه سايت مربوط به نقطه پاياني آن يعني محصولات مي باشد . يك آزمايش كارآيي نميتواند ارزيابي دقيقي را ايجاد كند . چه كسي بايد اين آزمايش را انجام دهد ؟
اين آزمايش مي تواند با حداقل 5 آلي 6 نفر شروع شود آزمايش سايت با اعضاء تيمهاي طراحي ديگر غير منطقي به نظر مي رسد . بعلاوه موضوع تست بايد براي كاربران واقعي سايت طرح گردد . براي نمونه شما نبايد سايت مربوط به تجارت سهام را باگروه سني جوانان تست كنيد و يا نبايد فقط خود را محدود به دلالان سهام كنيد . ولي يك تست خوب مي تواند شامل همه گروهها باشد . مثلاً در اين مثال شما نبايد آزمايش خود را برروي كساني كه از تجارت كم ميدانند يا اصلاً تا بحال تجارت انجام ندادهاند مطرح كنيد . روش ديگر براي انجام آزمايش ايجاد اطلاعات ورودي ارزشمند از مشاغل مختلف است. كاربران بايد بتوانند كارآيي سايت را در پايگاه داده سايت ثبت كنند و نيز ليستي از كساني كه در سايت تجارت داشتند فراهم گردد . به هر جهت كاربران اطمينان دارند كه شما آنها را به دقت درك كرديد و نظرات آنها در دورنماي سايت شما تأثير داده خواهد شد . اگرسايتهاي داخلي براي يك هدف معين با هم اشتراك داشته باشند يك اينترانت تشكيل مي دهند . به هر جهت بايد اعضاء آزمايش به جزء كساني كه از مراحل پيشرفت و توسعه جدا شدند را در آزمايش بكار گيريد . مهمترين اهداف گروه نمايش دقيق ،از موقعيت و توانايي سايت شما مي باشد . در طي سالهاي اخير و ازدياد خيل كاربران آزمايشهاي كارآئي سايت بدعتي بوده كه در طي سالهاي اخير و ازدياد كاربران آزمايشهاي كارائي سايت بدعتي بوده كه در طراحي صفحات وبنا نهاده شده است . اين قالب متداول كه در حال حاضر در وب وجود داد ، مجموعه كلي نظير يكدسته از انتشارات جداگانه مانند روزنامهها با كتابهايي كه هر كدام در يك زمان قابل دسترس باشند را ، در اختيار كاربران قرار ميدهد . وب به طور كلي پايه و بنيادي براي ارتباط كاربران مي باشد و سايتهاي شخصي جزو ناچيزي از دنياي وب هستند .
سرعتي كه كاربران با آن مرورگرهاي خود را به روز مي كنند ،به طور مسلم با ازدياد كاربران بر روي خط اينترنت كاهش مييابد . مطالعات نشان ميدهد كه سرعتي كه كاربران براي به روز كردن مرورگر از ورژن 3 به ورژن 4 صرف ميكنند بيشتر از برزو كردن مرورگر از ورژن 2 به 3 مي باشد. بعضي از فاكتورهاي زير در جابجايي آرام مرورگرها لحاظ مي شود . بستر كاربران به واسطه كاربران تكنيكي زيردستي كه به لحاظ خودشان به اينترنت علاقهمند هستند رشد زيادي داشته است . بيشتر كاربران امروزي به جاي توجه به نرمافزار و تكنولوژي توجه خاصي به مندرجات سايت دارند . بنابراين براي بروز كردن مرورگر خود تمايلي نشان نخواهند داد .
تعداد زيادي از كاربران جديد نمي دانند كه چگونه بايد مرورگر خود را به روز كنند . بنابراين كار خود را با مرورگري كه دارند ادامه مي دهند . در قبل اكثراً كاربران اينترنت استاد و خبره بودند ولي امروزه بيشتر كاربران متخصص نيستند و توانايي كمكي در بارگذاري ، نصب و نتظيمات نرم افزار دارند .
در باب اضافه كردن ويژگيها و با توسعه آزمايش و كارآيي و بروز رساني ، مرورگرهاي اخير اجبار كمتري نسبت به قبل دارند . مرورگرهاي اوليه مقدماتي بودند . توسعههاي نسبي كه از يك مرورگر به مرورگر بعدي منتقل مي شود نسبتاً قابل توجه بوده و براي بروز رساني به نفع كاربرهاي قديمي مي باشد .
اندازه زمان بارگذاري و بروز رساني سريع با استفاده از پهناي باند در دسترس توسعه يافته است بنابراين بروز رساني به خدمات اتصالي پرهزينه تري يا زمان بيشتري احتياج دارد . مطابق با سايت ميكروسافت
Explorer Internet ورژن 4 در بسياري از موارد به عنوان مرورگر از Ayvest استفاده شده است .
قابليت آزمايش
يكي از روشهاي ايجاد يك سايت مطلوب ، تست كردن كارآيي آن مي باشد . انتشار دهندگان و توسعه دهندگان اشارهاي بر اين كه طراحي سايت آنها وابسته به مخاطبين خواهد بود ندارند . توسعه دهندگان وب از نتايج توليداتشان آگاهيهاي لازم را بدست مي آورند و مفهوم سايت را درك ميكنند . اين آگاهي به توسعه دهندگان سايت يك نگاه كلي از واقعيات ارائه مي كند . آنها ميتوانند سايت را بپيمايند و اطلاعات را پيدا كنند . زيرا ارتباط نزديكي با پروژههاي كاري خود دارند .
كارآيي سايت ميتواند با كاربراني كه ديد و شناختي از سايت ندارند حساب شود . مديريت يك آزمايش كارآيي با داشتن يك ديد علمي از سايت ايجاد ميشود .
وظايف كارآيي
در هنگام اجراي آزمايش اعضاء بايد براي انجام وظايف واقعي از يكديگر سئوال كنند . ليستي از وظايف و عملكرد هر قسمت بدون اشاره بر اجراي آنها ايجاد كنيد . اين سايت خود به كاربران ميگويد كه آنها چه چيزهايي نياز دارند كه بدانند . لازم است كه ازشركت كنندگان هم پرسيده شود كه المانهايي را كه دوست دارند و نيز مواردي كه دوست ندارند را مشخص كنند و رعايت اين موارد باعث ايجاد يك سايت كارآمد مي گردد . شايد براي طراحان وب شنيدن انتقادات از شركت كنندگان در آزمايش سخت باشد و آنها را ناخشنود سازد، اما نبايد مانع از پيشرفت شود .
نتايج
بعد از اتمام آزمايش مصاحبهاي با شركتكنندگان داشته باشيد . بايد اغلب به آنها در بيان كردن مواردي كه از ياد بردند كمك كنيد آنها ممكن است فرصت كافي براي نوشتن نيز نداشته باشند . بايد سئوالات زير را از آنها بپرسيد . :
1ـ احساسات اوليه شما بعد از ديدن سايت چه بود ؟
2ـ عكسهاي سايت چه نوع شركتي را براي شما به تصوير ميكشد ؟
3ـ آيا طرح اصلي ساختار سايت را درك كرديد ؟
4ـ عناصر و المانهاي عمده سايت را به ياد داريد؟
درخواست نتايج
ممكن است در حين آزمايش بعضي از موارد ناكارآمدي سايتتان نمايان گردد . به عنوان يك طراح ممكن است كه اشكلات و انتقاداتي از سايتي كه در طراحي آن كوشش داشتيد ، گرفته شود . اما حتماً بايد نتايج را ضبط و ترتيب اثر دهيد . ناراحتي كه از انتقاد از شركتكنندگان آزمايش براي شما ايجاد ميشود بسيار بهتر از آن خواهد بو كه سايتي بدون كارآيي خوب ايجاد كنيد و همواره بهتر آن است كه حجم زيادي از انتقادات را دريافت كنيد ولي به جاي آن سايتي با كيفيت خوب ارائه ميدهيد .
تمرين محاسبه كارآيي يك وب سايت
به سايت برويد و داخل سايت را بپيمائيد و آسان و در مورد گردش در آن و نحوه ارايه محصولات نظر خود را بيان كنيد .
1ـ اين سايت ساختار خوبي دارد و اطلاعات بصورت شفاف در هر صفحهاي قرار دارد و لينكهايي نيز براي دسترسي به نواحي ديگر سايت قرار دارد . اين لينكها مخصوصاً براي پيمايش راحت و پيدا كردن سريع اطلاعات بنا شده است .
2ـ به سايت و در ميان سايت پيمايش كنيد و سعي كنيد كه آيتمهاي ويژه آن را پيدا كنيد ( اسم – سايز – رنگ و به جلو )
ساختار اين سايت به خوبي سايت قبلي نيست و علت اصلي آن اينست كه بيشتر اطلاعات در يك صفحه قرار دارد و ضروري نيست كه از يك صفحه به صفحه ديگر بپيمائيد بعلاوه سايت داراي گروهي از Navigation هاي تعريف شده خوب در بالاي صفحه براي پيمايش مي باشد . ليست لينكها در قسمت چپ صفحه مي تواند باعث ايجاد آشفتگي گردد . بعلاوه خيلي از صفحات شامل تعداد زيادي تصوير مي باشد كه به جاي ايجاد شفافيت سردرگمي ايجاد ميكند .
3ـ وارد سايت شويد و در آن سايت پيمايش كنيد و سعي كنيد كه مناطق ويژه مورد علاقه را پيدا كنيد .
سايت Yankee بهتري مثال از يك سايت گيرا مي باشد . اتصالات Navigation در بالاي صفحه و بصورت واضح جايگزين شده است و كاربران فرصت پيمودن را با انتخاب موارد Navigation دارند . اتصال به سايتهاي وابسته بوسيله تصاوير سمت چپ امكانپذير است . ا ين سايت همچنين داراي امكانات Flash براي مرورگرهايي كه از آنها حمايت ميكنند نيز هست و نيز اين سايت تجهيزات لازم براي كاربراني كه Plugins ندارند را مهيا ميكند .
خلاصه فصل
در اين فصل درباره دانش كاربران و اثر كارآيي سايت و نيز درباره فاكتورهاي تأثيرپذير و آزمايش كارآيي و نتيجه آن بحث كرديم .
اهداف
1ـ توصيف اهميت Navigation
2ـ شرح اينكه چگونه مرورگر Navigation را كنترل مي كند .
3ـ توصيف ساختار سايت
4ـ تعريف قراردادهاي مشابه
5ـ جستجو و كاوش براي يك طرح Navigation
مقدمه
طراحي خوب درباره اينكه اثر مطلوب و گيرايي دارد و مندرجات را به خوبي توصيف ميكند . بدون يك برنامهريزي دقيق از اينكه چگونه محتويات سايت را به خوبي به هم اتصال دهيد طراحي سايت دچار سردرگمي خواهد شد و با شكست مواجه مي شود . كاربران بايد بدانند كه نقاط مبهم ديگر در كجا قرار دارند و چگونه بايد به آنجا بروند و چنانچه هر كدام از اين فاكتورها را فراموش كرديد كاربران به سايتهاي ديگر خواهند رفت .
چرا Navigation مهم است ؟
فرآيند جستجو و كاوش ( سايت پيمائي ) اغلب در قسمت چپ صفحه قرار داده ميشود . در ابتداي طراحي يكسايت وب معمولاً با صفحه اي ايجاد ميكنيد و سپس اتصالات ديگر را به صفحه خود اضافه ميكنيد . به هر جهت اگر شما دور انديشي لازم در مورد اينكه چگونه كاربران در سايت شما گردش مي كنند را نداشته باشيد ، نتيجه آن سردرگمي در سايت خواهد بود .
Navigation فقط به معناي حركت از يك مكان به مكان ديگر نيست بلكه Navigation جا به جايي از يك نقطه به نقطه ديگر از يك روش كنترل شده و سنجيده و با منظور معين مي باشد. بدون برنامه ريزي هيچگاه به يك پيمايش درست در سايت نخواهيد رسيد . هنگامي كه سوار ماشين مي شويد احتمالاً به مغازه و يا سر كار برويد . در ابتدا خود را براي مسافرت آماده ميكنيد و در رسيدن به مقصد سردرگم هستيد . ولي كار در مرحله دوم برايتان آسانتر است زيرا به راه و نشانههاي آن آشنا شديد . حال احتمالاً بدون فكر و اينكه چگونه از اتوبان استفاده كنيد سفر را آغاز ميكنيد راحت هستيد و احساس سردرگمي نداريد و در هر زمان مي دانيد كه در كجا هستيد. حالا به يك مسافرت به شهر جديد فكر كنيد . چه احساسي داريد ؟ ترديد درباره اينكه شما كجا هستيد و چگونه به مقصد هدايت ميشويد ؟ در ارتباط با همين احساس علامتهاي متفاوتهاي براي راه مثل چراغهاي خيابان و ساخت اتوبانها وجود دارند . كاربران جديد هم در هنگام ديدن سايت شما همين حس را دارند . آنها گردشگر هستند و نمي دانند كه هنگامي كه به صفحه اول سايت شما رسيدند به كجا بايد بروند .
به عنوان يك طراح وب وظيفه شما اين است كه به جهت آنكه كاربران به راحتي از سايت شما لذت ببرند Navigation ايجاد كنيد تا آنها به طور كلي با سايت آشنا شوند و تشخيص دهند كه كجا هستند ؟
مطالعه اين مسير به زمان نياز ندارد و با يك طراحي خوب و با كمك يك كليك تمامي را شناسانده مي شود .
مرورگرها و Navigation
بيشتر معماري مرورگرهاي وب با عوامل زير توسعه داده مي شود .
دسترسي به لايههاي مرورگر وب : شامل پروتكلهايي براي ارتباط با سايتهاي دور ، تنظيم http تا انواع گوناگوني از پروتكلهاي سري مثل SSL
لايههاي Navigation : كاربراني كه در سايت بودند را نگه مي دارد و به آنها كمك ميكند كه كجا بروند و ميتواند شامل سيستمي باشد كه نشان ميدهد از كدام سرويس كاربران بازديد كردند .
نمايش لايهها : پنجرههاي مرورگر كه صفحات درخواست شده كاربران را نشان ميدهند .
هر مرورگر اجزاء منحصر به فردي دارد كه در پيمودن سايت به كاربران كمك ميكند . ولي اكثر مرورگرها در موارد زير با هم اشتراك دارند .
ابزار برگشت به عقب Tool Bar Back Button
ابزار برگشت به جلو Tool Bar Forward Button
ميدان آدرس Uniforme Resource Location_ URL Address Filed
تاريخچه مرورگر Browser History
علاقه منديها Bookmarks Favorites
نوار وضعيت Status Bar
رنگي كردن ابر اتصالات Color Hyper Link
يك تمرين معمولي براي استناد به المانهاي Navigation در سايت وجود دارد . بعضي از طراحان در پايان صفحه يك ابر متن براي برگشت ايجاد ميكنند كه كاربر ميتواند براي برگشت به صفحه اول روي آن كليك كند .
بقيه تغييرات رنگ اتصالات پيش فرض ممكن است كاربر را دچار سردرگمي در ارتباط با جايي كه در آن قرار دارند . بعلاوه اين المانها براي كمك به كاربر طراحي شده است . بنابراين بايد نسبت به Navigation از اهميت دوم برخوردار باشد . كاربر نبايد مجبور به استفاده ازكليدBack باشد زيرا ممكن است راه خود را گم كند .
Navigation اوليه و ثانويه
Navigation به طور عادي به 2 نوع مقدماتي و ثانويه ردهبندي شده است . Navigation مقدماتي شامل المانهاي Navigation است كه در بيشتر مكانهاي سايت در دسترس هستند . المانهاي Navigation ثانوي : كه به كاربر اجازه مي دهند تا در مكانهاي ويژه گردش كنند . براي مثال خيلي از سايتها صفحاتي دارند كه اطلاعاتي در مورد يك شركت را ارائه ميدهند . اين Navigation هاي نوع دوم ممكن است اتصال درباره ما (About US) باشد . هنگامي كه كاربر به صفحه About us (درباره ما ) ميرسد ممكن است در اينجا اتصال ديگري وجود داشته باشد . براي مثال خيلي از سايتها صفحاتي دارند كه اطلاعاتي در مورد يك شركت را ارائه مي دهند . اين Navigation هاي نوع دوم ممكن است اتصال درباره ما (About us) باشد . هنگامي كه كاربر به صفحه About us ( درباره ما) مي رسد ممكن است در اينجا اتصال ديگري وجود داشته باشد . براي مثال ممكن است در آنجا اتصال براي اطلاعات سرمايهگذاري ، مكانهاي ديگر و مطبوعات آزاد و ... باشد . اين اتصالات جزء المانهاي Navigation ثانوي هستند . زيرا آنها مربوط به صفحه درباره ما (About us) هستند نه مربوط به صفحات ديگر سايت و بنابراين اين اتصالات نميتوانند در نواحي ديگر سايت پيدا شوند .
سلسله مراتب Navigation
بيشترين جذابيت گرافيكي وب اين است كه هر صفحه بر روي هر سايت فقط با يك كليك ايجاد ميشود . اين خاصيت محدوديتي كه شما در دنياي خطي با آن مواجه بوديد را از بين ميبرد . بيشتر فعاليتهاي روزانه خود مثل خواندن ، كاركردن و رانندگي در نوع خطي دنبال مي شوند . در ابتدا عملي را شروع ميكنيد و مرحله به مرحله ارائه مي دهد تا تمام شود ولي اين مدل از طراحي كمك ميكند كه محدوديتهاي دنياي خطي از ميان برداشته شود .
مكاني كه در آنجا كار ميكنيد يك سلسله مراتبي دارد و يك سازمانبندي ديناميكي براي آن تعريف شده است . خانه شما نيز يك سلسله مراتب دارد و والدين در بالاترين جايگاه قرار دارند و بچهها در زير اين لايه قرار دارند . اين مفاهيم دقيقاًبيان ميكند كه چگونه قابل سازماندهي و اداره مي شوند . وب سايت نيز از مثالهايي كه ذكر كرديم متفاومت نيست . در ساختار وب در قسمت بالا ، صفحه خانگي (homepage) قرار دارد و زير آن صفحات ديگر قرار دارند كه طبق مثال قبل اين صفحات همان بچهها هستند .
اين صفحات بصورت خطي نيستند و شاخه شاخه ميباشند و با حجمهاي متفاوت رشد كرده و وابسته به مفاهيمي هستند كه هر شاخه را هدايت ميكند . اين ساختار به عنوان ساختار اطلاعات سايت شناخته شده است .
آگاهي از موقعيت
كاربراني كه ميخواهند از سايت شما اطلاع پيدا كنند لازم است كه ساختاز سايت را بدانند و اين مسأله باعث ميشود كه كاربران سرگرم شوندو با سايت بمانند . هميشه بايد يك علامتي وجود داشته باشد كه كاربران بوسيله آن از موقعيت خود آگاهي پيدا كنند . آگاهي از موقعيت شامل آگاهي از مبداء و يا صفحات ديگري است كه وابسته به صفحه ما هستند . خيلي از تكنيكهايي كه براي آگاهي كاربران ميتواند ايجاد شود شامل موارد زير است :
عنوان – سرفصل
عنوان هر صفحه ايجاد وسيله مؤثر براي دانستن و تعيين موقعيت جايي كه در آن قرار دارند . محدوديت استفاده از اين روش براي آگاه شدن از موقعيت در اين است كه در اين روش فقط موقعيت مكان جاري نشان داده ميشود و موقعيتهاي وابسته ( نظير صفحات بچه ) طبق مثال قبل را نشان نميدهند .
رنگها
بعضي از سايتها از رنگهايي استفاده ميكنند كه اشاره به موقعيت دارند ( يعني با بكار بردن درجات رنگ مختلف براي جاهاي مختلف ) محدوديت استفاده از رنگها در اين است كه كاربر بايد طرح رنگ را درك كندو سپس براي گردش در سايت بتواند با آن ارتباط برقرار كند. محدوديت ديگر استفاده از رنگها براي كاربراني مي باشد كه از لحاظ بينايي دچار مشكل هستند و اين استراتژي براي آنها بياثر است .
تصاوير
تصاوير براي آگاهي از موقعيت علامتهاي مفيدي ايجاد ميكنند . به عنوان مثال كليدهايي كه از آنها براي برنامهريز روزانه استفاده مي شود را در نظر بگيريد . اغلب يا بيشتر اين كليدها در محدوده ديد قرار دارندو هر كليد نامي دارد و كليدها در هر مكان ظاهر متفاوت دارند . اين استراتژي براي آگاهي از موقعيت مؤثر تر است زيرا صفحات مادر و بچه از هر مكاني در محدوده ديد قرار ميگيرند .
cooki
علائمي مثل خطوط اشاره بر مسير (Navigation) ميتوانند شما را در رسيدن به موقعيت جاري كمك كنند كه اين علامت براي حركت كاربران در صفحات چند گانه مفيد است .
نقشه سايت
نقشه سايت در اسناد جداگانه در HTML وجود دارند و هر صفحه از سايت مي تواند با متون ساده و شرحهاي گرافيكي به نمايش گذاشته شود . كاربران ميتوانند از اتصالات نقشه سايت براي رسيدن به صفحات دلخواه استفاده كنند . محدوديتي كه در اين روش وجود دارد اين است كه كاربران براي ديدن نقشه سايت مجبور به ترك صفحه جاري هستند .
عمل Navigation ، نمادهاي تصويري و نظارتها
سه كليك براي مديريت كاربران براي دسترسي به فايلها را به خاطر آوريد . كاربران نبايد در موقع گردش در سايت براي پيدا كردن اطلاعات درخواستي وسايتها بيشتر از 3 بار بر روي اتصالات كليك كنند . اين خطوط راهنما براي آگاهي و جستجو در سايتهاي وب بسيار مهم است . مسيرهاي لنگري مجهول كاربران را دچار سردرگمي كرده و آنها را از بازگشت به سايت نا اميد ميكنند . درنظر بگيريد كه آيا چند رسانهايها قالبهايي جهت مسيريابي ايجاد ميكنند و يا صرفاً اضافي ميباشند . به عنوان مثال اگر در سايت خود از Navigation Flash استفاده كنيد . براي مرورگرهايي كه از Flash حمايت نميكنند مشكل ايجاد ميكنيد . يك حس و ديد خوب جهت يابي براي كاربران خيلي مهم است . نوار ابزار Navigation بايد خيلي ساده و روشن باشد و به درستي درك شود.
آيكونها خيلي عمومي و عامه پسند هستند و بيشتر مردم به آنها آشنا هستند . آيكونها2 نوع دارند :
برچسب دار ، بدون برچسب ؛
اگر لازم باشد كه كاربران حدس بزنند كه آيكون آنها را به كجا هدايت ميكند اين آيكون بايد برچسب داشته باشند .
ـ بقيه اجزاء متداول Navigation به قرار زير است :
1ـ كليدها
2ـ نقشههاي تصويري و نقاط اشارهگر ماوس
3ـ بردارها
4ـ جداول
5ـ جداول Navigation و منوها
6ـ منو باز شونده
نگاهي به مرورگر
مرورگرها بصورت محدود شدهاي از Navigation حمايت ميكنند . بنابراين براي كمك به كارران در راه و غلبه بر محدوديتهاي نرم افزاري با ايجاد Navigation هاي گسترده صفحه خود را طراحي كنيد .
دادن هويت به سايت در تمامي صفحات به منظور اينكه كاربران بدانند در كجا قرار دارند ، ايجاد يك لوگوي پيوسته كه اغلب در گوشه سمت چپ صفحه نمايش قرار دارد .
نشانه اختصاصي براي صفحه را به راحتي بسازيد . هر صفحه بايد بوسيله ابر اتصالات و جستجوگر به سايتهاي ديگر متصل شود .
از تگ <meta> و كدهاي script براي جلوگيري از دسترسي به تاريخچه مرورگر استفاده نكنيد .
بعضي از سايتها از تگ meta براي تجديد كردن يك صفحه به منظور جلوگيري از بازگشت كاربران به صفحهاي كه قبلاً بازديد شده است استفاده ميكنند .
تأكيد بر ساختار و معماري اطلاعات شما
هر صفحه را به گونهاي درست كنيد كه ساختار و المانهاي صفحه را نشان دهد وشامل اتصالات ديگري براي مرور كردن صفحات اصلي كه در بالاترين نقطه ساختار قرار دارند باشد . اين اتصالات نميتواند نامهاي عمومي مثل (Go Top) را داشته باشد اما بايد نامي براي اشاره داشته باشند .
تا آنجا كه ممكن است رنگ لينكهاي پيش فرض را عوض نكنيد . با اتصال به صفحات بازديد نشده سايه آبي رنگ ايجاد مي وشد . استفاده از رنگهاي پيشفرض به كاربران كمك ميكند كه بدانند كدام صفحه را بازديد كردند .
نقشه سايت كه شامل ساختار و اطلاعات مهم مي باشد.
ساختار سايت ،URL و نام فايلها
مانند شاخههاي ديگر، وب سايت نيز در فرمهاي شاخهاي و مرتبهاي بنا شده است . اين شاخهها قالب اطلاعاتي كه مرورگرها براي پيدا كردن (URL) به آنها نياز دارند ايجاد ميكند . نام فايل نقش مهمي را در قسمت آدرس وب بازي ميكند . نام فايل بهمراه URL به كمك يكديگر، براي درك بهتر كاربر از ساختار وب سايت كمك ميكنند .
ساختار سايت
ساختار يك سايت دقيقاً بيان ميكند كه چگونه يك سايت در وب سرور ذخيره ميشود . ميتوانيد به فايلهايي كه بر روي سرور وجود دارند فكر كنيد . آنها همان عملي را كه وقتي در روي PC ها قرار دارند انجام ميدهند . بر روي يك PC درايو اوليه \:C ميباشد ، ساختار را با زير ساختارهاي ديگر مانند زير ادامه دهيد . Files program يا My Document Windows و ... هر شاخه شما را به زير شاخههاي بيشتري هدايت ميكند . اين نوع نظامبندي ساختاري را كه به مديريت سيستم شما كمك ميكند ايجاد ميكند ، وقتي كاربر آدرس را در قسمت نوار آدرس مرورگر وارد مي كند ، مرورگر به آن شاخهها دسترسي پيدا ميكند كه اين مسير ميتواند با مسير C:\drive سيستم خود قابل مقايسه باشد و در طرف ديگر آن نامگذ اري فايلها و طريقه گذاشتن آن در سرور تعيين مي شود .
وب سرور همچنين فايلها و تصاوير را در شاخههايي كه شما ايجاد كرديد ذخيره ميكند . ساختار فايلها بر روي سرور به شاخه و زيرشاخههايي تقسيم ميشود كه پيشنهاد ميشود محلي براي مديريت درخواستهاي شما باشد . تمامي فايلهايي كه بر روي شاخه PC شما قرار دارند را در نظر بگيريد مديريت اين فايلها مشكل به نظر مي رسند . وقتي ساختاري توسعه مي يابد توجه كنيد كه هر فولدر در زيرشاخهاي وجود دارد و شما ميتوانيد در هر زيرشاخه تصاويري را قرار دهيد . بهتر است تمريني براي نگهداري فايلها در زير شاخهها و نظم بندي ساختار داشته باشيد . اين ساختار ميتواند توسعه پيدا كند و فايلهاي جديدي در زير شاخهها قرار گيرد . از اين جهت شما بايد از روشهاي قابل فهم و معنيداري براي ساختار سايت استفاده كنيد .
RULS
URL براي محاسبه موقعيت و عمق يك وب سايت استفاده ميشود . براي مثال اگر كاربران بخواهند اطلاع پيدا كنند كه در كدام قسمت سايت قرار دارند ميتوانند با نگاه كردن به URL آدرس بار اين كار را انجام دهند تا بتوانند موقعيت خود را تشخيص دهند . با مثال فوق در نظر بگيريد كه يك URL چگونه بر موقعيت جاري اشاره ميكند . اين روش فقط موقعي كار ميكند كه شاخهها نامهاي معنيدار داشته باشند . دوباره تأكيد ميكنيم كه نام فايلها بسيار مهم است و به پيمايش و ساختار سايت كمك مي كند .
نام فايلها
نام فايلها مي توان به همان اندازه نام شاخه مفيد باشد . اگر نام فايل HTML تائيدي بر اين نكته باشد كه كدام صفحه توسط كاربر بازديد شده است مي تواند به فرآين سايت پيمايي كمك كند . براي مثال URL فوق و نام فايل به كاربر دقيقاً ميگويد كه كدام صفحه را بازديد مي كند .
قرارداد معمول
Navigation هايي كه براي سايت خود انتخاب ميكنيد نبايد در سايت منحصر به فرد باشد . اين امر مي تواند براي سايتهاي ديگر نيز مفيد باشد . خيلي از المانهاي عادي كه در وب از آنها استفاده ميكنيد براي كاربران مانوس مي شوند و بنابراين معاني از پيش تعريف شده خواهند داشت . بيشتر اين المانها بر چسب دارند . براي مثال وقتي كاربر دگمه و كليد بر چسب دار Home page را ميبيند ميداند كه آن لينك وي را به كجا خواهد برد براي اتصال به صفحه خانگي از Lable هايي مثل نقطه ورود استفاده نكنيد . به ياد داشته باشيد كه كاربران مانند يك گردشگر هستند و شما بايد كاري كنيد كه آنها را راضي نگه داريد و آنها همواره با شما باشند . در ادامه بحث خيلي از Logo ها يا تصاوير نشانهدار بايد به صفحات خانگي متصل شوند . بقيه برچسبهاي عادي مثل Search يا Find كاربران را براي جستجو به سايتهاي ديگر هدايت ميكند .
(FAQS,Downloads,News,Sitemap,About Us,US Contact) همگي از برچسبهاي معمول در سايتها هستند . سعي نكنيد كه از برچسبهاي منحصر به فرد استفاده كنيد ، چرا كه بهتر آن است كه كاربران بتوانند برچسبها را تشخيص دهند تا بتوانند به راحتي در سايت گردش كنند .
Guided Navigation ( راهنمايي Navigation)
از تكنيكهاي معمول ديگر براي كمك به كاربران در حين سايت پيمايي راهنمايي آنها است . با ايجاد يك اتصال به نقاط ديگر در واقع براي كاربران خود در وب ورودي براي حركت به نقاط ديگر ايجاد ميكنيد . اين اتصالات بايد براي اطلاعات ضروري ايجاد شود و نيز به كاربران اجازه خروج بدهند . به عنوان مثال با خريد بروي اينترنت ( به صورت online ) كاربران براي خريد از ميان اطلاعات عبور مي كنند و سپس براي دريافت اطلاعات بهايي پرداخت ميكنند . اگر از تصاوير گرافيكي استفاده ميكنيد بايد به نحوي باشند كه قابل درك باشند و مخاطبين قادر باشند به راحتي با تشخيص المانهاي كه قابليت كليك شدن را دارند در سايت گردش كنند .
نقشه فعاليت Navigation
Navigation چون بطور محسوسي به نوع تفكر و سليقه شخصي طراح بر ميگردد گاهي اوقات مي تواند مشكلاتي ايجاد كندو از ديدگاه طراحان كارآيي navigation ها متفاوت هستند .
اگر Navigation يك سايت كاربردي نباشد كاربران از سايت شما خواهند رفت و بالعكس آن اگر Navigation خوب عمل كند كاربران به راحتي از مكاني به مكان ديگر گردش مي كنند . Navigation سايت بايد آزمايش شود و اين مرحله نياز به برنامه دقيق و حساب شدهاي دارد .
موارد زير را در نظر بگيريد :
ـ محاسبه اهداف و نيازهاي كاربران
ـ يادگيري از Navigation هايي كه كارآيي خوبي دارند .
ـ رفتن به عمق سايت
ـ ايجاد اتصالات سريع
ـ پيشبيني اين مسئله كه كاربران سلايق و پيشزمينههاي متفاوتي دارند .
پيشبيني مقاصد و نيازها
طراحي Navigation براي پيشبيني فعاليتهاي كاربران سايت و ساختن يك سايت براي حمايت از كاربران مي باشد و براي انجام آن بايد بدانيد كه كاربران سايت چه مقاصد و نيازهايي دارند . براي محاسبه اهداف و نيازهاي كاربران نياز به مصاحبه با مردمي كه از سايت شما ديدن ميكنند خواهيد داشت . بايد زماني را براي مصاحبه با كاربران و آگاهي از فعاليت روزانه آنها قرار دهيد . براي ايجاد يك سايت تجاري با كاربران زياد وبا استعداد بايد درباره اولويتهايي كه ميخواهند در سايت داشته باشند پرسش كنيد و كوشش كنيد كه مقاصدي كه در پشت درخواستهايشان دارند را نيز درك كنيد . راه حل اصلي آن است كه براي مشكلات و معماها بايد راه حل مطلوبي بدست آيد و اين مهم فقط با مصاحبه با كاربران سايت بدست ميآيد .
آموزش از Navigation هايي كه كارآئي خوب دارند
اين مورد بيشتر از سايتهايي بايد آموخته شود كه پيمايش در آنها آسان است . المانهاي معمولي كه در پيمودن يك سايت موفق هستند را در نظر بگيريد . صرفنظر از ديدگاههاي كه تا به حال استفاده كرديد يك Navigation خوب داراي خصوصيات زير است :
ـ داشتن ظاهري آسان و ساده
ـ پايداري و بقاء
ـ ايجاد اتصالاتي براي بازگشت
ـ نمايش در زمينه
ـ حق انتخاب براي كاربر
ـ ايجاد پيامهاي روشن و گيرا
ـ ايجاد برچسبهاي قابل درك و تشخيص
ـ حفظ اهداف اختصاصي سايت
ـ تأمين اهداف كاربران و مراقبت از آنها
تمامي اين موارد مهم هستند اما ايجاد اتصال احتمالاً بيشترين اثر را براي كاربر دارد . Navigation ها بايد به مردم بگويد كه آنها كجا هستند و اگر ممكن باشد بگويد كه كجا بايد بمانند . كاربران بايد قادر باشند كه به راحتي اتصالات و موارد با قابليت كليك را شناسائي كنند . آنها نياز دارند كه بدانند كه آيا خريدي كه كردند و جستجويي كه انجام دادند و ظايف ديگر با موفقيت آنجام شده است ؟ با ايجاد بازگشت ميتوانيد احتياجات اصلي را براي Navigation تأمين كنيد .
رفتن به صفحات عميقتر ازصفحه خانگي
حتي در سايتهايي كه Navigation هاي ضعيفي دارند گردش از صفحه خانگي به صفحات ديگر دروني سايت بدون مشكل زيادي آسان است . ولي در هر صورت برنامهريزي صفحه خانگي شما يك بخش كوچكي از وظيفه شما در قبال Navigation مي باشد .
به هر جهت برنامهريزي خوب براي Home page يكي از كوچكترين كارهايي است كه براي ايجاد Navigation خوب و موفق بايد رعايت كنيد . هر چقدر در فازهاي اوليه طراحي جزئيات را بيشتر رعايت كنيد كاربران شما بامشكلات كمتري مواجه خواهند شد . بيشتر مشكلات Navigation اين است كه پارامتري براي رفتن از صفحه خانگي به صفحات ديگر وجود ندارد . اين مشكلات منجر به گرفتار كردن و به گل نشستن كاربران در سايت ميشود . معمولاً اين اتفاقات به دليل توجه بيش از اندازه به طراحي Navigation در يك جهت خاص روي ميدهد . در طراحي Navigation تمامي اين جزئيات و نيز مواردي كه دور از شما ميباشند و ممكن است براي سايت پيش آيند در نظر گرفته شوند .
ايجاد اتصالات سريع
ساختار صفحه را به طور كلي در نظر بگيريد و كمي وقت را براي ساختن ميانبر در سايت صرف بگذاريد . بعضي از اين ميانبرهاي معمولي شامل جستجو نقشه سايت و جداول (site map , table , search) هستند . هدف از هر ميانبر كمك به كاربران براي پيدا كردن سريع اطلاعات مي باشد و شما بايد راه ميانبر را با اين هدف در ذهن خود طراحي كنيد . خيلي از المانهاي صفحات كاربردي نيستند زيرا يك سري از موارد گمراه كننده را ارائه ميدهند . مثلاً نقشه سايت زمان زيادي را براي بارگذاري نياز دارد و يا جداول نياز به Scroll كردن دارند . راههاي ميانبر بايد ساده ، سريع و قابل درك باشند و نيز بايد بدانيد كه كاربران استعدادها و تواناييهاي متفاوتي دارند . به عنوان مثال نحوه تأثير علايق شخصي در ايجاد يك Navigation كاربردي را مي توان در جستجو كردن و عملكرد افراد در سايتها دانست . بعضي از كاربران دوست دارند تا جايي كه ممكن است از پرسه زدن در سايتها خودداري كنندو اطلاعات دقيق خود را در زمان كمي بدست آورند . اما بالعكس كودكان در هنگام جستجوي اطلاعات معمولاً تمايل به گردش در سايت را دارند و وقت بيشتري را صرف ميكنند . طراحي Navigation مشكل است اما در عين حال كمك به كاربران براي رسيدن به مقاصدشان مي باشد . همواره به خاطر داشته باشيد كه Navigation ها بايد به كاربراني كه ميخواهند در سايت شما به مقاصد خود دست يابند كمك كرده و آنها را هدايت ميكنند . براي اطلاعات بيشتر مربوط به Navigation ها به آدرس زير مراجعه كنيد .
خلاصه فصل
در اين فصل در مورد اين كه ساختار Navigation درطراحي بسيار مهم است بحث شد . بايد ساختار سايت و چگونگي ايجاد آن بر روي سرور را امتحان كنيد . در مورد انواع مختلفي از المانها آموختيد و ياد گرفتيد كه چگونه آنها براي آگاهي كاربران ايجاد ميشوند نيز بحث شد . همچنين در مورد كنترل Navigation مطالعه كرديد و ديديد كه چگونه ميتوان آنها را گسترش داد و در پايان مروري بر برنامه حمايت يك طرح از Navigation داشتيم .
گرافيكهاي وب
اهداف
1ـ تشريح عملكرد گرافيك در سايت شما
2ـ تعريف عمق رنگ و قدرت تفكيكپذيري
3ـ ابزارهاي ايجاد گرافيك
4ـ انتخاب قالبهايي براي فايلهاي گرافيكي
مفدمه
گرافيكها در عين حال كه با عث ايجاد جذابيتهايي در صفحات مي شوند به همان ميزان مي توانند و دامهاي پنهاني بر ضد توسعه در وب ايجاد كنند . تنها تعداد محدودي از قالبهاي گرافيكي تصاوير وسيله مرور گر ها حمايت مي شوند كه خود آنها نيز مزايا هاي خاص خود را دارند يعني حتي بعضي از قالبهاي مفيد و مقرون به صرفه نيز ، با محدوديت هاي جدي مواجه هستند . اين امر طراحان وب را به رقابت و مبارزه براي ايجاد تصاوير ي كه بطور سريع بارگذاري مي شوند وادار مي كند در اين رقابت ابتدا بايد معا ني عميق از وظايف تصاوير در وب سايت و نيز بهتر جلوه دادن تصاوير در ك شود .
تصاوير
در طراحي سايت تصاوير اركان اصلي هستند . كاربران انتظار دارند كه اين عكسها بتوانند مشاهدات خوبي برايشان به ارمغان آورند . همچينن از عكسها براي Navigation و نقشه هاي تصويري و دگمه هاي تصويري ( كه باعث اتصال به صفحات ويا منابع ديگر مي شوند ) استفاده مي شود . روي يك سايت يكدست و يكپارچه ساختار LOGO و نماد هاي تجاري براي شناسايي بسيار مهم هستند .
تصاوير خوب در طراحي بايد داراي جذابيت و كار آيي و مهمتر از همه سايز كوچك باشند .
اندازه فايل به طور مستقيم بر زمان بارگذاري تأثير دارد و ملاحظات اصولي براي توسعه و انتشار وب در اين مورد بايد رعايت شود . طراحان بايد پهناي باندي كه براي تصاوير بكار برده شده در صفحه مورد نياز است را در نظر داشته باشند .
معمولاً كاربران براي ديدن عكس بي صبر و حوصله مي شوند . مندرجات صفحات وب با بكارگيري غلط عكسهاي و ايجاد زمان بارگذاري طولاني نابود مي شوند .
مودمها با سرعت kbps 56 در Dial Up استاندارد به كار برده ميشود ولي هنوز هم خيلي از مودها وجود دارند كه با سرعت كمتر از آن . مورد استفاده قرار ميگيرند . اگر سايت به منظور استفاده در اينترانت بر روي شبكه ايجاد شود خيلي از اين موانع بر طرف خواهد شد . به ياد داشته باشيد كه سرور عمومي باشد و ميتواند نماي سازمان رابراي دنياي بيرون ترسيم كند .ولي اينترانت براي استفاده عمومي باشد و ميتواند نماي سازمان را براي دنياي بيرون ترسيم كند و لي اينترانت براي مصارف تجاري و به مقصود دسترسي سريع و آسان به منابع و اطلاعات بنا شده است . ا يجاد زرق و برق در اينترانت باعث كاهش بهروري ميگردد . شما ميتوانيد اينترانت را در جهت به عمل و اينترنت را مكاني جهت نمايش و عرضه بحساب آوريد . گرافيكها تشريح و توضيحي بر موراد وفعاليتهاي سايت و نيز ارائه معاني Navigation در يك سايت وب مي باشند .
دادههاي متصور رقمي
همه تصاوير ديجيتالي ويژگيهاي خاص و مهمي را دارند كه مي توانند در اندازه سايز آن موثر باشند كه مقدار كمي از اين ويژگيها در اين بخش بيان ميشود .
پيكسل (pixel)
نقطه كوچكي در تصوير ميباشد و در يك جمله شبكهاي از بلوكهاي ساختماني براي گرافيكها و تصاويري است كه ميتواند بر روي كامپيوتر نمايش داده شود . پيكسل كوچكترين واحد نمايشي كامپيوتر است .
عمق رنگ
پيكسل به مقدار زيادي اطلاعات رنگي ايجاد ميكند . اين اطلاعات با بيت اندازهگيري ميشوند . حساب كنيد كه چگونه هر پيكسل تمامي اين رنگها را ميتواند نشان دهد . براي مثال اطلاعات پيكسل 4 ميتوانيد بيتي در م د Scale Gray تا 16 سايه خاكستري را نشان دهد . هر 8 بيت از اطلاعات رنگ در هر پيكسل تا 256 بيت از اطلاعات رنگ را توليد ميكند و به اين ترتيب بديهي است كه در درجات بالاتر بيت ( كه عمق بيت نيز ناميده ميشوند ) واقعي بيني رنگي بيشتري را به ارمغان ميآورد . ضرورت تفكيك پذيري استاندارد صفحه نمايش 480*640 يا 72 نقطه در اينچ (dpi) ميباشد . شما بايد المانهاي وب را با آهنگ خاص براي كاربران جلو برده و توسعه دهيد .
جدول رنگ و الگو
( مجموعهاي از رنگهاي قابل دسترسي در يك سيستم گرافيكي كامپيوتر ) :
اگر چه 8 بيت رنگ ميتواند ميليونها رنگ را نمايش دهد و لي فقط در يك زمان 256 رنگ حمايت ميشوند . سيستم فقط اين 256 رنگ را در سيستم گرافيكي خود ذخيره
ميكند .
تذكر
تفاوت كمي ما بين جعبه رنگ ويندوز ميكروسافت و جعبه رنگ مرورگر Netscape Navigator وجود دارد Navigator از 256 رنگ حمايت ميشوند ولي ويندوز از 216 رنگ استفاده ميكند. هنگامي كه يك عكس 8 بيتي ايجاد ميكنيد از يك بردار و يا يك نرم افزار نمايشي استفاده ميكنيد ، خود برنامه يك جعبه ايجاد ميكند كه رنگهايي كه در عكس موجود ميباشند درآن جعبه رنگ نيز وجود د ا رد . هنگامي كه تصوير اصلي نمايش داده ميشود جعبه رنگ براي نمايش رنگ اصلي تنظيم مي شود . وقتي كه تصاوير متعددي بطور مرتب و يكجا به نمايش مي گذاريد دچار عدم هماهنگي در تلالو رنگها ميشويد كه اين امر درخشش الگو يا عوض شدن جعبه رنگ ناميده ميشود . درخشش الگو ، زماني اتفاق ميافتد كه تفاوتت معني دار زيادي بين تراكم ( چگالي ) تصوير با جعبه رنگ آن و تراكم ( چگالي ) سيستم با جعبه رنگ آن وجود دارد . براي غلبه بر اين محدوديت مرورگر به طور اتوماتيك تكنيكي را بنام افزايش نور تصوير ايجاد ميكند .
افزايش شدت نور نمايش
افزايش شدت نور نمايش تخمين تقريبي يا تطبيق رنگها ما بين يك جعبه تصوير و جعبه رنگ سيستم است و رنگهاي روي تصاوير با رنگهاي سيستم جايگزين ميشوند . متأسفانه افزايش شدت نور باعث ميشود كه نمايش عكس را بصورتي كه شما نميخواهيد عوض كند . تصاوير بايد قبل از آنكه در صفحات وب انتشار داده شوند پرنور شوند .
عكسهاي با فورمات Bitmap و برداري (Vector)
عكسهاي گرافيكي وب به 2 قالب دستهبندي ميشوند Bitmap و Vector كه هر قالب خود زير شاخههايي نيز دارد .
Bitmap
بيشترين قالب گرافيكي معمول Bitmap ميباشد .
عكسهاي Bitmap از تأثير هر رنگ نمايش به طور جداگانه ساخته شدهاند . هر چقدر كه رنگهاي ايجاد شده توسط يك عكس بيشتر باشد ، سايز فايل مربوطه به آن عكس بيشتر ميشود . وقتي كه فايل Bitmap با بزرگنمايي ديده مي شود ، فايل Bitmap شبيه به يك سري مربع كوچك ميشود كه هر يك درجه رنگي دارند كه در كل عكس سهم دارد .
Bitmap هنگامي كه از نزديك ديده ميشود ظاهري ناصاف دارد اما هنگامي كه با فاصله به آنها نگاه ميكنيد بصورت نقطه ، نقطه و شبيه به شكل واقعي و يا بصورت بلوكهاي مجزا ميباشد .
براي ساختن فايل Bitmap مرورگر موجود به طور هماهنگي در بارگذاري يك عكس با يكديگر كار ميكنند . اطلاعات هر پيكسل ذخيره ميشود وسپس دوباره در مرورگر براي ايجاد تصوير برگردانده مي شود . چون فايلهاي Bitmap از تعداد ديسكهاي بيشتري براي نمايش استفاده ميكنند سايز بزرگتري دارند ، فايلهاي Bitmap براي عكسها اثرهاي سايهدار و لبههاي هموار يا تيره ايجاد مي كنند .
بردار
تصاوير برداري در تفسير و ترجمه متفاوتتر از فايلهاي Bitmap مي باشند . تصاويربرداري اطلاعات عكس را در دستورالعملهاي رياضي خود ذخيره ميكنند كه
درهنگام نمايش معني ميدهند . براي مثال براي ايجاد يك دايره لازم است كه مختصات مركز و شعاع و درجه رنگ را بدانيم . از اين اطلاعات و دستورالعملهاي رياضي براي افزايش سايز فايل نيز استفاده ميشود . چون مقادير قابليت عوض شدن دارند بنابراين افزايش سايز بردار اندازه فايل را زياد نميكند . امتياز ديگر تصاوير برداري توانائيهاي آنها در به مقياس گذاشتن راندمان ابزار استفاده شده ميباشد و تصاوير برداري مستقل از قدرت تفكيك پذيري مي باشند .
برنامههاي گرافيكي
شما ميتوانيد با برنامههاي گرافيكي تصاوير ديجيتالي ايجاد كنيد . اخيراً پيشرفتهاي زيادي در نرم افزارها براي ويرايشي كردن عكسها ، رتوش كردن و ارسال آن براي وب ايجاد شده است .
اين برنامهها به 2 گروه زير تقسيم ميشوند :
ترسيم بردار ، فايلهاي از نوع نقاشي
برنامههاي ترسيم اشكال گرافيكي برداري :
نرم افزارهاي ترسيم بردار مبنا مانند XRes و AdobeIllustrator توصيف كننده نقشه شكل ميباشد و ميتوان در آن خطوط نامرئي ايجاد كرد .
اطلاعات عكس در مجموعهاي از دستورالعملهاي رياضي ذخيره ميشود . در قبل بحث كرديم كه تصاويربرداري مستقل از مانيتور هستند به اين معنا كه تنظيمات مانيتور كامپيوتر بر روي سايز و اندازه تاثير گذار است و نيز اين تصاوير كوچكتر از فايلهاي مشابه خود از نوع Paint هستند . تصاوير برداري گرافيكي معمولاً در ابعاد سه بعدي و در محيطهاي زبانهاي نمونهسازي فرضي VRLM-Vitual Reality Modeling Language مورد استفاده قرار ميگيرند و معمولاً نميتوانند به درستي و به طور واقعي گرايانه جزئيات تصاوير را انتقال دهند و نمايش آنها در صفحه نمايش تا اندازهاي آهستهتر است و نيز براي ديدن آنها در و ب نياز به Plug – ins ميباشد . به هر جهت تصاوير برداري در صنعت و مصارف علمي كاربرد خيلي خوبي دارند . بعداً به معرفي برنامههايي كه از تصاوير برداري حمايت مي كنند خواهيم پرداخت .
برنامههاي نقاشي
برنامههاي نقاشي از Scan از عكس تا ضبط فريمهاي ويدئويي فايلهاي Bitmap ايجاد ميكند و يا براي ايجاد كارهاي هنري از آنها استفاده ميشود . فايلهاي Bitmap با جزئيات بيشتري نشان داده ميشوند . در قبل بحث كرديم كه فايل Bitmap با نقطههاي كوچكي كه هر نقطه مطابق با يك پيكسل در صفحه نمايش ميباشد طراحي شده است . فايلهاي Bitmap در هنگام ضرورت پيكسل به پيكسل ويرايش ميشوند .
مضرت فايلهاي Bitmap در اين است كه سايز فايلهاي اصلي بزرگ هستند . ظاهر فايلهاي Bitmap به طور زيادي بر صفحه مانيتور اثر ميگذارد . هر دو قالب J pg ، Gif از نوع Bitmap هستند . براي ايجاد تصاوير گرافيكي خوب معمولاً از نرمافزارهاي زير استفاده ميشود :
قالبهاي فايل تصوير
تصاوير گرافيكي در قالبهاي زير ظاهر ميشوند : (Bitmap (BMP قالب TIFF(Tagged Image File
Graphic Interchange Format , (WMF) Windows Meta File (JPEG) Joint Photo (Format) (Gif Express Group Graphic فقط قالبهاي Gif و JPG بطور معمول و ذاتي با مرورگرها حمايت مي شوندو فورمتهاي ديگر با كمك Plug in مشاهده ميشوند . حمايت ذاتي به اين معنا است كه مرورگرها نيازي به نرمافزار خاص براي نمايش عكس ندارد . هنگام ايجاد يك تصوير وب يك طراح بايد يكي از فايلهاي jpg يا gif را بر مبناي نوع عكسي كه در فرمت دارد انتخاب كند . جدول زير قالبهاي گوناگوني از فايلهاي عكس و پسوندهاي آن را نشان ميدهد .
Image File Format
Interchange Format _ Gif Graphic
Gif يك قالب فايل مستقل است كه محدود به نمايش 256 رنگي مي باشد كه بطور طبيعي بوسيله Compuserver براي سرويسهاي روي خط انتشار داده شده است . Gif براي اكثر طراحان حرفهاي وب قالب خوبي ميباشد زيرا سايز آنها كوچك هستند . بهم تابيدگي فايلهاي Gif بينظير است و بهتر است كه براي فايلهاي بزرگ از اين نوع قالب استفاده شود . Gif به عنوان يك قالب كم ضرر در نظر گرفته ميشود به اين معني كه تصوير فشرده ميشود در حالي كه هيچ اطلاعاتي از دست نميرود . در نتيجه يك فايل Gif نميتواند به اندازه يك فايل Jpg فشرده شود و نيز طراح نميتواند ميزان فشردگي را محاسبه كند .
Animated –Gif
در سال 1989 ورژني از نرم افزار مربوط به فايلهاي Gif اين امكان را دارد كه رشته توالي از عكسها ذخيره شده يك فايل متحرك نمايش دهد . فايلهاي Gif ميتوانند انيميشنهاي كامل و افكتهاي ويدئوئي بدون نياز به Plugins را ايجاد كنند .
فايلهاي Gif ممكن است شامل يك عكس ساكن باشد ،توابع متحرك Gif مانند كارتون و ... فايلهاي Gif ممكن است شامل فرمهاي متوالي است كه تقريباًاز Cach مرورگر بارگذاري مي شوند و بطور نامحدود تكرار مي شوند و با حلقه مجبور به حركت تقليدي ميشود . يكي از اختيارات Gif هاي متحرك اين است كه آنها در درجه بالاي تصاوير متحرك قرار دارند آنها وابسته به Client-Pull و Server-Push نيستند . هم Client – Pull و هم Server Push نياز به فايلي دارند كه بتوانند بطوري در پي با تعداد زيادي تغييرات بين كامپيوتر كاربر و كامپيوتر سرور بارگذاري شود .
(Server Push _ Client Pull)
(Server Push _ Pull) تركيبي از فنون سرويسدهنده / سرويسگيرنده وب كه بصورت انفرادي شامل فشردن سرويسدهنده يا كشيدن سرويسگيرنده است . در فشردن سرويسدهنده ، دادهها را در سرويسگيرنده بارگذاري ميكند . اما ارتباط دادهاي همچنان باز ميماند . اين تركيب به سرويسدهنده امكان ميدهد كه در صورت لزوم انتقال دادهها را به مرورگر ادامه دهد .در كشيدن سرويسگير نده ، سرويس دهنده دادهها را براي سرويسگيرنده بارگذاري ميكند . اما ارتباط دادهاي باز باقي نميماند . سرويس دهنده رهنمود HTML را براي مرورگر ارسال ميكند و به آن اعلام ميكند كه اين ارتباط را پس از يك فاصله زماني مجدداً باز كند . تا دادههاي بيشتري را دريافت كرده يا احتمالاً URL جديدي را باز كند .
Gif شفاف
امتيازي كه فايلهاي Gif نسبت به تصاوير JPG دارند اين است كه طراح ميتواند يك رنگ از تصاوير Gif طراحي كند كه شفاف باشد و اين ويژگي باعث رفع محدوديتها در اشكالي مثل مربع يا مثلث ميشود . براي مثال يك طراح ميتواند يك logo دايرهاي با يك زمينه رنگ شفاف ايجاد كند . بنابراين عكس با اطلاعات شفاف و بصورت دايره ظاهر ميشود .
JPEG-Joint Photographic Experts Groop
عكسهاي در قالب JPEG از رنگهاي بيشتري نسبت به فايلهاي Gif برخوردار هستند . اما معمولاً به زمان بارگذاري بيشتري نيز نياز دارند .
فايلهاي JPG شامل اطلاعات 24 بيت رنگي (16.7 ميليون رنگ ) ميباشند و به خوبي در تصاوير يكپارچه گرافيكي و عكسبرداريها ظاهر ميشوند . بايد به خاطر آوريد كه خيلي از كاربران فقط توانايي نمايش 8 بيت رنگ را براي خود دارند و در نتيجه در نمايش عكس براي آنها به مقدار قابل ملاحظهاي افزايش نور ايجاد ميشود . ( پديدهاي كه قبلاً راجع به آن بحث شد )
فايلهاي JPG به طور اتوماتيك فشرده ميشوند و در هنگام ورود به صفحات وب از حالت فشردگي خارج مي شوند . اثرات فشردهسازي متفاوت هستند . فشردگي بيشتر تنزل درجه بيشتري در عكس نهايي دارد . JPG را به عنوان يك فايل زيان آور و پراتلاف در نظر ميگيرند . به اين معني كه فشردگي عكس را افزايش ميدهد . رنگها با قطره چگان از جعبه رنگ عكس برداشته ميشود و نتيجه آن تنزل در كيفيت عكس است . براي مثال يك فايل kb 100 ميتواند kb 10 فشرده شود و به هر جهت اين فشردگي كيفيت عكس را كم ميكند . يكي از مضرات استفاده از اين قالب اين است كه طراح كنترلي بر چگونگي تبديل bit 24 به 256 رنگ استفاده شده با صفحه نمايش كاربر را ندارد . همچنين تفاوت بارزي در نحوه نمايش اين قالب در 2 مرورگر IE و NetScape وجود دارد بعلاوه نحوه نمايش در PC ها نيز متفاوتتر از مكينتاش مي باشد . طراح بايد قبل از آنكه صفحه خود را به اتمام رسانيد بداند كه كدام قالب منظور وي را بهتر تأمين ميكند و كار خود را در د و مرورگر با سيستم عاملهاي مختلف آزمايش كند .
JPEG2000
قالب جديد JPEG به منظور توسعه ويژگيهاي فشردگي فايلهاي JPEG استاندارد ميباشد همانطور كه قبلاً بحث شد قالب اخير JPEG كه اطلاعاتي راجع به تصويري كه فشرده شده است در بردار سودمند نيست و اين قضيه در نتيجه روزنههايي را در تصوير ايجاد مي كند و باعث ايجاد تصوير خالدار ميگردد . در JPEG 2000 فشردهسازي در اثر يك تكنولوژي مواج بوجود ميآيد كه اطلاعات را به گونهاي متفاوت ذخيره ميكند كه تعداد زيادي از تكههايي كه در تصاوير فشرده شدهاي كه از طريق JPEG بوجود آمدند را از بين ميبرد .
Portable Network Graphics-PNG
قالب PNG به عنوان يك قالب جديد براي گرافيكهاي وب ظاهر شده است . براي تصاوير وب PNG بهترين تركيب از ويژگيهاي JPG و GIF را تحت يك قالب واحد دارا ميباشد. فايلهاي PNG زيادتر هستندو همچنين از شفافيت فايلهاي GIF و از عمق رنگي JPG حمايت ميكنند . فشردگي در فايلهاي PNG با استفاده از فيلترهاي فشردگي كه تا عمق bit 48 حمايت ميشوند توسعه پيدا كرده است . حمايت مرورگرها از قالب PNG هنوز معمول نشده است . Netscape 4.7 و IE5 با درجات مختلفي از PNG حمايت ميكنند . به هر جهت كميته www در 1996 فرمت PNG را پيشنهاد داد ولي فرمت استاندارد شده نيست .
تصاوير برداري مقياس پذير SVG
قالب تصاويربرداري مقياس پذير (SVG) در فاز نقشههاي كاري V3C ميباشد . SVG در XML در تشريح اشكال اصلي كاربرد دارد . مشابه بردارهاي گرافيكي ديگر SVG هنگامي كه با هنرهاي خطي و اشكال كار ميكند بهينه ميشود .
SVG به كمپانيهاي نرما فزارهايي كه از SVG حمايت مي كنند را ميتوانيد در سايت زير پيدا كنيد :
ايجاد تصاوير
ايجاد تصاوير با كيفيت در وب نياز به داشتن علم و كاربرد نرم افزارهاي گرافيكي دارد و از اين جهت طراحي وب براي استادان آن ميتواند مشكل باشد . يك هنرمند گرافيك كار بايد بتواند بخوبي تصاوير خوبي را ايجاد كند . اگر شما ذاتاً استعداد اين كار را نداريد خيلي از منابع در روي وب استفاده از اين عكسها را به طور مجاني براي شما ايجاد كردند . عكسهاي با كيفيت خوب معمولاً مجاني نيستند ولي به هر جهت ميتوانيد براي بدست آوردن كيفت مطلوب از گرافيكها در سايت هاي مختلف ثبت نام كنيد . اين حق اشتراك مي تواند در محدوده حق اشتراك ماهيانه تا حق اشتراك ساليانه باشد .
تذكر
ابتداد مطمئن شويد كه تصاويري كه در سايت خود از آنها استفاده ميكنيد حق كپي برداري از آن مجاني است . متون بكار برده شده در وب سايت يا بايد توسط شما ايجاد شود و يا براي دسترسي به آنها بايد اجازه داشته باشيد . هميشه جملات خود را از لحاظ قانوني بررسي كنيد .
ويژگي ALT
ويژگي ALT متون اختياري در مكانهايي از تصاوير بر روي صفحات HTML ايجاد ميكند . گرامر استفاده از ويژگي ALT به شكل زير دنبال مي شود :
ويژگيALT براي مكانهاي زير مهم است :
1 كاربراني كه گزينه نمايش عكس را در مرورگرهاي خود غيرفعال كردند از اين طريق ميتوانند آنرا بخوانند .
1 هنگامي كه صفحه در حال بارگذاري است كاربر مي تواند توصيف آنرا بخواند
1 اين گزينه براي كاربراني كه قدرت بينايي يا شنوايي كمكي دارند امكانات خوبي ايجاد ميكند .
بهينه سازي تصاوير
يك طراح وب اگر نتواند تصاوير خود را بهينه سازي كند هيچ يك از توانمنديهاي Gif و jpg و png تشخيص داده نميشود . اين اشتباه غلط از آنجا ناشي مي شود كه بگويم هيچ يك از اين قالبها از ديگري بهتر نيست . در صورتيكه در قبل گفتيم كه هر قالب تصوير داراي توانمندي ميباشد كه آن را منحصر به فرد مي كند. به عنوان يك طراح وب بايد بياموزيد كه چه نوع قالبي را براي ايجاد يك تصوير خوب و جذاب و بدون مشكل به كار بريد استفاده از قالبهاي Gif يا Jpg شما را به استفاده از تصاوير بهينه مطمئن نميسازد .
موارد زير راهنمايي است كه شما را در بهينه سازي تصاوير كمك ميكند :
1 استفاده از رنگهايي كه در وب امنيت دارند
1 ايجاد يك ليست از رنگهاي ممكن
1 استفاده از رنگهاي يكدست در هر جايي كه ممكن باشد .
1 اجتناب از اثرات بصري نامطلوب تا جايي كه مقدور است .
1 استفاده از امكانات بهينه سازي .
منابع بهينه سازي
در حال حاضر خيلي از منابع وجود دارند كه براي كمك به طرح بهينه سازي تصاوير در دسترس مي باشند . روش اصلي براي بهينهسازي ، محاسبه كوچكترين مقدار نگ ممكن و انتخاب قالب فايلي است كه ميتواند كيفيت رنگ درخواستي شما را ايجاد كند . بيشترين استفاده معمول در بهينه سازي استفاده از نرم افزارهاي Image Ready , Fire Works , Photo shop و ... ميباشد .
2 روش بهينه ساز معمول ديگر كه در حال حاضر مورد استفاده قرار ميگيرند Desktop Version , Online Version ميباشند .
بهينه سازي تصاوير بر روي اينترنت به نوعي نياز به حق اشتراك ساليانه دارد كه اين مقدار به طور زيادي بسته به تعداد صفحات و يا عكسهايي مي باشد كه شما ميخواهيد آنها را بهينه كنيد . بعضي از سرويسهاي ديگر مجاني هستند . يك طراح وب بطور ساده يك URL براي تصاوير وارد ميكند . يعني بر روي سايتي مي رود كه امكان بهينهسازي براي تصاوير را به ما مي دهد . برنامهاي روي سايت براي بارگذاري و بهينهسازي تصاوير آماده ميشود .
سپس طراح براي دسترسي به بهينه سازي تصاوير صاحب امتياز مي شود . سرويسهاي زير تصاوير بهينه Online ايجاد ميكند .
Image نيز به همان روش ، تصاوير شما را بهينه مي كند .
تكه تكه كردن عكس و بهم اتصال دادن
روش ديگري كه براي كمك به بارگذاري عكسهاي بزرگ در زمان كمي وجود دارد برش دادن عكس ميباشد . برش تكههاي متعددي از عكس را در بر دارد . با استفاده از جداول HTML يك عكس ميتواند تجديد بنا شده و در پنجره مرورگر بهم پيوند داده ميشود . برشها نميتوانند تغييري در سايز عكس بوجود آورند اما بارگذاري عكس را سريعتر ميكنند زيرا كاربر قبل از بارگذاري عكس قسمتهايي از عكس را مي بيند .
خلاصه فصل
در اين فصل در مورد نكات مهم در تصاوير وب و با بيشتر قالبهاي معمولي و امتيازات آنها و نيز تفاوت بين تصاوير BMP بحث كرديم ابزارها و تكنيكهاي بهينهسازي عكسها آموختيد .
چند رسانهاي
اهداف فصل
1 تعريف تكنولوژيهاي چند رسانهاي كه وب ميتواند آنها را نمايش دهد .
1 بكارگيري اصول طراحي چند رسانهاي
1 انتخاب بهترين چند رسانهاي براي سايت خود
مقدمه
تقويت غير قابل انكار تمامي سرگرميهايي كه بوسيله چند رسانهايها ايجاب شده است وجه عمومي وب را براي ما محبوب تر كرده است . ويدئو ، انيميشن و صدا تأثيرگذار است ، و همه اينها زماني آغاز شد كه چند رسانهايها به عنوان بستر بزرگي از فنآوري اطلاعات توسعه پيدا كرد و سرگرميهاي جذاب زيادي به رسانهاي كه بطور نسبي يك رسانه بر پايه اطلاعات ميباشد اضافه شد .
متأسفانه استفاده نادرست از چند رسانهايها براي كاربران و توسعهدهندگان وب ايجاد ياس و نااميدي ميكند . رشد سريع تكنولوژيهاي جديد باعث ميشود كه يك چند رسانهاي چيزي بيشتر از يك پيامد اخلاقي براي توسعه دهندگان وب محسوب شود . شما نه فقط بايد تكنولوژي امروزي در دسترس را بدانيد بلكه نياز داريد كه آنچه را كه بعدها در اختيارتان قرار ميگيرد را احساس كنيد . وقتي به اين مهم دست يافتيد بايد تصميم بگيريد و بياموزيد كه تأثيرات كدام تكنولوژي در آينده بهتر و موفقتر است . بعلاوه بايد در نظر بگيريد كه كدام تكنولوژي چند رسانهاي براي نيازهاي كاربرانتان بهتر عمل ميكند و مناسبتر است .
چند رسانهاي وب سايتها
برنامهريزي كليدي موفقيت در ايجاد چند رسانهاي براي وب سايت ميباشد . هر چند كه زماني بيش نيست كه چند رسانهايها ايجاد شدهاند اما به كاربردن آن در وب بصورت يك علم كامل نيست .
بكار بردن چند رسانهايها بر روي وب با ابزارهاي گوناگون و با تكنولوژيهايي
امكان پذير است كه هميشه در دسترس نيستند . در اين بخش شما ميآموزيد كه چگونه يك چند رسانهاي مفيد و كارآ را ايجاد كنيد . چند رسانهاي محبوبيت زيادي بر روي وب بدست آورده است زيرا پيشرفت آن در تكنولوژي اينترنت به شما اين اجازه را ميدهد كه چند رسانهايهاي مختلف را بر روي صفحات وب با هم تركيب كنيد .
اين تكنولوژيها توسعه دهندگان وب را به يك رقابت فرا ميخوانيد . پيشبيني كنيد كه چگونه توسعه دهندگان با نمايش عكسالعمل تكنولوژيهايي را بر روي سيستمهاي گوناگون و مرورگرهاي متفاوت به نمايش در مي آورند كه اين امر نياز به برنامهريزي و صبر و حوصله و مقدار زيادي آزمايش دارد .
امكانات جاري
امكانات جاري چند رسانهايها بر روي وب مشكل به نظر ميرسند و يك طراح وب براي كاربرد اين ابزارها و تكنولوژيها كوشش ميكند . در آينده تكنولوژيهاي جديدي در گامهايي بلند و پرقدرت ظاهر خواهد شد به هر جهت طراحان امروزي با 2 عامل بزرگ روبرو هستند كه عبارتند از پهناي باند و حمايت مرورگر از تكنولوژي مورد نظر . براي استفاده و لذت از اين تكنولوژي جديد به يك پهناي باند بالا و حمايت مرورگر از Plungins و تعداد خاصي از نرمافزارها نياز داريم . بنابراين طراحان وب بايد انديشه كنند و فريب استفاده از تكنولوژيهاي پر زرق و برق در صفحات خود را نخورند ، زيرا كاربران استاندارد بر روي ارتباط Dialup هستند و مرورگرهاي معمولي از هر نوع تكنولوژي نميتوانند حمايت كنند . اين امر به آن ارتباط Dialup هستند و مرورگرهاي معمولي از هر نوع تكنولوژي نميتوانند حمايت كنند . اين امر به آن معني نيست كه شما نتوانيد از تكنولوژي جديد در صفحات خود استفاده كنيد ولي بايد مراقب باشيد كه در صورت استفاده خيلي از كاربران خود را محروم ميكنيد . اگر شما كاربران خود را تعريف كنيد و بدانيد كه كدام گروهها هستند كه براي حمايت از تكنولوژي شما آماده مي باشد ، ديگر لازم نيست نگران ارتباط با بقيه كاربران خود باشيد . بنابراين ميتوانيد از تكنولوژي استفاده كنيد كه باعث توسعه و پيشر فت سايت شما باشد .
بيشتر تصميمات درباره استفاده از چند رسانهايها كه ما بعداً در مورد آنها بحث خواهيم كرد در طي برنامهريزي در حين طراحي سايت آماده ميشوند .
عامل زمان
براي بقيه افكار و انتخاب منابع بدون هيچگونه محدوديتي براي كاربر يك الگوي جديد ايجاد ميكند . براي مثال وقتي يك كاربر براي خريد يك كتاب يا مجله ثبت نام ميكند يا مشترك ميشود خود را درگير كرده است چون شخص براي آن كتاب زمان و هزينه گذاشته است بنابراين ترجيح ميدهد كه به جاي خريد كتاب ديگر همان كتاب را بخواند . ولي در مقابل آن كاربران وب ترجيح ميدهند كه افكار خود را سريعاً تغيير دهند و به سايت ديگري مراجعه كنند . به هر حال كاربران وب براي وقتشان سرمايهگذاري ميكنند . تعيين مقدار زمان ميانگيني كه كاربران از وب استفاده ميكنند مشكل است اما از نقطه نظر يك طراح زمان كاربران بسيار با اهميت است و اين زمان مشخص تا جايي بايد محاسبه شود كه بتوانيد كاربران خود را نگهداريد . انتخاب صحيح چند رسانهاي به حفظ زمان بازديدكنندگان كمك خواهد كرد و شانس بازديدهاي طولاني و عوامل بالقوه سايت را نيز افزايش ميدهد .
انيميشن
انيميشن يكي از مهمترين مولفههايي است كه وب را از بقيه رسانهها مشهور تر كرده است . درجات مختلف انيميشن از تصاوير Gif انيميشن ساده تا عناصر تعبيه شده سه بعدي و محيطهاي مجازي مي توانند دستهبندي شوند و به محسوس شدن حس حركت و درگير كردن تعدادي از كاربران كمك ميكند . بعضي اوقات از اين انيميشن ها براي جلب توجه و در مواقع ديگر براي شرح و تفصيل مفاهيم استفاده مي شود . طرح و ابزار هدفمند نه تنها فوايد انيميشن را از مسير خود منحرف نمي كند بلكه به ارزش آن نيز ميافزايد . بيشتر انواع انيميشنهاي پايه Animated Gif و فايلهاي Macromedia Flash ميباشند .
Animated Gif فايلهاي (Gif Animator)
در قبل گفتيم كه يك فايل انيميشن از جمع آوري عكسهاي ساكن و حركت آنها د رتوالي رشته با سرعت و تكرار طراحي شده است . خيلي از لوگوها با Gif Animated طراحي شده است . اغلب آگهيها فايلهاي Gif هستند كه خود با حركتشان براي آگهي چرخش ايجاد ميكنند . فايلهاي Gif Animator براي نمايش اطلاعات اضافي در مكاني مانند صفحه نمايش ميتوانند خيلي مفيد باشند و توانايي جلب نظر كاربران را نيز دارند و حركت را در فرم قالب عادي به صفحات ساكن اضافه ميكند .
رويدادهاي ماوسي Rollovers
رويدادهاي ماوسي حركتي است كه با رد شدن مكان نماي ماوسي بر روي مكانهاي معين صفحه ايجاد حركت ميكند . به طور معمول رويدادهاي ماوسي همراه با المانهاي Navigation كاربرد دارند و آنها با نشان دادن عكسالعمل نسبت به عمليات كاربر ، كاربر را درگير مي كنند و با كاربر بصورت متقابل عمل مي كنند و نيز بعضي از عناصر با بصورت ابر اتصال نشان ميدهند . در حالت عادي ابر متنهايي كه در صفحه بصورت پيشفرض قرار دارند به رنگ آبي هستند و زير آنها خط كشيده شده است و اين روش ظاهر صفحه راكمي متفاوت مي كند .
فايلهاي Flash
Macromedia Flash بطور چشمگيري مورد قبول همگان قرار گرفته است . Flash يك فرم جديد از انيميشن را كه در قبل ايجاد آن آسان نبود، معرفي ميكند ودر حالي كه پهناي باند را حفظ ميكند رسانهاي غني عرضه مي كند .
اجتناب از Animation
اسكرول كردن متنها يكي از انواع انيميشنهايي است كه كاربران مايل به استفاده از آن نيستند . براي دادن اطلاعات خيلي مهم نبايد اسكرول ايجاد شود زيرا احتمالاً كاربران توجه كمي به آنها خواهند كرد .
صوت
صوت متفاوت از بقيه مندرجات است و كاربران براي دريافت آن رسانه به نوع نمايش استناد نمي كنند و محدوديتهاي سايز مانيتور، سيستم عامل و عمق و بيت رنگي نيز در آن وجود ندارد .
اصوات ميتوانند به دو روش جداگانه انتشار داده شوند كاربر بايد صورت را بارگذاري كند و سپس مراحل اجرا آن سيستم شروع ميشود و يا فايل صوتي مي تواند در قالب رشتهاي توزيع شود . كيفيت اجراي هر فايل ضبط شده و ابسته به مراحل و قالبهاي استفاده شده و كيفيت دستگاه خروجي سيستم كاربر براي فايل ديجيتالي مي باشد .
بارگذاري صوت
اولين صوت Audio در وب بارگذاري آن فايل ميباشد . يك فايل ميتواند در يك صفحه وب تعبيه شود و همراه با ساير فايلها مانند عكسها بارگذاري شود . بايد در نظر داشته باشيد كه زمان بارگذاري فايلهاي صوتري بزرگ زياد است و بر خلاف فايلهاي متني نياز به حافظه بيشتري براي ذخيره و اجرا دارند .
زمان بارگذاري يك فايل صوتي در مقايسه با زماني كه آن فايل اجرا مي شود زيادتر است و اين مورد براي كاربران خيلي مناسب نيست . فايلهاي صوتي تعبيه شده از بقيه قالبهايي كه به كاربر براي بارگذاري اجازه نمي دهد متفاوت است . آنها جزء مولفه هاي ضروري سايت هستند و غير قابل تفكيك مي باشند . توصيه ميشود فايلهاي صوتي را تعبيه نكنيد و به جاي آن به كاربر اجازه دهيد كه خود آنها را بارگذاري كند و گوش دهد . در حال حاضر يك فايل تعبيه شده صوتي همراه با متن در وب استفاده مي شود فايل Flash ميباشد. فايلهاي Flash فايلهاي صوتي را بياندازه در سايز كوچك مي كنند و بصورت جرياني براي كاربر تبديل ميكنند و زمان بارگذاري آن را براي كاربر كاهش ميدهند .
جدول زير فايلهاي صوتي و پسوندهاي آن را نشان ميدهد :
انتشار صوت
مزيتي كه در روش انتشار صدا با فايلهاي صوتي بارگذ اري شده است اين ميباشد كه كاربر مجبور نيست كه به فايل گوش دهد . به مجرد آنكه اتصال با سرور منتشر كننده صدا برقرار مي شود يك حافظه موقت ايجاد مي شود . فايل صوتي اجرا مي گردد . يك فايل صوتي MB 10 را در نظر بگيريد ، بارگذاري آن با يك ارتباط با خط تلفن غير ممكن است . در اين نوع قالبها فايل زماني كه بارگذاري ميشود ميتواند اجراء شود و زمان انتظار براي تحويل آن به كاربر كاهش مييابد . نمايش زنده قالبهاي صوت براي انتشار تكنولوژي مفيد ميباشد . گوش دادن به يك فايل صوتي بصورت Online كه در همان زمان كربر منتشر ميشود ميتواند با گوش دادن به راديو قابل مقايسه باشد . وقتي انتقال جريان صورت ميگيرد بارگذاري كامل ميشود و سپس در حافظه ذخيره ميشود . شبكه جريان صوت را به صحنه هدايت ميكند . Real Palayer اين توانايي را دارد كه جرياني از فايلهاي صوتي ويدئويي را از ميان ارتباط آهسته kb 28.8 با كيفيت قابل قبولي اجرا كند .
ويدئو
ويدئو در گسترش تكنولوژي Multimedia مي باشد كه در وب مورد استفاده قرار ميگيرد تاثير بسزايي دارد . درحال حاضر ويدئو براي كاربراني كه از Dialup استفاده ميكنند از كيفيت خوبي برخوردار نيست . ديدار هر سايتهاي جديد و بزرگ مثالهايي از فايلهاي ويدئويي جاري كه با استفاده ازReal Player , Media Player و ... ساير برنامهها اجرا ميشود را ارائه ميكند .
در اين تكنولوژي از (ويدئو) بطور معمول قدرت تفكيك كمي دارد . حركت قاب آنها كند و داراي عدم تعادل است و در ابعاد نيز كوچك هستند و لي اكثر اوقات به طور معمول قابل مشاهده و فهم هستند . مانند صوت فايلهاي ويدئو نيز ميتواند بارگذاري و اجرا شود و بصورت جرياني به سمت كاربر جاري شود و پس از قطع جريان با نرم افزارهاي اجرا كننده اجرا شود . انتخاب ويدئو و استفاده از آن با زياد شدن پهناي باند افزايش يافته
است .
ويدئو كنفرانس ، تبديل كنندگان داده در وب ، دوربينهاي وب به عنوان وسايل حمل و نقل در وب مورد استفاده قرار مي گيرد .
ويدئو بر روي وب نبايد براي اشخاصي كه در خارج از شبكه مثل LAN يا اينترانت هستند اجباري باشد . شما بايد اتصالاتي ايجاد كنيدو با ايجاد آنها به كار اختيار دهيد كه خود را انتخاب كند . براي كليپهاي ويدئويي بايدزمان اختياري را در حدود چند دقيقه براي انتشار صوت براي كمك بهحفظ پهناي باند و بارگذاري ،زمان ايجاد كنيد .
Internet TV
Internet TV هنوز به عنوان يك جزء محكم و ثابت توسعه پيدا نكرده است و عموماً هنوز به عنوان وسيلهاي براي ارتباط مردم با اينترنت نيست ولي بيشتر كارشناسان بر اين باورند كه اين كار به زودي انجام خواهد شد . به طور معمول ميكروسافت اين تكنولوژي را داراست كه نام آن Web TV ميباشد و قسمتي از استراتژي آن افزايش سود براي مصرف كننده ميباشد . كنترل اين وسيله شبيه به جعبه كابل و ارتباط با اينترنت با يك سرعت خط بالا ميباشد . براي استفاده از Web TV كاربران نياز به يك خط تلفن براي ارتباط با تلويزيون بر روي اينترنت دارند . به محض ارتباط كاربران ميتوانند تمام اعمال خود را مانند موج سواري در دريا بر روي اينترنت انجام دهد . كاربران ميتوانند از يك سايت ديدن كنند و تمامي عسكهاي آن مشاهده كنند و عكسالعملهايي نيز براي كاربران در نظر گرفته شده كه كاربران ميتوانند محصولات در دسترس داخل سايت بازديد كنند . شركتهايي مثل سوني و فيليپس در اين تكنولوژي با TV Webtv.net متحد هستند .
اهداف يك سايت چند رسانهاي
چند رسانهايها مندرجاتي پرمحتوا ايجاد مي كنند و روشهايي را براي شرح اطلاعاتي كه مقصود آن واضح نيست بيان مي دارند . در اوايل پيدايش چند رسانهاي وب متخصصان خبره وب آنقدر از اين رسانه شگفت زده شده بودند كه رسالت بزرگتر پيام آن را از ياد برده بودند . روشن كردن اهداف چند رسانهاي وب سايت قبل از ايجاد اولين صفحه يا ايجاد توالي انيميشن سيار مهم است . د رابتداي كار با چند رسانهايها هميشه سئوالات زير را ازخود داشته باشيد .
1ـ كاربران شما چه كساني هستند ، پيام شما براي آنها چيست ؟
2ـ تنظيمات يا بر همكنش يا رابطه تقابل بايد چگونه باشد ؟
3ـ كدام يك ازالمانهاي چند رسانهاي براي بر هم كنش وتكميل پيام شما لازم هستند ؟
4ـكدام نوع از ابزار و چه نوع مهارتي جهت ايجاد المانهاي چند رسانهاي و ايجاد مطالب وب سايت نياز داريد ؟
به عبارت ديگر هنگامي كه كاربران سايت شما ميبينند ميخواهيد چه عملي انجام دهند ؟ آيا ميخواهيد جسته گريخته مندرجات را بخوانند؟ خريد كنند ؟ پژوهش كنند ؟ يا در سيستمهاي بروز شده ثبت نام كنند ؟
سرانجام در نظر داشته باشيد كه
كاربران بعد از ورود در يك وب سايت و قبل از خروج از آن مايل به پركردن يك فرم خواهند بود و يا به ثبت نام در صفحه مهمان ترغيب خواهند شد . كاربرا ن براي اطلاعات مربوط به محصولات فهرست شده از طريق Email ها يا تلفنهاي بدون صرف هزينه يا پركردن فرم هاي اختياري در خواست خريد مي دهند . ممكن است كاربران در جملاتي كه در مورد كارتها مي باشد ثبت نام كنند .
اساس طراحي يك سايت چند رسانهاي
طراحان يك وب سايت چند رسانهاي بايد المانهاي خود را در صفحه ارائه دهند . بنابراين بايد انتظارات كاربران را تأمين كنند. هماهنگي اين انتظارات وظايف سادهاي نيست و بايد براي پيشبرد آن با يك سيستم توسعه يافته برنامه ريزي شود .
چشمانداز و تنظيمات
در طراحي سايتهاي داراي چند رسانهاي ها ، مكانهاي عكس و تصاوير خود و چند رسانهاي ها بصورت تصادفي مي باشند .
ايجاد يك وب سايت كشنده
طراحان وب بايد بطور دقيق موقعيت و ارتباط بين تمامي المانها را بر روي صفحه مشخص كنند وتمركز و كنترل خوبي روي ساختار صفحه داشته باشند . سايتها از مجازها و موضوعات بصري براي راهنمايي و دادن آگهي استفاده ميكنند و تجربه خوبي مانند موج سواري از ديدن اولين صفحه به آخرين صفحه ايجاد مي كنند به عبارتي طراحان سايتهاي چند رسانهاي توليدات خود را در جهت تمركز و ايجاد بر م دلهاي ذهني روشن كاربراني كه بتوانند نقل كنند و و اكنش نشان دهند به انجام ميرسانند . نظر به اينكه مندرجات سايت در حال تغيير است ، بايد ساختار و عمل آنها به شكل ثابتي باقي بماند . مخصوصاً اگر شما انتظار داشته باشيد كه كاربران دوباره به سايت شما بازگردند . بر خلاف خيلي از باورها بيشتر مردم نميخواهند كه در هر بار بازديد مندرجات سايت شما را بازآموزي كنند .
فعل وانفعالات كاربران
وب كاران حرفهاي مي توانند مندرجات سايت را از ميان تعدادي مدلهاي قابل قبول انتشار دهند كه بيشترين موفقيت از آن مدل مارپيچي است و سه جزء اصلي دارد : علايق Farorites ، فعاليتها Activities ، تجزيه وتحليل Analys . هر كدام از اين المانها به صورت پي در پي و تا جايي كه تجربيات كاربران كامل شود يا كانالهاي مسيريابي سايت جستجو شود . چگونه يك وب سايت ميتواند با زمينهسازي تصاوير اصلي و ايجاد منوها و هدايت كاربران به اهداف در خواستي كاربران را جذب كند ؟
به خاطر داشته باشيد كه بيشترين تمركز كاربران در مطالب وب سايت شما است . اگر كاربران از مطالب سايت لذت ببرند در اينصورت احتمال آنكه دوباره به سايت شما بازگردند بيشتر ميشود . براي مثال كاربراني كه برر وي سايتهاي با كيفيت بالا در حال بازديد و بررسي هستند ، اغلب از گذر زمان غافل مي شوند . اين نوع تفكر براي مشتريهاي بعدي شما مخصوصاً براي كساني كه قصد خريد نيز دارند مطلوب است يكي از اهداف وب كاران حرفهاي ايجاد تجربياتي است كه پتانسيل طبيعي مشتريان را كشف و توسعه
ميبخشد . تحقيقات روانشناسي در مورد كساني است كه به اين مراحل رسيدند .
1 تمركز
1 مبارزه طلبي
1 از دست رفتن هوشياري
1 از دست رفتن زمان
1 گيج شدن
بنابراين براي كمك به كاربران در رسيدن به اين موارد كلي بايد سايتي ايجاد كنيد كه تمامي اين موارد را حمايت كنند .
يك مثال ديگر در مورد سايت مي باشد كه كاربران را بطور ناگهاني به پيشروي در اين سايت تشويق ميكند . تصاوير و مندرجات آنقدر پيشزمينه خوبي دارند كه كاربران را براي جستجو بيشتر تشويق ميكنند ، بعد به يكباره فعل و انفعالات شروع ميشود و كاربران به مراحل ودرجات بالا هدايت مي شوند . عكسهاي گرافيكي پيچيدگي دارندو صدا و ويدئو نيز ميتوانند به يك پيشزمينه اضافه شوند . با هر بار كليك روي كليدهاي Navigation كاربران براي موارد جديد جايزه ميگيرند اين نوع مندرجات براي سايتهاي تجاري خيلي مهم است ( تجارت ، خريد ، بازاريابي) اغلب سايتهاي تجاري سعي مي كنند براي جلوگيري از كاهش سرعت، از تحريكات كمتري براي جذب مشتري استفاده كنند . آنها براي ايجاد جذابيت و تحريك و تشويق كاربران تمايل به ايجاد متون جذاب مي كنند .
انتخاب المانهاي چند رسانهاي
دقيقترين اعمالي كه بايد صفحات چند رسانهاي انجام دهند اداره كردن فضاي صفحات و انتخاب قالبهاي مناسب براي المانهاي رسانههاست . همانطور كه تعداد Plug ins هاي قابل استفاده براي هر دو مرورگر IE و Netscape افزايش مييابد . تعداد قالبهاي فايلي قابل انتخاب نيز بصورتهايي براي هر 2 مرورگر افزايش مييابد .طراحان بايد كوشش خود را براي جستجوي بيشتر Plugins هاي مورد استفاده مخاطبين انجام دهند . طراحان وب بايد براي كاربراني كه Plugins هاي لازم را ندارند برنامهريزي كنند . اتصالات يا دستورالعملهايي را در جاهايي براي راهنمايي نصب plugins ايجاد كنيد . ميكروسافت اغلب اين مشكلات را شناسايي كرده و يا نصب اتوماتيك بيشتر plugins هاي معمول زودتر از آنكه مرورگر فايلهاي مورد نياز را بخواند نصب مي شوند . Netscape از منوي Helpخود اتصالي را براي بارگذاري صفحات به منظور plugins ايجاد مي كنند . چنانچه در مورد قالبهاي مورد استفاده فكر مي كنيد برخي از المان چند رسانهاي را در نظر آوريد براي مثال از خود بپرسيد كه آيا Java Script براي سايت شما مهم است يا فقط به صرف اينكه مي توانيد ميخواهيد آن را اضافه كنيد؟
بطور مشابه دلايل خوبي براي استفاده از اپلتهاي جاوا يا جاوا اسكريپت و يا جايگيري جاوا در نوار وضعيت نيز وجود د ارد .
يك طرح خوب از مندرجات و طراحي گرافيكي براي خشنودي انتظارات كاربران ميتواند كا في باشد . افكتهاي Mouseover و Rollovers يا واكنشها و عملهاي تقابلي ايجاد ميكنند . نمودار زير نشان مي دهد كه كدام قالب بهتري قالب براي چند رسانهاي مي باشند و اين نتيجهگيري با بكاربردن قالبهاي متفاوت حاصل مي شود .
بهترين طراحان وب برنامههايي دارند و مي دانند كه چگونه از ابزارها و المانهاي چند رسانهاي استفاده كنند . شايد هيج يك از طراحان وب ندانند كه بايد در ابتدا به عنوان آسيستان يك طراح شروع به كار كنند تا بتوانند با منابع و ابزارهاي مورد نياز براي يك سايت آشنا شوند . همچنين بايد سعي كنند كه محاسبه كنند كه چند درصد از كاربران مورد نظر مرورگرهايي با قابليت Java دارند و يا فايل به بارگذاري Plugin هستند .
ايجاد كننده چند رسانهاي
هر برنامه چند رسانهاي مي تواند محركي جهت استفاده از ابزارهاي جديدي كه به شما براي بنا كردن المانهاي قوي چند رسانهاي كمك مي كند ، باشد . چرا كه هر نرم افزار ويژگيهاي خاص خود را د ارد و هر يك مي تواند براي بهينه سازي عوامل نمايش انتخاب شود بعلاوه وسعت تيم طراحي شما ميگويد كه در فاز طراحي چه نقشي را خود ما ايجاد مي كنيم و چه عوامل ديگري بايد در كار درگير شوند . در فازهاي طراحي بايد فرصتهايي را براي محاسبه نقاط قوت و ضعف سايت خود داشته باشيد . همچنين شما به عنوان يك طراح وب بايد وقوف كامل به زمان داشته باشيد و آن را به عنوان يك بار اضافي براي كاربراني كه در حال حاضر حتي اضافه بازديد دارند تلقي كنيد . تكنيكهاي تجارت الكترونيك و قابليتهاي همكاري بين سيستم عاملهاي مختلف و سخت افزارهايي كه ميتوانند براي سيستمهاي مختلف به كار گرفته مي شوند همه و همه بايد به دقت در نظر گرفته شوندو ب كاران حرفهاي بايد همه اين موارد را در نظر بگيريد .
برنامههاي جديد دائماً چند رسانهاي هاي بزرگتر و مقبولتري را بر روي وب مطرح ميكنند . در مراحل توسعه امروزي هيچ رسانهاي استانداردي نيست كه بتواند بگويد كه كدام نرمافزار بر روي اينترنت بهتر كار مي كند . براي ايجاد چند رسانهاي خوب بايد كليه منابع و امكانات در قالب براي ا يجاد بهترين تكنولوژي به كار گرفته شوند.
با رشد و ازدياد مصرف كنندگان علاقمند ، فعاليت خريد و تجارت سئوالات شما پيرامون محورهاي زير قرار خواهد گرفت .
چگونه شركت ما بهترين بهره را از دانش برنامههاي تقابلي وب و مندرجات چند رسانهاي براي موفقيت در ايجاد توانايي براي مشتريان ( قبل از رقابت ) انجام مي دهد ؟ اين سئوالات تجاري از تصاوير سنتي كه در مورد تأكيد در تكنولوژي وب مي باشد متفاوت است ؟ يك صفحه وب فقط در چند ثانيه خواننده را ملزم و علاقمند به محتويات داخل سايت مي كند .
حس و نگاه صفحه ابزار مهمي براي اين فعاليتها مي باشد. گرافيكها قسمت مهمي از مشاهدات كاربران شما هستند . به اين دليل نمايش گرافيكها قسمت مهمي از توسعه وب مي باشد و اولين صفحه از سايت شما بايد گذرگاهي نمايش دقيق اجزاء براي كاربران به منظور جمع آوري اطلاعات باشد . اين نوع قالب پيمايش به در راه مشخص به كاربران كمك مي كند .
Java Plug Ins
يك طراح وب بايد در راه انتخاب ساختار و الماني كه كاربر براي اجراء آن نياز به زمان براي بارگذاري دارد ما نند اپلتهاي جاوا انديشه كند . موقعي كه Java اجازه اجرا شدن بدست آورد مباحث مهمي در پي آن ايجاد مي شود . بيشتر كاربران ترجيح مي دهند كه بجاي ارسال مندرجات تنها ابزارهاي لازم جهت استفاده از آنها را ارسال كنند . بيشترين نظريه ها مبين اين است كه مشكلات زيادي براي جاو وجود دارد مثلاً ترس از كار افتادن كامپيوتر هنوز وجود دارد . خيليها بر اين باورند كه بيشتر مشكلات جاوا ناشي از زبان آن نيست بلكه از اجراي آن در محيط ايجاد نمي شوند و لي چيزي كه مهم است اين است كه طراحان مي توانند كنترل خوبي بر روي سيستم كاربر داشته باشند .
متصور ساختن و درك ذهني از كاربران
ابتدا يك تصوير ذهني از كاربران سايت ايجاد كنيد . اگر شما دقيقاً بدانيد كه كاربران كه هستند پس مي توانيد درك خوبي از سخت افزار و مرورگري كه آنها استفاده مي كنند داشته باشيد.
اندازه مانيتور آنها چقدر است ؟ inch 14 يا inch 21 ؟ چه نوع كارت گرافيكي دارند ؟ از كدام نوع حافظه استفاده ميكنند و اين حافظه چقدر است ؟ همانطور كه مي دانيد وظيفه اصلي يك كارت ويدئويي نگهداري يك عكس براي دادن اجازه به مانيتور براي نمايش آن است . بنابراني كاربراني كه كا رت ويدئويي دارند Ram بيشتري نياز دارند و آنها مي توانند از جهت رنگ و پيكسل تصاويري مطلوب را ارائه دهند . يك عكس با كيفيت 480*640 با 256 رنگ به بيشتر از kb 300 حافظه نياز دارد . براي كاربران ديدن يك عكس بطور درست و دقيق حداقل نياز به MB2 حافظه مي باشد پس بنابراين بايد بدانيد براي كدام كاربر سايت طراحي مي كنيد ؟
براي كاربري با بيشترين و بهترين جزئيات ؟ حداقل تجهيزات ؟ يا مابين آنها ؟
اگر چه توسعه وب بدون وقفه شروع شده است اما كيفيت موجود كارتهاي ويدئويي در اينترنت مي تواند نامنظم ، نقطه به نقطه شده و خيلي كوچك باشد و بعضي اوقات را در كمتر از يك هشتم سايز صفحه نمايش اجرا مي شود .
انواع كارتهاي گرافيكي كه معمول هستند
از سالهاي پيش تكنولوژي Intel MMX شتابدهندههاي چند رسانهاي را در يك تراشه تعبيه كرد . حذف كارتهاي شتابدهنده گرافيكي و ويدئويي با هم صورت ميگيرد . ا گر حدود نصف كاربران سايت شما به انتخاب خوب چند رسانهاي وابسته باشند اكثر كاربرانتان خرسند خواهند بود و شما ديدگاه خوبي از نظر كاربران سايت خود خواهيد داشت .
كارآيي
ميتوانيد عكسها ، انيميشنها ،اصوات و عكسهاي كوچكتر و فشرده شده با نرمافزارهاي ويژه طراحي و براي استفاده در روي اينترنت ايجاد كنيد .
اين نرم افزارها به شما اجازه ميدهند كه شما كارهاي زيادي را براي بهينه سازي گرافيكي در مورد تصاوير غير متحرك و فايلهاي ويدئويي به كار بريد . نتيجه پاياني اين فشردهسازي ، ساختن فايلهاي كوچكتر بدون كاهش كيفيت مي باشد.
خصوصيت ديگري كه بايد در نظر داشته باشيد ذخيره كردن فايلهاي چند رسانهاي بطور Local زماني كه دستورالعمل هاي آن بر روي اينترنت يا اينترنت نگهداري شود .
بعضي از برنامههاي ايجاد چند رسانه ايها مثل :
Asymetrix Muluimedia,Macromedia Authorwar Tool Book و Director به شما اجازه مي دهد كه فايلهاي چند رسانهاي را از منابع محلي درخواست كنيد ( مثل شبكه يا CD ROM )
تخلف قانون كپي برداري
هر چند كه كاربران مي توانند موارد زيادي را بر روي اينترنت ببينند و يا بازيافت كنند اما استفاده كاري از آن عملي نامناسب و غير قانوني است .
نظر به اينكه در توسعه وب برنامههايي براي رديابي از بازديدكنندگان سايت ابداع شد ، آنرا به تدريج از تعداد كاربران مجهول كاسته مي شود.
لذا از مجهول بودن كاربران كاسته خواهد شد . به خاطر آوريد كه استفاده و انتشار اسناد بدون اجازه از ايجاد كنندگان آن تحت قانون كپي رايت غير قانوني است . ( متون ، هنر ، موزيك ، ...)
در نتيجه براي اجتناب از مجازات قانوني همه طراحان بايد تعبير كليه قوانين مربوط به اين موضوع را در نظر بگيريد .
بارگذ اري و Plug Ins
اهداف
1 بيان تكنولوژي plug ins
1 نصب Flash player , Macromedia Shockwave
1 نصب Real Net Works Real Player
1 اتصال به فايل با قابليت بارگذاري
مقدمه
يك مرورگر وب به خودي خود نرم افزار قدرتمندي مي باشد اما وظائف آن محدود است . اما زماني كه يك وب سايت كه يك رسانه تعاملي است و مملو از مندرجات فريبنده چند رسانهاي است و بيشتر آنها نيز با مرورگر تنها قابل دسترس نيستند . كاربران نرم افزارهاي افزودني نظير Plug ins نياز دارند .
plugins تنها نرم افزاري نيست كه به مرورگر براي انجام وظائفش كمك مي كند بلكه آنها رمزهايي هستند كه خود را بصورت قسمتي از مرورگر در ميآورند .
plugins امكان اختيار به كاربر مي دهند زيرا به كاربر اجازه مي دهد كه كارآيي مرورگر خود را تخمين بزند . به عبارت ديگر مشكلات ديگر مي تواند پيشروي نصب يك plugins ايجاد شود كه معمولاً كاربران سايت را مجبور به بازديد از سايت ديگري كه عمل بارگذاري را بالقوه انجام مي دهد ، ميكند . طراحان وب بايد تمامي مضرات و آگاهي از محتوياتي كه براي اجراء شدن نياز به plug_ins دارند را به دقت در نظر بگيرند . تمامي اين اختيارات و مضرات و نيز آگاهي به استفاده از محتوياتي كه به plugins نياز دارند ، بوسيله وب بايد در نظر گرفته شوند . در نهايت آيا بهرهاي كه از استفاده از plugins به ما مي رسد از ضررهايي كه براي كاربرد دارد بيشتر است ؟
تكنولوژي plugins
اگر بخواهيد از المانهاي چند رسانهاي زيادي در سايت خود استفاده كنيد بايد بدانيد كه احتياجات مرورگر براي ديدن مندرجات دايناميك چيست؟ plugins امكان ديدن ويدئو ، دنياي سه بعدي گوش دادن به فايلهاي صوتي و اثر متقابل اشياء چند رسانهاي دايناميكي را فراهم مي كند . اين فصل براي شما تكنولوژي plugnis در توانائيهاي مرورگر براي ديدن و و اكنش متقابلي با موارد جديد استنباط يافته است . بعضي اوقات قالبهاي جديد به وسيله مرورگر حمايت نميشوند ،كه اين رشته بيشتر شامل چند رسانهايهاي قابل دسترسي در وب ، مي باشد كه شما بايد هنگام استفاده از سايت آنها را در نظر بگيريد .
كمپانيهاي فروشنده نرم افزار در حال ايجاد plugins هايي با حركات حيرتانگيز هستند .
در حال حاضر حداقل 174 ، plugins اختصاص براي NetScape Navigator به تنهايي وجود ارد تا چند سال پيش فقط مقدار محدودي plugins وجود داشت . بيشتر اين plugins ها به گونهاي طراحي ميشوند كه ازچند رسانهاي هايي كه دايناميك ، تعاملي و قويتر از آنچه كه قبلاً تصور مي شده بتوانند حمايت كنند .
pluginsچيست؟
plugins يك نرم افزار محرك و پويا است كه منشا آن يك پايگاه داده ويژه و مرورگري مثل IE يا Netscape Navigator ميباشد . هدف plugins ابتدايي توسعه كارآيي مرورگر بوسيله ايجاد قالبهاي چند رسانهاي موثر و يكپارچه ميباشد .
pluginsچگونه كار مي كند ؟
وقتي مرورگر با فايلي روبرو مي شود كه آن را حمايت نمي كند . برنامهاي شروع به كار مي كند كه سازگار با نوع آن فايل است . وقتي كه برنامه آغاز به كار ميكند يك فرم از كاربر جديد مانندReal Player , Quick Time ميگيرد و پنجره جديدي در مرورگر آغاز به كار ميكند . plugins ها ميتوانند همزمان از جريانهاي متعددي حمايت كنند و اطلاعاتي كه مرورگر نشان مي دهد را حمايت كنند . بنابراين plugins ها ، عمل فيلتر ، توليد و ترجمه را انجام ميدهند يا از اينترنت و د ادههاي اينترنتي استفاده ميكنند .
چگونه اين جلوه توسعه را تحت تأثير قرار ميدهد ؟
قبل از آنكه امتيازات و توانائيهاي plugins را بدانيد بايد فايلهاي چند رسانهاي را به منظور ايجاد يك برنامه فشرده براي ساختن plugins ايجاد كنيد . اين برنامهها فايلهاي چند رسانهاي را جهت اجرا فشرده مي كنند و آنها را جهت دهي مي نمايند .
متأسفانه بيشتر فشردهكنندهها قالب اختصاصي ايجاد ميكنند كه فقط با plugins ها ويژهاي خوانده مي شود . خبر جالب توجه آن است كه بيشتر فشردهكنندگان plugins زمان بارگذاري را بهينه مي كنند ،سايز فايل را افزايش داده و به طور زيادي فعل و انفعالات چند رسانهاي را افزايش ميدهند .
و نقطه انتخاب plugins اوليه توسط طراحان براي زمان ذخيره سازي سايت اهميت دارد . براي مثال Writer بايد از Adobe Acrobat براي ايجاد فايل Acrobat Reader و براي ايجاد يك فايل Real Audio بايد از Real Net Work استفاده كنيد .
معمولاً براي ايجاد اين قالبها بايد برنامهايي خريده شود در صورتيكه برنامههاي مربوط به مشاهده آنها بصورت plugins و مجاني است . وظيفه ما به عنوان يك طراح وب اين است كه تجربيات كاربران را در سايت به كار گيريم . يكي از اصول مهمي كه در اين زمينه بايد رعايت شود اولين لحظهاي است كه كاربران plugins را بارگذاري و نصب ميكنند .
نصب plugins
با وجود آنكه روش نصب plug-in خيلي سريع بصورت استاندارد در آمد بعضي اوقات بعضي از نتايج غير قابل پيشبيني نيز اتفاق مي افتد و اين امر به خاطر آن است كه بيشتر تنظيمات متفاوت و به طور واضح وابسته به انتخاب مرورگر سيستم عامل كاربران است .
plugins ميتواند به 3 روش pre Installation , Offline , Online نصب شود .
نصب به صورت Online
نصب Online بدون احتياج به خروج از جلسه مرورگر آنجام مي شود . به عبارت ديگر كاربران نيازي به Restart كردن مرورگر ندارند . اگر ممكن باشد بايد صفحه خود را طوري طراحي كنيد كه كاربران موارد ديگري براي ديدن و يا خواندن در حين نصب plugins و يا فايلهاي بارگذاري بزرگ داشته باشند .
نصب به صورت Offline
نصب Offline نياز به بارگذاري فايل plugins توسط كاربر، بستن مرورگر و آغاز به كار نصب فايل plugins دارد و وقتي كامل نصب شد كاربر ممكن است كه نياز به Restart كردن كامپيوتر براي اعمال تغييرات و اثر دادن نتيجه داشته باشد . كاربران به جهت نصب دقيق قبل از شروع به بارگذاري راهنمايي ميشوند . اين نوع از plugins ها تلاش زيادتر كاربران را مي طلبند چرا كه كاربران بايد ارتباط خود را تجديد كرده و سپس سايت شما را ببينند .
Installation-pre
بعضي از plugins هاي معمولي در حال حاضر بوسيله پردازش گرو مرورگر نصب مي شوند اين نوع plugins هاي وب براي كاربر بسيار مفيد مي باشد . اين نوع plugins ميتواند تشخيص دهد كه بعضي از plugins هاي معروفي كه بر روي مرورگر نصب مي شوند عبارتند از:
, Shockwave Macromedia ShockwaveFlash Player , Shock Wave Macromedia .
كه از خانواده اجرا كنندگان چند رسانهاي و براي ارائه و مشاهده دامنه گسترده چند رسانهايها مي باشد .
Flash Player , Shockwave ميتوانند مندرجات چند رسانهاي را در بازيهاي تقابلي برهمكنشي با كاربران و نيز اصوات شامل كنسرتهاي زنده و راديو ، نمايش داده و اجرا كنند .
Shockwave با وب در سال 1995 و Flash در سال 1997 معرفي شد. نظر به اينكه هزاران سايت براي استفاده از رسانهها طراحي شدند Shockwave و Flash براي سيستمهاي ويندوز مكينتاش Mac در دسترس ميباشند . طبق با اخبار رسانهها 96 درصد از كاربران وب Flash را از ژانويه سال 2001 نصب كردند . بعلاوه اين آمارها را ميتوانيد در سايت فوق پيدا كنيد .
ReaderAdobe Acrobat
Adobe براي كمك به انتشار اسناد قابل توزيع از فايلهاي موجود معرفي شد . اين ابزار قالب فايلهاي اسناد (سبك PDF ) (Portable Document Format ) ايجاد مي كنند كه بصورت pdf . پسوند استفاده مي شود . فايلهاي pdf به وسيله برنامهAcrobat Reader خوانده ميشوند .
يك مرورگر Plugins ميتواند به طور مجاني آن را بارگذاري كند . بسياري از اسناد موجود در ارگانها نميتوانند به آساني بوسيله فايل HTML نشان داده شوند . اين اسناد براي نگهداري مي توانند به فايلهاي Adobe Acrobat برگردانده شوند . براي مثال اسناد تگهاي IRS به آساني در HTML ايجاد نمي شود. بنابراين IRS همه تگها را به فايل pdf در Acrobat براي آسان كردن بارگذاري از وب سايت تبديل ميكند . اگر برنامه Acrobat Reader را داشته باشيد ميتوانيد اين فايلها را در قالبهاي اصلي خود بارگذاري كنيد ، آنها را چاپ كنيد و به همان حالتهايي كه از اداره پست يا يك كتابخانه محلي دريافت ميكنيد از آنها استفاده كنيد . اين قالب در وقت و زمان شما صرف جويي ميكند و اطمينان مي دهد كه تمامي اسناد به همان صورت اصلي وارد شده است . فايلهاي pdf شبيه به فايلهاي Post Script هستند اما فرم فشرده ، آن را براي انتشار الكترونيكي در اينترنت و محيطهاي اينترانت مناسب تر ميكند . يك فايل pdf معمولاً به فضاي كمتري نسبت به فايلهاي PostScript نياز دارد .
از پردازشگر Word و برنامههاي صفحه گسترده ميتوانيد اسناد خود را بدون بازنويسي چاپ كنيد نيز ميتوانيد فايلهايي را براي مشاهده Online ويا چاپ با نرمافزارهاي مشابه ايجاد كنيد . Acrobat مندرجات را در امتداد هر رسانه الكترونيكي انتشار ميدهد .
Real Network , Real Player
به مرورگر اجازه ميدهد كه جريان فايلهاي ويدئويي و صوتي را در هنگام انتشار اجرا كند قبل از انتشار تكنولوژي كاربران مجبور به بارگذاري فايل صوتي و ويدئويي به طور كامل مي باشند تا بتوانند آن را اجرا كنند . Real Player از جريان تكنولوژي استفاده ميكند و به محض ارتباط با سرور شروع به اجرا ميكند . كاربران نيازي ندارند كه صبر كنند تا تمامي جريان بارگذاري شود زيرا اگر فايل بزرگ باشد زمان زيادي را ميگيرد . امواج راديويي و ويدئويي انتشار داده ميشوند و در حين اجرا ارسال مي گردند و سپس براي جلوگيري از كاهش سرعت از حافظه فراخوانده ميشوند .
ايجاد يك فايل با قابليت بارگذ اري
براي ايجاد يك فايل با قابليت بارگذ اري بايد به فايلهايي متصل شويد كه از نوعي باشند كه به طور طبيعي به وسيله مرورگر ويا با Plugins حمايت شوند .
چرا فايلها بارگذاري ميشوند ؟
در هنگام استفاده از تگهاي HTML يك ابر اتصال به صفحات ديگر را با استفاده از يك تگ ايجاد ميكنيد .
تگ Anchor
مرورگر صفحه ويژهاي از سرور درخواست ميكند و سپس صفحه در پنجره مرورگر به نمايش در ميآيد . مرورگر هر فايلي را كه بتواند تشخيص دهد نمايش ميدهد و اگر مرورگر نتواند يك فايل را به طور كامل تشخيص دهيد به دنبال Plugins ميگردد كه بتواند از اين فايل حمايت كند و اگر نتواند پيدا كند به شما اجازه بارگذاري آن را نميدهد براي مثال :
اگر با Realplayer كار كنيد به شما اجازه داده ميشود كه فايل را بارگذاري ك نيد .
اتصال به فايلها
مثال زير نمونهاي از بارگذاري يك اتصال با استفاده از فايل Adobe Acrobat مي باشد .
وقتي كاربر بر روي اتصال كليك مي كند اعمال زير ممكن است اتفاق بيافتد :
1 اگر كاربران از قبل Acrobat Reader را بارگذاري و نصب كرده باشند خواننده مجله را در مرورگر بازخواهد كرد و يك سري ابزار براي كار با فايل را اضافه خواهد
كرد .
1 اگر كاربران Acrobat Reader را بارگذاري و نصب نكرده باشند مرورگر به شخص براي بارگذاري فايل اعلام ميكند سپس كاربر بايد وارد سا يت Adobe شود و Acrobat Reader را براي ديدن فايل بارگذاري كند .
مثال : بارگذاري يك اتصال power point و يا سند Word مراحل زير را دنبال ميكند :
وقتي كاربر اتصال را كليك كند دو نتيجه اتفاق ميا فتد :
1 اگر كاربر Office 97 داشته باشد گزارش در پنجره مرورگر نمايش داده ميشود و Word آغاز به كار ميكند .
1 اگر كاربران Office 97 نداشته باشند به آنها اجازه داده مي شوند كه آن را بارگذاري كنند و كاربران بايد به نرمافزارهاي power point و يا word دسترسي پيدا كنند .
ايجاد اتصالاتي براي plug-ins
به عنوان يك طراح وب هميشه نميتوانيد محاسبه كنيد كه كاربران plug-ins آماده براي قالبهايي كه شما استفاده ميكنيد را دارند ؟ اگر شما از فايلهاي Acrobat Reader استفاده ميكنيد يك اتصال به سايت Adobe به منظور اينكه كاربران در صورت تمايل بتوانند Acrobat Reader را بارگذاري كنند ايجاد كنيد اگر شما از فايلهاي Real Player استفاده ميكنيد يك اتصال به سايت Real Network و بقيه منابعي كه فكر ميكنيد كاربران براي ديدن و پيمودن سايت به آنها نياز دا رند ايجاد كنيد .
شناخت و تعيين هويت بارگذاري براي كاربران
هنگامي كه يك اتصال با قابليت بارگذاري ايجاد ميكنيد بايد دو قسمت اطلاعات براي آن ايجاد كنيد ، يكي نوع فايلي كه كاربران ميخواهند بارگذاري كنند و ديگري سايز آن فايل ، براي اينكه كاربران بدانند براي بارگذاري آن به چه مقدار زمان نياز دارند و نيز بايد از تصاويري براي ارتباط دادن كاربران با پسوندهاي فايل استفاده كنند .
انتخاب plug-ins
حال نياز داريد كه تصميم بگيريد كه در سايت از كدام plug-ins ميخواهيد استفاده كنيد و نيز اينكه آيا بيشتر فايلهاي pdf ايجاد ميكنيد يا بيشتر از قالبهاي HTML استفاده ميكنيد ؟ آيا كاربران شما از امواج راديويي و صوتي استفاده خواهند كرد يا غير از آن ؟ آيا از فايلهاي Flash استفاده خواهيد كرد ؟ شما بايد براي حمايت بيشتر مرورگرها و تصميمات بهتري را اتخاذ كنيد .
فرآيند توسعه وب
اهداف
1 ويژگيهاي مشترك تيمهاي مختلف طراحي وب
1 تشريح مقاصد مهم در طراحي وب
1 توسعه وب سايت با جملات صريح
1 توصيف مفهوم كارآيي سايت
مقدمه
در اوايل پيدايش وب كوششهاي انفرادي در جهت ايجاد يك سايت معمول نبود . در خيلي از كمپانيها ، مدير سيستم وظايف توسعه و ذخيره سازي وب را تنظيم ميكرد . حتي هنگامي كه كمپانيها در خواست كمك ميكنند اغلب به اصرار دارند كه يك پيمانكار تمامي وظايف از ايجاد فايلهاي گرافيكي تا برنامهنويسي را انجام دهد . با توسعه روز افزون وبه طبع آن پيچيدهشدن آن فرآيند توسعه انفرادي بطور محسوس از بين رفته است . امروز توسعه دهندگان وب بطور معمول وظايف خود را بصورت سيستمي انجام ميدهد . تركيب اين تيمها ممكن است در كمپانيهاي مختلف متفاوت باشد ولي همه آنها ويژگيهاي مشتركي دارند . در اين فصل درباره مراحل توسعه وب و ابزارهاي طراحي آن بحث خواهيم كرد.
تيم طراحي
مفهوم تيم در محيطهاي كاري جديد نيست به هر جهت به تازگي تيمهايي براي توسعه وب ايجاد شده است . انفرادي بودن توسعه وب در سالهاي قبل بدليل نداشتن علم كافي در مورد تكنولوژي وب و محدود بودن سرمايه علمي و مديريت و منابع توسعه بود . ولي امروزه ديگر به آنگونه نيست و مديريت به عنوان يك نياز براي تكنولوژي توانايي وب ضرورت دارد و تيمطراحي براي پروژههاي وب توسعه آن سازماندهي و به كار برده مي شوند . بي شك داشتن نيروهاي خلاق در زمينههاي متفاوت بطور انكارناپذيري مفيد است . جمع شدن اين نيروهاي خلاق تمرين خوبي است و اگر پروژه وب همين چرخه را در پروژههاي تجاري ديگر نيز دنبال كند نتيجه آن اميدوار كننده خواهد بود .
كارشناسي در نقاط زير ميتواند در خيلي از تيمهاي طراحي چندگانه نشان داده شود.
1 مديريت پروژه
1نوشتن و ويرايش
1 طراحي گرافيك
1 تكنولوژي
1 بازاريابي
1 معماري اطلاعات
مديريت پروژه
تهيه و ايجاد يك وب سايت به تواناييها و مهارتهاي متعددي نياز دارد كه به ندرت در يك نفر پيدا مي شود . وقتي يك طراح وب نقش يك مدير پروژه را بر عهده ميگيرد اولين وظيفه آن درك مهارتهايي است كه براي ساختن و ذخيره كردن يك سايت به آن نياز دارد . سپس بايد بدانيد كه موجودي مهارتهاي سازمان خود را هستند و يك طراح وب بايد بيشتر از نحوه ايجاد و ذخيره يك وب سايت آگاهي داشته باشيد . وب سايت تركيبي از نيازهاي موجود در مديريت تكنولوژي و منابع انساني است . هر وب كار حرفهاي توانائيهاي متفاوتي در قسمتهاي مختلف ارائه ميدهد . معمولاً در تيم توسعه وب مهارتها انتظام زير را دارند .
هر حرفه تخصصي مهارت متفاوتي را براي تنظيم كار دارد و اگر شخصي باشد كه تمامي اين مهارتها برنامهنويسي، چاپ ، طراحي و ديگر مهارتهايي كه براي توسعه سليت نياز است ) را دارا باشد ، احتمالاً ايدهآل است . واقعيت اين است كه اين مهارتهاي فردي بي نهايت مهم است و طراحي وب تمريني در اتحاد طراحان و تكنولوژيها براي رسيدن به منظور درخواستي است . چرا كه ما با منابع و مهارتهاي محدود در دنياي واقعي سرو كار داريم و توسعه وب بيشتر شبيه به يك هنر مي باشد تا يك علم و آن هنري است كه نياز دارد كه شما بهترين توليد و منابع در دسترس را براي آن ايجاد كند . واقعيت امر آن است كه بينهايت نادر است كه شخصي بتواند تمامي اين مهارتها را باهم داشته باشد . زيرا در دنياي واقعي ما با مقدار كمي از منابع و مهارتها مواجه هستيم و توسعه وب بيشتر شبيه به يك هنر ميباشد تا يك علم . هنري كه نيازمند به ساختن بهتري توليدات بامنابع موجود است .
روش اجراء از بالا به پائين
در اين روش سعي بر آن است كه طراحي از پايين به بالا صورت گيرد . ظاهر شكل سايت را تعريف و طراحي نماييد . سپس عكس العمل كاربر را با طرحي خاص تطبيق دهيم . در هر حال، فرآيند طراحي بر پايه شناخت عملكردهاي يك سيستم مطلوب در پاسخ به رفتار كاربران متمركز ميباشد . بنابراين فرآيند طراحي سايت بر عكس مي باشد . شكل و عملكرد سايت وب زماني پديدار ميشود كه ديدگاههاي مختلف كاربر از ديدگاه او و بصورت پايين به بالا توسعه يابند .
شما مي توانيد براي يك سايت وب يك سري رفتارهاي كاربردي مطلوب ايجاد كنيد . هر يك از اين رفتارهاي مطلوب ، ديدگاههايي به همراه دارند كه بايد مورد توجه واقع شوند . اين نقطه نظرات به صورت چشمگير فرآيند توسعه سايت وب را آسان مينمايند . آنها در ابتدا يك تصوير واضح و روشن از وسعت پروژه براي شما فراهم ميآورند سپس در طول توسعه سايت به عنوان يك ابزار عمل مي كنند تا روند برنامه و بودجه طرح را تأمين نمايند . تعريف و طراحي نگاه و ا حساس سايت سپس تطابق عكسالعمل كاربران به طراحي مخصوص فرآيند طراحي از بالا به پايين مي باشد به هر جهت ديدگاههاي توسعه در شناخت رفتارهاي سيستم در واكنش به رفتار كاربران است و بدين ترتيب فرآيند طراحي سايت معكوس مي شود . نگاه و احساس و عامليت وب سايت در سناريوهاي ...
فازهاي توسعه
فرآيند توسعه وب شامل فازهاي زير است :
1 مفهوم سازي
1 تجسم طراحي
1 تجزيه و تحليل
1 توليد
1 ترقي و توسعه
هر مرحله براي رسيدن به مرحله بعد به اجزاء صحيح نياز دارد . اين فازها مي توانند به عنوان برداري براي فرآيند در نظر گرفته شوند .
مفهوم سازي
مفهوم سازي فرآيند توسعه بصري و بيان استراتژي وب سايت است . بينايي يك سايت تمامي اشياء يك وب سايت را به طور كلي در محفظهاي قرار ميدهيد ، اين بينايي شبيه به جملاتي كه رسالت كمپاني و اهداف و موجوديات آنرا بيان ميدارد .
تجسم طراحي
تجسم طراحي فرآيندي است كه لنگرگاهها وساختار مندرجات ، نقشهها شرح و فلوچارت مورد استفاده در اين فاز را آماده ميكند .
تجزيه و تحليل
تجزيه و تحليل فرآيندي جهت آزمايش مندرجات براي رسيدن به بينايي سايت ميباشد . آناليز به شما اجاز ميدهد كه محاسبه كنيد كه آيا اصلاحات بايد در فاز قبلي براي رسيدن به فاز بعد انجام گيرد يا خير ؟
توليد
توليد فرآيندي براي اجرا كردن برنامههاي طراحي مي باشد اين مرحله شامل ايجاد تمامي مندرجات و نيز آزمايش كارآيي سايت ميباشد .
توسعه و ترقي
تعريف اهداف پروژه
تعريف اهداف پروژه تعيين ميكند و اطمينان ميبخشد كه آيا انتظارات اشخاص برآورده شده است يا خير ؟ بيشتر پروژههاي وب يك مدير پروژه PM دارند كه در نظام تيم توسعه نقش پيشگستر دارد . به عبارتي مدير پروژه يك مدير تكنيكي نيست اما لازم است كه بداند كه حدود و وسعت فرآيند توسعه چقدر است ؟ يك مدير پروژه (PM) هر كدام از مراحل تكنيكي علمي را براي فرآيند توسعه هدايت ميكند (PL) . به عنوان مثال يك پروژه داراي راهبريهاي تكنيكي، خلاق، مندرجات ميباشد كه هر كدام از آنها كارشناس خبره تيم هستند كه PL ها همه باهم تحت نظر رئيس پروژه (PM) براي راهنمايي و وا بستگي به پروژه به طور كامل كار مي كنند .
مرحله 1 تجزيه پروژه
تجزيه وتحليل براي شناسايي و بررسي نقاط ضعف اعضاء پروژه انجام ميشود . اين مرحله به برقراري ساختار تيم كمك ميكند . بعضي اوقات اعضاء تيم بايد براي مساعدت در بعضي ازسطوح پروژه در خارج از حوزه منابع با هم مشورت كنند . نقاط قوت و ضعف پروژه ميتواند شامل قابليت و دوام محصولات و يا سرويسهايي كه در وب عاريه شده است باشد . آيا پروژه با تأمين وجه محدود در تكامل تدريجي دچار گرفتاري خواهد شد ؟ و بررسي سئوالاتي نظير اينكه آيا در حدود و دامنه پروژه و اقع بيني وجود دارد ؟ اعضاء تيم پروژه بايد در اين زمان چنين سئوالاتي را در نظر داشته باشند .
مرحله 2 توقع مشتري و ارزيابي آن
توقعات كاربران بايد به وضوح درك شوند . كاربران اغلب انتظارات غير واقعبينانهاي از تكامل و امكانات سايت شما دارند . حال چگونه كاربر سايت ، به سايت شما ارزش گذارد ؟
مرحله 3
رويدادها و علائم بايد در تقويت ارزش جهت سايت باشد . براي مثال آيا توجه بازار هنوز در همان تكنولوژي قبل مي باشد يا تكنولوژي جديدي كشف شده است كه ميتواند جانشين تكنولوژي تعريف شده قبلي شود . آيا پيشبيني تغييراتي كه در حين آنجام يك پروژه اتفاق ميافتد مهم است ؟ ودر نظر بگيريد كه چگونه مي توانيد آنها را به بهترين صورت تكميل كنيد .
مرحله 4
انتقال پروژه : بيان كنيد كه چگونه و از چه نقطه نظري يك پروژه مي تواند به سمت كاربر ارسال شود . اين مرحله شامل تعريف مهارتها و وظايف تيم پروژه و كاربر است . اگر شما فرض كنيد كه كاربر مي تواند و قادر است كه در هر زماني پروژه وب را قبول كنند و در نگهداري آن با شما متحد باشند اين انتقال ممكن است مشكل باشد .
درك مرحله تجارت
نقش يك طراح وب پيچيده مي شود . در قبل فقط كافي بود طراحان وب مهارت ايجاد يك صفحه وب براي مشتري را داشته باشند . اما امروزه فقط لزوم بودن وب به تنهايي كافي نيست.اينترنت فقط انباري از كاتالوگهاي اينترنتي نيست بلكه تدرجاً كلكسيوني از تكنولوژيهاي پيچيدهاي است كه توانايي توسعه سودمند اينترنت بر مبناي تجارت را ارائه مي كند .
راهكارهاي موفقيت تجارت الكترونيك متفاوت هستند . معمولاً آنها به 2 دسته تقسيم مي شوند :
1ـ سايتهايي كه محصولات خود را در اينترنت ارائه ميدهند ( مثل بازيهاي تقابلي يا ابزارهاي جستجو در اينترنت )
2ـ سايتهاي كه محصولات موجود و سرويسهاي بازار تجارت جهاني را بر روي اينترنت انتشار ميدهند .
به طور عمومي يك وب سايت موفق به چه مياديني براي هر كاربر نياز دارد ؟
فروش عمومي يك وب سايت موفق ميتواند بهترين مثال باشد . فروشگاه كتاب در نقطه اصلي پايتخت وجود دارد كه بزرگ است . به هر جهت اين فروشگاه نميتواند 5 ميليون عنوان جابهجا كند و نيز اين فروشگاه فقط براي مردمان نزديك به پايتخت در دسترس خواهد بود سايت به اين نياز پاسخ ميدهد . هر شخصي با دسترسي به اين وب سايت در حقيقت به ميليونها عنوان كتاب دسترسي دارد .
چنين تجارتي چگونه آغاز ميشود؟ همه چيز با يك تصور شروع مي شود . به عبارت ديگر با اين نگاه بدون نگهداري كالا كتابها را به فروش ميرسد .
نتيجه گيري
مؤثر ترين صفحات نتيجه طراحي دقيق و ارزشيابي مي باشند ، شايد شنيده باشيد كه هزينه ايجاد برخي سايتهاي وب بقدر زيادي مي شود كه در كل به كار بي مصرف و مسخره اي تبديل مي شوند . يك سايت وب نيم ميليون دلاري بايد به ميزان 70% از كل هزينه ها را صرف برنامه ريزي و ارزش يابي نمايد .
براي ارزش يابي صفحات قدم هاي زير را دنبال كنيد :
1) عمليات تمام ارتباطات داخلي و منابع را آزمايش كنيد . ايجاد يك پرونده با فورمت Phot oshop و قرار دادن GIF در آن ، يا قرار دادن يك پرونده HTML در مسير غلط ، اشتباهاتي است كه به راحتي اتفاق مي افتند . در صورتي كه از دنباله HTML براي پرونده هاي صفحه خود استفاده مي كنيد ، اطمينان حاصل كنيد كه سيستم عامل آن به HTM ، خلاصه نمي كند .
2) با دقت تمام ارتباطات خارجي را چك كنيد هيچ چيز بدتر از ارتباط به صفحه خارجي نمي باشد كه ديگر وجود ندارد يا به مكاني ديگر منتقل شده يا به گونه اي تغيير كرده كه ديگر مربوط به صفحات شما نمي باشد .
3) صفحات را در مرور گر هاي مختلف آزمايش كنيد . پس از بررسي مشتريان ، بايد به ابزار موارد استفاده آنها واقف باشيد . ديگران چطور؟ آيا شما از منابع خواص مرور گر مورد استفاده مشتريان خود استفاده كرده ايد ؟ اگر چنين است صفحات بر روي مرور گرهاي ديگر چگونه كار مي كنند ؟
4) صفحات را تحت خطوط ارتباطي مختلف آزمايش كنيد . ممكن است فرض كرده باشيد كه مشتريان با خطوط TI با سرعت بالا كار كي كنند ، ولي اگر آنها بخواهند در خانه و با مودم 288 كار كنند كار آيي صفحات شما چه وضعي خواهد داشت ؟
5) صفحات را تحت شرايط ترافيك بالا امتحان كنيد . بهترين زمان براي جواب گرفتن تحت چنين شرايطي ساعت 10 صبح مي باشد . (البته با ساعت كالي فورنيا) . در اين ساعت تمام موج سواران جدي و غير جدي وب مشغول كار با آن مي باشند و باعث ترافيك زيادي بر روي اينترنت مي شود . اگر سرور و صفحات شما در طول پيك ترافيك به خوبي جواب دهند ، در ساعت هاي ديگر حتي بهتر عمل خواهند كرد .
6) صفحات را با كاربران مختلف آزمايش كنيد . اگر صفحات شما مورد علاقه عمومي مي باشند ، از همكاران ، دوستان و بچه ها براي آزمايش صفحات خود مي توانيد استفاده كنيد . نكات مورد توجه و مشاهده آنها را يادداشت كنيد . در اين مرحله احتمال دارد توانايي تغيير صفحات را نداشته باشيد ، ولي مي توانيد از پيشنهادات آنها در نسخه هاي بعدي استفاده كنيد .
منبع : سايت علمی و پژوهشي آسمان -- صفحه اینستاگرام ما را دنبال کنید
اين مطلب در تاريخ: دوشنبه 03 فروردین 1394 ساعت: 14:01 منتشر شده است
برچسب ها : تحقیق درباره طراحي صفحات وب,طراحي صفحات وب,