“Sabır bir erdemdir” atasözü online dünyada geçerli değildir. Bir saniyelik gecikme bile, sayfa görüntülemelerini, müşteri memnuniyetini ve dönüşüm oranlarını önemli ölçüde azaltabilir. Sitenizin hızı, organik arama sıralamanızı da etkiler. Google, 2010’dan bu yana, algoritmasında site hızını önemsemektedir. Peki sayfa hızınıza katkıda bulunan en büyük faktör nedir? Sayfa Boyutu Sayfanızı oluşturan kodu indirmek, tarayıcıların zamanını alır. HTML'nizi, stil sayfalarınızı, komut dosyalarınızı ve resimlerinizi indirmek gerekir. Tüm bu verileri indirmek biraz zaman alabilir. Web kullanıcıları daha ilgi çekici site tasarımları bekledikçe, bir sitenin kaynak dosyalarının boyutu büyümeye devam edecektir. Her yeni özellik, sitenizi biraz daha aşağıya çeken yeni bir komut dosyası veya stil sayfası gerektirir. Sitenizin nasıl hızlandırabilirsiniz? Sitenizin hızını analiz etmek için bazı harika kaynaklar var. Google'ın PageSpeed Insights, Website Grader ve GTMetrix en popüler olanlarıdır. Her iki hizmet de sitenizi analiz eder ve size geride kaldığınız yeri söyler. Küçük bir uyarı: sonuçlar bazen biraz göz korkutucu olabilir, ancak çoğu düzeltmeler nispeten hızlı ve kolaydır. Hız servisinin önerdiği her şeyi düzeltemeyebilirsiniz, ancak siteyi ziyaretçileriniz için daha iyi hale getirmek için yeterince düzeltmeniz gerekir. Hadi sitemizi hızlandırmayı öğrenelim! Birkaç modern içerik yönetim sistemi hız arttırıcı seçenekler uygularken, Wordpress ve Joomla gibi daha yaygın sistemler hız için biraz el emeği gerektirir. Şimdi, her web yöneticisinin dikkate alması gereken bazı temel hız çözümlerine bakalım. 1. Görüntüleri Optimize Edin Görüntüler, web'deki en yaygın bant genişliği duraklarından biridir. Görüntülerinizi optimize etmenin ilk yolu, bunları uygun şekilde ölçeklendirmektir. Birçok web yöneticisi büyük resimler kullanır ve ardından bunları CSS ile ölçeklendirir. Fark etmedikleri, tarayıcınızın onları tam görüntü boyutunda yüklemesidir. Örneğin, 1000 x 1000 piksel boyutunda bir resminiz varsa, ancak 100 x 100 piksele düşürdüğünüzde, tarayıcınızın gerektiğinden on kat daha fazla yükleme yapmasını engelleyebilirsiniz. Görüntülerinizi sitenize yüklemeden önce ölçeklendirin, böylece ziyaretçilerinizden daha fazlasını indirmelerini istemezsiniz. Görüntülerinizi optimize etmenin ikinci yolu onları sıkıştırmaktır. Kaliteyi kaybetmeden görüntü boyutlarınızı önemli ölçüde azaltabilen, tinypng.com gibi görüntü sıkıştırma için birkaç ücretsiz çevrimiçi araç vardır. Boyutu %25 ila %80 arasında bir azalma görebilirsiniz! 2. Tarayıcı Önbelleğe Alma Ziyaretçiler, bir sayfayı her yüklediklerinde neden aynı şeyleri indiriyor? Tarayıcı önbelleğe almayı etkinleştirmek, bir ziyaretçinin bilgisayarında bazı verileri geçici olarak saklamanıza olanak tanır, böylece sayfanızı her ziyaret ettiklerinde yüklenmesini beklemek zorunda kalmazlar. Verileri ne kadar süre depoladığınız, tarayıcı yapılandırmasına ve sunucu tarafındaki önbellek ayarlarına bağlıdır. Sunucunuzda tarayıcı önbelleği ayarlamak için aşağıdaki kaynaklara bakın veya hosting şirketinize başvurun: Apache Caching IIS Caching Nginx Caching 3. Sıkıştırma Sıkıştırmayı etkinleştirmek, web sitenizi bir zip dosyası haline getirmek gibidir. Sıkıştırma sayfanızın boyutunu önemli ölçüde azaltabilir ve böylece hızını artırabilir. Varvy'e göre, sıkıştırma HTML ve CSS dosyalarınızdan %50 - 70'i kesebilir! Bu, ziyaretçinin indirmesi gerekmeyen bir ton veri. Sıkıştırma bir sunucu ayarıdır, bu yüzden nasıl uyguladığınız web sunucunuza ve ayarlarına bağlıdır. Aşağıda en yaygın web sunucuları için bazı kaynaklar bulunmaktadır. Sizinkini göremiyorsanız, neler yapabileceğini görmek için hosting şirketinize başvurun. Apache IIS Nginx 4. CSS'nizi Optimize Edin Kullanıcılar sitenizi görmeden önce CSS'niz yüklenir. CSS'nizi indirmeleri ne kadar uzun sürerse, o kadar çok beklerler. Optimize edilmiş CSS, dosyalarınızın daha hızlı indirileceği ve ziyaretçilerinizin sayfalarınıza daha hızlı erişebildiği anlamına gelir. Kendinize sorarak başlayın, "Tüm CSS içeriği gerekli mi?" Değilse, dosyalarınızdaki gereksiz koddan kurtulun. Web sitenizin salyangoz hızı, sizi ziyaretçilerinizden uzaklaştırır. Ardından, CSS dosyalarınızı en aza indirmelisiniz. Stil sayfalarınızdaki ekstra alanlar dosya boyutunu artırır. CSS minimizasyonu, dosyanızın en küçük boyutta olduğundan emin olmak için bu fazladan boşlukları kodunuzdan kaldırır. Peki, CSS dosyalarınızı nasıl optimize edebilirsiniz? İlk olarak, CMS'inizin CSS'nizi optimize edip etmediğine veya bunun için bir seçenek olup olmadığına bakın. Örneğin, CSS dosyası Wordpress veya Joomla'da otomatik optimize edilmez. CMS'niz CSS seçeneğini optimize etmiyorsa, dosyalarınızı optimize etmek için CSS Minifier gibi ücretsiz bir çevrimiçi hizmet kullanabilirsiniz. Sadece CSS'nize yapıştırın ve yeni optimize edilmiş stil sayfanızı görmek için “Sıkıştır” a basın. Kaynak dosyalarınızı en aza indirgemek, dosyalarınızı bir miktar küçültmenin harika bir yoludur. 5. Komut Dosyalarınızı Sayfanın Altında Tutun Javascript dosyaları sayfanızın geri kalanından sonra yüklenebilir, ancak bunların hepsini içeriğinizden önce yerleştirdiğinizde (çoğu site gibi) içeriğiniz yüklenmeden önce yüklenir. Bu, ziyaretçilerinizin, Javascript dosyalarınızın sayfanızı görmeden önce yüklenmesini beklemesi gerektiği ve beklemekten ne kadar hoşlanmadıklarını bildiğimiz anlamına gelir. En basit çözüm, harici Javascript dosyalarınızı, sayfanızın alt kısmına, body etiketinizin kapanmasından hemen önce yerleştirmektir. Artık sitenizin geri kalanı, komut dosyalarınızdan önce yüklenebilir. Daha fazla kontrole izin veren bir başka yöntem de sitenize harici .js dosyaları yerleştirilirken erteleme veya async özelliklerinin kullanılmasıdır. Hem defer hem de async çok yararlıdır, ancak bunları kullanmadan önce farkı anladığınızdan emin olun: Async etiketleri sayfanın geri kalanı yüklenirken betikleri yükler, ancak bu komutların sırayla yüklenebileceği anlamına gelir. Temel olarak, daha önce açılmış dosyalar yüklenir. Bu, bazı komut dosyaları için iyi olabilir, ancak diğerleri için felaket olabilir. Defer özniteliği, içerikler yüklemeyi bitirdikten sonra komut dosyalarınızı yükler. Ayrıca komut dosyalarını sırayla çalıştırır. Sadece komut dosyalarınızın sitenizi bozmadan geç kalmasını sağlayın. Tek yapmanız gereken script etiketlerinize basit bir kelime eklemek. Örneğin, orijinal kodunuz bu olsun; Ve istediğiniz zaman yüklendiğinden emin olmak için buna küçük bir kod ekleyin. Komut dosyalarınızın önemi, bir özellik alıp almadığınıza ve hangisinin size ait olduğunu belirler. Daha önemli komut dosyalarının, async özelliğine sahip olması gerekir. Böylece, içeriğinizin geri kalanı yüklenmeden önce yükleyebilirler. Ancak, önemli olmayanlar, ziyaretçilerin sayfanızı daha hızlı görmesini sağlamak için sonuna kadar beklemelidir. Ancak her zaman, özniteliğin sitenizi bozmadığından emin olmak için her bir komut dosyasını test ettiğinizden emin olun! Sonuç Çevrimiçi kullanıcılar daha zengin bir çevrimiçi deneyim istedikçe, sayfalarımızın büyüklüğü artmaya devam edecektir. Sitelerimizi düşürmek için flashier Javascript, daha fazla CSS hilesi ve daha fazla üçüncü taraf gerekli olacak. Çok az bir ilgi uzun bir yol kat edecektir - unutmayın, bir saniyelik gecikme çok şey kaybetmek için gereken her şeydir. script etiketlerinize basit bir kelime eklemek. Örneğin, orijinal senaryonuzu alabilirsin Ve istediğinizde yüklendiğinden emin olmak için küçük kodu ekleyin. Komut dosyalarınızın önemi, bir özellik alıp almadığınıza ve hangisinin size ait olduğunu belirler. Daha önemli komut dosyalarının, async özelliğine sahip olması gerekir. Böylece, içeriğinizin geri kalanı tutmadan ASAP yükleyebilirler. Ancak, önemli olmayanlar, ziyaretçilerin sayfanızı daha hızlı görmesini sağlamak için sonuna kadar beklemelidir. Ancak her zaman, özniteliğin sitenizi kırmadığından emin olmak için her bir komut dosyasını test ettiğinizden emin olun! Sonuç Çevrimiçi kullanıcılar daha zengin bir çevrimiçi deneyim istedikçe, sayfalarımızın büyüklüğü büyümeye devam edecektir. Sitelerimizi düşürmek için flashier Javascript, daha fazla CSS hilesi ve daha fazla üçüncü taraf analitik olacak. Pazarlamacılar olarak, bunun bizi rahatsız etmesine izin veremeyiz. Çok az bir ilgi uzun bir yol kat edecektir - unutmayın, bir saniyelik gecikme bir kurşun kaybetmek için gereken her şeydir. script etiketlerinize basit bir kelime eklemek. Örneğin, orijinal senaryonuzu alabilirsin Ve istediğinizde yüklendiğinden emin olmak için küçük kodu ekleyin. Komut dosyalarınızın önemi, bir özellik alıp almadığınıza ve hangisinin size ait olduğunu belirler. Daha önemli komut dosyalarının, async özelliğine sahip olması gerekir. Böylece, içeriğinizin geri kalanı tutmadan ASAP yükleyebilirler. Ancak, önemli olmayanlar, ziyaretçilerin sayfanızı daha hızlı görmesini sağlamak için sonuna kadar beklemelidir. Ancak her zaman, özniteliğin sitenizi kırmadığından emin olmak için her bir komut dosyasını test ettiğinizden emin olun! Sonuç Çevrimiçi kullanıcılar daha zengin bir çevrimiçi deneyim istedikçe, sayfalarımızın büyüklüğü büyümeye devam edecektir. Sitelerimizi düşürmek için flashier Javascript, daha fazla CSS hilesi ve daha fazla üçüncü taraf analitik olacak. Pazarlamacılar olarak, bunun bizi rahatsız etmesine izin veremeyiz. Çok az bir ilgi uzun bir yol kat edecektir - unutmayın, bir saniyelik gecikme bir kurşun kaybetmek için gereken her şeydir.
