HTTP2 چیست؟ چه تاثیری بر بهبود سرعت سایت دارد؟

از سال 2015 و با معرفی این پروتکل، بسیاری از سایت‌ها به استفاده از آن روی آورده‌اند و تا اواسط سال 2021، نزدیک به 50 درصد وب‌سایت‌های اینترنتی از پروتکل HTTP2 استفاده کرده‌اند. بخشی زیادی از محبوبیت HTTP2  به دلیل افزایش سرعت سایت و تاثیر مثبت آن در سئو است. اما پروتکل جدید وب چطور بر روی سئو سایت تاثیر می‌گذارد؟ و چطور می‌توان به بهترین شکل از HTTP2  برای بهبود وضعیت وب‌سایت‌ها استفاده کرد؟

در این مقاله به صورت کامل HTTP2  و تفاوت آن با نسل قدیمی یعنی HTTP1.1 را بررسی می کنیم. با استفاده از چند مثال تاثیر مثبت HTTP2 را به صورت عملی بررسی کرده و در نهایت تکنیک‌هایی که در گذشته رایج بودند ولی امروز استفاده از آن‌ها به سئو سایت شما آسیب می‌زند را معرفی می‌کنیم. در پایان خواهیم دید که چطور می‌توانیم با فعال کردن این پروتکل سرعت سایت خود را افزایش داده و یک قدم جلوتر از رقبا باشیم؟

ازHTTP1  تا HTTP2 ؛ نگاهی به سیر تکامل وب

HTTP (مخفف Hypertext Transfer Protocol) یک پروتکل انتقال اطلاعات فرامتنی میان مروگر و سرور است. وقتی یک صفحه اینترنتی را باز می‌کنیم، پروسه‌ای تقریباً طولانی اتفاق می‌افتد. فرآیندی که حداقل به عنوان یک کاربر کم‌تر به آن توجه می‌کنیم.

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

صفحات اینترنتی مملو از فایل‌های مختلف هستند. کدهای HTML، کدهای CSS، JS، تصاویر با فرمت‌های مختلف و فونت‌ها از جمله فایل‌هایی هستند که در کنار هم یک صفحه وب را تشکیل می‌دهند.

تا قبل از سال 2015، تنها یک پروتکل بر فضای وب حکم‌فرما بود؛ HTTP1. در HTTP1 زمانی که مرورگر یک سایت را باز می‌کرد، فایل‌های مختلف داخل صفحه مثل CSS، JS، فرمت های تصاویر و موارد دیگر به صورت تک تک فراخوان می‌شدند. به عبارت دیگر ابتدا لازم بود یک فایل به صورت کامل فراخوان و بارگذاری شده، سپس سرور فایل‌های دیگر را ارسال کند.

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

TBT که یکی از معیارهای مهم سرعت سایت در Core Web Vitals محسوب می‌شود مربوط به همین لود کدهای صفحه است که بهینه‌سازی کدهای صفحه و استفاده از پروتکل Http2 می‌تواند بر روی کاهش زمان TBT تاثیر گذار باشد.

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

یک مثال برای درک بهتر  HTTP2؛ وقتی همه کمک می‌کنند

همه‌ی ما تجربه یک بار اثاث‌کشی و مشارکت در این کار را داریم. در یک خانه وسایل زیادی مثل مبل، فرش، ظروف آشپزخانه، وسایل دکوری و اثاثیه دیگری وجود دارد. بیاید فرض کنیم کاملاً دست تنها هستیم و باید به تنهایی این وسایل را از داخل خانه بیرون بیاوریم. این کار چقدر طول خواهد کشید؟

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

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

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

در سئو مدرن، تجربه کاربری حرف اول را می‌زند و بهبود سرعت سایت یکی از فاکتورهای موثر در تجربه کاربری است.

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

مرگ Combine CSS Files؛ تکنیک‌هایی که منسوخ شده‌اند

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

زمانی که تنها پروتکل وب HTTP1 بود، وب‌مسترها و متخصصین سئو، برای کاهش سرعت سایت از تکنیک‌های مختلفی استفاده می کردند. همه‌ی این تکنیک‌ها بر یک اصل ساده استوار بودند؛ ترکیب کردن.

به عنوان مثال در تکینک Combine CSS Files تمامی فایل‌های CSS موجود در یک صفحه یا وب‌سایت اینترنتی در قالب یک فایل حجیم گردآوری‌شده و با یک درخواست از سرور دریافت می‌شود. علت این کار هم کاملاً مشخص است. در HTTP1 فرخوان هر فایل وابسته به فرخوان فایل قبلی بود. با استفاده از تکنیک ترکیب‌کردن، تعداد درخواست‌های (Request) کم‌شده و سرعت سایت افزایش می‌یافت.

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

