Grid Sistemi Nedir?
Grid sistemi, web sitesi içerisinde sunulmak istenilen içeriğin, farklı ekran senaryolarına göre düzgün bir şekilde gösterilebilmesi adına oluşturulmuş lojistik gruplandırma mantığıdır.
Elbette sadece tanım olarak ele alındığı zaman ön yüz kodlamasını yapan kişi tarafından bunun anlaşılması pek de kolay değildir. Daha açık bir şekilde anlatmak gerekirse Grid Sistemi, içeriğimizin gruplar haline getirip yeri geldiğinde yan yana yeri geldiğinde dikey şekilde istifleyebileceğimiz bir sistem yaratmaktır. Günümüzde Skeleton, Bootstrap ve benzeri birçok hazır grid sistemi bulunmaktadır ve ön yüz kodlayıcısı tarafından yeni bir grid sistemi yazmaya çalışmak Amerika'yı yeniden keşfetmekten farksızdır.
Fakat ileride de bahsedeceğimiz bu Framework'ler ile çalışabilmek için öncelikle Grid Sisteme ve Medya Query'leri anlamak önem arz eder.

Öncelikle elimizde büyükçe bir kutu olduğunu hayal edelim. Bir yandan da elimizde biraz kitap, bir kaç su şişesi ve bir kaç tence de tencere olduğunu var sayalım.
Buradaki ilk opsiyonumuz kutuyu kullanmadan elimizdeki malzemeyi olduğu gibi yük konteynerine koymaktır. Bu durumda elimizdeki ürün çoğaldıkça kimisi dikey, kimisi yatay, kimisi radyal olan bu ürünleri yerleştirirken hem oluşan boş alanlardan dolayı yerden zarar edeceğiz hem de karmaşık bir konteyner elde etmiş olacağız.
KONTEYNER VE İÇERİK FOTOĞRAFI

İstif ve Lojistiğin temel mantığı gereği buradaki en basit derecedeki mühendislik çözüm, bu ürünleri elimizdeki kutuya minimum boşluk kalacak şekilde yerleştirdikten sonra konteynere koymaktır.

KOTEYNER VE KUTU FOTOĞRAFI
Geleneksel tasarım yönteminde içerik tablo yapısından dolayı sınırlı bir şekilde hareket eder ve satırdaki tüm sütunlar ancak ilgili satır kadar esnek olabilir. Grid Sistemi ise bize içeriğimizi bağımsız kutulara koymamızı sağlayan bir alan yaratır.
Bu sayede uluşturduğumuz sistem dikey olarak istiflememizi kolaylaştıracaktır. Mantık olarak baktığımız zaman bir grid sistemi bize çeşitli boyutlarda kutular verir ve içeriğimizi bunun içerisine koymamızı ister. Bu sayede bir kutu içerisine koyduğumuz kitap, şişe ve tencere; Yani resim, yazı ve diğer web elementleri bir blok olarak sunulabilir.