Web Site Performansı İzleyebileceğiniz Platformlar

bay404

Uzman üye
1 Mar 2020
1,672
42
Antalya


GyUig8.gif



Konu İstatistikleri

Okuma süresi: 25 dakika 22 saniye
Konu metni kelime sayısı: 3063
Konu metni karakter sayısı:23995


Konuya Giriş

Merhaba Sevgili Turk Hack Team Ailesi, bu konuda web siteleriniz performanslarını takip edebileceğiniz platformlardan bahsedeceğim. Aklınızda "bunu öğrenmek benim ne işime yarar ki?" gibi bir soru varsa buna da bir cevabım olacak. Web sitenizin performansını öğrendiğiniz zaman öncelikle diğer sitelerin performansına göre karşılaştırma yapabilirsiniz. Onun dışında neyin ne kadar performansı etkilediğini görebilirsiniz. Performansınıza göre şekillendirmeler ve değerlendirmeler yapabilirsiniz. Yani kısaca sitenize olumlu olarak birçok geri dönüşü olacaktır.


Kötü performansı etkileyen birçok etken vardır. Büyük dosya boyutları etkileyen büyük etkenlerden bir tanesidir. Onun dışında kullanılan eski yazılımlarda performansı önemli ölçüde düşüren etkenlerdendir. Bunlar örneklerden sadece iki tanesiydi arkadaşlar web site performansını etkileyen çok sayıda etken vardır. Web sitenizin düşen performansı sitenin kullanılabilirliğini düşürmektedir. Kullanıcılar üzerinde de büyük etkileri vardır. Sizler de tahmin edebilirsiniz ki kullanıcılar daha kaliteli ve hızlı bir sitede gezinmek isterdi. Bizlerin amacıda sitelerdeki kullanıcıları her daim tatmin etmeliyiz ki sitelerimiz kullanıcılar tarafından değere binsin. Bu yüzden site performansına hakimiyetimiz çok önemlidir arkadaşlar. Şimdi ise konun detaylarına geçebiliriz..


Bahsedeceğimiz platformlar sayesinde site performanslarını ölçeceğiz hangi ögenin performansı ne kadar etkilediği, hangisinin ne kadar sürede yüklendiği konusunda bilgi sahibi olacağız. Örneğin testler sonucunda bir ögenin site hızını olumsuz etkilediğini yakaladığımız zaman onu düzeltecek veya site üzerinden kaldırıp başkası ile değiştireceğiz. Haliyle site performansımız daha da artacak. Örneğin satış yaptığınız bir site kullanıyoruz diyelim. Kullanıcılarımız sitemize girdi satın alacakları bir ürün bulunmakta ama bizim sitemiz bir türlü açılmamakta haliyle kullanıcılar sitemizi terk edeceklerdir. Araştırmalar sonucunda kullanıcıların yüzde kırkı üç saniyeden daha uzun yüklenme süresine sahip siteleri terk ettikleri gözlenmiştir. Üyeleriniz sitenizin performansını beğenmediği hızlı bağlanamadığı sürece sitenizden ürün satın alışları, geri dönüşümleri büyük oranda düşecektir. Olası tüm müşterileriniz sitenizde geri dönüşüm yerine sitenizi terk edecektir. Bu da hiçbir web site sahibinin istemeyeceği bir durumdur.


Site performansını sadece ilk açtığımız zamanda da test etmek yeterli değildir arkadaşlar zaman içerisinde sürekli eklemeler yaptığımız içerik yüklediğimiz sitemizde yüklenmelerde oluşacak ve birikmeler olacaktır, haliyle performans kaybına neden olabilir. Bu yüzden performans testlerimizi yalnızca ilk açılışta değil düzenli aralıklarla yapmalıyız.



Web Site Performansı İzleyebileceğiniz Platformlar

Arkadaşlar web site performansını izleyebileceğiniz birçok site bulunuyor. Fakat bunların hepsinden doğru etkiyi alamayabilirsiniz sizler için bu konuda bunların en iyilerine göz atacağız. Konu içerisinden paylaştığım veyahutta başka yerlerden ulaştığınız araçları da kullanarak site performansınızı teste tabi tutabilirsiniz. Burada önemli olan nereden yapıldığı değil testin nereden yapıldığı sadece test işleminin kolaylığını değiştirebilir. Bizim için burada önemli olan testlerin yapılması ve site performansının takip edilmesidir. O zaman ilk aracımız ile konumuza devam edelim.



1- Google PageSpeed ​​Insights


I1B4pv.webp



Google PageSpeed ​​Insights (PSI) ile sitenizini hem mobil hem de masaüstü olarak performansınız değerlendirmeye tabi tutabilirsiniz. Google PageSpeed ​​Insights gerekli testlerini yaptıktan sonra çok fazla kaynaktan örnekler, alıntılar yaparak site performansı ve hızını arttıracak eksikliklere çözüm sağlayacak önerilerde bulunan bir araçtır.


Google PageSpeed ​​Insights, rapor sonuçlarında iki ekran olarak rapor sonuçları verir. Mobil sekmesi, web sitenizin mobil cihazlar karşısında gösterdiği performans sonuçlarının bulunduğu bölümdür. Diğer bir bölüm ise masaüstü bölümüdür. Bu bölümde ise sitenizin masaüstü cihazlarda sergilediği performans sonuçları gösterilmektedir. Google PageSpeed Insights bu şekildeydi şimdi bir sonraki aracımıza geçelim



2- Pingdom


I12UIp.webp



Arkadaşlar sıradaki aracımız Pingdom. Pingdom, web sitenizin performansını ölçmek için kullanabileceğiniz en iyi araçlardandır. Pingdom diğer platformlara göre detaylı rapor sunmaktadır ve çözüm yolları konusunda kullanıcılarına yardım etmektedir. Bu sayede çözüm ararken çok zorlanmayız. Pingdom detaylı ve güzel açıklaması ve yardımlarının yanı sıra testlerinin yanında kimin nereden web sitenize giriş yaptığını hangi tarayıcılarını kullandığını da raporlamaktadır. Bu sayede performansın kimlerde nasıl olduğunu detaylı bir şekilde görebilirsiniz. Pingdom çok fazla güzel özelliği olmasına rağmen halen daha özellikleri bitmemiştir. Bir diğer özelliği ise, sitenizin çalışma süresini izlemektedir. Bunun ile ne yapabilirim gibi bir sorunuz olursa diye cevaplayacağım: Sitenizin çalışma süresi ile kullanılan sunucu ve uygulamaların da performansları takip edilebilmektedir.


Yukarıda sözünü ettiğimiz araç olan pingdom web geliştiricileri, web yöneticileri için uygun bir platformdur. Çok uygun bir maaliyet ile kullanabilirsiniz. Sunduklarını görebilmek için 14 günlük deneme sürümünü kullanmak için kayıt olabilirsiniz. Bizse sıradaki platformumuza geçelim :)



3- GTmetrix


I1Wjwc.webp



