CSS layout için en iyi yöntem? lütfen yardım

Selamun aleykum, uzun süredir kabataslak CSS öğrenmeye çalışıyorum. Kişisel olarak bir şey yaparken "en iyi yöntemi" bilmezsem rahat edemiyorum, stres yapıyorum :(

2 tane sorum var lütfen üstadlar açıklığa kavuşturursa beni büyük bir yükten kurtarırlar.

1) CSS layout (site düzeni - header, footer ve content yerleşimi)
2) bloglarda content içerisinde son gönderiler kısmı.

Bu 2 şey için ayrı ayrı hangi CSS düzeni en mantıklı, performanslı ve modern?

Yani kafamın karışması normal, düzen için - float, Flex (eski flexbox), grid, table-cell vb çok fazla yol var. Hangisi üzerine yoğunlaşmak gerekiyor?

Burada bir sürü etken var. Her birinin kullanım amacı farklı demeyin lütfen evet farklı. Ama bu 2 düzeni de hepsiyle de yapabiliyoruz. Hangisini seçmek daha iyidir. Hiç kaynak yok.

Google bile bu CSS lerin tarayıcıda derlenme performansını paylaşmıştı geçen senelerde. Yani o kadar fark var aralarında.

Hangisini tercih etmek lazım ve neden? Benim için Flex daha mantıklı ve modern geliyor ama kararsızım. Her tema farklı bir yöntem seçmiş.

Google bile bu CSS lerin tarayıcıda derlenme performansını paylaşmıştı geçen senelerde

hangi kaynaktan takip ediyorsunuz acaba paylaşabilir misiniz, etiketler ve css etki etmez, iframe svg gibiler etki eder,

şu an için herkes flex kullanıyor, float veya table özellikleri ile site tasarımı yapılmaz bunlar basit işlemler için kullanılır (örnek: resmin yanına yazı getirme gibi)

flex şu an bootstrapt için kullanılan ana sistem, belli bir süre daha flex kullanılmaya devam eder, 2 sene sonrada grid layouta yavaştan geçilmeye başlar. (tahminimce) grid layout 2 yeni yayımlandı.


Css layout dedidiğiniz kısım için: giriş, gelişme sonuç ,

, {content},

Flex 2 boyutlu ama grid'de ki gibi cell(hücre) mantığı pek iyi değil. Çoğu tarayıcı destekliyor. Ama grid adobe'nin oluşturduğu ve her kutuyu istediğiniz noktaya almanızı sağlıyor iyi derecede bilirseniz. Grid her türlü flex'i ezer :) Ama desteklenme konusunda ise şöyle küçük sorunlar var;
https://caniuse.com/#feat=flexbox
https://caniuse.com/#search=grid
grid'in bazı minik özellikleri tüm tarayıcılar tarafından desteklenmiyor. Ama yüzde 90 oranında destekleniyor diyebiliriz.

Bulutekno
Grid'in mantığı daha karmaşık olduğu için basitleştirilmiş hali olarak Flex çıkarıldı. İlk çıktığında gelistiriciler, tarayıcıda işlenme süresi çok yavaş demişlerdi sonra Google performans raporlarını sundu daha yavaş değil diye.

Modernlik olarak bakarsak Flex daha modern, daha basit. Çok daha az kodla güzel bir düzen çıkarılıyor. Az kod, kontrol ve performans için daha iyi. Karmaşık yapılar yapılmadığı sürece Flex öneriliyor. Ama layout sistemi karmaşık yapıya girer mi?

Aynı şekilde kullanıcıların çoğu mobilden giriyor. Responsive için ekstra iş çıkarmak lazım grid yapida. Ama Flex nerdeyse hiç oynamadan mobile uyumlu hale getirilebiliyor.

Grid'e çok hakim değilim. Kararsızım. Header sidebar footer content sadece 4 bileşen var. Flexbox ile aynı zamanda mobil uyumlu yapmış oluyoruz ama grid daha statik geliyor bana, acaba o daha mı mantıklı olur?

Bir de anasayfa son yazılar kısmı. Kutucuklar eşit olacağı için Flex en mantıklısı gibi. Gözden kaçırdığım bir şey var mı?