اخبار دنياي ديجيتال اینترنت و وب

راهكارهاي تعامل بيشتر با كاربر

اضافه كردن تعامل و انيميشن به يك طراحي، نيازي نيست پيچيده باشد يا وب‌سايت را زماني كه از استانداردهاي پيشرفته وب استفاده مي‌كنيد از دسترس خارج كند. در اين نوشته تكنيك‌هايي ارائه شده‌اند كه به راحتي اين كار را براي شما انجام خواهد داد. برخي از اين تكنيك‌ها براي شما آشنا هستند ولي ممكن است با برخي آشنايي نداشته باشيد.
HTML و جاوا اسكريپت

اداره كردن HTML توسط جاوا اسكريپت معمول‌ترين روش براي اضافه‌كردن تعامل به يك وب‌سايت است. ولي قبل از اين كه استفاده از جاوا اسكريپت را آغاز كنيد، درك قوي از مدل فرمت‌بندي ديداري CSS و مدل جعبه، بسيار مهم است. آنها براي درك چگونگي به‌كارگيري عناصر HTML به صورت ديداري، حياتي‌اند. زماني كه به صورت پويا، سبك يك عنصر HTML را تغيير مي‌دهيد، اين تغيير تا پايان متن جريان پيدا مي‌كند و عكس‌العمل نشان مي‌دهد. ياد گرفتن پيشگيري و كنترل تأثيرات آن كمي سخت خواهد بود.

استفاده از يك كتابخانه جاوا اسكريپت مثل jQuery مي‌تواند از مشكلات چند مرورگري جلوگيري كند. همچنين jQuery عملكرد رايج‌تري ارائه مي‌كند كه تعامل با HTML را به پروسس سريع‌تري تبديل مي‌كند. يادگيري پايه‌هاي جاوا اسكريپت قبل از نگاه كردن به كتابخانه‌اي مثل jQuery ضروري است تا اصول را متوجه شويد و بدانيد چگونه jQuery كاري را انجام مي‌دهد نه اين كه چه كاري مي‌كند.

چه زماني نبايد از جاوا اسكريپت استفاده كنيد

محتواي تعاملي مي‌تواند بسيار جذاب‌تر از محتواي ثابت باشد ولي هميشه راه‌حل قابل استفاده‌اي نيست. شرايط زير را در نظر بگيريد:

ـ آيا كاربر عمل مناسبي كه اتفاق مي‌افتد را درك مي‌كند و انتظار آن را دارد؟

ـ اگر محتوا پنهان باشد آيا كاربر خواهد فهميد چگونه به آن دسترسي پيدا كند؟

ـ آيا وب‌سايت روي تمام دستگاه‌ها قابل استفاده است؟

اگر نمي‌توانيد جاوا اسكريپت را با اين سوالات تطبيق دهيد، بهتر است از آن دوري كنيد! هوشيار باشيد؛ از خودتان بپرسيد كه آيا چشم‌نوازي زياد واقعا ضروري است؟

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

انيميشن با SVG

افكت‌هاي معلق (hover) براي لينك‌ها خوب عمل مي‌كنند ولي زماني كه روي عناصر ديگر اعمال مي‌شوند گيج‌كننده خواهند بود. همچنين آنها روي دستگاه‌هاي صفحه لمسي دسترسي كمتري دارند. زماني كه كاربر كليك مي‌كند، تعامل معمولا خيلي قابل استفاده است چرا كه به كاربر بازخورد مي‌دهد. سايت getsatisfaction از يك تكنيك هوشمندانه براي نشان دادن 12 توصيه مختلف استفاده كرده است. در اين مثال، شركت از گرافيك‌هاي برداري مقياس‌پذير (Scalable Vector Graphics - SVG) براي پشتيباني از انيميشن بهره برده است.

چه زماني از SVG استفاده كنيد

هميشه فوايد و مضرات هر فناوري را در نظر داشته باشيد. منطقي‌ترين راه‌حل لزوما راحت‌ترين راه براي پياده‌سازي نيست. SVG يك محيط گرافيكي ديگر فراهم مي‌كند كه در برخي شرايط انيميشن را مثل يك برش كيك مي‌كند. همچنين طبيعت مقياس‌پذيري SVG فوايد آشكاري نسبت به تصاوير پيكسلي با اندازه ثابت دارد. دليلي كه به ندرت مي‌توانيم SVG را ببينيم اين است كه اينترنت اكسپلورر از آن پشتيباني نمي‌كرد (تا قبل از نسخه 9). البته كتابخانه رافائل (Raphaël) كه سايت getsatisfaction از آن استفاده كرده است، به طور خودكار SVG را براي VML (Vector Markup Language يا زبان نشانه‌گذاري‌برداري) كه IE آن را مي‌فهمد، تبديل مي‌كند.

انيميشن با Canvas

انتقال‌هاي CSS مي‌توانند بسياري از ويژگي‌ها را تغيير دهند تا افكت‌هاي بصري زيادي بسازند. ولي در نهايت آنها هنوز هم به شيوه‌هاي CSS و انتقال‌هاي با طول ثابت محدودند. آيا راهي وجود دارد كه انيميشن‌هاي پيشرفته‌تري توليد كرد؟

چگونه Canvas مي‌تواند مفيد باشد؟

Canvas يك عنصر بسيار منعطف HTML براي توليد گرافيك‌هاي اسكريپتي و قدرتمندترين راه‌حل براي تعامل و انيميشن است. با مشخص كردن افكت‌هاي مشابه براي عملياتي مثل كليك و hover توسط جاوا اسكريپت، مي‌توانيد اجسام لذتبخشي كه از ديد HTML و CSS نامحدود هستند را به كاربر نشان دهيد.

اگر مي‌خواهيد محتوا را توسط عنصر canvas نشان دهيد، بايد محتوا را در قالب يك فرمت ديگر و در دسترس قرار دهيد. شايد canvas براي نشان دادن داده‌هاي تصويري مثل گراف‌ها، نمودارها و جداول بهتر باشد.

يك يادداشت روي فلش

فلش يك استاندارد وب نيست ولي به طور گسترده در وب استفاده مي‌شود. ادوب فلش محيطي براي ساخت محتواي تعاملي با استفاده از Actionscript ارائه مي‌كند. Actionscript 3 همان ريشه‌هاي ECMAScript جاوا اسكريپت را به اشتراك مي‌گذارد، بنابراين يادگيري يكي بعد از ديگري حركت بسيار ساده‌اي خواهد بود. مشكل اينجاست كه فلش يك افزونه اختصاصي و نه يك استاندارد باز وب است. مسلما فلش مي‌تواند قدرتمندترين و در برخي موارد تنها راه‌حل مناسب در حال حاضر باشد.