Uyğunlaşan tərtibat nədir?

Uyumlu dizayn veb dizayn və inkişaf sahəsində bir yanaşmadır; burada saytın tərtibatı və məzmunu avtomatik olaraq cihazın ekran ölçüsünə uyğunlaşır, masaüstü kompüter, planşet və ya smartfon olsun. Məqsəd — hər hansı həllatda optimal görüntü və istifadə rahatlığını təmin etmək.

Əsas prinsiplər:

• Əlavə edilə bilən şəbəkə (Fluid Grid): Elementlərin ölçülərini müəyyən etmək üçün nisbət ölçü vahidlərindən (faizlər, em, rem) istifadə etmək, sabit piksel yerinə.
• Əlavə edilə bilən şəkillər (Flexible Images): Şəkillər konteynerin ölçüsünə nisbətən ölçülərini dəyişir, onun sərhədlərindən çıxmamaq üçün.
• Media sorğuları (Media Queries): CSS qaydaları, cihazın xüsusiyyətlərinə, məsələn, ekran genişliyi, istiqamət, həllolma kimi, müxtəlif stilləri tətbiq etməyə imkan verir.

Media sorğularının istifadəsinin tipik nümunəsi:

/* Əsas stillər */
.container {
    width: 960px;
    margin: 0 auto;
}

/* 768px-dən kiçik ekranlar üçün stillər */
@media (max-width: 767px) {
    .container {
        width: 95%;
        padding: 0 10px;
    }
    .column {
        float: none;
        width: 100%;
    }
}

Praktikada, uyumlu dizaynı test edərkən mən:

1. Layihənin göstərilməsi: Yatay sürüşmə olmamalıdır, bloklar düzgün yerləşdirilməlidir.
2. Mətnin oxunaqlığı: Font ölçüləri bütün cihazlarda rahat olmalıdır.
3. Navigasiya: Menyu əlçatan və istifadə üçün rahat olmalıdır (məsələn, mobil cihazlarda "burger menyu").
4. Funksionallıq: Bütün interaktiv elementlər (düymələr, formalar) düzgün işləməlidir.
5. Performans: Mobil cihazlarda yükləmə vaxtı. Şəkillərin optimallaşdırılması üçün <picture> və ya srcset istifadə etmək.

Əsas üstünlükləri:

• Bütün cihazlar üçün tək kod bazası.
• SEO göstəricilərinin yaxşılaşdırılması (Google uyumlu saytları üstün tutur).
• Daha yaxşı istifadəçi təcrübəsi.
• Saytın ayrı versiyalarını yaratmaqla müqayisədə vaxt və resursların qənaəti.

Fərqi, adaptiv dizayn (Adaptive Design) ilə müqayisədə, sonuncusu sabit breakpoints istifadə edir, uyumlu dizayn isə hər hansı ekran ölçüsünə daha hamar uyğunlaşır. Bu terminlər, müxtəlif cihazlar üçün inkişaf kontekstində çox vaxt sinonim kimi istifadə olunur.