giriiş

1991 yılında, istek-yanıt HTTP (HTTP 0.9) protokolünün belgelenmiş ilk versiyonu tanıtıldı. O zamandan beri, web büyük ölçüde genişledi ve 24 yıl sonra, HyperText Transfer Protocol'ün (HTTP/2) en son sürümü 2015'te piyasaya sürüldü ve doğru bir şekilde uygulandığında site performansına çok sayıda olası fayda sağladı.

Bu makale, sayfa hızı optimizasyon girişimlerinin bir parçası olarak HTTP/2 uygulamak isteyen SEO'lara yöneliktir.

HTTP/2, ayrıntılı olarak tartışılabilecek son derece zengin bir konudur. HTTP/2'yi tartışan çok sayıda çevrimiçi bilgi var ve son kullanıcılar ve geliştiriciler için daha geniş faydaları var, ancak kendinizi HTTP/2 hakkındaki bilgi zenginliğine kaptırmadan önce, ihtiyacınız olan bilgiyi aldığınızdan emin olun. Bu, doğru soruları sormakla başlar:

1. Bu, arama motoru optimizasyonunu ve/veya sayfa hızını doğrudan nasıl etkiler?
2. İçgörüden bir öneri yapılabilir mi?
3. Tavsiye gerçekçi bir şekilde gerçekleştirilebilir mi?

Bu sorular “yaptığım şey etkili ve değerli mi?” diye sormanıza yardımcı olur. ve nihayetinde HTTP/2'nin bir web sitesini iyileştirmeye nasıl yardımcı olabileceğini değerlendirmek için sizi daha iyi bir konuma getirir.

Konunun geniş doğası nedeniyle, SEO'nun önemini anlamaya çalışırken HTTP/2 hakkında gerekli olmayan büyük miktarda bilgi vardır. SEO için HTTP/2'nin temel faydası Sayfa Hızıdır.

Zengin çevrimiçi bilgiler arasında gezinmenize yardımcı olmak için, burada HTTP/2'ye giriş, HTTP 1.1'den Google'ın HTTP uyumlu Spdy'sine ve sonunda HTTP/2'ye geçişi açıklanmaktadır.

Web'in nasıl geliştiğini anlamak, HTTP/2 protokolünün eklenmesinin bir sonucu olarak web'de yapılan iyileştirmeleri vurgulamaya yardımcı olacaktır.

Google Sayfa Hızını nasıl değerlendirir?

Google'ın Sayfa Hızını nasıl değerlendirdiğini görmek için Chrome Kullanıcı Deneyimi Raporlarından başka bir yere bakmayın . Bu raporlar, kullanıcıların web'deki popüler destinasyonları nasıl deneyimlediklerine ilişkin kullanıcı deneyimi ölçümleri sağlar. Bu, temel kullanıcı etkileşimi metrikleri (First Paint, First Contentful Paint, First Anlamlı Boyama, Etkileşim Zamanı) kullanılarak desteklenir ve ayrıca Page Speed ​​Insights, Public Google Big Query Project, Lighthouse ve Web Sayfası Testi gibi yaygın araçlarla desteklenir. Bu metrikleri ve araçları kullanmak, Sayfa Hızında olası iyileştirmeler yapılmasına yardımcı olabilir.

HTTP/2'ye Giriş

HTTP 1.1

2015 itibariyle, HTTP 1.1 güncelliğini yitirmişti. Web sayfalarının/sitelerinin temel HTML, CSS ve JavaScript'e ve sayısız kaynağa ve farklı çerçevelere dayandığı/güvenildiği günler geride kaldı. 2015 öncesi dönem, TCP bağlantısı başına bir istekle sınırlı olduğunuz fikrine dayanıyordu. Bu, web istemcilerinin indirme için sıraya giren birden çok kaynağa sahip olduğu, ağda tıkanıklığa ve sayfa yükleme sürelerinin yavaşlamasına neden olan durumlara yol açtı.

HTTP/2, yukarıda tartışılan sorunları hafifletmek için üç ana iyileştirme alanını hedeflemek üzere tasarlanmıştır:

• Basitlik
• Yüksek performans
• sağlamlık

HTTP/2 için SEO Faydaları