Diğer iki platformumuzu anlatırken Pingdom adlı platformun ne kadar ayrıntılı olduğundan bahsetmiştim. Eğer daha da ayrıntılı bir platform arıyorsanız bulabileceğimiz en ayrıntılı platformlardan bir tanesi olan GTmetrix adlı platform tam size göredir arkadaşlar. GTmetrix kullanmanın en büyük avantajı taramalarını çok farklı seçeneklerle yapmasıdır. Nedir bu çok farklı seçenekler derseniz; farklı ağlar, aygıtlar hatta ülkelerde testlerini gerçekleştirmesidir arkadaşlar. Tabi ki sadece bunlar da değildir. GTmetrix web sitenizi telefon tablet ekranı dahil olmak üzere birçok ekran üzerinden de web sitenizi test etmektedir. Pingdom adlı platformun aksine GTmetrix adlı platformu kullanmak tamamen ücretsizdir. Tercihinize göre eğer isterseniz pro versiyonuna da geçiş yapabilirsiniz. Peki ya bu pro sürümünde neler vardır neden geçiş yapılmalıdır sorusuna da şöyle cevap vereyim; saatlik izleme, kaynak kullanımı grafikleri ve raporunuz için çok sayıda filtre seçeneği GTmetrix adlı platformun pro versiyonunda biz kullanıcılarına sunulmaktadır.


Evet sözüne edeceğimiz araçlar bu kadardı arkadaşlar. Bu bölüme kadar okuyanlara şu sorumu yöneltmek isterim "sizce bu tanıtmış olduğumu üç adet platformdan hangisi daha avantajlı kullanışlı duruyordu?" görüşlerinizi yorum olarak belirtebilirsiniz. Umarım bahsettiğim araçları anlamışsınızdır. Şimdi ise araçlar ile teste tabi tuttuğumuz sitemizi daha hızlı hale getirebilmek için neler yapmalıyız, neler yapmamalıyız ve nelere dikkat etmeliyiz onlardan bahsedelim.


4- Uptrends


Iq7vjj.jpg



Arkadaşlar son platformumuzun adı Uptrends. Uptrends adlı platformun özellikleri hemen hemen bahsettiğim diğer platformlar ile aynı olduğu söylenebilir Uptrends adlı platformu diğer platformlarımızdan ayıran en büyük özellik taramalarımızda lokasyon seçeneği olmasıdır. Yani istediğim lokasyonu seçebilir ve lokasyona göre bir rapor hazırlamasını isteyebiliriz. Uptrends adlı platform raporların hem olumlu hem de olumsuz maddeleri, noktaları bizlere listelemektedir. Tarama ve testleri sonrasında eksik, hatalı bölümleri düzeltmek için önerilerde bulunur. İncelemeleri sonrasında web sitemizin hızlandırılması ve performansının artırılması konsunda bilgilendirmeler yapar.



5- KeyCDN Speed Test


Iqdl2s.jpg



Bir sonraki platformumuz ise KeyCDN Speed Test adlı platformdur arkadaşlar. KeyCDN Speed Test adlı platformun öne çıkan özellikleri çok ayrıntılı oluşudur. Bir diğer ve en güzel özelliği ise testlerin çok hızlı bir şekilde gerçekleştirmesidir arkadaşlar. Taramayı başlattığınız zaman sitenizi çok hızlı bir şekilde test edip sizlere sonuçlarını sunmaktadır. KeyCDN Speed Test adlı platformumuz 14 farklı lokasyona sahip ülkeden testlerini yapabilmektedir. Sizin için en uygun lokasyonu seçtikten sonra sizler de kendi web sitelerinizin testini KeyCDN Speed Test adlı platformdan yapabilirsiniz.

KeyCDN Speed Test adlı platformda testler sonucunda test sonuçlarında HTTP istek sayısı, yükleme süresi ve istenen sayfanın boyutu şeklinde test sonucu raporu sunulmaktadır. KeyCDN Speed Test adlı platformun cep telefonlarından dahi kullanılabilir olması da tercih edilebilirliği konusunda artı bir husus daha oluşturmaktadır.



Site hızını artırmak için nelere dikkat etmeliyiz?


Web sitemizin hızını ve performansını öğrendik. Hata ve yapılması gerekenleri öğrendik sırada ise bu geliştirmeleri yapmak için neler yapmamız gerektiğini öğrenmeye aşağıda temel başlıklar olarak nasıl performans ve hız artışı sağlayabileceğimize bakacağız.



Görsel dosyaları optimize etmek


Daha önce görsellerin SEO'ya uyumu için yapılması gerekenleri anlattığım bir konumda bahsettiğim gibi görsellerinizi web sitelerinize yüklemeden önce gerekli sıkıştırma işlemlerini yapmanız. Bunların etkisi hem SEO açısından hem de web sitenizin açılış hızını etkileyen en önemli konulardandır. Resimleri doğru formatlarda ayarladıktan ve sıkıştırma işlemlerini yaptıktan sonra web sitelerimize yüklüyoruz. Bu sayede web site açılış hızlarını olumsuz olarak etkilemeyecektir. Bir diğer husus ise görsel formatlarıdır arkadaşlar peki burada nelere dikkat etmeliyiz? Her görseli aynı dosya tipinde yüklememeliyiz. Eğer görsellerimiz arasında geometrik şekiller ve bu tarzda bir görsel ile uğraşmaktaysak ve bunu sitemize yükleyeceksek görsel formatını .svg olarak ayarlamamız gerekmektedir. .jpg formatını ise normal fotoğraflar ekran, görüntüleri gibi yerlerde kullanırız. Eğer kullandığını görsel bir fotoğraf ve ekran görüntüsü ise görsel formatı seçiminiz jpg formatında olmalıdır. Bir diğer görsel formatımızda png 'dir arkadaşlar. Peki ya png formatını hangi görsellerde tercih etmeliyiz derseniz. Png Formatı diğer görsel formatlar göre biraz daha bilindik olacağını düşünüyorum. Png formatı transparan görsellerde ya da kalitesi yüksek görsellerde kullanılır. Elimizde örneğin arka planı boş olan bir görsel bulunuyorsa görsel formatını ayarlarken png formatını seçmemiz en doğru tercih olacaktır. Bir diğer görsel optimizasyon önerim de görsel sayısını az tutmak ve görseller yerine css kullanmak olacaktır arkadaşlar. Bu söylediklerimi biraz daha açık bir şekilde anlatacak olursam, görsel sayısını az tutmalıyız arkadaşlar bunu zaten herkesin anlayacağını düşünüyorum ne kadar çok görsel bulunursa web sitemizin açılış hızı bir o hayli azalacak ve web site performansımız düşecektir arkadaşlar bu yüzden web sitelerinizdeki görsel sayılarını azami düzeyde tutunuz. Onun dışında görsel yerine css kullanın dedim bu nedir derseniz, arkadaşlar örneğin bir footer alanını siz resim olarak ekleyip onun üstüne şekillendiriyorsanız görsel yükleyeceğinizden yine açılış hızında ve web site performansında bir kayıp olacaktır. Onun yerine footer alanın arkaplanını çok basit bir şekilde kısa css kodları ile oluşturarak görsel sayısını azaltmış olursunuz ve görsel optimizasyonunu sağlamış olursunuz. Dolayısıyla web sitenizin açılış hızında yine bir artış olacaktır ve web sitenizin performansı olumlu yönde oldukça artacaktır. Arkadaşlar görsel dosyaları optimize etmek başlığı altına ele alacağım son madde de görsellerin ekran boyutlarına göre şekillendirmekle alakalı olacak yani responsive olmaları ile alakalı. Arkadaşlar hem SEO açısından hemde web sitenizin açılış hızı ve performanısını olumlu yönde etkilemek için olsun olumlu yönde arttıracak etkenlerden bir tanesi de görsellerimizin responsive olarak ayarlanması olacaktır. Responsive olan görsellerimiz sayesinde her ekran boyutunda sorunsuz bir şekilde görsellerimiz hızlı bir şekilde açılacaktır.



Kaynak dosyalarını optimize etmek


