wmaraci reklam

sitemin Seo analizi hakkında

5 Mesajlar 3.454 Okunma
pst.net
wmaraci reklam

SkyWalker SkyWalker WM Aracı Kullanıcı
  • Üyelik 01.09.2012
  • Yaş/Cinsiyet 37 / E
  • Meslek Serbest meslek
  • Konum Samsun
  • Ad Soyad ** **
  • Mesajlar 10
  • Beğeniler 0 / 1
  • Ticaret 0, (%0)
Merhaba arkadaşlar sitemi wmaraci'daki seo analizi ile tarayınca bazı hatalar buluyor. bunlardan birkaç tanesine kafam takıldı. umarım yardım edecek arkadaşlar çıkar.
1. CSS Standartizasyonu'nda CSS kodlarınız standarta uygun değil "CSS kodlarınızı eklerken @import olarak eklemekten kaçının." diyor. evet main.css dosyamda diğer .css leri bağlamak için @import kullanılmış. @import yerine başka ne kullanabilirim. google da da aradım ama fazla da bilgim olmadığı için bir sonuca ulaşamadım.

2. CSS Sprite özelliğini kullanmıyor benim sitem. araştırdığım kadarıyla çok faydalı bir yöntem. fakat nasıl yapılacağını basitçe anlatan bir yazı bulamadım. herkes uzman değil :) basit birşekilde sırasıyla yapılacak adımları yazan bir arkadaş çıkar diye umuyorum.

Hepinize teşekkür ederim.
 

 

wmaraci
reklam

Hurkal Hurkal Sms Onayı Gerekli Banlı Kullanıcı
  • Üyelik 05.08.2011
  • Yaş/Cinsiyet - / E
  • Meslek Öğretmen
  • Konum İstanbul Avrupa
  • Ad Soyad ** **
  • Mesajlar 382
  • Beğeniler 89 / 114
  • Ticaret 0, (%0)
1.


2. Sitenizde kullandığınız tüm resimleri tek bir resim dosyasında topluyorsunuz. Böylece tek seferde hepsi elde ediliyor. Ardından resimlerin kullanılacağı alanlarda CSS kodlarıyla büyük resmin başlangıç koordinatlarını x ve y cinsinden giriyorsunuz, resmin kullanacağınız kısmını da söz konusu alanın genişlik ve yüksekliği olarak belirtiyorsunuz.
 

 

sezeroz sezeroz Sms Onayı Gerekli Banlı Kullanıcı
  • Üyelik 15.02.2012
  • Yaş/Cinsiyet - / E
  • Meslek öğrenci
  • Konum
  • Ad Soyad ** **
  • Mesajlar 84
  • Beğeniler 39 / 7
  • Ticaret 0, (%0)
bu css sprite 'ı bende uygulamak istiyorum ama hiç bi fikrim yok bilen biri varsa anlatsın hayrına
 

 

StRonK StRonK Öğrenci Kullanıcı
  • Üyelik 09.07.2012
  • Yaş/Cinsiyet 33 / E
  • Meslek Öğrenci
  • Konum Bursa
  • Ad Soyad E** A**
  • Mesajlar 114
  • Beğeniler 80 / 28
  • Ticaret 1, (%100)
aslında pek de bi bilgi gerekmiyor ben çata pata bişiler diyeim css sprite hakkında
http://tr.spritegen.website-performance.org/
yukarıda siteye girin zip dosyasına attığınız 3-5-10 resim dosyasını zipteki max boyut 1mb olacak

Daha sonra Tümleşik Resim Üretim Seçenekleri altında
Yatay Aralık: 5px
Dikey Aralık:5px
Diye ayarlayın

CSS Üretim Seçenekleri burada seçeneklerde sprite- silin gitsin sonrada Tümleşik Resim Dosyasını & CSS Kodlarını Üret ürete tıklayın tamamdır resim dosyasın indirip ftpye atmayı unutmuyoruz :D

gelelim eklemeye

orda nasıl olacağinida açıklıyor aslında



.deneme {
background: url(csg-5053b527745da.png) no-repeat;
background-position: 0 -62px; width: 15px; height: 12px;
}
 

 

2 Dakika Adam Ol Desem "Kaç Dakikam Kaldı"diye Soracak İnsanlar Var...
Şener Şen
wmaraci
Mersin evden eve nakliyat

