Kovboy Kodlamasını Durdur: WordPress temalarınızın ve eklentilerinizin kalitesini artırmak için 10 ipucu
Kısa bir süre önce, Tork, Themeforest temalarındaki kodun kalitesi hakkında şikayet eden bir yazı yayınladı. Sitenizde kullanmak için bir tema veya eklenti satın alan veya satın alan bir WordPress kullanıcısıysanız, kullandığınız temanın ve eklentinin iyi, güvenilir ve güvenli bir koda sahip olduğundan emin olacaksınız. Ancak bu sadece kullanıcılar için geçerli değildir. Bir WordPress geliştiricisiyseniz, bu kritere göre kendi temalarınızı ve eklentilerinizi de kodlamanız önemlidir. Bu, kendi sitenizi müşterilere sağladığınız hizmetleri daha güvenli, daha hızlı ve güvenilir hale getirecek ve geliştirme ekibinin bir parçası olarak çalışmanıza yardımcı olacaktır.
Bu yazıda, kendiniz, müşteri veya halka açık sürüm için bir kod oluştursanız da, kalite kodunu neyin oluşturduğunu göreceğim ve temanız ve eklentinizdeki kodunuzun kalitesini artırmak için bana en iyi 10 ipucunu vereceğim.
Kod “Kalite” yönleri, bazıları kodun çalışma şekli ve kullanıcının deneyimiyle kodla oluşturulan siteyi keşfetme ile ilgili olan, kaliteli olarak kabul edilebilecek birkaç ana kod özelliği vardır. Peki bu nedir?
Geçerli kod ve standarda göre.
WordPress kodlama standardıyla eşleşen kod.
Yapılması kolay korunabilen kod.
Ateş, fonksiyon, kanca ve WordPress sınıfının doğru kullanımı.
Erişilebilen ve yardımcı teknoloji kullanan ziyaretçilere veya duyusal bozukluklara karşı ayrımcılık yapmayan kodlar.
Uluslararasılaşma, böylece kendi diliniz dışında dil kullanan kullanıcılar temalarınız ve eklentilerinizle etkileşime girebilir. Gereksiz olmayan verimli kodlar.
Sizin veya başkalarının anlayabileceği ve daha sonra yapabileceğiniz mantıksal kodlar.
Onu çalıştıran sitenin performansını artıran kod.
Onu çalıştıran sitenin güvenliğini riske atmayan kod.
Burada her birinin ayrıntılı olarak ne anlama geldiğini kontrol edeceğim ve sonra kendi kodunuzun yüksek kalitede olduğundan emin olmak için size en iyi 10 ipucunu vereceğim.
Geçerli kodlar ve bir web tarayıcısında kullanılan her kodun ilk kural standartlarına göre, kodun standartla eşleşmesi gerektiğidir. W3C web standartlarına aşina değilseniz, yapın. Şimdi.
Kodunuzun, standartla eşleşen W3C kodunun doğrulayıcısına uygun olup olmadığını kontrol edip etmediğini kontrol edin, mobil cihazlar ve ekran okuyucuları da dahil olmak üzere modern tarayıcılarda atıfta bulunulan çalışacaktır. Bu, artık kullanılmayan veya çok deneysel olan (veya bunun yerine geçme sağlayan) işaretlemelerin kaldırılması, geçerli standartlar (HTML ve CSS içeren ancak PHP veya JavaScript olmayan) ile kaplı bir kod kullanacaktır. Standart kodun en önemli yönlerinden bazıları şunlardır:
Anlamsal kodu HTML5 kullanır (HTML5 kullanmadıysanız, bunun WordPress ile iyi çalıştığına dikkat edilmelidir).
İşaretlemenizi doğru şekilde düzenleyin, standarda göre bir belge ağacı kullanın ve ve öğelerini kullanın.
Mümkünse sınıf veya gereksiz kimlik kullanmaktan kaçının.
Sunumlar için HTML değil, CSS kullanın (Düzen için Tablolar Kullanma dahil).
İçeriğin bir parçası olan görüntülerin sağlanması HTML’de kodlanmış ve CSS çapraz -devies ve tarayıcı uyumluluğu içinde dekoratif olarak kodlanmıştır.
Doğru Başlık Öğesini Kullanma: Başlığı yanlış sıraya yerleştirerek SEO’nuzu geliştirmeye çalışmayın, çünkü müvekkilim denedi!
Kodunuza erişilebileceğinden emin olun: Daha sonra yayında bunun hakkında daha fazla bilgi.
Yeni HTML ve CSS özelliklerini deniyorsanız, bu, özellikle kendi projenizde bunu yapmanızı engellememelidir, ancak özelliğin sayfalar için önemli olmadığından ve bir geri dönüş sağladığınızdan emin olun. Ancak, kodunuz kamuya açıklanacak şekilde tasarlanmışsa, bunu kullanmamayı öneririm.
Kodunuzun doğrulanıp onaylanmadığını kontrol etmek için HTML ve CSS W3C Doğrulayıcı aracını kullanın. WordPress Kodlama Standartları W3C standartlarına ek olarak, WordPress, kodunuzun kaliteli olacak şekilde ayarlamanız gereken bir dizi kodlama standardı vardır. Bu, PHP, HTML, CSS ve JavaScript standartlarını içerir. PHP standartları şunları içerir:
El yazısı PHP etiketlerinin kullanımı (yani Yerine ).
Tek ve çift tırnak kullanımı.
Girinti ve diş telleri.
Koma sonrası boşlukları kullanın, ancak satırın sonunda silin.
Veritabanına erişmek için bir işlev kullanma.
Adlandırma kuralı.
Kod okunabilirliği.
WordPress kodlama standartları, kodunuzun kalitesini artırmanıza yardımcı olacaktır, kodunuzda hangi işlevleri, kancaları ve sınıfları ve hangilerinin modası geçmiş veya yanlış olduğunu bulmak için önemlidir.
Kullandığınız kodun doğru veya uygun olup olmadığından emin değilseniz, Codex’teki en son kodlama standartlarını kontrol edin. HTML standartları standart W3C yönlerini içerir: Kodunuz standarda uygunsa, kod HTML WordPress standardıyla eşleşmelidir. CSS WordPress Standartları şunları içerir: Yapı: Stil sayfanızı okumak.
Seçiciler: Gereksinimleri yerine getirmeyin (örneğin kullanma. Konteyner, div.container değil) ve alt satırlardan ve büyük harflerden kaçının.
Özellik: Benzer özellikleri birlikte gruplandırma.
Sözdizimi: Boşlukları, noktalı virgülleri ve virgülleri doğru kullanın.
Medya Sorguları: Stil sayfanızın altındaki eğrileri ve grup kullanın.
Son olarak, aşağıdakileri içeren JavaScript Standartları
Elementler ve argümanlar da dahil olmak üzere, okunması kolay olmak için boşlukları serbestçe kullanın.
Uzun nesne bildirimi birkaç satıra ayrılmalıdır.
Her zaman bir noktalı virgül kullanın.
Okumaları kolay olacak şekilde sıraların eğrilerini ve duraklamalarını kullanın.
Kıvırcık braketler ve satır duraklamaları, eğer, başka, için, blokları ve deneyin ile kullanın.
Değişkenleri bildirmek için VAR kullanın.
Nesne türünü doğru kontrol edin.
Birçok durumda anahtar ifadelerinden kaçınılmalıdır, ancak gerekirse doğru kodlanmıştır.
Dizileri, nesneleri ve yinelemeleri doğru kullanın.
İçinde yanlış eleman dizisi olan Yoda ifadesinden kaçının.
Kodlama standardının tanımlanması, WordPress için kalite kodunun yazmanın belkemiği olacaktır, ancak bu her şey değildir. Bunu, diğerlerinin yanı sıra işlevler, kancalar ve doğru WordPress sınıfları kullanarak artırmanız gerekir.
Kodunuzu WordPress kodlama standartlarıyla eşleşecek şekilde yazmanın yanı sıra işlevlerin, kancaların ve sınıfların doğru kullanımı, WordPress tarafından verilen araçları doğru bir şekilde kullanmanız gerekir. Örnek olarak:
WordPress Fire ile kendinize alışın ve kodunuzda alakalı kullanın
WordPress işlevi sizin için yaparken asla zor bir kod yapmayın. Bu, bağlantılar için işlevleri kullanmayı içerir. Artık kullanılmayan işlevleri kullanmayın. Şüphe varsa, kodeksini kontrol edin.
Kodunuzu yavaşlatacak Query_Posts () gibi işlevlerden kaçının.
Doğrudan çağrı yerine (örneğin wp_enqueue_script ()) işlevini kullanarak komut dosyasını ve literatürü doğru şekilde çağırın.
Eklentiye dahil olan ve gerektiren işlevi kullanarak dosyayı doğru arayın ve etiketi şablon dosyasına ekleyin.
Kodunuz mantıklı, geçerli ve iyi yapılandırılmışsa yönetilebilen kodlar (IE W3C ve WordPress kodlama standartlarını karşılıyor), korunmasını sağlayacaktır. Ama WordPress’te bundan daha fazlası var:
Temanızı doğru ve mantıksal olarak düzenleyin, yalnızca gerekirse ek bir şablon dosyası kullanın.
Loop.php gibi bir şablon bölümünü kullanarak tema şablonu dosyanızdaki yinelenen koddan kaçının.
Kullanıcıların temayı veya eklentiyi hacklemeden kodunuzu değiştirmesine veya değiştirmesine izin vermek için temanızda ve eklentinizde bir filtre kullanın.
Kullanıcıların temayı kesmek zorunda kalmadan ek içerik ekleyebilmeleri için temanızdaki kancaları kullanın.
Sunumlar için temaları ve işlevsellik için eklentiler kullandığınızdan emin olun – temanıza birçok işlev eklemek için cazibeden kaçının.
Web’nin dünya çapında mucidi Berners-Lee ekibi tarafından erişilebilecek kodlar erişilebilirliği güçlü bir şekilde vurgulamaktadır:
Web’in gücü evrenselliğinde yatıyor. Engelliliğe bakılmaksızın herkes tarafından erişim önemli bir hususdur. Erişilebilirlik, W3C standartlarının ana ilkelerinden biridir. Kodunuza erişilen teknolojiyi kullanan ziyaretçiler tarafından erişilemiyorsa, kod doğrulanmayacaktır.
Coolfields web sitesi, WordPress kodunuza nasıl erişilebileceğinizi daha iyi anlamak istiyorsanız WordPress erişilebilirliğini anlamanıza yardımcı olacaktır, daha sonra erişilebilirlik hakkında Codex sayfasını ve WordPress erişilebilirlik uzmanı Graham Armfield’ın Coolfields blogunu okumanızı öneririm. Web İçeriği Erişilebilirlik Yönergeleri (WCAG) hakkında kendinizi tanımalısınız. Temayı WordPress eklentisi deposuna gönderirseniz, erişilebilirlik için test edilecektir: temaya erişilemezse, depodan askıya alınacaktır. Temaya uygulanan kriterler iki başlık altındadır: zorunlu ve önerilir. Bu, tema ile aynı eklenti için geçerlidir ve eklentinize de koymanız gerekir.
Gereken kriterler şunları içerir:
Başlığın doğru kullanımı önce kullanılan H1 elemanını içerir.
Aria rolünün kullanımı. Bağlantıların Kodu Doğru Olun – Bağlantıda anlamlı olan metni kullanın (‘Buraya Tıklayın’) ve bağlantınızın başlığı içerdiğinden emin olun.
Kontrol için doğru öğeyi kullanın (düğme, giriş veya a).
Sadece bir fare değil, bir klavye ile navigasyona izin verin.
Tarzınızdaki kontrastın emin olun: arka plan ve ön arka plan birbiriyle karışmamalıdır.
Sayfaya girerken bir ‘İçeriğe Atla’ bağlantısı ekleyin.
Form için doğru işaretlemeyi kullanın ve her bir giriş öğesi için etiket öğesini kullandığınızdan emin olun.
CSS’deki dekoratif görüntü kodu HTML değildir ve her zaman işaretlemenizdeki görüntüler için Alt özniteliğini kullanın.
Videolar, ses veya kaydırma gibi ortamlar kullanıcı girişi olmadan otomatik olarak oynatılmamalıdır.
Önerilen kriter, büyütülmüş metni etkinleştirmek ve görünür olan başlık ve metin öznitelikleri için aynı metni kullanmaktan kaçınmaktır. Erişilebilirlik, uluslararasılaşma (veya i18n) gibi içselleştirme kapsayıcılıkla ilgilidir: uluslararası uluslararası tarafından, sizinle aynı dili konuşmayan kişilerin temalarınız ve eklentilerinizle etkileşimlerden hariç tutulmadığından emin olursunuz. I18N, temanız ve eklentinize kodlanmış herhangi bir metnin herhangi bir çevirisini etkinleştirmekle ilgilidir ve kullanıcı ile etkileşime girebilir. Bu, ayar ekranınızdaki tanımlayıcı metin, başlıklar ve başlıklar ve ayarlarınızdaki veya tema ayarındaki herhangi bir giriş veya öğe alanı içerecektir. W3C, uluslararasılaşma hakkında yönergeler sağlar. Kodunuz mantıklı, geçerli ve iyi yapılandırılmışsa (IE W3C ve WordPress kodlama standartlarını karşılıyorsa), korunmasını sağlar.
Codex, uluslararasılaşma hakkında bir dizi sayfa içerir ve bu eğitim bunu anlamanıza yardımcı olacaktır. Kodunuzun iki şekilde çalıştığı emin olmasına gerek olmayan şişkinlik olmadan verimli kod: İlk olarak, bu kodun sizin için, meslektaşlarınız ve kullanıcılarınız için kullanımı kolaylaştırır. Her ikisi de sitenin kodunuzu daha hızlı kullanmasını sağlayacaktır. Ne sevilmedi? İşte bazı ipuçları:
İhtiyacınız olanı elde ederken kodunuzun mümkün olduğunca hızlı olduğundan emin olun.
Kodun tekrarlanmasından kaçının: Dosyayı kullanın veya birçok konumda kullanabileceğiniz bir işlevi yazın veya yazın.
Kuru prensiplere bağlı kalacaklar (kendinizi tekrarlamayın).
İşlevleri, kancaları ve WordPress sınıfını doğru kullanın.
Aynı işi yapacak bir WordPress işlevi olduğunda asla kendi işlevlerinizi yazmayın. Mevcut işlevleri değiştirmeniz veya değiştirmeniz gerekiyorsa, yeni bir işlev yerine mümkünse bir filtre kullanmayı deneyin.
Temanızda, yalnızca ihtiyacınız olan şablon dosyasını kullanın.
Temanızın işlevselliğini koruyun – bunun yerine eklentiler kullanın.
Temaya veya eklentiye ek özellikler eklemeyi düşünürseniz, özellikle kullanıcı tarafından etkinleştirilebilir veya devre dışı bırakılabilir, yalnızca kullanıcı tarafından ihtiyaç duydukları takdirde etkinleştirilen ayrı bir eklentiye dahil edip etmeyeceğini düşünün.
Şüphe varsa, bırak! Diğer kişiler (kullanıcılar, istemciler veya meslektaşları) kodunuzla çalışacaksa veya sürekli olarak çalışacaksanız (ve bu beklemeseniz bile bu gerçekleşecek) kullanımı kolay olan mantıksal kod. Kodunuzu kolaylaştırmanız ve anlaşılmasını sağlamak önemlidir.
Size ve diğer kullanıcıların neler olduğunu anlamalarına yardımcı olmak için kodunuzda özgürce yorumlardan yararlanın.
Dahil dosyasını aradığınızda, kullanıcının ne aradığını ve nerede bulacağını bilmesi ve dosyanın kendisini içermesi için bir yorum ekleyin, hangi dosya kayıtlarının onu aradığını ekleyin.
Dosyalarınızı mantıksal olarak düzenleyin, stil sayfasını, komut dosyalarını ayırın ve eklentideki ayrı bir klasöre ekleyin.
Kodunuzu kolayca taramak için eğrileri ve boşlukları kullanın.
Kullanıcıya dosyada ne olduğunu anlatmak için dosyanın başlangıcına notlar ekleyin
Kodunuzu mantıksal olarak düzenleyin: Joy gibi grup ve eklentilerinizdeki ve temalarınızda kullanım sırasına göre blok kodu ekleyin.
Dosyadan yararlanın, ancak insanların kodlarını bulmadan önce dosya yapısında birkaç seviye kazmak zorunda kaldığınız için aşırıya kaçmayın. Kodunuz için belgeler verin.
Dokümantasyon çok önemlidir, bu yüzden kodunuzu halka açıklarsanız, belgeler çok önemlidir. Bu, tema ve eklenti deposu için bir gerekliliktir ve kodunuzun ne yaptığını, yapının nasıl olduğunu ve nasıl genişletileceğini açıklamalıdır. İnsanların kullanabilmesi ve kodunuzdaki işlevler ve dosya yapınız hakkında bilgi verebilmesi için eklentiniz veya temanızdaki kancaların eylemlerini ve filtrelerini belgeleyin.
Performans Geliştirme Kodu Performans Geliştirme Kodu: Kulağa oldukça etkileyici geliyor! Ne yazık ki daha hızlı çalışmanıza veya daha uzun süre yaşamanıza yardımcı olmayacak, ancak kodunuzu çalıştıran sitenin performansını artıracaktır. Eklentiyi kodlarsanız, bu performansı geliştirmek (eklentiniz performansı iyileştirmek için özel olarak tasarlanmıştır) ve her şeyi yavaşlatmamakla ilgili değildir. Temanız ayrıca performansı dikkate almalı ve temanızı çalıştıran sitedeki sayfaların mümkün olan en kısa sürede yüklenmesini sağlayacak şekilde kodlanmalıdır. Kodunuzun sayfayı yavaşlatmamasını nasıl sağlayabilirsiniz:
Tarayıcı dizisinin buna ihtiyacı olduğu için, sayfanın başında ve sonunda komut dosyasının stili çağırır.
Zor bir kod bağlantısı yapmayın: Bunun yerine doğru işlevi kullanın, bunlar doğru şekilde oluşturulur, yani aktarım veya hata olmadığı anlamına gelir.
Gerekmeyen komut dosyalarını ve stilleri aramaktan kaçının.
CSS kullanarak boyutunu değiştirmek yerine duyarlı bir sitede doğru boyutta görüntü çağırmak için PHP kullanın. Bunu yapmak için WordPress Media Boyut ayarlarını üstün resimlerle kullanabilirsiniz. WordPress’in yaptığı bir şey yapmak için asla yeni bir işlev yazmayın.
Birkaç kez onu aramaktan kaçınmak için senaryoyu doğru arayın.
Eklentide, birkaç kez dosyaları dahil etmekten veya gerektirdiğinden kaçınmak için gerekirse request_once () ve Insplage_once () kullanın.
Grafik efektleri için mümkünse görüntüler yerine CSS kullanın.
Ayar sayfanızdan veri depolamak ve veritabanını doğru kullanmak için yerinize dikkat edin.
Mümkünse üzerine yazılan kodu çalıştırmaktan kaçının.
Gerçekten önemli olmadıkça transferden kaçının.
Bu ipuçlarını ve WordPress kodlama standartlarını izlerseniz, kodunuz daha hızlı çalışırsa, WP_ENQUEUE_SCRIPT () işlevini kullanarak komut dosyasını doğru arayın, bu da çalıştıran site de daha hızlı olacaktır. Tumanmaktan da kaçındığınızdan emin olun, çünkü bu siteyi gereksiz yavaşlatabilir.
Son güvenli kod ancak daha az önemli olmayan, kodunuz güvenli bir doğada olmalı ve siteyi saldırılara karşı savunmasız hale getirmemelidir. WordPress Security ve WordPress Sertleştirme ile ilgili Codex sayfasında bu yazıda bunun hakkında daha fazla bilgi bulabilirsiniz, ancak burada bazı önemli ipuçları:
Diğerlerinin yanı sıra ESC_html () gibi işlevleri kullanarak ayar ekranınıza doğrulama ve veri girişi.
Bağlantıların yalnızca gerektiği gibi kullanılabilmesini sağlamak için Nones kullanın.
Kodunuzu izleyin ve kullanıcınız güvenlik sorunları bulursanız hızlı bir şekilde güncelleyin. Gerçekten gerekli olmadıkça eklentinizden dosyalara veya yönetmenlere yazmaktan kaçının ve gerekirse güvenli bir şekilde yaptığınızdan emin olun.
Üçüncü taraf kaynaklarından, özellikle de eklenti depolarında saklanan eklentiler için yasaklanmış kodlar çizmekten kaçının.
Devrilme kodundan kaçının.
İzinsiz kullanıcı verilerini toplamayın.
Kod kalitenizi geliştirmek için ipuçları Yukarıdaki başlık, WordPress kodunuzun kalitesini artırabileceğiniz ana alanın iyi bir resmini sunar, bu da iş hayatınızı kolaylaştırır, müşterilerinizi ve kullanıcılarınızı mutlu eder ve siteyi hızlandırır. Kodunuzu çalıştırır. Burada birçok talimat var, kodunuzun iyi kaliteye sahip olmasını istiyorsanız veya müşterilere gönderilmesini istiyorsanız her şey önemlidir. İşte, kodunuzun yüksek kalitede olduğundan emin olmak için en iyi 10 ipucum: Kodunuzun geçerli ve Standard’a göre olduğundan emin olun.
WordPress kodlama standartlarına göre.
Kodunuza erişilebileceğinden emin olun.
İşlevleri, kancaları ve WordPress sınıfını doğru kullanın, tema eklentisi için tasarlanmamış veya modası geçmiş olanlardan kaçının.
Dosyanız için mantıksal bir yapı kullanın ve yalnızca ihtiyacınız olan dosyayı kullanın, örneğin temanızdaki şablon dosyasını sınırlandırın.
Kuru prensiplere tutunacak, işlevleri kullanın, sınıfı kullanın ve kod çoğaltmasını önlemek için dosyaları ekleyin.
Kodunuzu uluslararası.
Çağırma Kaçının: Temanın işlevselliğini koruyun ve çoğu kullanıcının devre dışı bırakacağı özellikleri içermeyin. Kodunuzun mümkün olduğunca verimli olduğundan emin olun.
Kodunuzun güvenli olduğundan emin olun.
Başkalarının kodunuzu anlamalarına ve onunla çalışmasına yardımcı olmak için belgeler verin.
Bu ipucunu takip ederseniz, kullanımı kolay, hatalara veya performans sorunlarına neden olmayan ve diğer temalar ve eklentilerle çatışmayan yüksek kaliteli bir kod yazacaksınız.Etiket:
kodlamak
