مقالات طراحی سایت

در دنیایی زندگی می‌کنیم که همه‌چیز (کسب‌وکارها، کلاس‌ها و دور‌ه‌های آموزشی، سرمایه‌گذاری، حراجی‌ها و مزایده‌ها و…) کم‌کم به فضای مجازی کوچ می‌کند و برای هرچیزی طراحی سایت در مشهد وب‌سایتی ساخته می‌شود.

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

رقابت درداشتن وب‌سایت‌هایی هرچه تعاملی‌تر، سریع‌تر و بهتر. این رقابت، و درواقع نیازی است در تمام نقاط دنیا. کاربرانْ سایت‌هایی می‌خواهند پویا و سریع.

به سخن دیگر، کاربرانْ صفحاتی (Web Pages) می‌خواهند که خیلی سریع‌تر و راحت‌تر خواسته‌های کاربران را اجرایی کنند. فرقی نمی‌کند این خواسته پیدا‌کردن جایی روی نقشه است یا ثبت‌نام کردن یا واردشدن به حساب کاربری.

بنابراین، طراحی سایت و طراحان سایت به تکنولوژی‌ها و تکنیک‌هایی نیاز دارند که پاسخگوی نیاز کاربران باشد، هر روز بیش از دیروز . AJAX ساخته شد تا به طراحان سایت در همین راه کمک کند.

AJAX عمر طولانی‌ای ندارد. اما می‌شود گفت که از مفاهیم پیچیده در برنامه‌نویسی و طراحی سایت است. البته،‌AJAX زبان برنامه‌نویسی نیست. AJAX تکنولوژی یا فناوری هم نیست. (متاسفانه در بسیاری از محتواهای وب فارسی، به‌اشتباه، AJAX را فناوری یا تکنولوژی معرفی کرده‌اند.)

حالا که ایجکس نه زبان برنامه‌نویسی است نه فناوری و نه تکنولوژی و نه حتی تکنیک به معنای دقیق کلمه، بالاخره این ایجکس چیست؟ دقیقاً چه می‌کند؟ چرا ساخته شده؟ مزایا و معایبش چیست؟

در این مقاله تلاش شده تا به زبان ساده و با استفاده از نمونه‌ها به سؤالات بالا پاسخ‌های دقیق و درست داده شود.

AJAX (ایجکس) چیست؟
برای فهمیدن ایجکس باید اول توضیح دهیم که وب‌سایت‌ها و وب اپلیکیشن‌ها قبل از آن چطور کار می‌کردند و ایجکس چه تغییری ایجاد کرده است.

هر وب‌سایت یا وب اپ دو طرف دارد: Frontend and Backend. فرانت طرفی است که کاربر قرار می‌گیرد و تمام آن‌چیزهایی که او روی صفحه‌ می‌بیند. بک‌اند طرف Server است، پشت‌صحنه. جایی‌که اطلاعات و داده‌ها ذخیره شده‌اند و جایی‌که فرمان‌ها اجرا می‌شود.

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

برای انتقال اطلاعات در این فرآیند از زبان‌های برنامه‌نویسی (کُدها) و تکنولوژی‌های مختلفی استفاده می‌شود. برای مثال Java, JavaScript & PHP زبان‌های نوشتن بک‌اند و HTML, CSS, JQuery & JavaScript زبان‌های نوشتن فرانت.

معرفی فناوری AJAX

همین فرآیند رفت‌وبرگشت ‌هم‌زمان مدت زمانی را به خود اختصاص می‌دهد و حتی در بعضی درخواست‌ها و کارهایی که باید در بک انجام شود، نیاز است تمام صفحه دوباره بازگذاری (Reload or Refresh) شود.

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

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

Asynchronous JavaScript and XML یعنی جاوااسکریپت و XML ناهم‌زمان، که مخففش می‌شود AJAX. بنابراین، ایجکس انتقال و دریافت اطلاعات از فرانت به سِرور (بک) است بدون‌اینکه تمام صفحه‌ی پیش روی کاربر refresh شود.

ایجکس این کار را با به‌کارگیری مجموعه‌ای از تکنولوژی‌های طراحی سایت انجام می‌دهد. پس،‌ ایجکس برنامه‌ای مستقل نیست. ایجکس از مجموعه‌ی ۵ ابزار برنامه‌نویسی XMLHttpRequest, JavaScript, HTML, CSS & DOM بهره می‌گیرد.

AJAX (ایجکس) چه می‌کند؟
طراح سایت با استفاده از زبان‌های برنامه‌نویسی و تکنولوژی‌هایی که نام برده شد، می‌شود گفت که ایجکس را در کدهایی که می‌نویسد پیاده می‌کند.

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

