مرجع تخصصی مقالات آموزش سئو کاربردی

SSR و تاثیر آن بر بهینه سازی تارنما
اجازه بدهید، قبل از پرداختن به تعاریف و جزئیات، به دو سؤال مهم جواب بدهیم تا ارتباط این مسئله با بهینه سازی وب سایت کاملا معین خواهد شد:

آموزش سئو

دوره آموزش سئو

آیا ssr (هرچه کیست) بر سئو وبسایت تاثیر داراست؟ بله.
آیا تاثیر آن مثبت است یا منفی؟ درکل مثبت میباشد.
همگی‌ی تارنما‌ها (استاتیک یا داینامیک) ساختار کم‌وبیش مشترکی دارا هستند: با زبان آرم‌گذاری HTML ساختار اساسی سایت و صفحاتش ساخته میشود، با CSS به صفحات و محتواها استایل داده می گردد و درنهایت با Javascript (که زبان نرم افزار‌نویسی و سمت کاربر،Front-end، هست) صفحه های تعاملی‌تر و پویاتر می شود. ولی امروزه آیتم‌ی بسیار دوستداشتنی و پرطرفدار دیگری هم برای ساختن Front-end و رابط کاربری وب‌وبسایت‌ها وجود داراست: فریمورک‌های جاوااسکریپت.

درهرحال، زمانی استفاده کننده یا بات موتور جستجو می خواهد کاغذ‌ای را ببیند، آحاد این کدها بایستی جاری ساختن (ترجمه شوند) و نمایش داده شوند. این فعالیت را مرورگرهای کاربران اعمال می دهند.هرچه این کدها سریع‌تر و بی نقص‌تر پردازش و جاری ساختن شوند، برگه و محتوای آن را خزنده‌های (بات‌های/ bots) موتورهای جستجو و استفاده کننده سریع‌‌تر و کامل‌تر می‌بینند. پس دارای تخصص بهینه سازی بایستی مطمئن شود که پردازش و نمایش تک تک کدها بی‌هیچ مشکلی صورت پذیرد، این اعتقادوباور‌یافتن با سئو جاوااسکریپت (JS) نتایج میگردد.

seo جاوااسکریپت (JavaScript seo) چیست؟
At its core, JavaScript بهینه سازی is basically the practice of making sure that content on a page (executed via JS) is being correctly rendered, indexed and ultimately ranked in search results by search engines.

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

ترجمه‌، پردازش و نمایش کدها (Rendering) دو نوع دارد: Server-side rendering and Client-side rendering. این دو نوع هر یک مزایا و معایب و تاثیرات خاص خودشان را دارا‌هستند. اولیه ssr (که نوع دیرین‌تر است) را تعریف و تمجید و آنگاه با csr (که سیاق مدرن‌تر برای rendering میباشد) مقایسه می‌کنیم.

SSR or Servers-Side Rendering چیست؟
در اصل و معمولا همه‌ی اطلاعات وبسایت در پایگاه‌داده‌ی سرور ذخیره می‌گردد. زمانی ورقه‌ای از تارنما خواسته می گردد (استفاده کننده یا بات موتور جستجو)، استارت سرور html را طوری که مرورگر بتواند بخواند و پردازش کند می‌فرستد و آنگاه CSS و JS را . درنهایت کاغذ با مجموع محتوا و استایلش نمایش داده می شود.

این فرآیند درست برعکس چیزی می باشد که در csr رخداد میفتد. در csr پردازش تک تک کدها در مرورگر و از طریق فریمورک‌های جاوااسکریپت (مثل Vue.js) ایفا می‌شود. یعنی سرور وبسایت کاری انجام نمی‌دهد. کلیه‌ی عمل را مرورگرهای من و شما جاری ساختن میدهند بدون نیاز به کدها.

SSR vs. CSR از لحاظ موتورهای جستجو و سئو وب سایت
خب چرا اینکه نخستین فایل html سایت خوانده و پردازش گردد اصلی میباشد؟ چه ربطی به سئو و موتورهای جستجو داراست؟ موتورهای جستجو با ایندکس‌کردن صفحاتی که با فریمورک‌های js تشکیل‌شده‌اند ایراد دارند. زمانی موتور جستجو میخواهد کاغذ‌ای را که با فریمورک‌ درست شده و مرورگر آن را پردازش کرده ببیند و ایندکس کند، درواقع چیزی نمی‌بیند جز شیت‌ای خالی! چون کدی وجود ندارد که بات‌ها بتوانند بخوانندش. این یعنی خبری از سئوشدن نیست.

