WebOnline

Blog paylaşımlarımız ile eğlenceli zamanlar geçirebilirsiniz.

Kendi siteni yap - Ders 2

Kendi siteni yap - Ders 2

Kendi siteni yap serimizde lütfen sıralamaya göre ilerlerseniz daha güzel ve verimli bir ders olur.

Bugün sizlere “head” kısmında yapmamız gereken çalışmaları ve dikkat etmemiz gereken noktaları anlatacağım. Öncelikle “head” kısmı bildiğiniz gibi sitenin “css,js,seo,meta” taglarının bulunduğu yaptığımız tasarımın dizayn kısmı diyebiliriz.

İlk olarak “head” kısmında sitemize giren kullanıcının sekmesinde sitemizin adının görünmesi için “title” kodunu giriyoruz. Bu işlem ile kullanıcı sitemize girdiğinde paylaşımımızın yada sitemizin adını görebilir birçok sekme arasından bizim sitemizi ayıra bilir. Seo açısından önemi ise arama motorları sitenizi index’lerken sayfanızın yada sitenizin adı olarak algılar ve sıralama sonuçlarında “title” içerisinde yer alan yazıyı gösterir.

Kendi siteni yap - Ders 2 - Title

Bir diğer önemli olan meta tag ise “description” bu kısımda ise arama motorlarının siteniz hakkında sıralamada bilgi verebilmesi içindir. Örneğin : sitenizdeki bir sayfa arama motoru sıralamasına çıkacak. “description” tag eklediğinizde o sayfaya özel bir açıklama yer almaktadır. Bu sizin sıralamada yükselmenizi de sağlayabilir ve ziyaretçilerinize ön bilgi sunabilirsiniz.

Kendi siteni yap - Ders 2 - Description

Önemli bir meta tag olan “keywords” ise siteniz yada sayfanız hakkında içeriğinizde yer alan kelimeleri sunmaktadır. Bu konuda fazla anahtar kelime girmeniz yada içerikle alakasız girişler yapmanız sizi spam site olarak gösterebilir bu kısımda ortalama 5 kelime yazmanız yeterli olacaktır.

Kendi siteni yap - Ders 2 - Keywords

Bir diğer meta tag ise bildiğiniz “title” ama yeni güncellemeler sonucu sitenizi daha verimli bir seo alışkanlığına sürükleye bilir. Bu meta tag ile sitenizin yada sayfanızın başlığını arama motorlarına daha verimli analiz etmesini sağlayabilirsiniz.

Kendi siteni yap - Ders 2 - Title

Önemli bir meta tag olacağını düşündüğüm “author” yani site sahibi anlamına gelmektedir. Sitenizin bir kişiye yada şirkete ait olduğuna dair arama motoruna bir ön bilgi vermekte olabilir.

Kendi siteni yap - Ders 2 - Author

Seo açısından büyük bir öneme sahip olan bu meta tag ise “robots” yani sitenizin arama motorları tarafından indexlenmesini isteyip istemediğinizi göstermektedir. Eğer sayfanız özel bir sayfa değil ise kesinlikle arama motorları tarafından analiz edilmesine izin verin. Ziyaretçi çekmenizi sağlayacak önemli bir seo kodudur.

Kendi siteni yap - Ders 2 - Robots

Şimdi sitenizin analizine izin verdiğimize göre bunu eklemeden de olmaz. Sitenizin arama motorları tarafından kaç günde bir tekrardan göz atılmasını istediğinizi belirtmeniz için kullanılacak meta tagımız ise “revisit-after” budur. Eğer sitenizdeki bir paylaşımda güncelleme yada sürekli bir yenileme olmayacaksa 2-3 günde bir yada 5 günde bir tekrardan analiz et diyebilirsiniz.

Kendi siteni yap - Ders 2 - Revisit-after

Bildiğiniz gibi arama motorları birçok dili içerisinde barındırdıkları için verimliliği artırmak açısından web masterlardan bu kodu girmelerini ister. Bizim açımızdan da iyidir çünkü sitemize gelen kullanıcıların bizim dilimizden anlaması demek sitemize geri dönüşüm sağlaması demektir. İşte bu konuyu kolaylaştırmak için de eklememiz gereken meta tag “language” dir.

Kendi siteni yap - Ders 2 - Language

Sitemizin dil desteğini yazdık ama İngilizce bir içerikte sunabiliriz. Peki bu konuyu nasıl yapmamız gerekecek. İşte orda da “content-language” meta tagımız devreye girmektedir. Sitemizde paylaşılan içeriğin yazı dili anlamına gelmektedir.

Kendi siteni yap - Ders 2 - Content-language

Şimdi bu kısma kadar sitenizin arama motoru tarafından anlaşılabilmesi için yada kullanıcıların başlıkları fark edebilmesi için kodlar yazdık. Şimdi ise “css,javascript” taglarını yazalım. Burada iki tane özellik var bunu önceden söylemem sizin içinde daha iyi olacaktır. “js” kodları her alanda çalışmaktadır bazen yaptığımız bir özellik çalışmaya bilir o zamanda “body” kısmına yazmamız daha verimli çalışmasını sağlayabilir. İlk olarak size meta tag ile “css,js” özelliklerini başka bir klasörden çekmeyi sonrasında ise tek bir sayfada da yazarak çalıştırmayı öğreteceğim. Css çekmek için “link” meta tag ile çalışma yaparak uzantı göstererek sitenizin dizaynını ayrı bir sayfada kodlayabilirsiniz. Tabi javascript dosyanızı çekmeniz için de “script” özelliği kullanmaktayız. Tabi “script” kullanımı type özelliği ile ikiye ayrılabilir. “type=”text/css” yada type=”text/javascript”” özelliği ile iki kodlamayı tek bir sayfada yapabilirsiniz.

Kendi siteni yap - Ders 2 - Css-javascript

Dersimizin sonuna gelmiş bulunmaktayız. Kodların tam sayfa görüntüsünü sizler için alt tarafta yer almaktadır. Derslerimize destek vermek için bizi paylaşmayı unutmayın.

Kendi siteni yap - Ders 2