Menü

Site Açılma Süresini Kısaltmak

Bir sitenin açılma süresi, siteye erişimi sağlayan en önemli etkenlerden biridir. Keza birçadequate iternet kullanıcısı birkaç saniyede göremedikleri siteleri girmekten vazgeçer. Bu yüzden basit, bir o kadar da faydalı birkaç konudan bahsetmek istiyorum.

Öncelikle bir web page yapımcısı olarak, sitenizin açılma süresini çeşitli web taraycılarında görmek için WebWait sitesini kullanabilirsiniz. Bu sayede bir ziyaretçinizin sitenize girmek için beklediği süreyi görebilirsiniz. Ayrıca siteniz hakkında biraz daha kapsamlı bilgi almak için website online Optimization‘ın internet page Analyzer servisini kullanarak sitenizin kod yapısını, belge boyutlarını, resim sayılarını ve siteniz hakkında birçok bilgiyi öğrenebilirsiniz.

Birçgood enough tasarımcı, website online tasarımının görsel bölümünde Photoshop gibi komplike çizim programlarını kullanır. Oluşturulan resimlerin internete uygunluğu için dosyaların formatlarında çevrilme yapılmalıdır. on-line bir çevrim için örneğin Dynamic power‘ın şuradaki bölümünden faydalanabilirsiniz. Yeri gelmişken resim dosyalarının formatlarından da biraz söz edebiliriz. Kullanacağınız resim dosyalarının formatları JPEG, GIF veya PNG olmalıdır. JPEG (Joint Photographic experts workforce) layoutı birçgood enough rengi desteklediği ve okayüçük boyutta olduğu için fotoğraflarınız için uygundur. GIF (images Interchange format) structureı maksimum 256 rengi desteklemektedir. Bu yüzden biraz daha basit resimler, logolar, text karakterli resimler için kullanılmalıdır. PNG (transportable community images) ise GIF’in aksine 24-bit rengi desteklemektedir. Hemen hemen her resim dosyanız için kullanabileceğiniz bir formattır.

Günümüzde birçadequate web page css kodlamasını kullanmaktadır. Sitenin her sayfasında ayrı ayrı tablo oluşturmak, kod yazmak yerine css ile pratik bir şekilde bütün ayarlar yapılmatadır. Sitenizde kullandığınız css kodlarında olabilecek bir hata da sitenizin açılma süresini etkileyecektir. Bu yüzden clean CSS sitesini kullanarak hem hataları denetleyebilir, hem de mümkün olduğu ölçüde okısaltmalar yapabilirsiniz. Ayrıca bazı okayısaltmaları siz de yapabilirsiniz. Örneğin;

margin-top: 10px;
margin-right: 20px;
margin-bottom: 10px;
margin-left: 20px;

şeklindeki bir kodlama yerine

margin: 10px 20px 10px 20px;

şeklinde kodlama biçimi tercih edilmelidir. Bu sayede css dosyanızın boyurundan tasarruf eder, her bir kodun tarayıcı tarafından algılanma süresini kısaltırsınız.

Sitenizden sayfalarınıza verdiğiniz linklere “/” (curb) eklemek az da olsa açılma sürenizi okayısaltmaya yardımcı olacaktır. Çünkü örneğin “www.siteniz.com/sayfa” şeklindeki bir adres tarayıcı tarafından okısa sürede kestirilemez. Ancak “www.siteniz.com/sayfa/” şeklindeki bir adresin sonundaki bölüm tarayıcı tarafından html olarak algılanır ve dediğim gibi sayfanın açılma süresi az da olsa okısalır.

Sitenize eklediğiniz resimlerin yükseklik (height) ve genişlik(width) değerlerini girmeyi unutmayın. Çünkü bir internet görüntüleyicisi bir sayfadaki resmin -eğer değerleri yazılmamış ise- ne boyutta olduğu hemen algılayamaz. Öncelikle resmi açmaya, daha sonra resimden sonraki bölümleri göstermeye çalışır. Hatta zaman zaman siz de bazı sitelerde resim açıldıktan sonra diğer bölümlerin resmin boyutu kadar alta kaydığını görmüşsünüzdür. Dolayısıyla img identity="resim" top="200" width="450" şeklinde bir tanımlama yaptıkran sonra src="http://www.siteniz.com/resim.png" alt="resim adı" şeklindeki resim kodunuzu yazarak internet tarayıcısının resim boyutlarını önceden algılamasını ve resme gerektiği alanı bırakmasını sağlayabilirsiniz.

Son olarak sitenizin kod yapısını oluşturan dosyaların sayısını birleştirerek azaltabilirsiniz. Bir kullanıcı sitenize girdiği zaman sunucunuzdaki -o an sitenizin açılması için gereken- her dosya web görüntüleyecisi tarafından kullanılır. Tarayıcının yükünü hafiflerek açılma süresini okayısaltabilirsiniz. Pek görülmese de

<link rel="stylesheet" sort="textual content/css" href="/physique.css" />
<link rel="stylesheet" type="textual content/css" href="/facet.css" />
<link rel="stylesheet" sort="textual content/css" href="/footer.css" />

şeklinde kod dosyalarınız alabilir. Görüldüğü gibi her bölüm için ayrı bir doya oluşturmak yerine, her bölümün özelliğini

 

<hyperlink rel="stylesheet" type="text/css" href="/type.css" />

şeklindeki bir dosyada toplayabilir ve kodu da ona göre yazabilirsiniz.

Buradaki bilgiler elbette muazzam sonuçlar doğurmayacaktır. Ancak saniyeler ile ölçülen açılma sürelerinde biranlıokay farklar ziyaretçilerinizin sitenizden faydalanma oranını yükseltecektir.

Bir yanıt yazın

E-posta adresiniz yayınlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir

This site uses Akismet to reduce spam. Learn how your comment data is processed.