البته صرفا گوگل راهی برای رفع این ایراد ابتکار عمل کرده: Two-wave Indexing System (سیستم ایندکس‌کردن دومرحله‌ای). یعنی اولیه بات‌های گوگل می‌آیند و کدهای HTML & CSS سایت را استخراج می‌کنند. البته آن را ایندکس نمی کنند. تارنما در صف می ماند تا گوگل بتواند جاوااسکریپت آن وبسایت را نیز بخواند و آنگاه آن را ایندکس کند (مرحله‌ی دوم). این مرحله‌ی دوم ممکن میباشد تا هفته‌ها طول بکشد. این یعنی تا هفته‌ها وبسایت شما در نتایج سرچ گوگل وجود نخواهد داشت.

پس اینجاست که ssr برای سئو مهم و موءثر می‌شود: موتورهای جستجو برای ایندکس‌کردن کدهای وب سایت را می خواهند، یعنی همان فایل html که در ssr اولیه به مرورگر رسول می شود. گوگل آن را ایندکس می‌کند و کاری هم با JS ندارد. تازه استفاده کننده هم فارغ از هیچ مشکلی شیت را با تک تک محتوایش می‌بیند.

مزایای SSR برای سئو وب سایت
مزیت گرانقدر این مشی برای seo تارنما مشخص شد. البته این اسلوب مزایای دیگری هم دارد:

From a search engine perspective, server-side rendering is the second-best option for rendering JS. The biggest benefit is the rate at which pages can be rendered. The faster search engines can “view’ your pages, the faster it can move on to the next page and improve your crawl budget. Not only does your crawl budget improve, but your user experience also increases.

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

Speed: با اس اس آر، چون گوگل به‌راحتی به کدهای html دسترسی داراست ایندکس‌کردن را تخت گاز اعمال می دهد. از طرف دیگر این یعنی در وقتی کوتاه وبسایت شما در نتایج سرچ ظاهر می شود و قادر است جايگاه بگیرد.
UX: تجارب کاربری برای سئوی تارنما هم اصلی میباشد و به یکی‌از استانداردهای موتورهای جستجو تبدیل شده. ssr مجال کمتری برای بارگذاری کاغذ می خواهد و تاحدی کوشش و کارآیی صفحه را افزایش می‌دهد. همین یعنی استفاده کننده بدون چاره نیست در انتظار بنشیند تا کل ورقه بار گذاری گردد.
Core Web Vitals (CWV): دسته معیارهای دیگری که در seo سایت باید رعایت شوند. ssr برای ارتقای این معیارها نیز مفید هست.
Optimization for Social Media: با این سیاق صرفا به باصرفه‌شدن سایت برای موتورهای جستجو یاری نمی‌شود، بلکه تارنما برای شبکه‌های اجتماعی نیز باصرفه می‌گردد. یعنی در شرایطی‌که کسی لینکی را در فیسبوک به اشتراک بگذارد، پیش‌نمایشی از آن شیت هم هم پا با آن بار گذاری میگردد.

معایب SSR در seo
بالاخره در حالتی که ssr همگی سود و خوبی بود، نیازی خلا متد دیگری به‌نام CSR به‌وجود بیاید. ssr برای تمامی‌ی سایت‌ها مناسب نیست. این نوع از rendering چه معایبی دارد که آن را برای همگی‌ی وب سایت‌ها تبدیل به بهترین گزینش نمی‌کند؟

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

جمع‌بندی و فایده‌گیری
۱. صاحبان تارنما در مشورت با مجموعه طراحی و اما دسته بهینه سازی و درنظرگرفتن نیازهایشان باید تصمیم بگیرند کدام روال برای سایت و حصول‌وکار بهتر میباشد. پس الزما SSR انتخاب تمامی نیست و نمی‌تواند باشد؛ بااینکه تاثیر مثبت و مستقیمی بر سئو وب سایت داراست.

۲. آیا انتخاب سومی وجود داراست؟ بله، Pre-rendering که نسبتاً ایرادات دو سیاق قبلی را ندارد و مزیت خاص ssr در seo را هم داراست. ولی گزینش این اسلوب هم باید بررسی شود.

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

