mobil tasarım hakkında

siteme mobil tasarım yapmak istiyorum mobil tasarım için nerden başlamalıyım bilen biri varsa yardımcı olursa sevinirim...

Tasarım / Tasarım ayarları bölümüne gidiniz. Orada "mobil" seçeneğini göreceksiniz.

ama mobil tasarıma göre tam olarak uyarlamıyor çok eksiklik oluyor mesela yüksekliklerde genişliklerde sayfanın çoğu şeyinde kaymalar oluyor bu sorunu nasıl giderebilirim ?

Mobil sayfanın ID ve CLASS etiketlerine stil tanımlamaları yaparak her türlü sorunu giderebilirsiniz. Örneğin mobil tasarıma ait bazı ID ve CLASS etiketleri şunlardır:
.ui-body-c .ui-header .ui-content #nav-panel .ui-footer
______________

tam olarak anlamadım mobil tasarım yerinde İd ,class yerleri yok bunları nasıl yapcaz anlamadım açık anlatırsan

Tasarım > Mobil Tasarım > Bir alt sayfanın içerik metni (örneğin CSS kodu kullanılabilir) bölümünü ID ve CLASS etiketlerine stil tanımlamaları (yani CSS kodlaması) yapmak için kullanabilirsiniz. Daha net anlaşılabilmesi için bir örnek vermek gerekirse, ilgili bölüme şöyle bir kodlama girebilirsiniz:

______________

kendi sayfamın tasarım kodunu mobil tasarım koduna yapıştırsam oluyormu ? yoksa tekrardan ayrı bir tasarım kodumu yazmak gerekiyor ?

Eğer BS'in mobil tasarımını kullanmak istiyorsanız, onun hazır tanımlamalarına uygun kodlama yapmalısınız. Eğer kendiniz bir mobil tasarım oluşturmak istiyorsanız, bunu istediğiniz şekilde hazırlayabilirsiniz. Lakin kodlarınızı doğrudan kopyalarsanız istediğiniz sonucu alamazsınız, genişlik veya aralık gibi değerlerde değişiklikler yapmanız gerekir. Tüm bunlarla uğraşmaktansa sitenizde kullandığınız tasarımı duyarlı hale dönüştürmenizi tavsiye ederim.
______________

nasıl tam olarak açıklarsan anlamadım tam.sitedeki tasarımı duyarlı hale nasıl dönüştürüyoruz ?

Duyarlı bir tasarım, web sitesinin mobil ve tablet cihazlardan girildiğinde site içindeki resim, yazı gibi elementlerin ekran genişliğine göre yeniden şekillenip ekrana tam oturması ile oluşur. Örneğin duyarlı bir tasarım için; ekran çözünürlüğü 960px'ten küçük cihazlar için:

Ekran çözünürlüğü 801px ve 959px arasında olan cihazlar için:

gibi kodlamalar yapılabilir. Daha ayrıntılı bir örnek vermek gerekirse;

Site tasarımınıza ekleyeceğiniz bu gibi tanımlamalar, websitenizi daha duyarlı bir hale getirir.
______________

mjobil tasarım kodu yazarken hep "@media only screen" kodunumu kullanıcaz her koda başlarken?

Evet, duyarlı bir tasarım için medya sorguları kullanılır. Ayrıntılı bilgi için CSS 3 Media Queries veya CSS 3 Medya Sorguları aramalarına göz atabilirsiniz.
______________

ozaman ben bunu tekrardan mobil olarak kodlucam baştan olarak ölemi yani aynı kodları bide mobil olarak uygulucaz ozaman ölemi ?

Evet, eğer BS'in mobil tasarımını kullanmak istemiyorsanız, bu şekilde kodlarınızı duyarlı hale getirebilirsiniz. Eğer Medya Sorguları ile yapılan bu işlem de karmaşık geliyorsa, temel olarak duyarlılığı yüzdelik dilimler belirterek de sağlayabilirsiniz. Misal CSS içerisindeki width:80%; tanımlaması, hangi tarayıcıdan girilirse girilsin, ilgili içeriğin ekran genişliğine göre %80 genişlikte açılmasını sağlar. font-size:75%; tanımlaması, yine hangi tarayıcıdan girilirse girilsin, ilgili içeriğin yazılarının varsayılan font büyüklüğünden %25 daha küçük açılmasını sağlar gibi örnekler çoğaltılabilir...
______________