Sayfa Hızı, muhtemelen SEO'ların HTTP/2'yi kendi web sitelerinde veya müşterilerinin web sitelerinde uygulamayı düşünmelerinin birincil nedenidir. Sayfa Hızı/Performans, 2010'dan beri Masaüstü sorguları için bir sıralama faktörü olan bir dizi ölçümdür . Mobil cihaz kullanımının artması nedeniyle, Temmuz 2018'de Google , Sayfa Hızının Mobil için bir sıralama faktörü olacağını resmen duyurdu .

HTTP/2, siteleri Sayfa Hızı için optimize ederken kullanılabilecek 3 ana işlevsellik sağlar:

1. çoğullama
2. Sunucu İtme
3. Akış Önceliklendirme

çoğullama

Çoğullama, bir web istemcisinin tek bir TCP bağlantısı içinde birden çok istek içermesine izin vererek, sunucu yükünün azalmasına ve ağ tıkanıklığının azalmasına neden olur.

Eski HTTP 1/1.1 protokollerini kullanan modern web istemcileri (Chrome, Firefox, Safari ve Opera), ana bilgisayar adı başına eşzamanlı TCP bağlantılarının sayısı için varsayılan bir sınıra sahiptir. Bu nedenle, HTTP 1/1.1 kullanan bir web istemcisi TCP tıkanıklığı ile kolayca zorluk çekebilir. Modern web istemcilerinde bu sorun, sayfa hızında en önemli iyileştirmelerden bazılarını sağlayabilen çoğullama kullanılarak çözülür.

Aşağıda, HTTP/1.1 ve HTTP/2 karşılaştırması kullanılarak Çoğullamanın faydası gösterilmiştir ve HTTP /2 çoğullama etkinleştirildiğinde ve etkinleştirilmediğinde tipik davranışı gösterir.

( WebpageTest, HTTP/1.1, Çoğullama Gösterilmiyor )

( WebpageTest, HTTP/2, Gösterilen Çoğullama )

Yukarıdaki resimlerde , bir web sayfasının bir kullanıcı (kaynakları talep eden) ve sunucusu (hangi kaynaklara yanıt veren ) arasındaki kaynakların yüklenmesini göstermek için performansa dayalı bir şelale kullanılmıştır. Genellikle sayfa kaynakları HTML, JavaScript, CSS ve görüntüleri içerir. Performansa dayalı şelale, bir sitedeki sayfa hızı sorunlarının keşfedilmesi, değerlendirilmesi ve analiz edilmesinde kritik olan belirli bir kaynağın ne zaman çağrıldığını, indirildiğini ve istemci içinde işlendiğini tam olarak gösterir. Yukarıdaki “HTTP/2” görüntüsünde gösterildiği gibi, farklı bir noktada herhangi bir kaynak yüklenmeye başlamadan tüm kaynaklar aynı anda indirilmeye başlar. HTTP/2 çoğullamayı kullandığından ve artık tek bir TCP bağlantısı üzerinden yalnızca 1 istek göndermeye dayanmadığı için, yukarıda görüldüğü gibi aynı anda birden çok kaynak indirilebilir. Buna karşılık, “HTTP/1.1” görüntüsünde gösterildiği gibi, kaynaklar çoğullama işlevini kullanamadıkları için eşzamanlı olarak indirilmez. HTTP/1.1 kapsamındaki ortalama modern tarayıcı aynı anda 6 bağlantıya sahip olabilir, ancak HTTP/2 uygulamasının yararı, her istek için bir TCP anlaşmasının gerekmemesidir, ancak başlangıçta HTTP/1.1 ile aynı anda kaç bağlantı çalıştırılabilirse çalışsın. bağlantı işlemi her seferinde tamamlanmalıdır. Bu nedenle farklı noktalarda indirmeye başlıyorlar ve bu da kullanıcı için daha uzun sayfa yüklemesine neden oluyor.

( Upwork HTTP/1.1 ve HTTP/2 Diyagramı )

Google ve Bing gibi arama tarayıcıları, HTTP/2 uygulamasından doğrudan faydalanmaz. Yukarıda açıklandığı gibi, bu optimizasyonlardan en büyük fayda, potansiyel olarak Sayfa Hızı için olabilir. Bu nedenle, HTTP/2 uygulaması arama tarayıcısını doğrudan etkilemese de, 2010'dan beri Masaüstü için Google sorguları ve Temmuz 2018'den beri Mobil sorgular için doğrudan bir sıralama faktörü olan Sayfa Hızını etkileyebilir. Sonuç olarak, web sitelerinin yayınlanmaması kritik öneme sahiptir. Google, sıralamaları etkileyerek veya daha yakın zamanda kullanıcılara sitenizin yavaş olabileceğini bildirerek performansı baskılayabileceğinden, kullanıcılar için yavaş bir deneyim.