SSR و تاثیر آن بر بهینه سازی تارنما
اجازه بدهید، قبل از پرداختن به تعاریف و جزئیات، به دو سؤال مهم جواب بدهیم تا ارتباط این مسئله با بهینه سازی وب سایت کاملا معین خواهد شد:

آموزش سئو

دوره آموزش سئو

آیا ssr (هرچه کیست) بر سئو وبسایت تاثیر داراست؟ بله.
آیا تاثیر آن مثبت است یا منفی؟ درکل مثبت میباشد.
همگی‌ی تارنما‌ها (استاتیک یا داینامیک) ساختار کم‌وبیش مشترکی دارا هستند: با زبان آرم‌گذاری HTML ساختار اساسی سایت و صفحاتش ساخته میشود، با CSS به صفحات و محتواها استایل داده می گردد و درنهایت با Javascript (که زبان نرم افزار‌نویسی و سمت کاربر،Front-end، هست) صفحه های تعاملی‌تر و پویاتر می شود. ولی امروزه آیتم‌ی بسیار دوستداشتنی و پرطرفدار دیگری هم برای ساختن Front-end و رابط کاربری وب‌وبسایت‌ها وجود داراست: فریمورک‌های جاوااسکریپت.

درهرحال، زمانی استفاده کننده یا بات موتور جستجو می خواهد کاغذ‌ای را ببیند، آحاد این کدها بایستی جاری ساختن (ترجمه شوند) و نمایش داده شوند. این فعالیت را مرورگرهای کاربران اعمال می دهند.هرچه این کدها سریع‌تر و بی نقص‌تر پردازش و جاری ساختن شوند، برگه و محتوای آن را خزنده‌های (بات‌های/ bots) موتورهای جستجو و استفاده کننده سریع‌‌تر و کامل‌تر می‌بینند. پس دارای تخصص بهینه سازی بایستی مطمئن شود که پردازش و نمایش تک تک کدها بی‌هیچ مشکلی صورت پذیرد، این اعتقادوباور‌یافتن با سئو جاوااسکریپت (JS) نتایج میگردد.

seo جاوااسکریپت (JavaScript seo) چیست؟
At its core, JavaScript بهینه سازی is basically the practice of making sure that content on a page (executed via JS) is being correctly rendered, indexed and ultimately ranked in search results by search engines.

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

ترجمه‌، پردازش و نمایش کدها (Rendering) دو نوع دارد: Server-side rendering and Client-side rendering. این دو نوع هر یک مزایا و معایب و تاثیرات خاص خودشان را دارا‌هستند. اولیه ssr (که نوع دیرین‌تر است) را تعریف و تمجید و آنگاه با csr (که سیاق مدرن‌تر برای rendering میباشد) مقایسه می‌کنیم.

SSR or Servers-Side Rendering چیست؟
در اصل و معمولا همه‌ی اطلاعات وبسایت در پایگاه‌داده‌ی سرور ذخیره می‌گردد. زمانی ورقه‌ای از تارنما خواسته می گردد (استفاده کننده یا بات موتور جستجو)، استارت سرور html را طوری که مرورگر بتواند بخواند و پردازش کند می‌فرستد و آنگاه CSS و JS را . درنهایت کاغذ با مجموع محتوا و استایلش نمایش داده می شود.

این فرآیند درست برعکس چیزی می باشد که در csr رخداد میفتد. در csr پردازش تک تک کدها در مرورگر و از طریق فریمورک‌های جاوااسکریپت (مثل Vue.js) ایفا می‌شود. یعنی سرور وبسایت کاری انجام نمی‌دهد. کلیه‌ی عمل را مرورگرهای من و شما جاری ساختن میدهند بدون نیاز به کدها.

SSR vs. CSR از لحاظ موتورهای جستجو و سئو وب سایت
خب چرا اینکه نخستین فایل html سایت خوانده و پردازش گردد اصلی میباشد؟ چه ربطی به سئو و موتورهای جستجو داراست؟ موتورهای جستجو با ایندکس‌کردن صفحاتی که با فریمورک‌های js تشکیل‌شده‌اند ایراد دارند. زمانی موتور جستجو میخواهد کاغذ‌ای را که با فریمورک‌ درست شده و مرورگر آن را پردازش کرده ببیند و ایندکس کند، درواقع چیزی نمی‌بیند جز شیت‌ای خالی! چون کدی وجود ندارد که بات‌ها بتوانند بخوانندش. این یعنی خبری از سئوشدن نیست.