Görsel dosyalarını optimize etmek konusunda anlatımlarımız yaptığımıza göre sırada kaynak doya optimizasyonlarında arkadaşlar. İlk maddemiz ile başlayalım, bilirsiniz ki css ve javascript kodlarımızı yazabileceğimiz bir çok şekil vardır bunlardan herhangi birini seçmeniz çok fark etmez gibi gözükebilir ama sayfa açılış hızı optimizasyonu ve performans artışı elde etmek isteyen birisi için bunların yazılış yerinin önemi oldukça çoktur. Css ve javascript kodlarınızı ayrı yazdığınız zaman kullanıcıların web tarayıcıları bu dosyaları ve dosyalardaki kodları önbelleklemez ama biz bu dosyaların tamamını tek dosya içerisinde tutarsak açılışta kullanıcılarımızın web tarayıcıların bu dosya ve kodlar önbelleklenecektir bu da web sitelerinizin açılış hızı ve performansı gibi etkenlere olumlu yönde yükseliş sağlamaktadır. Aklınızda peki ya bu dosyalar ve kodlar önbelleklenmek için de zaten yüklenmiyor mu gibi bir soru takılmışsa onu da şu şekilde açıklayayım, ilk girişte web tarayıcıları tarafından görsel ve imaj dosyalarındaki kodlar önbelleklenmekte bu sayede bir sonraki girişte görsel ve imaj dosyalarındaki kodlar tekrardan yüklenmeyecektir diğer maddelerde olduğu gibi bizler de açılışı hızlanmış ve performansı artmış bir web sitesine sahip olacağız. Bir sonraki kaynak optimizasyonu maddemiz ise html kodlarını sıkıştırmak olacaktır. Html kodlarını Gzip biçiminde sıkıştıracağız bu sayede kodlarımız daha kısa olacaktır. Bu sayede verilerimiz boyutunda güzel bir azalma olacaktır. Bununla birlikte verilerin aktarım hızı dolayısıyla web sitelerimizin açılış hızları olumlu yönde artacaktır. Bir diğer ve en önemli kaynak optimizasyonu maddemiz ise Content Delivery Network adı verilen sunucu sistemini kullanmaktır. Web sitemize nasıl açılış hızı ve performans katkısı sağladığı konusunda bu maddeyi daha detaylı anlatacağım.



Content Delivery Network (CDN) Nedir?


IKo241.png



Content Delivery Network (CDN) yani Türkçe anlamı olarak içerik dağıtım anlamına gelmektedir. Content Delivery Network (CDN) nasıl çalışır, mantığı nedir? derseniz, Content Delivery Network (CDN) kullanıcıların web sitelerine giriş yapmak istedikleri zaman kendilerine en yakın olan serverdan bağlanmaktadırlar bu sayede açılış hızında ve performansta çok yüksek artış bulunmaktadır. Content Delivery Network (CDN) adı verilen bu sunucu sistemini kullandığımız zaman sitemizde bulunan görseller, videolar, kodları ve diğer tüm içerikleri bünyesinde barındırır optimize eder ve kullanıcılara bu dosyaları kendilerine en yakın olan serverdan en hızlı şekilde ulaştırır.


IKodOY.jpg



İçerik Dağıtım Ağı Nasıl Çalışır?


Genellikle bir web sitesi açtığımız zaman kullanıcılarımıza yayınlarımız web sitemizin bulunduğu ülkenin serverlarından yapılır arkadaşlar. Ama uluslar arası ziyaretçi alan bir web siteniz var ise Content Delivery Network yani içerik dağıtım sistemini kullanmanız gereklidir. Content Delivery Network sistemi kullandığınız zaman web sitenize diğer ülkelerden giriş yapan kullanıcılar olduğu zaman hız kaybı olmayacaktır. Kendilerine en yakın sunuculardan web sitelerine giriş yapacaklardır. Örneğin, Amerika 'dan yaşayan birisi sizin web sitenize giriş yapıyor ve siz Content Delivery Network içerik dağıtım sistemi kullanmıyorsunuz. Bu yüzden kullanıcı mecburen sizin kullandığınız server 'dan giriş yapacak yani Türkiye 'de bulunan bir sunucu haliyle hızında büyük oranda düşüş yaşayacaktır. Fakat sizler web siteleriniz de Content Delivery Network sistemi kullanırsanız kendilerine en yakın sunucu olan New York’tan bağlanacaklardır. Bu sayede site açılış hızlarında hiçbir düşüş olmadan en hızlı şekilde siteye gireceklerdir.


IKEuUj.jpg



Content Delivery Network kullanıcılara dosyaları kendilerine en yakın olan lokasyon dan gönderir bu hem onların açılış hızlarını v web site performanslarını olumlu yönde etkiler hem de sizlerin ana sunucunuz olan Türkiye'deki sunucunuza yük binmesini ve yavaşlamasını önler. Maddelerimizde de bahsettiğimiz gibi web sitelerinizin açılış hızları hem kullanıcılar için dolayısıyla hem de SEO için önemli bir etkendir. Yavaş açılan bir web siteniz var ise bu hem kullanıcılarınız için hem de SEO açısından olumsuz bir dönüş ve etki yaratacaktır. Fakat web siteniz bunun aksine hızlı açılıyorsa yine kullanıcılarınız ve SEO açısından olumlu bir dönüş olacaktır. Web sitelerinizde Content Delivery Network kullandığınız zaman da bu artış yine sağlanacaktır.



HTTP isteklerini azaltmak


Detaylı bir açıklamanın ardından HTTP isteklerine geçebiliriz arkadaşlar. Http isteklerini azaltmak sayfa hızımızı ve performansını olumlu yönde etkileyen etkenlerden bir tanesidir. Bunlar arasındaki ilk madde ise gereksiz Http yönlendirmesi yapmamak arkadaşlar. Sürekli bir yerden diğer bir bölüme, o bölümden başka bölümlere şeklinde çok fazla yönlendirmeden kaçının yapılan fazla yönlendirmeler web sitenizin hızını ve performansını düşürecektir bunun önüne geçmek için gereksiz ve önemli olmayan yönlendirmelerden kaçınmalıyız. 404 durum kodunun ne kadar önemli olduğunu biliriz. Eğer 404 durum koduna sahip bir sayfanız bulunuyorsa onu 404 yönlendirmesi yapmak yerine 404 kodunu alan sayfayı düzenleyin ve bu sorunu çözmeye çalışın eğer olmuyorsa o sayfayı tamamen kaldırın. Ne kadar önemli olsa da 404 yönlendirmeleri de yönlendirme sayılacağından web site hızını ve performansını olumsuz etkileyen etkenlerden bir tanesi olabilir. Bu yüzden eğer 404 durum kodu alan sayfamız var ise bu sayfaya uygulayacağımız ilk çözüm yolu sorunu çözmeye yönelik olmalıdır. Eğer yaptığımız çalışmalar sonucunda sorun hala çözülmüyor ise sayfayı html kodlarımız arasından kaldırmalıyız ki gereksiz 404 durum yönlendirmesi yapılmasın arkadaşlar. Çoğu kişi web site kodlarını karışıklık olmaması adına her bölümün kodlarını farklı klasör ve dosyaların içine yaymakta bu aslında kodlama kısmında ne kadar güzel bir yöntem de olsa ne kadar karışıklığı azaltıyor olsa da kullanıcılar web sitelerinizi açmak istediklerinde tüm dosyalara istek gitmektedir. Bu durum yine web site hızını ve performansını olumsuz yönde etkileyebilir. Bunun çözümü içinse css ve javascript kodlarımızı olabildiğince tek dosya içerisinde tutmalıyız. Dosyalarımız ne kadar az olursa kodlarımız ne kadar az dosyalarda saklanırsa web sitemiz açılırken o kadar az istek gidecektir. Haliyle hız ve performansı da artacaktır. Web sitelerimizin hızını etkileyen maddelerden bir diğeri ise ikon ve logolar ile ilgili. Hepimiz web sitelerinde logolar ve ikonlar kullanırız bazı durumlarda bu ikon ve logolar birden fazla yerde kullanılır hatta bazen her sayfada var bile diyebiliriz. Bu logo ve ikonlar her ayrı sayfada defalarca yüklenmektedir. Haliyle sizinde anlayabileceğiniz gibi gereksiz istek gittiği için yine web sitemizin hızında ve performansında kayıplar olacaktır. Bunun önüne geçmek için birçok sayfada bulunan logo ve ikonların statik imaj dosyalarını CSS Sprite yöntemi ile kullanmalıyız. Bu sayede maddenin başında da dediğim gibi gereksiz istek gitmeyecek ve bu sayede web sitemizin açılış hızı düşmeyecektir. Maddeleri açıkladımıza göre şimdi de bilmeyenler adına Css Sprite yöntemini açıklayalım.