Sunucu İtme

Server Push, belirli bir sunucunun veya uç ağın, istemci tarafından talep edilmediğinde kaynakları web istemcilerine göndermesine izin verir. Sunucu gönderiminin nasıl çalıştığını anlamak için öncelikle bir web sitesinin izlediği istek-yanıt modelini anlamak önemlidir. Bir kullanıcı bir web sitesinden bir sayfa ister ve sunucu istenen içerik/kaynak ile yanıt verir.

Varsayımsal olarak, tüm stilleri style.css adlı harici bir stil sayfasında tanımlanmış olan bir site düşünün. Kullanıcı sayfa için HTML iskeletini istediğinde (diyelim ki bu durumda index.html) server push, index.html'ye yanıt göndermeye başladıktan hemen sonra CSS'yi kullanıcıya "gönderebilir".

( S mashing Magazine, Server Push )

Server Push'un Sayfa Hızını iyileştirmeye nasıl yardımcı olabileceğini anlamadan önce, bir tarayıcının tarayıcınızda görünmesi için resimler, CSS ve JavaScript gibi farklı kaynaklarla nasıl çalıştığını anlamak önemlidir. Görüyorsunuz, tarayıcı resimlerin, CSS'nin ve JavaScript kaynaklarının nasıl indirileceğine ilişkin talimatlar gönderiyor. Bir web sitesini ilk ziyaret ettiğinizde, genellikle .html dosyası olan bir GET isteğinde bulunursunuz. Bu .html dosyası alındıktan sonra, tarayıcı onu anlamak için tarar ve ardından HTML dosyasında nelerin bulunduğuna bağlı olarak ek GET istekleri yapabilir.

Server Push, Sayfa Hızını artırmaya nasıl yardımcı olur?

Server Push kullanımı sayesinde, tarayıcıdan ihtiyaç duyulan GET isteklerinin sayısı (gidiş dönüşler) azaltılır ve sayfa yükleme sürelerinin artmasına neden olan işleme gecikmeleri önlenir. Bu, web sayfasının kullanıcılar için daha hızlı görünmesine yardımcı olarak onlara çok daha iyi bir deneyim sağlayarak web istemcisi için oluşturma süresini önemli ölçüde iyileştirmeye yardımcı olabilir.

Server Push, Googlebot'un sitenizi veya aslında diğer tarayıcıları nasıl taradığını doğrudan etkilemese de, SEO avantajı, First Paint ve First Anlamlı İçerik gibi kullanıcı merkezli faktörlerde yapılan iyileştirmelerle elde edilir.

Web Sayfası Testi, Lighthouse, Page Speed ​​Insights ve Chrome Kullanıcı Deneyimi Raporu'nu kullanarak bir sitenin/sayfanın aynı sektörlerdeki rakiplere kıyasla nasıl performans gösterdiğini belirleyebilirsiniz. Aşağıda (Resim 1) ve Server Push (Resim 2) olmadan uygulamayı gösteren iki resim bulunmaktadır.

(Sunucu Push Olmadan Web Sayfası Testi)

(WebpageTest, HTTP/1.1, Server Push ile)

Server push ile, sunucu, onları içeren .html dosyası üzerinden göndermesi istenirse, her zaman ek sayfa bileşenlerini (CSS dosyaları, JavaScript ve resimler gibi) gönderecek şekilde yapılandırılabilir.

Yukarıdaki şelalelerde push.php'nin dört CSS dosyası kullandığını görebiliriz.

Sunucu gönderimi olmadan, tarayıcının push.php dosyasını alması, HTML'yi ayrıştırması ve ardından her ek CSS dosyası için özel istekler yapması gerekir. Yalnızca tüm CSS dosyalarını aldıktan sonra bunları işleme sürecinde kullanmaya başlayabilir.

