تكنيك هاي طراحي سايت هر روز در حال پيشرفت هست و اگر شما مي خواهيد از اين قافله عقب نمانيد حتما بايد خود را بروز كنيد. طراح سايت كسي هست كه خود را بروز نگه دارد چون علم كامپيوتر هر ثانيه عوض مي شود و تكنيك هاي جديد مي آيد پس اگر كسي مي خواهد در زمينه برنامه نويسي واقعا فردي موفق باشد بايد و بايد خود را بروز نگه دارد. بايد سايت هايي كه طراحي مي كند از آخرين تكنولوژي هاي طراحي سايت بهره برده باشد.

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

AJAX چيست ؟

ماهيت صفحات وب و پروتكل HTTP به گونه اي است كه به ازاي هر كنش و واكنش ميان كاربر و سايتي كه در حال كار با آن است، كل يك صفحه وب از نو بارگذاري و تازه سازي (refresh) مي شود.

AJAX فناوري جديدي است كه تغيير محسوسي را در اين سناريو به وجود مي آورد؛ به اين ترتيب كه به جاي بارگذاري مجدد كل صفحه، فقط قسمتي تغيير مي كند كه قرار است اطلاعات جديد را به نمايش درآورد و كليه عمليات ارسال اطلاعات و دريافت نتايج در پشت صحنه انجام مي شود AJAX .موجب آزاد شدن پهناي باند اينترنت و در نتيجه ميلياردها دلار صرفه جويي اقتصادي در اين زمينه مي شود و اين به نوبه خود انقلابي در عرصه وب و فضاي سايبر به شمار مي رود.

AJAX مجموعه اي از استانداردها و فناوري هاي وب است كه به كمك آنها مي توان برنامه هايي مبتني بر وب توليد كرد كه به آساني با كاربران تعامل داشته باشند؛ اين فناوري‎ها در جهت تبادل داده‎ها با يك سرور و بروز رساني قسمتي از يك صفحه وب بدون بارگذاري مجدد آن است.

فن آوري هاي مورد استفاده

