SEO açısından, siparişin önemli olmadığı doğru olsa da, güvenlik, içerik (karakter) ekranı veya yükleme hızı gibi diğer şeyleri düşünürken doğru değildir. Sayfanızın kafasını kabaca sipariş etmek iyi bir fikirdir (sözdizimi için HTML5 olduğunu varsayarak):
<head>
Belgede şimdiye kadar ASCII olmayan karakterler kullanmamalısınız, bu nedenle karakter kodlaması henüz bir sorun değildir. Ancak, bu kafa etiketini açtığınızda ASCII olmayan karakterler kullanma olasılığı belirgin şekilde artar. Buna göre (ve karakter kodlamanızı programlı olarak veya sunucu düzeyinde bildirmediğinizi varsayarsak), bir sonraki ifadeyi karakter kodlama bildiriminiz olarak yapmanız gerekir. Bu ayrıca, karakter kodlama ifadeleri için koklama yapacak ayrıştırıcıları / tarayıcıları / aracıları da tatmin eder:
<meta charset="utf-8">
Aşağıdaki iki ( X-UA-Compatible
ve viewport
) Bootstrap'taki kişiler tarafından önerilir (v3.3.4 kadar yakın zamanda). Bu önerilerin performansa dayalı olduğu konusunda hemen hemen pozitif olsam da, söyleyeceğim şeylerin çoğu spekülatif olacaktır:
<meta http-equiv="X-UA-Compatible" content="IE=edge">
Cihazdan bağımsız tasarım / geliştirme (daha küçük, masaüstü olmayan kullanıcı aracıları dahil) hakkında düşünüyorsanız, aşağıdakileri eklemeniz gerekir:
<meta name="viewport" content="width=device-width, initial-scale=1">
Son olarak, başlık:
<title>Ingenious Page Title</title>
Ardından, CSS'yi başlıktan mümkün olan en kısa sürede sunarsınız (aralarında 'gün ışığı' olmaz):
<link rel="stylesheet" href="stylesheet-1.css">
<link rel="stylesheet" href="stylesheet-2.css">
Sayfa düzeyinde stiller kullanıyorsanız, buraya giderler. Bu büyük ölçüde CSS'nin 'basamaklı' doğasından kaynaklanmaktadır: yani aynı özgüllük düzeylerinin (bir paragrafı hedefleyen iki ifade gibi) son stil bildirimi p
. Dış stilleri geçersiz kılmayı kolaylaştırmak için (yani daha fazla özgüllük kullanmadan veya !important
), dış stil ( <link>
ler) den sonra sayfa düzeyi stilleri koymalısınız . Ayrıca, @import yönergesini sayfa düzeyinde stillerde kullanmak genellikle tavsiye edilmez, çünkü diğer stil varlıklarının aynı anda indirilmesini engelleyecektir:
<style>body{color:black;}</style>
Bu, meta etiketler, favicons ve diğer cruft'leri koymanın en uygun olduğu noktadır. Favicons'ların veya benzer varlıkların (örneğin iOS uygulama resimleri) çoğu meta etiketten önce yükleneceği iddia edilebilir, çünkü bu varlıkların indirilmesinin marjinal olarak daha erken başlamasını sağlar.
<link rel="shortcut icon" href="favicon.ico">
<link rel="apple-touch-icon" href="apple-icon.png">
<meta name="description" content="Some information that is descriptive of the content">
<meta name="generator" content="Microsoft FrontPage 2002">
Oluşturmayı engellediğinden / geciktirdiğinden, komut dosyaları gerektiriyorsanız, makul olduğu kadar yükleyin. İçinde olmaları gerekiyorsa head
, head
( </head>
) kapanmadan önce yükleyebilirsiniz . Daha sonra yükleyebiliyorsanız, body
etiketi ( </body>
) kapatmadan önce koyun .
<script src="script-1.js"></script>
<script src="script-2.js"></script>
</head>
Çoğu durumda, endeksleme botlarının (yani arama motoru örümcekleri) tüm sayfayı tüketeceği göz önüne alındığında, SEO amaçları için meta etiketlerin sırasına çok dikkat etmek önemsiz görünüyor. Aksi takdirde, bir sayfanın içeriğini nasıl dizine ekler veya daha sonra bu dizini nasıl güncellerler?
Bildiğimizi düşündüğümüz her şey ve web'de bulduğumuz tüm öneriler (Google ve Bing Web Yöneticisi Araçları vb. Gibi yerlerden bile), Amazon, Google ve açıkça önemseyen diğer kişiler için benim için dikkat çekicidir. bu kadar küçük performans kazançları hakkında bu kurallara uymayın.