Site hızını düşüren faktörleri 4 ana başlık altında toplayabiliriz. Bunlardan ilki ve belki de en kolay aksiyona geçebileceğimiz sorun, imaj dosyalarının optimize olmamasıdır. Yani site performansı için görselleri sitenize yüklemeden önce sıkıştırma ve yeniden boyutlandırma işlemleri yapmalısınız. Bu sayede dosya boyutlarını küçülterek görsellerin daha hızlı yüklenmesini sağlayabilirsiniz. Ayrıca görselleri uygun olan formatta yüklemelisiniz: SVG formatını geometrik şekiller, JPEG formatını fotoğraf ve ekran görüntüleri, PNG formatını ise yüksek kaliteli görseller ve transparan öğeler için tercih edebilirsiniz. Görsellerin sayısını asgari seviyede tutmaya özen göstermelisiniz; CSS kullanarak veya gereksiz görselleri kaldırarak veri aktarım boyutunu düşürebilirsiniz. İmajların responsive olmasını sağlamalısınız; böylece görseller her cihaz ve boyutta düzgün görüntülenebilirler.
İmaj dosyalarının yanı sıra kaynak dosyaların optimize olmaması da site hızını olumsuz etkileyen faktörler arasındadır. Bunun önüne geçmek için CSS ve JavaScript'leri aynı dosyada tutabilirsiniz; tarayıcıların önbellekleme özelliğinden faydalanarak bu dosyaları daha hızlı yükletebilirsiniz. Her ne kadar front-end tarafında insanın işini kolaylaştırsa da, CSS ve JavaScript kodlarında yorum ve boşluk gibi gereksiz satır kullanımlarından kaçınmalısınız. Kaynak dosyaları olabildiğince minimalize etmek, tarayıcıların kodları daha hızlı çözümleyebilmesine yardımcı olacaktır. JavaScript'leri HTML kodlarında üst kısım yerine body kısmının kapanış etiketinin hemen öncesinde yerleştirebilirsiniz; böylece sayfa içerikleri kaynak dosyalar tetiklenmeden önce yüklenmeye başlayacaktır. Bu yöntemin yanı sıra dosyaları ilk açılışta yükletmek yerine erteletmeli olarak yükletmek için async attribute'unu da kullanabilirsiniz.
Site performansını düşüren bir diğer durum ise veri aktarım hızının düşük olmasıdır. Bu konuda iyileştirme yapmak için tarayıcının önbellekleme özelliğinden, yani cache özelliğinden faydalanabilirsiniz. Bu özellik sayesinde belirlenen süre boyunca sitenize tekrar gelen kullanıcılar için imaj ve kaynak dosyalar önbellekten çekilerek daha hızlı sayfaya yüklenmesini sağlayacaktır. Dosyalarınızı HTTP sıkıştırma yöntemi ile sunabilirsiniz. Gzip biçiminde yapabileceğiniz bu sıkıştırma işlemi sayesinde verilerin boyutlarında tasarruf edebilir, daha hızlı veri aktarımı elde edebilirsiniz. Content Delivery Network adı verilen sunucu sistemini kullanarak sayfa kaynaklarınızın farklı sunuculardan yüklenmesini sağlayabilirsiniz. Bu sistem sayesinde kullanıcı ile server arasındaki fiziksel uzaklık nedeniyle hız kaybı yaşamaz, kaynakların en yakın serverdan yüklenmesini sağlayabilirsiniz. Ele alabileceğim son ana sorun ise HTTP isteklerinin fazla sayıda olmasıdır. Gereksiz HTTP isteği oluşturmamak için gereksiz yönlendirmelerden ve yönlendirme zincirlerinden kaçınmalısınız.
Bunun yanı sıra 404 kodu döndüren sayfaları site içi linklerden kaldırmalısınız. 404 durum koduna sahip kaynak dosyalar varsa, bu dosyaları düzeltmeyi deneyebilir veya kullanabilir durumda değillerse HTTP istek sayısını azaltmak için bu dosyaları kaynak kodlardan kaldırmayı deneyebilirsiniz. Çok fazla sayıda CSS ve JavaScript dosyası kullanmak yerine, kaynak verileri mümkün olduğunca tek bir dosyada toplamak da etkilidir. Böylece sayfalar yüklenirken kaynak dosyaları için gönderilen HTTP isteğinde azalma olacak ve daha iyi site performansı elde edilecektir. Her sayfanıza tekrar eden ikon, logo, statik dosyalar için CSS sprite yöntemini kullanabilirsiniz. Bu yöntem ile her imaj için farklı HTTP isteğinin gönderilmesini engelleyebilirsiniz. Sitenizde bu maddelere yönelik iyileştirmeler yaptığınızda daha iyi performans elde edebilir, site hızını sıralamalarda bir metrik olarak kabul eden Google'ın gözünde daha iyi görünürlüğe sahip olabilirsiniz.
We can group the factors that slow a site down into 4 main buckets. The first one is probably the easiest to act on. Your image files aren't optimized. So compress and resize your images before you upload them. That shrinks the file sizes. Smaller files load faster. You should also upload images in the right format. Use SVG for geometric shapes. Use JPEG for photos and screenshots. Use PNG for high-quality images and transparent elements. Try to keep the number of images to a minimum. Use CSS or drop the images you don't need. That cuts down your data transfer size. Make sure your images are responsive. That way they render properly on every device and screen size.
Unoptimized source files hurt site speed too, not just images. To avoid that, keep your CSS and JavaScript in the same file. Then lean on browser caching. Those files will load a lot faster. Comments and blank lines make life easier on the front end. But skip those extra lines in your CSS and JavaScript. Minify your source files as much as you can. It helps browsers parse the code faster. Put your JavaScript right before the closing body tag. Don't stick it up top in the HTML. That way page content starts loading first. The resource files get triggered after. You can also use the async attribute. It defers loading instead of pulling everything on first load.
Slow data transfer speed also hurts site performance. To improve this, lean on the browser's caching. That's the cache feature. For a set period, returning visitors get images and resource files straight from cache. Pages load faster that way. You can serve your files with HTTP compression. Do it in Gzip format. This shrinks your data sizes. You get faster transfers. There's also a server system called Content Delivery Network. Use it to load your page resources from different servers. With this system, physical distance between user and server won't slow you down. Resources load from the nearest server. The last main issue I'll cover is too many HTTP requests. Avoid unnecessary redirects. Skip redirect chains too. They create HTTP requests you don't need.
You should also remove pages returning a 404 code from your internal links. Got resource files with a 404 status code? Try fixing them. If they're unusable, pull them from your source code. That cuts down your HTTP request count. Don't use tons of separate CSS and JavaScript files. Bundle your resources into a single file when you can. That cuts down the HTTP requests fired off during page load. Better site performance is the payoff. Use the CSS sprite method for repeating icons, logos, and static files. It works across every page on your site. That way you avoid a separate HTTP request per image. Fix these things and your performance improves. Google treats site speed as a ranking metric. So you get better visibility in their eyes too.
This transcript was generated using AI speech recognition and verified against subtitle style rules.