Sunucu gönderimi etkinleştirildiğinde, push.php isteği, sunucuyu dört CSS dosyası üzerinden göndermesi için otomatik olarak tetikler. Tarayıcı bunları alır ve oluşturma sürecinde bunları çok daha erken kullanmaya başlayabilir. Bu, tarayıcının sayfa içeriğini çok daha erken oluşturmaya başlayabileceği ve bu da daha iyi sayfa hızı ölçümleri ile sonuçlanacağı anlamına gelir.

HTTP/2 Önceliklendirme

HTTP/2 Önceliklendirme, kaynakların yüklenme sırasının kontrolünü site sahiplerine geri verir. Doğru yapıldığında, Önceliklendirme, sayfa kaynaklarını optimize edilmiş bir sırada sunarak kullanıcı deneyimine ve Sayfa/Site hızına fayda sağlar ve böylece "hızlı" bir kullanıcı deneyimi yaratır.

HTTP/2'nin öncülü HTTP/1.1'e bakarsak, web istemcisi kaynakların ne zaman yükleneceğini kontrol ediyordu. Yukarıda tartışıldığı gibi bunun nedeni, her TCP bağlantısının aynı anda yalnızca bir kaynağı destekleyebilmesiydi. Hangi kaynakların seçileceğine ve paralel olarak kaç bağlantının açılacağına karar vererek istekleri zamanlamak tarayıcıya bağlıdır.

Nasıl yapıldığına geçmeden önce, kaynaklarımız için neden önceliklendirmeyi kullanmak istediğimizi anlamak önemlidir.

Bir sayfanın üstünde bir resmimiz ve sayfanın altında bir resmimiz varsa, mantıksal olarak üstteki resmin alttaki resimden önce yüklendiğinden emin olmak isteriz. Bu kavram, HTTP/2 Önceliklendirmenin getirebileceği önemi ve etkisini göstermeye yardımcı olur. HTTP/2 önceliklendirmesi, hangi kaynakların önce teslim edileceğini ve diğerlerinden önce yükleneceğini belirlememize olanak tanır (ister JavaScript, CSS veya resimler olsun), böylece sayfa için en hızlı yükleme süresini sağlar.

Tarayıcı artık çoğullama kullanarak tek bir TCP bağlantısı üzerinden aynı anda birden fazla kaynak talep edebilirken, kaynağın ne zaman/nasıl teslim edilmesi gerektiğini belirlemeye yardımcı olmak için artık her istekle öncelik bilgilerini de belirtebilir. Hem sunucu hem de tarayıcı HTTP/2 önceliklendirmesini destekliyorsa, tarayıcı, kaynakların birbirleriyle rekabet etmeden tam bant genişliğini kullanarak önceliklendirme kurallarını tanımlamalıdır. Önceliklendirme sürecinin nasıl işlediğini daha iyi anlamak için HTTP/2 Önceliklendirme için önemli olan üç parametreyi tartışmak önemlidir:

Akış: Bu, kurulmuş bir bağlantı içinde bir veya mesaj taşıyabilen çift yönlü bir bayt akışıdır.

Ana Akış: Bu, kaynakların bağımlı olduğu bir akıştır.

Alt Akış: Bu, ana akışın bağımlı akışıdır. Aynı ebeveyni paylaşırlar ve bu nedenle alt akış olarak bilinirler.

Ağırlık: Bu, birden fazla akış bir bağlantıyı paylaşıyorsa akışa ne kadar bant genişliği ayrılacağını tanımlayan 1 ile 256 arasında tahsis edilen bir sayıdır. Bant genişliği, diğer tüm aktif akışların ağırlıklarına göre tahsis edilir.

Özel Bit: Bu, akışın diğer akışlarla bant genişliğini paylaşmadan indirilmesi gerektiğini belirten bir işarettir.

Başlık Çerçevesi: Bu, hangi çerçeveye ait olduğu akışın tanımlamasıdır.

İkili Çerçeveleme Katmanı: HTTP mesajlarının istemci ile sunucu arasında nasıl kapsüllendiği ve aktarıldığı budur.

Aşağıdaki bir örnek, yukarıdakilerin bir örneğini göstermektedir:

( Google Developers HTTP/2 Akış Önceliklendirme )