Css Sprite yöntemi nedir?


Arkadaşlar Css Sprite yöntemi web sitelerde kullanacağımız birçok görsel dosyasının sıralı bir şekilde tek bir dosyada bulunmasıdır. Örneğin bir web sitesi düşünelim. Bu web sitesinde varsayalım ki 30 adet görsel kullanılıyor. Eğer bizler bu 30 tane görseli tek tek kullanırsak web sitemizin her sayfasında yenilenişinde bu görsellere sürekli istekler gidecek ve hepsi tek tek yüklenecektir. Haliyle web site hızı ve performansı yine düşecektir. Ama biz bunları tek bir dosya içerisinde sıralı bir şekilde sıkıştırısak sadece bir görsel yüklenecek ve aslında tüm web sitesinin görselleri yüklenmiş olacaktır. Bu sayede her görsel tek tek istekte bulunmayacaktır. Tek tek istek gönderen görseller olmayınca web site hızımızda ve performansımızda olumsuz yönde etki olmayacaktır. Düşünsenize 30 adet dosyayı yüklemek yerine yalnızca 1 adet dosya yüklüyor ne kadar fark olacaktır.


Evet arkadaşlar etkisi büyük olan yöntemler olsa da genel olarak maddelerin etkileri küçük oranda artılardı. Aslında hepsi tek başına pek de fazla etki etmeyebilir ama hepsi birleştiği ve en doğru şekilde kullanıldığı zaman en iyi açılış hızlarını ve site performanslarını yakalayacaksınız.



Konu özeti, Sonuç


Arkadaşlar konu içeriğinden yeteri kadar anlattığımız maddeleri ve hususları tekrar etmek ve üzerinden geçmek isterim. Sizler için üç adet farklı özelliklere sahip ama temelinden birbirinden iyi web site performansını ve hızını test edebileceğiniz platformlardan bahsettik bunlardan ilki, Google PageSpeed ​​Insights adlı platformdu. Masaüstü ve mobil olarak iki sekme şeklinde sonuçları bize sunmaktaydı. Kullanılabilir güzel platformlardan bir tanesi olarak değerlendirebiliriz. Hemen ardından bahsettiğimiz ikinzi platformumuz, Pingdom adlı platform idi. Pingdom'un yeterince detaylı olduğundan da bahsetmiştik, aramalarını ağ, cihaz hatta ülkeye kadar farklı farklı şekillerde test ediyordu. Uygun maaliyetli bir platform idi kullanıcıları için 14 günlük deneme süresi de vardı. Sizler de hemen kayıt olarak bu deneme süresini kullanabilirsiniz. Pingdomdan sonra daha da detaylı olan GTmetrix adlı platformu inceledik. Ücretsiz bir platform idi ama pro versiyonunu tercih edersek sayısız şekilde filtrelemeler ve düzenli olarak izleme gibi özellikleri ile daha da verimli bir platform oluyordu. Platformlarımızı inceledikten sonra hızı düşmüş veya daha da hızlandırmak istediğimiz web sitelerimiz için hızlandırma ve performans artışı için optimizasyonlardan bahsettik. Öncelikle görsel dosya optimizasyonundan bahsettik. Bilirsiniz ki görsel dosyalar sadece düz metinlerden daha çok boyuta sahiptirler ve açılış hızında büyük rol oynarlar. Dosya formatlarına ve görseller Css Sprite yöntemi ile tek dosya haline çevirmekten bahsettik. Bu da etkili bir yöntemdi. Düşünsenize 30 40 adet görseli tek görsele çeviriyor. Merak etmeyin görsellerde bir kayıp ya da eksi yön oluşturmuyor. Css Sprite yöntemi dedik ve bu yöntemi biraz daha detaylandırma gereği duydum bu konuyu biraz daha açtık ayrı başlık altında detaylıca inceledikten sonra o konuyu da kapattık. Daha sonrasında kaynak optimizasyonu konusuna değindik. Daha çok dosyaları ve kodları düzenlemeye yönelik oldu tek dosya içerisinde toparlamaktan söz ettik, bunlar önemli arkadaşlar. Tarayıcılarımız imaj ve görsel dosyalarını önbellekleyip her seferinde yeniden yüklememesi için hepsini tek dosyaya ayarlamamız en iyi şekilde yazmak olacaktır. Daha sonra bu başlık altında incelediğimiz en önemli madde olan Content Delivery Network yani içerik dağıtım sisteminden bahsettik. Kullanıcılarımıza en yakın serverdan yüklüyordu bu sayede mesafeden dolayı bir gecikme ya da performans düşüşü yaşanmamış oluyordu. Burada aslında daha fazla yapacağımız bir şey yoktu. Daha sonrasında Http isteklerini azaltmaktan bahsettik burada asıl olay neydi karmaşık yönlendirmelere sahip sayfalar içindi örneğin bir sayfanız çalışmıyor ve sayfada 404 durum yönlendirmesi bulunuyor bu yönlendirme yerine çözme şansımız var ise sayfadaki sorunu çözmek ya da sayfayı tamamen kaldırmak şeklinde bir çözüm bulmuştuk. Arkadaşlar benim konu sonrasında sizlere tavsiyem şu şekilde tanıttığım araçlardan herhangi birini veya diğer tüm farklı araçlardan bir tanesi seçmeniz ki burada önemli olan testin yapılmasıdır. Düzenli olarak taramalarınızı yapmanızdır. Sitenizin performansını ve açılış hızını artırma optimizasyonlarını da uygulmanız oldukça önemlidir


TRoCYy.png


Geri Dönüş ve Yanıtlarınız Bekliyorum. Benim için önemliler. :))


Konum bu kadardı arkadaşlar, bugün sizlere web siteleriniz hızını ölçebileceğiniz araçlar hakkında elimden geldiğince detaylı ve önemli bilgiler anlatmak istedim. Umarım hepinizin işine yarar ve konumu beğenmişsinizdir. Hepinize vaktinizi ayırdığınız, okumaya uygun görüp de okuduğunuz için teşekkür ediyorum. Saygılarla iyi forumlar.. :mml

giphy.gif



 

By Birkan

Katılımcı Üye
18 Nis 2022
626
677




GyUig8.gif






Konu İstatistikleri




Okuma süresi: 25 dakika 22 saniye

Konu metni kelime sayısı: 3063

Konu metni karakter sayısı:23995





Konuya Giriş