در دنیایی زندگی می‌کنیم که همه‌چیز (کسب‌وکارها، کلاس‌ها و دور‌ه‌های آموزشی، سرمایه‌گذاری، حراجی‌ها و مزایده‌ها و…) کم‌کم به فضای مجازی کوچ می‌کند و برای هرچیزی طراحی سایت در مشهد وب‌سایتی ساخته می‌شود.

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

رقابت درداشتن وب‌سایت‌هایی هرچه تعاملی‌تر، سریع‌تر و بهتر. این رقابت، و درواقع نیازی است در تمام نقاط دنیا. کاربرانْ سایت‌هایی می‌خواهند پویا و سریع.

به سخن دیگر، کاربرانْ صفحاتی (Web Pages) می‌خواهند که خیلی سریع‌تر و راحت‌تر خواسته‌های کاربران را اجرایی کنند. فرقی نمی‌کند این خواسته پیدا‌کردن جایی روی نقشه است یا ثبت‌نام کردن یا واردشدن به حساب کاربری.

بنابراین، طراحی سایت و طراحان سایت به تکنولوژی‌ها و تکنیک‌هایی نیاز دارند که پاسخگوی نیاز کاربران باشد، هر روز بیش از دیروز . AJAX ساخته شد تا به طراحان سایت در همین راه کمک کند.

AJAX عمر طولانی‌ای ندارد. اما می‌شود گفت که از مفاهیم پیچیده در برنامه‌نویسی و طراحی سایت است. البته،‌AJAX زبان برنامه‌نویسی نیست. AJAX تکنولوژی یا فناوری هم نیست. (متاسفانه در بسیاری از محتواهای وب فارسی، به‌اشتباه، AJAX را فناوری یا تکنولوژی معرفی کرده‌اند.)

حالا که ایجکس نه زبان برنامه‌نویسی است نه فناوری و نه تکنولوژی و نه حتی تکنیک به معنای دقیق کلمه، بالاخره این ایجکس چیست؟ دقیقاً چه می‌کند؟ چرا ساخته شده؟ مزایا و معایبش چیست؟

در این مقاله تلاش شده تا به زبان ساده و با استفاده از نمونه‌ها به سؤالات بالا پاسخ‌های دقیق و درست داده شود.

AJAX (ایجکس) چیست؟
برای فهمیدن ایجکس باید اول توضیح دهیم که وب‌سایت‌ها و وب اپلیکیشن‌ها قبل از آن چطور کار می‌کردند و ایجکس چه تغییری ایجاد کرده است.

هر وب‌سایت یا وب اپ دو طرف دارد: Frontend and Backend. فرانت طرفی است که کاربر قرار می‌گیرد و تمام آن‌چیزهایی که او روی صفحه‌ می‌بیند. بک‌اند طرف Server است، پشت‌صحنه. جایی‌که اطلاعات و داده‌ها ذخیره شده‌اند و جایی‌که فرمان‌ها اجرا می‌شود.

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

برای انتقال اطلاعات در این فرآیند از زبان‌های برنامه‌نویسی (کُدها) و تکنولوژی‌های مختلفی استفاده می‌شود. برای مثال Java, JavaScript & PHP زبان‌های نوشتن بک‌اند و HTML, CSS, JQuery & JavaScript زبان‌های نوشتن فرانت.

معرفی فناوری AJAX

همین فرآیند رفت‌وبرگشت ‌هم‌زمان مدت زمانی را به خود اختصاص می‌دهد و حتی در بعضی درخواست‌ها و کارهایی که باید در بک انجام شود، نیاز است تمام صفحه دوباره بازگذاری (Reload or Refresh) شود.

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

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

Asynchronous JavaScript and XML یعنی جاوااسکریپت و XML ناهم‌زمان، که مخففش می‌شود AJAX. بنابراین، ایجکس انتقال و دریافت اطلاعات از فرانت به سِرور (بک) است بدون‌اینکه تمام صفحه‌ی پیش روی کاربر refresh شود.

ایجکس این کار را با به‌کارگیری مجموعه‌ای از تکنولوژی‌های طراحی سایت انجام می‌دهد. پس،‌ ایجکس برنامه‌ای مستقل نیست. ایجکس از مجموعه‌ی ۵ ابزار برنامه‌نویسی XMLHttpRequest, JavaScript, HTML, CSS & DOM بهره می‌گیرد.

AJAX (ایجکس) چه می‌کند؟
طراح سایت با استفاده از زبان‌های برنامه‌نویسی و تکنولوژی‌هایی که نام برده شد، می‌شود گفت که ایجکس را در کدهایی که می‌نویسد پیاده می‌کند.

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