HTTP/2 Önceliklendirmesini gerçekleştirmek için, yeni HTTP/2 İkili Çerçeveleme Katmanında bulunan Başlık Çerçevesi içinde önceliklendirme bilgilerini eklemeniz gerekecektir. Ana akış ve diğer alt akışlara bağımlılık/bağımlılık olmaması, önceliği/ağırlığı ve dolayısıyla kaynağın web istemcisine teslimini belirleyecektir.

HTTP/2 önceliklendirmesi artık çok sayıda platformda desteklense de, birçok CDN ve barındırma sağlayıcısı HTTP/2 önceliklendirmesini desteklemez. Bu nedenle, bu optimizasyon tekniğini kullanmak istiyorsanız, HTTP/2 önceliklendirmesini destekleyen bir CDN/barındırma sağlayıcısı kullandığınızdan emin olmanız önemlidir. Aşağıda, hangi CDN/barındırma/sunucuların HTTP/2 Önceliklendirmeyi destekleyebildiğini ve destekleyemediğini açıklayan bir tablo bulunmaktadır.

HTTP/2 Önceliklendirme - Ortak Sunucu/Barındırma/CDN'ler Uyumluluğu

Bu karşılaştırma 02/01/2020 tarihinde doğruydu, ancak hangisini seçeceğinize karar vermeden önce potansiyel hizmet sağlayıcıların uyumluluklarını iyileştirip iyileştirmediğini kontrol etmeye değer.

Belirli tarayıcılara eleştirel olarak bakmak da önemlidir, çünkü ne yazık ki tüm tarayıcılar HTTP/2 önceliklendirmesini desteklemez ve farklı web istemcileri olduklarından farklı öncelikler verir. Aşağıda, hangi web istemcilerinin HTTP/2 Önceliklendirmeyi destekleyebileceğini açıklayan bir tablo bulunmaktadır.

HTTP/2 Önceliklendirme Web İstemcisi Uyumluluğu

HTTP/2 Önceliklendirme, bir kullanıcının Sayfa/Site Hızı algısını önemli ölçüde iyileştirebilir ve Chrome Kullanıcı Deneyimi Raporunda toplanan verileri olumlu yönde etkiler. Bu optimizasyonun Googlebot gibi arama tarayıcıları üzerinde hiçbir etkisi olmasa da Lighthouse ve Page Speed ​​Insights gibi araçlar , HTTP/2 Önceliklendirmesinin sayfa hızı performansı üzerindeki etkisini bir kullanıcının bakış açısından değerlendirmenize yardımcı olur.

HTTP/2 destekli bir CDN/ana bilgisayar kullanan hem sunucu hem de istemci ile akış ağırlığını doğru bir şekilde yapılandırarak, istemciniz için sayfa hızı ölçümlerinizi büyük ölçüde iyileştirebileceksiniz.

HTTP/2 için ön koşullar nelerdir?

HTTP/2'nin hız avantajlarından yararlanmadan önce, onu kullanabildiğinizden emin olun. Dikkate alınması gereken birkaç ön koşul vardır:

1. HTTPS'nin etkinleştirildiğinden emin olmak önemlidir.
2. Kimliği doğrulanmış bir yetkiliden bir TLS sertifikası kullanın ve sertifikayı etkinleştirip yükleyin.
3. Nginx, Apache ve IIS gibi Web Sunucusu yazılımınızın HTTP/2'yi desteklediğinden emin olun. Destek için kimliği doğrulanmış tam bir liste http://ayi.ma/browsershttp2 adresinde bulunabilir ve bu liste HTTP/2 için tarayıcı desteğini gösterecektir. CDN'ler/Hosting için HTTP/2 desteği arıyorsanız lütfen http://ayi.ma/serverhosting adresine bakın .

Yaygın Tuzaklar / HTTP/2'nin Tanıtılmasıyla Değişmesi Gereken Şeyler

Önceki HTTP 1.0 ve HTTP 1.1 protokollerinin sınırlamaları nedeniyle, geliştiriciler ve SEO'lar, bu sınırlamaların sayfa hızı performansı ve güvenliği için sunduğu çok sayıda sorunu aşmanın yollarını bulmaya çalışmıştır.

Sonunda, bu sınırlamalardan bazılarını ortadan kaldırmak için "hackler" bulabildiler, ancak bu yöntemlerin çoğu geliştiricilerin daha fazla çalışmasına neden oldu. Sorabileceğiniz bu hacklerden bazıları nelerdir? HTTP/2'nin doğru uygulanmasıyla çözülebilecek sitelerde göreceğiniz en yaygın hacklerden bazıları burada.