Merhaba Sevgili Turk Hack Team Ailesi, bu konuda web siteleriniz performanslarını takip edebileceğiniz platformlardan bahsedeceğim. Aklınızda "bunu öğrenmek benim ne işime yarar ki?" gibi bir soru varsa buna da bir cevabım olacak. Web sitenizin performansını öğrendiğiniz zaman öncelikle diğer sitelerin performansına göre karşılaştırma yapabilirsiniz. Onun dışında neyin ne kadar performansı etkilediğini görebilirsiniz. Performansınıza göre şekillendirmeler ve değerlendirmeler yapabilirsiniz. Yani kısaca sitenize olumlu olarak birçok geri dönüşü olacaktır.





Kötü performansı etkileyen birçok etken vardır. Büyük dosya boyutları etkileyen büyük etkenlerden bir tanesidir. Onun dışında kullanılan eski yazılımlarda performansı önemli ölçüde düşüren etkenlerdendir. Bunlar örneklerden sadece iki tanesiydi arkadaşlar web site performansını etkileyen çok sayıda etken vardır. Web sitenizin düşen performansı sitenin kullanılabilirliğini düşürmektedir. Kullanıcılar üzerinde de büyük etkileri vardır. Sizler de tahmin edebilirsiniz ki kullanıcılar daha kaliteli ve hızlı bir sitede gezinmek isterdi. Bizlerin amacıda sitelerdeki kullanıcıları her daim tatmin etmeliyiz ki sitelerimiz kullanıcılar tarafından değere binsin. Bu yüzden site performansına hakimiyetimiz çok önemlidir arkadaşlar. Şimdi ise konun detaylarına geçebiliriz..





Bahsedeceğimiz platformlar sayesinde site performanslarını ölçeceğiz hangi ögenin performansı ne kadar etkilediği, hangisinin ne kadar sürede yüklendiği konusunda bilgi sahibi olacağız. Örneğin testler sonucunda bir ögenin site hızını olumsuz etkilediğini yakaladığımız zaman onu düzeltecek veya site üzerinden kaldırıp başkası ile değiştireceğiz. Haliyle site performansımız daha da artacak. Örneğin satış yaptığınız bir site kullanıyoruz diyelim. Kullanıcılarımız sitemize girdi satın alacakları bir ürün bulunmakta ama bizim sitemiz bir türlü açılmamakta haliyle kullanıcılar sitemizi terk edeceklerdir. Araştırmalar sonucunda kullanıcıların yüzde kırkı üç saniyeden daha uzun yüklenme süresine sahip siteleri terk ettikleri gözlenmiştir. Üyeleriniz sitenizin performansını beğenmediği hızlı bağlanamadığı sürece sitenizden ürün satın alışları, geri dönüşümleri büyük oranda düşecektir. Olası tüm müşterileriniz sitenizde geri dönüşüm yerine sitenizi terk edecektir. Bu da hiçbir web site sahibinin istemeyeceği bir durumdur.





Site performansını sadece ilk açtığımız zamanda da test etmek yeterli değildir arkadaşlar zaman içerisinde sürekli eklemeler yaptığımız içerik yüklediğimiz sitemizde yüklenmelerde oluşacak ve birikmeler olacaktır, haliyle performans kaybına neden olabilir. Bu yüzden performans testlerimizi yalnızca ilk açılışta değil düzenli aralıklarla yapmalıyız.







Web Site Performansı İzleyebileceğiniz Platformlar




Arkadaşlar web site performansını izleyebileceğiniz birçok site bulunuyor. Fakat bunların hepsinden doğru etkiyi alamayabilirsiniz sizler için bu konuda bunların en iyilerine göz atacağız. Konu içerisinden paylaştığım veyahutta başka yerlerden ulaştığınız araçları da kullanarak site performansınızı teste tabi tutabilirsiniz. Burada önemli olan nereden yapıldığı değil testin nereden yapıldığı sadece test işleminin kolaylığını değiştirebilir. Bizim için burada önemli olan testlerin yapılması ve site performansının takip edilmesidir. O zaman ilk aracımız ile konumuza devam edelim.







1- Google PageSpeed Insights






I1B4pv.webp






Google PageSpeed Insights (PSI) ile sitenizini hem mobil hem de masaüstü olarak performansınız değerlendirmeye tabi tutabilirsiniz. Google PageSpeed Insights gerekli testlerini yaptıktan sonra çok fazla kaynaktan örnekler, alıntılar yaparak site performansı ve hızını arttıracak eksikliklere çözüm sağlayacak önerilerde bulunan bir araçtır.





Google PageSpeed Insights, rapor sonuçlarında iki ekran olarak rapor sonuçları verir. Mobil sekmesi, web sitenizin mobil cihazlar karşısında gösterdiği performans sonuçlarının bulunduğu bölümdür. Diğer bir bölüm ise masaüstü bölümüdür. Bu bölümde ise sitenizin masaüstü cihazlarda sergilediği performans sonuçları gösterilmektedir. Google PageSpeed Insights bu şekildeydi şimdi bir sonraki aracımıza geçelim







2- Pingdom






I12UIp.webp






Arkadaşlar sıradaki aracımız Pingdom. Pingdom, web sitenizin performansını ölçmek için kullanabileceğiniz en iyi araçlardandır. Pingdom diğer platformlara göre detaylı rapor sunmaktadır ve çözüm yolları konusunda kullanıcılarına yardım etmektedir. Bu sayede çözüm ararken çok zorlanmayız. Pingdom detaylı ve güzel açıklaması ve yardımlarının yanı sıra testlerinin yanında kimin nereden web sitenize giriş yaptığını hangi tarayıcılarını kullandığını da raporlamaktadır. Bu sayede performansın kimlerde nasıl olduğunu detaylı bir şekilde görebilirsiniz. Pingdom çok fazla güzel özelliği olmasına rağmen halen daha özellikleri bitmemiştir. Bir diğer özelliği ise, sitenizin çalışma süresini izlemektedir. Bunun ile ne yapabilirim gibi bir sorunuz olursa diye cevaplayacağım: Sitenizin çalışma süresi ile kullanılan sunucu ve uygulamaların da performansları takip edilebilmektedir.





Yukarıda sözünü ettiğimiz araç olan pingdom web geliştiricileri, web yöneticileri için uygun bir platformdur. Çok uygun bir maaliyet ile kullanabilirsiniz. Sunduklarını görebilmek için 14 günlük deneme sürümünü kullanmak için kayıt olabilirsiniz. Bizse sıradaki platformumuza geçelim :)







3- GTmetrix






I1Wjwc.webp






Diğer iki platformumuzu anlatırken Pingdom adlı platformun ne kadar ayrıntılı olduğundan bahsetmiştim. Eğer daha da ayrıntılı bir platform arıyorsanız bulabileceğimiz en ayrıntılı platformlardan bir tanesi olan GTmetrix adlı platform tam size göredir arkadaşlar. GTmetrix kullanmanın en büyük avantajı taramalarını çok farklı seçeneklerle yapmasıdır. Nedir bu çok farklı seçenekler derseniz; farklı ağlar, aygıtlar hatta ülkelerde testlerini gerçekleştirmesidir arkadaşlar. Tabi ki sadece bunlar da değildir. GTmetrix web sitenizi telefon tablet ekranı dahil olmak üzere birçok ekran üzerinden de web sitenizi test etmektedir. Pingdom adlı platformun aksine GTmetrix adlı platformu kullanmak tamamen ücretsizdir. Tercihinize göre eğer isterseniz pro versiyonuna da geçiş yapabilirsiniz. Peki ya bu pro sürümünde neler vardır neden geçiş yapılmalıdır sorusuna da şöyle cevap vereyim; saatlik izleme, kaynak kullanımı grafikleri ve raporunuz için çok sayıda filtre seçeneği GTmetrix adlı platformun pro versiyonunda biz kullanıcılarına sunulmaktadır.