فرض کنیم که می‌توانیم همه‌ی اثاث خانه را در یک جعبه بسیار بزرگ جای داده و با یک حرکت همه وسایل را از خانه خارج کنیم! این کار تا زمانی معنی می‌دهد که شما توان جابجا کردن آن بسته بزرگ را داشته باشید ولی چند نفر در دنیا هستند که می‌توانند یخچال و ماشین لباس‌شویی را هم‌زمان جابجا کنند؟

اگر سرور شما از پروتکل HTTP2 برای ارسال فایل و ارتباط با مرورگر استفاده می‌کند ترکیب کردن فایل‌های CSS و JS نه تنها کمکی به سرعت لود صفحه نخواهد کرد بلکه موجب می‌شود تا عملا از همان HTTP1 برای ارتباط با سرور استفاده کنید.

در کارگاه آموزش سئو تکنیکال آکادمی وبسیما به صورت کامل با تکنیک‌ها و ترفندهایی که بر روی بستر HTTP2 قابلیت اجرا دارند آشنا می‌شویم.

بررسی Waterfall و تفاوت آن در HTTP2

برای اینکه به صورت کامل و دقیق با HTTP2 آشنا شویم، بیاید نحوه فرخوان فایل‌ها را به صورت واقعی مشاهده کنیم. برای این کار از ابزار Gtmetrix استفاده می‌کنیم. هنگامی که یک سایت را با استفاده از این ابزار بررسی می کنیم، در بخش Waterfall می توانیم نحوه فرخوان فایل‌های مختلف را مشاهده کنیم. تصویر زیر، waterfall سایت آکادمی وبسیما را نشان می‌دهد که از HTTP2 استفاده می‌کند.

در ستون اول، نام درخواست ها را مشاهده می‌کنیم. برای مثال درخواست yekan.woff2 مربوط به فرخوان فونت سایت است. ستون دوم مربوط به کد وضعیت درخواست، ستون سوم مربوط به آدرس فرخوان‌شده، ستون چهارم حجم فایل و در نهایت ستون تایم‌لاین نحوه فرخوان این درخواست‌ها را نشان می‌دهد. اگر با مفهوم کدهای وضعیت صفحه آشنا نیستید و نمی‌دانید عدد 200 به چه معنی است، پیشنهاد می‌کنیم مقاله status code چیست را در آکادمی وبسیما مطالعه کنید.

اگر به قسمت Timeline و به رنگ‌ها توجه کنیم، متوجه می‌شویم که شروع رنگ بنفش در همه‌ی درخواست‌ها یک‌سان است. یعنی همه‌ی درخواست‌ها به‌صورت هم‌زمان فرخوان شده‌اند. اما در سایت‌هایی که از HTTP1 استفاده می‌کنند، اوضاع چگونه است؟

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

HTTP2 را با HTTPS اشتباه نگیرید

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

چطور HTTP2 را بر روی سایت خودمان فعال کنیم؟

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

برای اینکه متوجه شوید سایت شما بر روی چه پروتکلی است، می‌توانید در قسمت Waterfall سایت GTmetrix که برای تست سرعت سایت استفاده می‌شود، بر روی علامت مثبت کنار یکی از آدرس‌ها در لیست کلیک کرده و اطلاعات را مشاهده کنید. یا با استفاده از ابزار http2.pro و وارد کردن آدرس سایت، وضعیت پاسخ‌گویی سرور خود را تست کنید. در صورت فعال بودن پیامی مشابه تصویر زیر و با تیک سبز رنگ مشاهده خواهید کرد.

HTTP2 به تنهایی کافی نیست

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

گوگل از 200 فاکتور مختلف برای رتبه‌بندی سایت‌ها استفاده می‌کند. در بین این فاکتورها، تجربه کاربری اهمیت بسیار بالایی دارد. استفاده از HTTP2 می‌تواند سرعت سایت شما را افزایش و زمان انتظار برای لود صفحات وب را کاهش دهد. طبیعتاً افزایش سرعت باعث بهبود تجربه کاربری خواهد شد.

اما این همه مساله نیست. استفاده از HTTP2 به ما کمک می‌کند که ارتباط میان مرورگر و سرور را سریع و بهینه کنیم ولی آنچه در این ارتباط جابجا می‌شود هم نیاز به بهینه‌سازی دارد. منابعی مانند تصاویر، فونت‌ها، فایل‌های CSS و JS هرکدام استانداردهایی برای کاهش حجم و اولویت فراخوان دارند که با رعایت کردن‌شان می‌توانیم سرعت سایت را به بالاترین حد ممکن برسانیم.

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