Etki Alanı Paylaşımından Kaçının

Şaşırtıcı bir şekilde, HTTP/2'yi doğru bir şekilde uygulamış olmalarına rağmen, çok sayıda site hala bu hack'i kullanıyor. HTTP/2 etkinleştirildiğinde, alan paylaşımı kullanmaktan kaçınmak önemli olacaktır. Etki Alanı Paylaşımı, kaynakları farklı ana bilgisayar adlarına bölme tekniğidir, böylece aynı anda daha fazla kaynağın sunulmasına olanak tanır.

Güncellenen HTTP/2 protokolü sayesinde, Etki Alanı Paylaşımı artık gerekli değildir ve aslında çözdüğünden daha fazla soruna neden olur. HTTP/2, siteniz için doğru bir şekilde yapılandırılır ve etkinleştirilirse ve ayrıca Etki Alanı Paylaşımı kullanıyorsanız, tarayıcı birden çok ana bilgisayar adı arasında çoğullama ve indirmelerden yararlanamayacağından, HTTP/2'nin bazı avantajlarına karşı koymuş olursunuz.

Ayrıca, Etki Alanı Paylaşımı aracılığıyla, Akış Önceliklendirmesini gerçekten bozuyorsunuz ve Sayfa Hızından en iyi şekilde yararlanmak için kaynaklarınız yüklenemeyecek.

Server Push'u Doğru Şekilde Kullanın

Server Push, bilmeniz gereken bazı dezavantajlara sahiptir. Server Push aslında aşırı kullanılabilir ve ne zaman kullanılacağını seçerken seçici olmalısınız. Çok fazla kaynak zorlamak istemezsiniz çünkü bu, web istemcisinin yalnızca HTML'yi değil, birlikte "ittirildiği" her şeyi indirmesine neden olabilir. Bu, sayfanın yüklenmesinin ve oluşturulmasının gerçekten daha uzun sürebileceği anlamına gelir (Google'ın odaklandığı, Etkileşime Geçme Süresi gibi kullanıcı merkezli metrikleri artırır).

Sunucu gönderimi için ikinci bir yaygın tuzak, web istemcisinin zaten sahip olduğu kaynakları nasıl zorlamayacağınızı bulmaktır. Bu, birçok yöntemle kontrol edilebilir. Bir yöntem, kaynakları geri dönen kullanıcılara göndermemeyi seçmek ve bu nedenle döndürülen kullanıcıların önbelleğe alınmış varlıklarını kullanmasına izin vermektir. Bu, bugüne kadarki en kolay uygulamadır. Bu, kaynakların önbellek başlıklarını kontrol ederek, başlıkların sunucu push uygulamasıyla örtüşmediğinden emin olarak yapılabilir.

HTTP/2 kapsamında Gerçek Hayat Testleri

Teorik bilgi, HTTP/2'yi ve faydalarını anlamanın temelini atmak için her zaman önemlidir. Kavramlar kavranıp anlaşıldıktan sonra, HTTP/2'nin Sayfa Hızı üzerindeki etkisini ölçmek için bu teorileri test etmek önemlidir.

Bu Sayfa Hızı serisinin 2. Kısmı HTTP/2 Gerçek Hayatta - Web Sitesi Testlerini ve Analizini kullanmak , HTTP/2'nin Sayfa Hızı ve SEO için değeri açısından gerçek faydasını tartışacaktır, bu yüzden kaçırmayın!

HTTP/3'e ne dersiniz?

HTTP/3, HTTP/2'nin ardılı protokolü olarak açık bir potansiyel gösterse de, web genelinde SEO'lar için HTTP/2'nin sonunu işaret etmez ve etmemelidir. Dünya çapındaki web'deki her yeni büyük gelişmede olduğu gibi, normal bir dağıtım aşamasından geçecek ve bir sitenin yeni protokolü benimsemesi ve SEO endüstrisinde fiili bir standart haline gelmesi muhtemelen zaman alacaktır. HTTP/2 uygulaması, doğru bir şekilde uygulandığında sitenizin performansını artırmaya yardımcı olabilecek faydalı ve basit bir kazancı temsil eder.