Evet sözüne edeceğimiz araçlar bu kadardı arkadaşlar. Bu bölüme kadar okuyanlara şu sorumu yöneltmek isterim "sizce bu tanıtmış olduğumu üç adet platformdan hangisi daha avantajlı kullanışlı duruyordu?" görüşlerinizi yorum olarak belirtebilirsiniz. Umarım bahsettiğim araçları anlamışsınızdır. Şimdi ise araçlar ile teste tabi tuttuğumuz sitemizi daha hızlı hale getirebilmek için neler yapmalıyız, neler yapmamalıyız ve nelere dikkat etmeliyiz onlardan bahsedelim.





4- Uptrends






Iq7vjj.jpg






Arkadaşlar son platformumuzun adı Uptrends. Uptrends adlı platformun özellikleri hemen hemen bahsettiğim diğer platformlar ile aynı olduğu söylenebilir Uptrends adlı platformu diğer platformlarımızdan ayıran en büyük özellik taramalarımızda lokasyon seçeneği olmasıdır. Yani istediğim lokasyonu seçebilir ve lokasyona göre bir rapor hazırlamasını isteyebiliriz. Uptrends adlı platform raporların hem olumlu hem de olumsuz maddeleri, noktaları bizlere listelemektedir. Tarama ve testleri sonrasında eksik, hatalı bölümleri düzeltmek için önerilerde bulunur. İncelemeleri sonrasında web sitemizin hızlandırılması ve performansının artırılması konsunda bilgilendirmeler yapar.







5- KeyCDN Speed Test






Iqdl2s.jpg






Bir sonraki platformumuz ise KeyCDN Speed Test adlı platformdur arkadaşlar. KeyCDN Speed Test adlı platformun öne çıkan özellikleri çok ayrıntılı oluşudur. Bir diğer ve en güzel özelliği ise testlerin çok hızlı bir şekilde gerçekleştirmesidir arkadaşlar. Taramayı başlattığınız zaman sitenizi çok hızlı bir şekilde test edip sizlere sonuçlarını sunmaktadır. KeyCDN Speed Test adlı platformumuz 14 farklı lokasyona sahip ülkeden testlerini yapabilmektedir. Sizin için en uygun lokasyonu seçtikten sonra sizler de kendi web sitelerinizin testini KeyCDN Speed Test adlı platformdan yapabilirsiniz.



KeyCDN Speed Test adlı platformda testler sonucunda test sonuçlarında HTTP istek sayısı, yükleme süresi ve istenen sayfanın boyutu şeklinde test sonucu raporu sunulmaktadır. KeyCDN Speed Test adlı platformun cep telefonlarından dahi kullanılabilir olması da tercih edilebilirliği konusunda artı bir husus daha oluşturmaktadır.







Site hızını artırmak için nelere dikkat etmeliyiz?






Web sitemizin hızını ve performansını öğrendik. Hata ve yapılması gerekenleri öğrendik sırada ise bu geliştirmeleri yapmak için neler yapmamız gerektiğini öğrenmeye aşağıda temel başlıklar olarak nasıl performans ve hız artışı sağlayabileceğimize bakacağız.







Görsel dosyaları optimize etmek






Daha önce görsellerin SEO'ya uyumu için yapılması gerekenleri anlattığım bir konumda bahsettiğim gibi görsellerinizi web sitelerinize yüklemeden önce gerekli sıkıştırma işlemlerini yapmanız. Bunların etkisi hem SEO açısından hem de web sitenizin açılış hızını etkileyen en önemli konulardandır. Resimleri doğru formatlarda ayarladıktan ve sıkıştırma işlemlerini yaptıktan sonra web sitelerimize yüklüyoruz. Bu sayede web site açılış hızlarını olumsuz olarak etkilemeyecektir. Bir diğer husus ise görsel formatlarıdır arkadaşlar peki burada nelere dikkat etmeliyiz? Her görseli aynı dosya tipinde yüklememeliyiz. Eğer görsellerimiz arasında geometrik şekiller ve bu tarzda bir görsel ile uğraşmaktaysak ve bunu sitemize yükleyeceksek görsel formatını .svg olarak ayarlamamız gerekmektedir. .jpg formatını ise normal fotoğraflar ekran, görüntüleri gibi yerlerde kullanırız. Eğer kullandığını görsel bir fotoğraf ve ekran görüntüsü ise görsel formatı seçiminiz jpg formatında olmalıdır. Bir diğer görsel formatımızda png 'dir arkadaşlar. Peki ya png formatını hangi görsellerde tercih etmeliyiz derseniz. Png Formatı diğer görsel formatlar göre biraz daha bilindik olacağını düşünüyorum. Png formatı transparan görsellerde ya da kalitesi yüksek görsellerde kullanılır. Elimizde örneğin arka planı boş olan bir görsel bulunuyorsa görsel formatını ayarlarken png formatını seçmemiz en doğru tercih olacaktır. Bir diğer görsel optimizasyon önerim de görsel sayısını az tutmak ve görseller yerine css kullanmak olacaktır arkadaşlar. Bu söylediklerimi biraz daha açık bir şekilde anlatacak olursam, görsel sayısını az tutmalıyız arkadaşlar bunu zaten herkesin anlayacağını düşünüyorum ne kadar çok görsel bulunursa web sitemizin açılış hızı bir o hayli azalacak ve web site performansımız düşecektir arkadaşlar bu yüzden web sitelerinizdeki görsel sayılarını azami düzeyde tutunuz. Onun dışında görsel yerine css kullanın dedim bu nedir derseniz, arkadaşlar örneğin bir footer alanını siz resim olarak ekleyip onun üstüne şekillendiriyorsanız görsel yükleyeceğinizden yine açılış hızında ve web site performansında bir kayıp olacaktır. Onun yerine footer alanın arkaplanını çok basit bir şekilde kısa css kodları ile oluşturarak görsel sayısını azaltmış olursunuz ve görsel optimizasyonunu sağlamış olursunuz. Dolayısıyla web sitenizin açılış hızında yine bir artış olacaktır ve web sitenizin performansı olumlu yönde oldukça artacaktır. Arkadaşlar görsel dosyaları optimize etmek başlığı altına ele alacağım son madde de görsellerin ekran boyutlarına göre şekillendirmekle alakalı olacak yani responsive olmaları ile alakalı. Arkadaşlar hem SEO açısından hemde web sitenizin açılış hızı ve performanısını olumlu yönde etkilemek için olsun olumlu yönde arttıracak etkenlerden bir tanesi de görsellerimizin responsive olarak ayarlanması olacaktır. Responsive olan görsellerimiz sayesinde her ekran boyutunda sorunsuz bir şekilde görsellerimiz hızlı bir şekilde açılacaktır.







Kaynak dosyalarını optimize etmek






