همه چیز درباره‌ی تفاوت سایت های استاتیک و داینامیک (فیلم آموزشی)

در دنیای طراحی وب ما با انواع مختلفی از مفاهیم سر و کار داریم. یکی از چیزهایی که خیلی با آن ممکن است مواجه شوید، اصطلاحات Dynamic و Static است که وبسایت ها را به ۲ گروه وبسایت های داینامیک و وبسایت های استاتیک تقسیم بندی میکنند. در این مقاله و فیلم آموزشی بصورت کامل میخواهیم تفاوت استاتیک و داینامیک را بررسی کنیم و یاد بگیریم که سایت های استاتیک و داینامیک چه تفاوت هایی دارند و هرکدام برای چه کاربردی استفاده میشوند. پس با من همراه باشید.

تفاوت استاتیک و داینامیک

دانلود این فیلم آموزشی با کیفیت بالا و حجم ۱۴ مگ

اگر بخواهیم تفاوت استاتیک و داینامیک را مشخص کنیم، خیلی خوب است که اینکار را در قالب یک مثال انجام دهیم. فرض کنید که دو صفحه‌ی وب مختلف داریم. یک صفحه‌ی وب داینامیک (Dynamic) و یک صفحه‌ی وب استاتیک (Static). حالا میخواهیم بصورت تک به تک، هرکدارم ازین این صفحات وب را بررسی کنیم که به چه صورت هستند؟ چه ویژگی هایی دارند؟ برای انجام چه کارهایی مناسب هستند و چرا باید/نباید از آن‌ها استفاده کنیم و بصورت کلی تفاوت استاتیک و داینامیک را درک کنیم.

صفحات وب استاتیک (Static) یا ایستا

اگر کلمه‌ی Static را در دیکشنری سرچ کنید، با معنای ایستا، ثابت و… مواجه میشوید. در تعریف صفحات وب استاتیک میتوانیم بگوییم:

صفحات وبی هستند که تمام محتوای آن‌ها توسط کدهای HTML, CSS و جاوا اسکریپت نوشته شده است و این صفحات، هیچ ارتباطی با دیتابیس ندارند و هیچ اطلاعاتی را از دیتابیس دریافت نمیکنند.

در واقع محتویات صفحات وب استاتیک، بصورت کامل توسط کدهای HTML تولید شده است و هرگز این محتویات از جای دیگری تغذیه نمیشوند. برای مثال به صفحه‌ی وب زیر دقت کنید:

تمام محتویات این صفحه توسط کدهای زیر ساخته شده است:

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>سلام</title>
</head>
<body>

	<p id="text">سلام من مهدی خسروی هستم از yadify.com</p>
	<button onclick="addText()">Change</button>
	
	<script>
		function addText(){
			document.getElementById("text").innerHTML = 'changed';
		}
	</script>
	
</body>
</html>

همانطور که میبینید اطلاعاتی که در خروجی صفخه نمایش داده میشوند، همگی با استفاده از کدها نوشته شده اند. البته شما با کلیک کردن روی دکمه‌ی Change، میتوانید محتویات صفحه را عوض کنید، اما این محتویات توسط کد جاوا اسکریپت عوض میشود و هیچ ارتباطی با دیتابیس ندارد.

سایت های استاتیک، سایت هایی هستند که اطلاعات درون آن‌ها همگی توسط کدهای مستقیم نوشته شده اند.

حالا ممکن است برایتان سوال پیش بیاید که چرا یک سایت باید بصورت استاتیک طراحی شود. جواب این سوال میتواند این باشد که سایت هایی که نیاز به تغییرات اطلاعات زیادی ندارند و اطلاعات کمی را قرار است در خود جای دهند، میتوانند بصورت سایت های استاتیک طراحی شوند.

مقاله‌ی مرتبط: آموزش Import و Export در phpmyadmin

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

اما سایت هایی که نیاز دارند اطلاعات بروز داشته باشند چی؟ آن‌ها را بصورت داینامیک طراحی میکنیم!

صفحات وب داینامیک (Dynamic) یا پویا

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

برای مثال سایت یک فروشگاه اینترنتی را در نظر بگیرید. این سایت نمیتواند یک سایت استاتیک باشد، زیرا باید هرروز مقادیر زیادی از اطلاعات را درباره‌ی محصولات اضافه یا حذف کند. به همین دلیل انجام اینکار بصورت استاتیک غیرقابل انجام است. پس از دیتابیس برای ساخت سایتی این چنینی استفاده میکنند و وقتی که اطلاعات یک سایت از دیتابیس خوانده میشود، میتوانیم بگوییم که این سایت، یک سایت داینامیک است.

برای مثال اگر شما به سایت دیجی کالا سر بزنید، متوجه میشوید که هزاران کالا در آن وجود دارد. آیا بنظرتان منطقی است که برای هر تغییر کوچکی در کالا، کد را عوض کنند؟ هرگز.

بجای اینکه کد را تغییر دهند، اطلاعات را در دیتابیس تغییر میدهند و این دقیقا ویژگی سایت های داینامیک (Dynamic) است.

یک سایت داینامیک، برای سایت هایی مناسب است که اطلاعات که در آن سایت قرار است نمایش داده شود، به مقدار بسیار زیادی در زمان های کوتاه دستخوش تغییرات میشود. و همینطور سایت هایی که اطلاعات زیادی را قرار است به کاربران خود نشان دهند. این ها دقیقا همان سایت هایی هستند که باید از از یک سیستم داینامیکِ متصل به دیتابیس برخوردار باشند.

مقاله‌ی مرتبط: HTML5 چیست و چه تفاوتی با HTML دارد؟

اگر میخواهید درباره‌ی دیتابیس و پایگاه داده بیشتر بدانید، مقاله‌ی دیتابیس چیست میتواند بسیار مفید باشد.

داینامیک یا استاتیک؟ کدام سایت برای من مناسب است؟

در ادامه‌ی پاسخ به سوال تفاوت استاتیک و داینامیک ممکن است این سوال نیز برایتان پیش بیاید که وبسایت داینامیک مناسب شما و کسب و کارتان است یا وب سایت های استاتیک؟ پاسخ به این سوال کاملا بستگی به هدف و کارکرد سایت شما دارد.

اگر میخواهید سایتی داشته باشید که اطلاعات کمی را قرار است ارائه دهد و آن اطلاعات به ندرت و شاید چند ماهی یک بار نیز قرار نیست تغییر کنند و هیچ چیز جدیدی به سایت شما بصورت مکرر اضافه نمیشود:‌قطعا یک سایت استاتیک نیاز شما را پاسخ میدهد.

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

نمیتوان گفت که سایت های استاتیک بهتر هستند یا سایت های دانامیک، پاسخ این سوال کاملا بستگی دارد به نوع استفاده ای که شما میخواهید از سایت‌تان بکنید. در نظر داشته باشید که برای سایت‌تان چه هدفی دارید،‌ سپس ببینید که میخواهید یک سایت داینامیک داشته باشید یا استاتیک.