Siteyi Sayfada Ortalama ve Arama Motorunda Gösterme

Merhaba arkadaşlar. Kendi kullanıcı adımı içeren arkiolok.com isimli bir site kurdum. Sitede facebook, twitter vs. hesaplarımı içeren linkler koydum.

Şimdi sizlere ilk sorum bu siteyi nasıl ortalarım. 960px olacak şekilde tasarladım. Şimdi ise bunun ortalanmasını istiyorum.

İkinci sorum ise googleye "arkiolok" yazınca sitemin nasıl en üstte çıkmasını sağlayabilirim?

İlk soru: HTML'de tüm etiketleri bir ana tutucunun içine yerleştirmeli ve bu ana tutucuya CSS'de margin:auto; kodunu eklemelisiniz.
İkinci soru: Bunun için sitenin bolca tıklanması gerek ve Arama Motoru Optimizasyonu (SEO) yapmalısınız.

stil.css dosyama
#tutucu { margin:auto }
kodlarını ekledim ve html dosyasında bodyden itibaren <div id="tutucu"> içerik </div> komutunu ekledim.

Ama sayfam ortalanmadı.

#tutucu {width:960px; margin:auto} yapınca olması gerek.

Sonuç aynı.

Öncelikle bir değeri ortalayacağın zaman bunun sabit bir genişliği olmalı. Genişlik değeri olmayan bir element auto değer alarak genişliğini sağlar. İkinci olarak sen sadece left-right olarak hizalandırmak istiyorsun. O yüzden "margin: auto yerine margin: 0px auto" demen daha sağlıklı olur.

Neden ortalayamıyorsun bunu da belirteyim. İlk olarak position değeri absolute olan bir elementi sadece margin ile auto olarak hizalayamazsın. Ayrıca şuan ki yapı için hiç gerek bile yok.
Eğer position değeri absolute olan bir elementi hizalamak istersen bu şekilde çözüme ulaşabilirsin.


Diyelim ki position kullanmadın. Yine ortalayamazsın çünkü sen "cerceve" sınıfının alt elementini float: left diyerek sola hizalamışsın. Eğer bu şekilde kullanıyorsan bir üst element için overflow:hidden ya da üst elementi kapatmadan önce clear:both uygulaman gerekir. Eğer bunlara rağmen ben ne yapmalıyım diyecek olursan şu adımları izleyebilirsin.

İlk olarak "resim_cerceve" sınıflı elementini "cerceve" ID'li elementin içerisinden çıkartmalısın ve "resim_cerceve" sınıfından float: left değerini silip margin: 0px auto olarak ortalarsın.
İkinci adım ise zaten sen body elementi içerisinde bulunan tüm elementlere text-aling: center demişsin. O yüzden h1 ve p elementlerinin style değerlerini tamamen kaldırman yeterli.
Üçüncü ve son adım ise "cerceve2" ID'li elementinden position: absolute değerini sildikten sonra istediğin yapıya ulaşmış olursun.

Yardımlarınız için teşekkür ederim. Üçüncü sırada yazdığınız adımlar uyguladım ve neredeyse çözüldü sorunum. Şimdi size resim_cerceveyi nasıl biraz daha alta çekebilirim olacak. Sitenin son halini yükledim.