البته صرفا گوگل راهی برای رفع این ایراد ابتکار عمل کرده: Two-wave Indexing System (سیستم ایندکس‌کردن دومرحله‌ای). یعنی اولیه بات‌های گوگل می‌آیند و کدهای HTML & CSS سایت را استخراج می‌کنند. البته آن را ایندکس نمی کنند. تارنما در صف می ماند تا گوگل بتواند جاوااسکریپت آن وبسایت را نیز بخواند و آنگاه آن را ایندکس کند (مرحله‌ی دوم). این مرحله‌ی دوم ممکن میباشد تا هفته‌ها طول بکشد. این یعنی تا هفته‌ها وبسایت شما در نتایج سرچ گوگل وجود نخواهد داشت.

پس اینجاست که ssr برای سئو مهم و موءثر می‌شود: موتورهای جستجو برای ایندکس‌کردن کدهای وب سایت را می خواهند، یعنی همان فایل html که در ssr اولیه به مرورگر رسول می شود. گوگل آن را ایندکس می‌کند و کاری هم با JS ندارد. تازه استفاده کننده هم فارغ از هیچ مشکلی شیت را با تک تک محتوایش می‌بیند.

مزایای SSR برای سئو وب سایت
مزیت گرانقدر این مشی برای seo تارنما مشخص شد. البته این اسلوب مزایای دیگری هم دارد:

From a search engine perspective, server-side rendering is the second-best option for rendering JS. The biggest benefit is the rate at which pages can be rendered. The faster search engines can “view’ your pages, the faster it can move on to the next page and improve your crawl budget. Not only does your crawl budget improve, but your user experience also increases.

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

Speed: با اس اس آر، چون گوگل به‌راحتی به کدهای html دسترسی داراست ایندکس‌کردن را تخت گاز اعمال می دهد. از طرف دیگر این یعنی در وقتی کوتاه وبسایت شما در نتایج سرچ ظاهر می شود و قادر است جايگاه بگیرد.
UX: تجارب کاربری برای سئوی تارنما هم اصلی میباشد و به یکی‌از استانداردهای موتورهای جستجو تبدیل شده. ssr مجال کمتری برای بارگذاری کاغذ می خواهد و تاحدی کوشش و کارآیی صفحه را افزایش می‌دهد. همین یعنی استفاده کننده بدون چاره نیست در انتظار بنشیند تا کل ورقه بار گذاری گردد.
Core Web Vitals (CWV): دسته معیارهای دیگری که در seo سایت باید رعایت شوند. ssr برای ارتقای این معیارها نیز مفید هست.
Optimization for Social Media: با این سیاق صرفا به باصرفه‌شدن سایت برای موتورهای جستجو یاری نمی‌شود، بلکه تارنما برای شبکه‌های اجتماعی نیز باصرفه می‌گردد. یعنی در شرایطی‌که کسی لینکی را در فیسبوک به اشتراک بگذارد، پیش‌نمایشی از آن شیت هم هم پا با آن بار گذاری میگردد.

معایب SSR در seo
بالاخره در حالتی که ssr همگی سود و خوبی بود، نیازی خلا متد دیگری به‌نام CSR به‌وجود بیاید. ssr برای تمامی‌ی سایت‌ها مناسب نیست. این نوع از rendering چه معایبی دارد که آن را برای همگی‌ی وب سایت‌ها تبدیل به بهترین گزینش نمی‌کند؟

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

جمع‌بندی و فایده‌گیری
۱. صاحبان تارنما در مشورت با مجموعه طراحی و اما دسته بهینه سازی و درنظرگرفتن نیازهایشان باید تصمیم بگیرند کدام روال برای سایت و حصول‌وکار بهتر میباشد. پس الزما SSR انتخاب تمامی نیست و نمی‌تواند باشد؛ بااینکه تاثیر مثبت و مستقیمی بر سئو وب سایت داراست.

۲. آیا انتخاب سومی وجود داراست؟ بله، Pre-rendering که نسبتاً ایرادات دو سیاق قبلی را ندارد و مزیت خاص ssr در seo را هم داراست. ولی گزینش این اسلوب هم باید بررسی شود.

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