Görsel dosyalarını optimize etmek konusunda anlatımlarımız yaptığımıza göre sırada kaynak doya optimizasyonlarında arkadaşlar. İlk maddemiz ile başlayalım, bilirsiniz ki css ve javascript kodlarımızı yazabileceğimiz bir çok şekil vardır bunlardan herhangi birini seçmeniz çok fark etmez gibi gözükebilir ama sayfa açılış hızı optimizasyonu ve performans artışı elde etmek isteyen birisi için bunların yazılış yerinin önemi oldukça çoktur. Css ve javascript kodlarınızı ayrı yazdığınız zaman kullanıcıların web tarayıcıları bu dosyaları ve dosyalardaki kodları önbelleklemez ama biz bu dosyaların tamamını tek dosya içerisinde tutarsak açılışta kullanıcılarımızın web tarayıcıların bu dosya ve kodlar önbelleklenecektir bu da web sitelerinizin açılış hızı ve performansı gibi etkenlere olumlu yönde yükseliş sağlamaktadır. Aklınızda peki ya bu dosyalar ve kodlar önbelleklenmek için de zaten yüklenmiyor mu gibi bir soru takılmışsa onu da şu şekilde açıklayayım, ilk girişte web tarayıcıları tarafından görsel ve imaj dosyalarındaki kodlar önbelleklenmekte bu sayede bir sonraki girişte görsel ve imaj dosyalarındaki kodlar tekrardan yüklenmeyecektir diğer maddelerde olduğu gibi bizler de açılışı hızlanmış ve performansı artmış bir web sitesine sahip olacağız. Bir sonraki kaynak optimizasyonu maddemiz ise html kodlarını sıkıştırmak olacaktır. Html kodlarını Gzip biçiminde sıkıştıracağız bu sayede kodlarımız daha kısa olacaktır. Bu sayede verilerimiz boyutunda güzel bir azalma olacaktır. Bununla birlikte verilerin aktarım hızı dolayısıyla web sitelerimizin açılış hızları olumlu yönde artacaktır. Bir diğer ve en önemli kaynak optimizasyonu maddemiz ise Content Delivery Network adı verilen sunucu sistemini kullanmaktır. Web sitemize nasıl açılış hızı ve performans katkısı sağladığı konusunda bu maddeyi daha detaylı anlatacağım.







Content Delivery Network (CDN) Nedir?






IKo241.png






Content Delivery Network (CDN) yani Türkçe anlamı olarak içerik dağıtım anlamına gelmektedir. Content Delivery Network (CDN) nasıl çalışır, mantığı nedir? derseniz, Content Delivery Network (CDN) kullanıcıların web sitelerine giriş yapmak istedikleri zaman kendilerine en yakın olan serverdan bağlanmaktadırlar bu sayede açılış hızında ve performansta çok yüksek artış bulunmaktadır. Content Delivery Network (CDN) adı verilen bu sunucu sistemini kullandığımız zaman sitemizde bulunan görseller, videolar, kodları ve diğer tüm içerikleri bünyesinde barındırır optimize eder ve kullanıcılara bu dosyaları kendilerine en yakın olan serverdan en hızlı şekilde ulaştırır.





IKodOY.jpg






İçerik Dağıtım Ağı Nasıl Çalışır?






Genellikle bir web sitesi açtığımız zaman kullanıcılarımıza yayınlarımız web sitemizin bulunduğu ülkenin serverlarından yapılır arkadaşlar. Ama uluslar arası ziyaretçi alan bir web siteniz var ise Content Delivery Network yani içerik dağıtım sistemini kullanmanız gereklidir. Content Delivery Network sistemi kullandığınız zaman web sitenize diğer ülkelerden giriş yapan kullanıcılar olduğu zaman hız kaybı olmayacaktır. Kendilerine en yakın sunuculardan web sitelerine giriş yapacaklardır. Örneğin, Amerika 'dan yaşayan birisi sizin web sitenize giriş yapıyor ve siz Content Delivery Network içerik dağıtım sistemi kullanmıyorsunuz. Bu yüzden kullanıcı mecburen sizin kullandığınız server 'dan giriş yapacak yani Türkiye 'de bulunan bir sunucu haliyle hızında büyük oranda düşüş yaşayacaktır. Fakat sizler web siteleriniz de Content Delivery Network sistemi kullanırsanız kendilerine en yakın sunucu olan New Yorktan bağlanacaklardır. Bu sayede site açılış hızlarında hiçbir düşüş olmadan en hızlı şekilde siteye gireceklerdir.





IKEuUj.jpg






Content Delivery Network kullanıcılara dosyaları kendilerine en yakın olan lokasyon dan gönderir bu hem onların açılış hızlarını v web site performanslarını olumlu yönde etkiler hem de sizlerin ana sunucunuz olan Türkiye'deki sunucunuza yük binmesini ve yavaşlamasını önler. Maddelerimizde de bahsettiğimiz gibi web sitelerinizin açılış hızları hem kullanıcılar için dolayısıyla hem de SEO için önemli bir etkendir. Yavaş açılan bir web siteniz var ise bu hem kullanıcılarınız için hem de SEO açısından olumsuz bir dönüş ve etki yaratacaktır. Fakat web siteniz bunun aksine hızlı açılıyorsa yine kullanıcılarınız ve SEO açısından olumlu bir dönüş olacaktır. Web sitelerinizde Content Delivery Network kullandığınız zaman da bu artış yine sağlanacaktır.







HTTP isteklerini azaltmak






Detaylı bir açıklamanın ardından HTTP isteklerine geçebiliriz arkadaşlar. Http isteklerini azaltmak sayfa hızımızı ve performansını olumlu yönde etkileyen etkenlerden bir tanesidir. Bunlar arasındaki ilk madde ise gereksiz Http yönlendirmesi yapmamak arkadaşlar. Sürekli bir yerden diğer bir bölüme, o bölümden başka bölümlere şeklinde çok fazla yönlendirmeden kaçının yapılan fazla yönlendirmeler web sitenizin hızını ve performansını düşürecektir bunun önüne geçmek için gereksiz ve önemli olmayan yönlendirmelerden kaçınmalıyız. 404 durum kodunun ne kadar önemli olduğunu biliriz. Eğer 404 durum koduna sahip bir sayfanız bulunuyorsa onu 404 yönlendirmesi yapmak yerine 404 kodunu alan sayfayı düzenleyin ve bu sorunu çözmeye çalışın eğer olmuyorsa o sayfayı tamamen kaldırın. Ne kadar önemli olsa da 404 yönlendirmeleri de yönlendirme sayılacağından web site hızını ve performansını olumsuz etkileyen etkenlerden bir tanesi olabilir. Bu yüzden eğer 404 durum kodu alan sayfamız var ise bu sayfaya uygulayacağımız ilk çözüm yolu sorunu çözmeye yönelik olmalıdır. Eğer yaptığımız çalışmalar sonucunda sorun hala çözülmüyor ise sayfayı html kodlarımız arasından kaldırmalıyız ki gereksiz 404 durum yönlendirmesi yapılmasın arkadaşlar. Çoğu kişi web site kodlarını karışıklık olmaması adına her bölümün kodlarını farklı klasör ve dosyaların içine yaymakta bu aslında kodlama kısmında ne kadar güzel bir yöntem de olsa ne kadar karışıklığı azaltıyor olsa da kullanıcılar web sitelerinizi açmak istediklerinde tüm dosyalara istek gitmektedir. Bu durum yine web site hızını ve performansını olumsuz yönde etkileyebilir. Bunun çözümü içinse css ve javascript kodlarımızı olabildiğince tek dosya içerisinde tutmalıyız. Dosyalarımız ne kadar az olursa kodlarımız ne kadar az dosyalarda saklanırsa web sitemiz açılırken o kadar az istek gidecektir. Haliyle hız ve performansı da artacaktır. Web sitelerimizin hızını etkileyen maddelerden bir diğeri ise ikon ve logolar ile ilgili. Hepimiz web sitelerinde logolar ve ikonlar kullanırız bazı durumlarda bu ikon ve logolar birden fazla yerde kullanılır hatta bazen her sayfada var bile diyebiliriz. Bu logo ve ikonlar her ayrı sayfada defalarca yüklenmektedir. Haliyle sizinde anlayabileceğiniz gibi gereksiz istek gittiği için yine web sitemizin hızında ve performansında kayıplar olacaktır. Bunun önüne geçmek için birçok sayfada bulunan logo ve ikonların statik imaj dosyalarını CSS Sprite yöntemi ile kullanmalıyız. Bu sayede maddenin başında da dediğim gibi gereksiz istek gitmeyecek ve bu sayede web sitemizin açılış hızı düşmeyecektir. Maddeleri açıkladımıza göre şimdi de bilmeyenler adına Css Sprite yöntemini açıklayalım.







