Hızlandırılmış hücresel sayfalar: WordPress hücresel optimizasyonu için AMP
İnternette sörf yapmak ve keşfetmek hızlı ve kolay olmalıdır. Webmaster, web sitelerinin performansını optimize ederek ve site hızını artırarak gerçekleşmeye çalışır ve bunu başarmanın en iyi yolu WordPress için AMP iledir. Web siteleri esas olarak daha büyük ekranlar için tasarlanmıştır. Ancak daha küçük ekranlar sayıca artıyor ve hatta bir dizüstü bilgisayar ve kişisel bilgisayarları geride bırakıyor. Cep telefonları artık dijital medya zamanının% 65’ini temsil ediyor. El tipi cihaz, daha hızlı olmasa da, daha büyük bir ekranda olduğu kadar hızlı yüklenmesi için bir sayfa gerektirir. Hızlı bir şekilde yayınlanan talep taleplerini karşılamak için, belirli hücresel platformlar için tasarlanmış uygulamalar Apple (News), Facebook (Anında Makaleler) ve Snapchat (Find) ‘de mevcuttur. Bu senenin başlarında. Google, hücresel içeriğin teslimatını hızlandırmak ve daha iyi kullanıcı deneyimi sağlamak için Hızlandırılmış Mobil Sayfa (AMP) tanıtıyor.
AMP nedir?
Ağustos 2016’da Google Search, endeksinde 150 milyondan fazla AMP belgesi vardı ve haftada 4 milyonda büyüdü. Ağustos ayı başlarında Google, AMPED içeriği için Google arama önizlemesini de başlattı. Bu yılın ilerleyen saatlerinde daha geniş bir şekilde uygulanması bekleniyor. Arama önizlemesinde AMP AMP’nin burada etkinleştirdiği aramada hızlı bir sayfaya bakabilirsiniz. Cep telefonunuzdaki bir bağlantı kullanmaya bakın (masaüstünde çalışmıyor). Hangi web sitesi AMP kullanmalı? Şubat ayında bu proje yayıncılar için başladı. Ancak AMP’nin evlat edinilmesi, yayıncılık endüstrisinin çok ötesinde eğlence, seyahat, e -ticaret ve daha fazlasına yayıldı.
İlk evlat edinmeden karlı raporlar alınmaktadır. AMP belgeleri için açık sürede% 88 artışla Washington Post, cep telefonundan geri dönen kullanıcı sayısında% 23 oranında bir artış olduğunu bildirdi. Ebay, yaklaşık 15 milyon amp tabanlı ürün arama sayfası ile AMP’ye geçen büyük e -ticaret şirketlerinden biridir. Kısa sürede, bu sayfaların aramada bulunması beklenmektedir. Peki hangi web sitesi AMP kullanmalı? Elbette trafik için hücresellere çok bağımlı olanlar. Ancak, daha fazla kullanıcının WordPress (veya herhangi bir web sitesi) için interneti keşfetmek için mobil cihazlarını kullanmayı seçtiği düşünüldüğünde iyi bir ek olabilir.
AMP’deki fark nedir? Bu içerik dağıtım sistemi, HTML AMP çerçevesine dayanır ve sıradan HTML’den daha hızlıdır, çünkü
Bu, normal HTML çerçevesinin ince sürümüdür, eksi tüm JavaScript içeriğidir. JavaScript için çerçeve genel JS AMP kütüphanesine bağlıdır.
İçerik önbellektir ve genel bulutta saklanır, böylece sunucudan sorgulamak ve almak için gereken süre ortadan kaldırılır. Daha fazla farklılık vardır, ancak burada belirtilen ikisi size hızlı ve geniş bir anlayış vermelidir. Cep telefonlarında yavaşça yer alan sayfaları okurken yayıncılar ve bloglar neden AMP’yi etkinleştirmeli, kullanıcılar için hayal kırıklığı yaratan bir deneyim olmaya devam ediyor, yayıncılar cep telefonlarındaki reklamlardan gelir kaybediyor. AMP, ziyaretçilerin web sitesinde daha uzun süre getirilmesine ve korunmasına yardımcı olacak ve potansiyel olarak gelir elde eden tıklamalar üretecektir.
AMP sayfası, normal bir web sayfasından işaretlemek için yıldırım simgesinin yanında görünür. Bu seçeneği tıklayan izleyiciler doğrudan AMP sanatçısındaki AMP sayfasına götürülecektir. Yalnızca bu değil, içerik Google Search’te hemen kullanılabilir olacak ve Twitter, LinkedIn, WordPress, Parse.ly, Adobe Analytics, Nuzzel ve Pinterest gibi sosyal platformlardan erişilebilir. Buna ek olarak, yayıncılar sayfa performanslarının nasıl olduğunu gözlemlemek için Google Analytics’e erişebilir. En iyi içeriklerini seçebilir ve web sitelerinin performansını ve kullanıcı deneyimini optimize etmek için kullanabilirler.
AMP, yüksek performans ve kullanıcı deneyimi işlediği için başka avantajlar sunar, böylece kaynaklar harika içerik sağlamaya odaklanabilir. AMP AMP için gerekenleri optimize etmek aslında Google’ın gerektirdiği gibi tek tip bir şekilde yürütülen web sitesine çok fazla optimizasyondur. AMP’ye göre bir web sayfası yapmak için yapmanız gereken çeşitli optimizasyonlar,
Yalnızca JavaScript asenkronize izin verin – sayfanın oluşturulmasını geciktirmemek için. Bu, yaptığınız JavaScript’i kullanamayacağınız ve sayfa etkileşimli içeriğinizi işlemek için AMP öğelerine güvenmeniz gerektiği anlamına gelir. IFrame’deki JS’ye izin verilir, ancak yalnızca oluşturma işlemini engellemezse. Tüm kaynakların boyutu statik olarak – amp, görüntüler ve iframes gibi kaynakları beklemeden sayfalar içerir. Bu kaynağın boyutu HTTP’de ifade edilmelidir, böylece indirme başlamadan önce bu kaynağın boyutu ve konumu bilinir.
Uzatma mekanizmasının oluşturulmasına izin vermeyin – sayfaya dahil edilecek bir uzantı varsa, özel komut dosyaları sistemi bu konuda anlatmalıdır. Böylece, AMP neyin dahil edileceğini bilmeden önce bile alan uzatma için yapılır. LightBox, Instagram gömme ve tweet’ler için uzatma iyidir, çünkü ek HTTP istekleri gerektirse de, oluşturma sayfalarını engellemezler.
Kritik yoldan üçüncü tarafı JavaScript’i saklayın – özel JavaScript’e yalnızca kum kutusunda izin verilir. Bu şekilde yüklemenin ana sayfasını engellemez.
Tüm CSS sırada ve sınırlı boyutta olmalıdır – bu, kritik yoldaki HTTP isteklerinin sayısını azaltmaya yardımcı olur.
Yazı tipleri için tetikleyiciler verimli olmalıdır – AMP sistemi, HTTP’nin yazı tiplerinin indirilmesine izin vermez.
Boyutların yeniden hesaplanmasını en aza indirin – yeniden hesaplama gecikmelerini yeniden hesaplama, bu nedenle minimumda tutulmalıdır.
Sadece GPU’yu destekleyen animasyonları çalıştırın – tüm animasyonlar GPU’da (grafik işleme birimi) çalışabilmelidir.
Kaynakların yüklenmesine öncelik verin – yalnızca ilk olarak gereken içerik, reklamlar ve resimler mümkün olan en kısa sürede alınır, ancak yalnızca gerektiğinde yüklenir. Bu şekilde CPU’daki istek minimum tutulur. Bir anında oluşturma işlemindeki sayfalar birçok bant genişliği ve CPU’lar harcar. Önceden oluşturma AMP yalnızca önce gereken içeriği içerir ve üçüncü taraf IFRames’i ve diğer kaynakları yalnızca gerekirse indirir.
Çeşitli reklam formatları, reklam ağları ve standart teknoloji mevcut olacaktır. Aynı zamanda yayıncı, hızı engellemediği sürece kendi formatlarını da seçebilir.
WordPress Google için AMP nasıl eklenir. Temel bir HTML AMP sayfası oluşturmaya, derlemeye, AMP’ye uygun olarak doğrulama, yayınlama ve dağıtma başvurabileceğiniz bir öğreticiye sahiptir. AMP sayfasının doğrulanması önemlidir, çünkü Twitter ve Instagram gibi üçüncü taraflar sayfanın platformlarında iyi görüntüleneceğine inanmaktadır. Web siteleri WordPress.com’da yayınlandığı sürece, başka bir şey yapmak zorunda kalmadan WordPress için otomatik olarak desteklenir. Kendiniz tarafından gönderilen WordPress web sitesi, eklentiler yükleyerek WordPress için AMP’yi etkinleştirebilir.
AMP WordPress eklentisi Automattic
WordPress sitesindeki AMP eklentisini indirdikten, yükledikten ve etkinleştirdikten sonra, yayınınız otomatik olarak üretilen AMP’nin dinamik bir sürümü olacaktır. URL’nizin sonuna AMP ekleyerek bu sayfaya erişebilirsiniz (örneğin.com/my-post/amp). Güzel kalıcı bağlantıyı etkinleştirmezseniz, bağlantıya? Amp = 1 ekleyin (örneğin.com/?p=100&=1 gibi görünecektir). Diğer tek adım, sayfalarınızı yukarıda belirtildiği gibi test etmek ve doğrulamaktır. Bu eklenti için ayarları veya özellikleri hiç görmeyeceksiniz. AMP Analytics için kendi JSON yapılandırma kodunuzu ekleyebileceğiniz ek bir gösterge tablosu seçeneği vardır, ancak hepsi budur. Bu eklenti, Automattic Stable’ın resmi eklentisidir ve şu anda sayfaları ve arşivleri desteklemez, sayfayı da ayarlayamazsınız. Ancak bu çok basit ve kullanımı kolay bir seçenektir ve GitHub’daki ayarlama için bazı yönergeler bulabilirsiniz. WP için AMP – Hızlandırılmış Mobil Sayfa
Bir başka harika ücretsiz seçenek WP için AMP’dir. Bu ücretsiz WordPress eklentisi hızlı ve kolay hazırlık sunar – sadece ayarları yükleyin, etkinleştirin ve web siteniz için otomatik olarak AMP yapmaya başlayın. Bonuslar – Bu eklenti de birçok siteyle uyumludur.
AMP’yi etkinleştirmek için doğuştan gelen ayarlar (direkler, sayfalar, arşivler), hücresel reklam alanları ekleyin, yapılandırılmış veriler (SEO’nun önemli kısımları), SEO yoast meta etiketlerinin entegrasyonu, dizin seçenekleri/gelişmiş dizin olmadan, push bildirimi, orijinal amper yorumları, AMP Çeviri Özel (İngilizce dışında dil kullanıyorsanız, bunu güncellemelisiniz) ve daha fazlası. Ayarlar olağanüstü ücretsiz eklentiler için çok kapsamlıdır. En iyisi, bu eklenti bir tasarım seçeneği sunar, böylece AMP çıkışınızın görünümünü ve hissini ayarlayabilirsiniz. Dahil edilen varsayılan AMP temasını kullanın veya kendi benzersiz tasarımınızı oluşturmak için AMP tema çerçevesini kullanın. WP için AMP ayrıca özellikler eklemek için birinci sınıf bir uzatma (AMP oyunculuk davetiyesi veya önbellekleme amfi gibi) ve WooCommerce, gelişmiş özel alanlar ve iletişim formları 7 dahil popüler eklentiler için destek sunar. WordPress web sitenize AMP eklemenin tek yolu değildir. WordPress siteleri için AMP ile size yardımcı olabilecek diğer eklentiler şunları içerir: WP AMP – Kodlama yapmadan özel bir AMP tasarımı oluşturmak ve SEO’yu artırmak.
WordPress için Hızlandırılmış Mobil Sayfalar (AMP) – Web siteniz için AMP temaları oluşturmak için.
Facebook Anlık Makaleler ve Google AMP Sayfası – İçeriğinizi doğrudan WordPress’ten Google AMP sayfasına reklam ve analitik desteği ile yayınlamak ve yönetmek için. Yoast SEO & AMP için yapıştırıcı – Varsayılan WordPress AMP eklentisinin doğru Yoast SEO meta verilerini kullandığından ve AMP sayfası tasarımının değiştirilmesine izin vermesini sağlamak için.