Kategoriler
Kodlama

CSS’de önce mobil mi desktop mı?

CSS’de tercih edilen geliştirme akışı değişti, eskiden ilk olarak masaüstü cihazlara göre yazılırken artık öncelikli olarak mobil yazılmakta.

Statcounter’da 2021 Q1’deki cihaz pazar paylarına bakılınca mobilin masaüstü cihazları geçtiğini ve yükselmeye devam ettiğini görebiliyoruz. Şu an %54,25 mobil %42,9 masaüstü %2,85 tablet. Yine aynı sitede işletim sistemlerine bakıldığında mobil işletim sistemleri yükselişte.

Böyle olunca developerler eskiden aşağıdaki gibi kodlamaya başlarken:

h1{
font-size: 2rem;
}
@media (max-width: 900px){
h1{
font-size: 3.5rem;
}
}

Artık aşağıdaki gibi başlıyorlar:

h1{
font-size: 2rem;
}
@media (min-width: 900px){
h1{
font-size: 3.5rem;
}
}

Burada görüldüğü gibi CSS kodu ilk olarak mobil cihazlara göre ayni varsayılan CSS kodu mobil cihazlara göre yazılırken ekran boyutu büyük masaüstü cihazlarda çalışması için @media (min-width: 900px) kullanarak çalışması şeklinde.

CSS mobile first
CSS mobile first

Bu akış elbette projeye göre değişebilir ancak varsayılan webde kullanıcıların ziyaret edeceği bir web sitesi ve uygulama için öncelikli olarak mobil CSS yazmak ve öyle başlamak günümüzde doğru olanıdır. Eskiden ben de öncelikli masaüstü site ile başlayıp mobili sonraya bırakıyordum fakat artık benim de önceliğim mobil.

Bu hem sitenin yanıt verme hızını arttıracaktır(mobil cihazlarda) hem de modern framewokler de bu çalışma prensibini benimsemişlerdir uyumludur. Daha fazla bilgi için https://css-tricks.com/how-to-develop-and-test-a-mobile-first-design-in-2021/

How to Develop and Test a Mobile-First Design in 2021

wolkanca.com’da CSS’de önce mobil mi desktop mı? veya diğer konular hakkında herhangi bir sorunuz varsa, sosyal medya butonları ile yorum ya da mesaj göndermekten çekinmeyin, CSS’de önce mobil mi desktop mı? için ya da değil DM kapısı her daim açık. Yazıyı beğendiyseniz paylaşın, daha fazla ilgili gönderi için hemen aşağıdaki menülere göz gezdirebilirsiniz, okuduğunuz için teşekkürler, saygılar sevgiler.

WOLKANCA

Volkan Yılmaz

Digital Marketing & WordPress & SEO - wolkanca mahallesi gmail sokak nokta com.