Css Sprite yöntemi nedir?






Arkadaşlar Css Sprite yöntemi web sitelerde kullanacağımız birçok görsel dosyasının sıralı bir şekilde tek bir dosyada bulunmasıdır. Örneğin bir web sitesi düşünelim. Bu web sitesinde varsayalım ki 30 adet görsel kullanılıyor. Eğer bizler bu 30 tane görseli tek tek kullanırsak web sitemizin her sayfasında yenilenişinde bu görsellere sürekli istekler gidecek ve hepsi tek tek yüklenecektir. Haliyle web site hızı ve performansı yine düşecektir. Ama biz bunları tek bir dosya içerisinde sıralı bir şekilde sıkıştırısak sadece bir görsel yüklenecek ve aslında tüm web sitesinin görselleri yüklenmiş olacaktır. Bu sayede her görsel tek tek istekte bulunmayacaktır. Tek tek istek gönderen görseller olmayınca web site hızımızda ve performansımızda olumsuz yönde etki olmayacaktır. Düşünsenize 30 adet dosyayı yüklemek yerine yalnızca 1 adet dosya yüklüyor ne kadar fark olacaktır.





Evet arkadaşlar etkisi büyük olan yöntemler olsa da genel olarak maddelerin etkileri küçük oranda artılardı. Aslında hepsi tek başına pek de fazla etki etmeyebilir ama hepsi birleştiği ve en doğru şekilde kullanıldığı zaman en iyi açılış hızlarını ve site performanslarını yakalayacaksınız.







Konu özeti, Sonuç






Arkadaşlar konu içeriğinden yeteri kadar anlattığımız maddeleri ve hususları tekrar etmek ve üzerinden geçmek isterim. Sizler için üç adet farklı özelliklere sahip ama temelinden birbirinden iyi web site performansını ve hızını test edebileceğiniz platformlardan bahsettik bunlardan ilki, Google PageSpeed Insights adlı platformdu. Masaüstü ve mobil olarak iki sekme şeklinde sonuçları bize sunmaktaydı. Kullanılabilir güzel platformlardan bir tanesi olarak değerlendirebiliriz. Hemen ardından bahsettiğimiz ikinzi platformumuz, Pingdom adlı platform idi. Pingdom'un yeterince detaylı olduğundan da bahsetmiştik, aramalarını ağ, cihaz hatta ülkeye kadar farklı farklı şekillerde test ediyordu. Uygun maaliyetli bir platform idi kullanıcıları için 14 günlük deneme süresi de vardı. Sizler de hemen kayıt olarak bu deneme süresini kullanabilirsiniz. Pingdomdan sonra daha da detaylı olan GTmetrix adlı platformu inceledik. Ücretsiz bir platform idi ama pro versiyonunu tercih edersek sayısız şekilde filtrelemeler ve düzenli olarak izleme gibi özellikleri ile daha da verimli bir platform oluyordu. Platformlarımızı inceledikten sonra hızı düşmüş veya daha da hızlandırmak istediğimiz web sitelerimiz için hızlandırma ve performans artışı için optimizasyonlardan bahsettik. Öncelikle görsel dosya optimizasyonundan bahsettik. Bilirsiniz ki görsel dosyalar sadece düz metinlerden daha çok boyuta sahiptirler ve açılış hızında büyük rol oynarlar. Dosya formatlarına ve görseller Css Sprite yöntemi ile tek dosya haline çevirmekten bahsettik. Bu da etkili bir yöntemdi. Düşünsenize 30 40 adet görseli tek görsele çeviriyor. Merak etmeyin görsellerde bir kayıp ya da eksi yön oluşturmuyor. Css Sprite yöntemi dedik ve bu yöntemi biraz daha detaylandırma gereği duydum bu konuyu biraz daha açtık ayrı başlık altında detaylıca inceledikten sonra o konuyu da kapattık. Daha sonrasında kaynak optimizasyonu konusuna değindik. Daha çok dosyaları ve kodları düzenlemeye yönelik oldu tek dosya içerisinde toparlamaktan söz ettik, bunlar önemli arkadaşlar. Tarayıcılarımız imaj ve görsel dosyalarını önbellekleyip her seferinde yeniden yüklememesi için hepsini tek dosyaya ayarlamamız en iyi şekilde yazmak olacaktır. Daha sonra bu başlık altında incelediğimiz en önemli madde olan Content Delivery Network yani içerik dağıtım sisteminden bahsettik. Kullanıcılarımıza en yakın serverdan yüklüyordu bu sayede mesafeden dolayı bir gecikme ya da performans düşüşü yaşanmamış oluyordu. Burada aslında daha fazla yapacağımız bir şey yoktu. Daha sonrasında Http isteklerini azaltmaktan bahsettik burada asıl olay neydi karmaşık yönlendirmelere sahip sayfalar içindi örneğin bir sayfanız çalışmıyor ve sayfada 404 durum yönlendirmesi bulunuyor bu yönlendirme yerine çözme şansımız var ise sayfadaki sorunu çözmek ya da sayfayı tamamen kaldırmak şeklinde bir çözüm bulmuştuk. Arkadaşlar benim konu sonrasında sizlere tavsiyem şu şekilde tanıttığım araçlardan herhangi birini veya diğer tüm farklı araçlardan bir tanesi seçmeniz ki burada önemli olan testin yapılmasıdır. Düzenli olarak taramalarınızı yapmanızdır. Sitenizin performansını ve açılış hızını artırma optimizasyonlarını da uygulmanız oldukça önemlidir





TRoCYy.png




Geri Dönüş ve Yanıtlarınız Bekliyorum. Benim için önemliler. :))






Konum bu kadardı arkadaşlar, bugün sizlere web siteleriniz hızını ölçebileceğiniz araçlar hakkında elimden geldiğince detaylı ve önemli bilgiler anlatmak istedim. Umarım hepinizin işine yarar ve konumu beğenmişsinizdir. Hepinize vaktinizi ayırdığınız, okumaya uygun görüp de okuduğunuz için teşekkür ediyorum. Saygılarla iyi forumlar.. :mml



giphy.gif






Elinize sağlık
 
Üst

Turkhackteam.org internet sitesi 5651 sayılı kanun’un 2. maddesinin 1. fıkrasının m) bendi ile aynı kanunun 5. maddesi kapsamında "Yer Sağlayıcı" konumundadır. İçerikler ön onay olmaksızın tamamen kullanıcılar tarafından oluşturulmaktadır. Turkhackteam.org; Yer sağlayıcı olarak, kullanıcılar tarafından oluşturulan içeriği ya da hukuka aykırı paylaşımı kontrol etmekle ya da araştırmakla yükümlü değildir. Türkhackteam saldırı timleri Türk sitelerine hiçbir zararlı faaliyette bulunmaz. Türkhackteam üyelerinin yaptığı bireysel hack faaliyetlerinden Türkhackteam sorumlu değildir. Sitelerinize Türkhackteam ismi kullanılarak hack faaliyetinde bulunulursa, site-sunucu erişim loglarından bu faaliyeti gerçekleştiren ip adresini tespit edip diğer kanıtlarla birlikte savcılığa suç duyurusunda bulununuz.