SkyWalker SkyWalker WM Aracı Kullanıcı
  • Üyelik 01.09.2012
  • Yaş/Cinsiyet 37 / E
  • Meslek Serbest meslek
  • Konum Samsun
  • Ad Soyad ** **
  • Mesajlar 10
  • Beğeniler 0 / 1
  • Ticaret 0, (%0)

Hürkal adlı üyeden alıntı

1.


2. Sitenizde kullandığınız tüm resimleri tek bir resim dosyasında topluyorsunuz. Böylece tek seferde hepsi elde ediliyor. Ardından resimlerin kullanılacağı alanlarda CSS kodlarıyla büyük resmin başlangıç koordinatlarını x ve y cinsinden giriyorsunuz, resmin kullanacağınız kısmını da söz konusu alanın genişlik ve yüksekliği olarak belirtiyorsunuz.


Hocam dediğiniz gibi @import olan .css leri düzenledim. seo analizinde hala sorun görünüyor fakat çok acayip birşey oldu. bu kodları yazınca sitenin açılış hızı inanılmaz arttı. şöyle ki @import varken seo analizinde açılış hızı 6,99sn iken sizin verdiğiniz kodları girdiğimde bu açılış hızı 2.52sn'ye düştü :D birkaç kez test ettim farklı bir şey yüzünden mi oldu diye @import lu kodu girince açılış hızı 6,99sn lere geliyor kodu silip sizin verdiğiniz kodu girince 2.50sn civarına geliyor. ne mübarek kodmuş :D ama @import hatası hala gitmedi. belki bir süre beklemek lazım. şimdi css sprite için uğraşacağım umarım yapabilirim.

Ek Olarak:

StRonK adlı üyeden alıntı

aslında pek de bi bilgi gerekmiyor ben çata pata bişiler diyeim css sprite hakkında
http://tr.spritegen.website-performance.org/
yukarıda siteye girin zip dosyasına attığınız 3-5-10 resim dosyasını zipteki max boyut 1mb olacak

Daha sonra Tümleşik Resim Üretim Seçenekleri altında
Yatay Aralık: 5px
Dikey Aralık:5px
Diye ayarlayın

CSS Üretim Seçenekleri burada seçeneklerde sprite- silin gitsin sonrada Tümleşik Resim Dosyasını & CSS Kodlarını Üret ürete tıklayın tamamdır resim dosyasın indirip ftpye atmayı unutmuyoruz :D

gelelim eklemeye

orda nasıl olacağinida açıklıyor aslında



.deneme {
background: url(csg-5053b527745da.png) no-repeat;
background-position: 0 -62px; width: 15px; height: 12px;
}

cevabınız için teşekkür ederim. deneyeyim bakalım umarım yapabilirim.

Ek Olarak: @StRonK hocam bu sprite i yapamadım kafamda karıştı. şimdi önce images klasörünü zip yapıp dediğiniz gibi siteye yükledim. bana tek bir resim dosyası ve kodları verdi. Şimdi ben bu kodları css dosyasına nasıl yerleştireceğim örnek verecek olursak;

voteinfo adlı bir resmi ele alalım. bu resim blocks.css adlı dosyanın içinde duruyor ve kodları şöyle

.bvote p {
background:#f6fafd url(../images/voteinfo.png) no-repeat 100% 0;
border:1px solid #d8e3ea;
color:#466f9d;
padding:5px 18px 5px 8px;
}


bana verilen kod ise şu şekilde;
.voteinfo{ background-position: -5258px -176px; width: 12px; height: 12px; }

şimdi bunu nasıl düzenleyeceğiz? Ben şu şekilde denedim ama olmadı. sprite resmin adını spriteimages olarak değiştirip images klasörüne attım ve kodları şu şekilde değiştirdim.

#container li {
background: url(../images/spriteimages.png) no-repeat top left;
}
{ background-position: -5258px -176px; width: 12px; height: 12px; }


hata nerde?
 

 

wmaraci
Konuyu toplam 1 kişi okuyor. (0 kullanıcı ve 1 misafir)
Site Ayarları
  • Tema Seçeneği
  • Site Sesleri
  • Bildirimler
  • Özel Mesaj Al