عبارت Ajax به طيف وسيعي از فن آوري هاي وب اشاره دارد كه ميتوانند براي پياده سازي يك برنامه تحت وب بكار روند. فن آوريهايي كه در پشت صحنه و در سرور فعاليت مي كنند و در نتيجه با وضعيت جاري صفحه وب تداخلي ندارند. بطور كلي ميتوان گفت فن آوريهاي زير مورد استفاده قرار ميگيرند HTML يا XHTML) و (CSS به منظور نمايش محتوا - فن آوري DOM (Document Object Model) يا مدل شيئي صفحهبراي نمايش پوياي داده ها و تعامل با آنها. XML براي تبادل داده ها و XSLT براي مديريت داده ها. XMLHttpRequest نيز براي تبادل غير متقارن داده ها بكار ميرود. JavaScript به منظور يكپارچه سازي اين فن آوري ها البته در حال حاضر عمدتاً بجاي XML (كه فرمتي نسبتاً سنگين است) از JSON براي تبادل داده ها استفاده ميشود و حتي الامكان استفاده از HTML فرمت بندي شده يا متن ساده نيز به اين منظور وجود دارد. طراحي سايت فروشگاهي

البته توجه داشته باشيد كه همواره لازم نيست استفاده از Ajax بخاطر انجام تغييري در صفحه باشد، گاهي اوقات شما ممكن است بخواهيد يك عمليات سروري (همچون يك عمليات ديتابيس) را توسط Ajax انجام دهيد، به گونه اي كه كاربر متوجه نشود.

چرا AJAX ؟

1- عدم نياز به بارگذاري مجدد كل يك صفحه وب

2- صرفه‎جويي در مصرف پهناي‎ باند

3- افزايش محسوس سرعت نرم‎افزارهاي تحت وب

4- پشتيباني از بيشتر مرورگرهاي معروف

5- توانايي سفارشي سازي كنترلهاي سرور به منظور استفاده از ظرفيت‎هاي client

مزاياي استفاده از Ajax در طراحي سايت

- پشتيباني مرورگرهاي معروف از تكنيك Ajax، از جمله IE، فايرفاكس، كروم و سافاري

- سرعت و كارايي بهتر براي قسمت هايي از سايت كه نياز نيست كل اطلاعات سايت دوباره بارگذاري شود مثل فرم هاي ثبت نام و سبد خريد

- فقط قسمتي كه تكنيك Ajax استفاده شده است در طراحي سايت تغيير مي يابد يعني اينكه فقط قسمتي از يك صفحه نه كل صفحه سايت رفرش شود

طراحي پورتال

معايب Ajax

البته هر پديده جديدي در كنار ارائه مزاياي متعدد ممكن است نقاط ضعف يا كمبودهايي داشته باشد كه در اينجا به برخي از مشكلات فن آوري Ajax نيز اشاره ميكنيم:

- هر مرورگري كه از JavaScript يا سيستم تقاضاي XMLHttp پشتيباني نكند، يا در صورتي كه كاربر اين قابليت مرورگر خود را غير فعال كرده باشد، امكان استفاده صحيح از صفحاتي كه به Ajax متكي هستند را نخواهد داشت. دستگاه هايي از جمله تلفنهاي همراه هوشمند و PDAها نيز ممكن است پشتيباني كاملي از اين فن آوري نداشته باشند اگرچه اين مسئله در آينده نزديك مرتفع خواهد شد.

- با توجه به ساختار صفحاتي كه از اين فن آوري استفاده مي كنند و ماهيت پوياي محتواي Ajax، ممكن است خواندن اين محتوا توسط برنامه هاي Crawler امكان پذير نباشد، در نتيجه اين صفحات ممكن است بخوبي در موتورهاي جستجوگر رتبه بندي نشوند.

- از نقطه نظر برنامه نويسي نيز حفظ و نگهداري، اشكالزدايي و تست صفحاتي كه چنين محتوايي توليد مي كنند دشوار خواهد بود.

- برخلاف صفحات معمولي كه در آنها كاربر ميتواند با فشردن دكمه Back صفحه كليد يا آيكون Back مرورگر به صفحات قبلي بازگردد، صفحاتي كه از محتواي Ajax استفاده مي كنند امكان بازگشت به صفحه پيشين را ندارند، البته اين مسئله در HTML5 به نوعي حل شده است طراحي سايت وردپرس      .

- هنگامي كه شما از Ajax براي تغيير دايناميك محتواي صفحه استفاده ميكنيد، امكان مشاهده محتواي اضافه شده را در بخش view source صفحه نخواهيد داشت زيرا محتواي صفحه همان چيزي است كه در ابتدا از سرور خوانده شده بود، به اين ترتيب پس از رفرش مجدد صفحه نيز محتوا به همان حالت قبلي برميگردد. اگر ميخواهيد در محيط ASP.NET از Ajax استفاده كنيد بايد در ابتداي صفحه خود يك كنترل ScriptManager قرار دهيد. نماد اصلي Ajax در ASP.NET، كنترلي به نام UpdatePanel است. ميتوانيد اين كنترل را به همراه ساير كنترلهاي مربوط به Ajax در برگه اي با نام Ajax در نوار ابزار ويژوال استوديو بيابيد.

Ajax در طراحي سايت

اگر بخواهيم به طور خلاصه به معرفي ajax بپردازيم اصطلاح AJAX را اولين بار كارشناسي از شركت Adaptive Path به نام جسي جيمزگرت در مقاله اي با عنوان اي جكس؛ و خيلي سريع اين تكنيك توسط برنامه نويسان در سراسر جهان استفاده شد، عاميانه ترين مثال براي Ajax سيستم Google Suggest كه وقتي شما عبارتي را جستجو مي كنيد گوگل عبارتهاي ديگر را با تكنيك Ajax براي شما مي آورد يا مثلا سبدهاي خريد سايت هاي فروشگاه اينترنتي وقتي شما كالايي را به سبد خريد اضافه مي كنيد فقط سبد خريد آپديت مي شود نه كل سايت يا در خيلي از فرم هاي ثبت نام اين تكنيك به كار برده شده است يا مثلا در سايتي كه خود ما طراحي كرديم كاربر بدون اينكه دوباره صفحه بارگذاري شود و حجم زيادي از پهناي باند كم شود خيلي راحت با تكنيك Ajax محصول شما بارگذاري مي شود امروزه بسياري از سايت هاي معروف دنيا نظير فيس بوك، Google Maps، Gmail، YouTube از اين تكنيك استفاده مي كنند كه كاربران را خسته نكنند و سرعت سايت بالاتر برود.  هزينه طراحي سايت       

كاربردهاي فن آوري Ajax

اگر شما ميخواهيد يك برنامه نويس خوب وب باشيد، تسلط بر فن آوري هاي پيشرفته اي همچون Ajax از ضروريات كارتان خواهد بود. با توجه به توضيحاتي كه ارائه كرده ايم، قطعاً نميتوان فهرست مشخصي از كاربردهاي Ajax ارائه كرد چون اين فن آوري ميتواند در بخشهاي مختلف كاربرد داشته باشد اما در اينجا برخي كاركردهاي رايج و مهم Ajax را بطور مختصر بررسي مي كنيم:

بررسي وجود كاربر مشابه در هنگام ثبت نام كاربران: يكي از كاربردهاي نسبتاً ساده ولي در عين حال مفيد Ajax، بررسي ديتابيس سايت در هنگام ثبت نام كاربران جديد ميباشد. فرض كنيد كاربري قبلاً در سايت شما با يك نام كاربري خاص ثبت نام كرده است، اكنون كاربر ديگري ميخواهد با همين نام كاربري ثبت نام كند و احتمالاً شما نميخواهيد دو كاربر با يك نام كاربري يكسان ثبت نام كنند. در حالت معمول شما ميتوانيد پس از فشردن دكمه ثبت نام توسط كاربر و در كد مربوط به دكمه ثبت نام، ديتابيس را بررسي كرده و در صورت وجود نام كاربري يكسان، عمليات ثبت كاربر جديد را متوقف كنيد يا به كاربر پيام بدهيد. در هر صورت به اين ترتيب يك postback كامل خواهيد داشت كه شايد چندان خوشايند كاربر نباشد. اما به كمك Ajax ميتوانيد عمليات postback را حذف كرده و سرعت كار را افزايش دهيد. كافيست يك تابع استاتيك (WebMethod) در كد سرور بنويسيد كه ديتابيس را چك كرده و در صورت وجود نام كاربري مشابه يك مقدار مشخص بازگشت دهد. سپس ميتوانيد در تابع client مربوط به خروج از كادر متني نام كاربري يا در تابع client مربوط به كليك دكمه ثبت نام، از طريق JQuery اين تابع را فراخواني نماييد و در صورت وجود نام كاربري يكسان در ديتابيس پيامي به كاربر بدهيد و البته اجازه اجراي كد سرور را نيز ندهيد. به اين ترتيب احتياجي به رفرش صفحه نخواهد بود، همين تكنيك را ميتوانيد به صورتهاي ديگري نيز استفاده كنيد قيمت طراحي سايت.

احتمالاً نحوه نمايش commentها در سايت facebook يا نمايش تصاوير در بخش جستجوي تصاوير google توجه شما را جلب كرده است. هر دو سايت رويكرد مشابهي دارند، در ابتدا بخش كوچكي از اطلاعات را نمايش ميدهند تا صفحه خيلي سريع بارگذاري شود، سپس در صورت لزوم اطلاعات بيشتر را آرام آرام بارگذاري مي كنند. شما نيز ميتوانيد به كمك Ajax اين تكنيك زيبا را شبيه سازي كنيد. به اين منظور بايد يك تابع سرور براي ايجاد اطلاعات صفحات جديد در قالب html بسازيد، و اين تابع را در رويداد scroll down صفحه فراخواني كنيد. در اين صورت وقتي كاربر صفحه را scroll كرده و به انتهاي صفحه برسد تابع استاتيك مربوطه از JQuery Ajax اجرا شده و محتواي صفحه جديد به مرورگر ارسال ميشود. سپس شما اين محتواي جديد را در صفحه نمايش ميدهيد. البته از آنجاييكه مرورگر چيزي جز html نميفهمد شما هم بايد صرفاً محتواي html ارسال كنيد، يعني تابع استاتيك سرور بايد اطلاعات را به فرمت html توليد كرده و به صورت رشته ارسال كند. حتي شما ميتوانيد در زمان اجراي پشت صحنه تابع سرور دريافت صفحات (كه ممكن يكي دو ثانيه طول بكشد) يك فايل gif animated را در صفحه پخش كنيد تا كاربر متوجه شود كه صفحات جديد به زودي نمايش داده ميشوند.

يكي از كاربردهاي مفيد Ajax در توسعه وب، انجام فعاليتهاي ديتابيسي در پشت صحنه ميباشد. از آنجا كه عمليات مربوط به ديتابيس همواره سنگين و زمان بر بوده و ميتواند موجب كندي اجراي صفحات وب شود، شما ميتوانيد برخي از عملياتهاي مربوط به ديتابيس از جمله و خواندن و نوشتن و يا حذف از ديتابيس را توسط Ajax انجام دهيد. به اين ترتيب احتياجي به رفرش صفحه نخواهد بود و در نتيجه سرعت اجراي سايت شما افزايش خواهد يافت. البته بخاطر داشته باشيد كه ممكن است به دلايل مختلف (از جمله عدم پشتيباني مرورگر يا غير فعال كردن جاوا اسكريپت توسط كاربر) امكان استفاده از Ajax وجود نداشته باشد، و در اين شرايط شما بايد سناريوي ديگري را به منظور مديريت فعاليتهاي ديتابيس به پيش ببريد  طراحي سايت اختصاصي     

خلاصه مطلب AJAX

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