Saf CSS ile duyarlı tasarım kur
CSS Responsive Web Design Training Eğitimi, çatıya bağlı kalmadan saf CSS ile her ekrana uyumlu arayüzler kurmayı öğretir. Program; mobil öncelikli yaklaşım, viewport ve göreli birimler, akışkan düzen, media query ve breakpoint stratejisi, özellik ve feature…
Mobil öncelikli yaklaşımdan media query'ye, Flexbox ve Grid'den modern tekniklere
CSS Responsive Web Design Training Eğitimi, hiçbir çatıya bağlı kalmadan saf CSS ile her ekrana uyumlu arayüzler kurmayı öğretir. Katılımcılar mobil öncelikli yaklaşımı, viewport ve göreli birimleri, akışkan düzeni uygular; media query ve feature query ile breakpoint tasarlar. Program, Flexbox ve CSS Grid ile duyarlı yerleşim, srcset ile duyarlı görseller, clamp ile akışkan tipografi ve container query gibi modern tekniklerle tamamlanır.
4 Gün. Her gün dört modül; kısa anlatımın ardından aynı sayfa mobil öncelikli kurulup farklı ekranlarda büyütülerek karşılaştırmalı test edilir.
Orta Seviye — Saf CSS ile mobil öncelikli, media query, Flexbox ve Grid tabanlı duyarlı tasarım programı
Tek bir sayfa mobil öncelikli olarak kurulur ve adım adım geniş ekranlara uyarlanır; her teknik tarayıcıda farklı genişliklerde test edilir.
Bootstrap gibi bir çatıya bağlı kalmadan saf CSS ile her ekrana uyumlu, hafif ve özgün arayüzler kurmayı öğrenirsiniz.
Flexbox ve CSS Grid ile karmaşık yerleşimleri az kodla, esnek ve bakımı kolay biçimde çözmeyi kavrarsınız.
clamp, vw ve container query ile ekran boyutuna göre akıcı değişen tipografi ve düzen tasarlamayı uygularsınız.
Eğitime başlamadan önce faydalı olacak bilgi ve araçlar
Seçiciler, renk ve kutu modeli gibi temel CSS bilgisi düzen tekniklerini kavramayı kolaylaştırır.
Semantik etiketler ve belge yapısına aşinalık düzen kurarken işaretlemeyi anlamayı hızlandırır.
Geliştirici araçlarıyla ekranı ölçekleyip öğe inceleyebilmek duyarlılık testlerini kolaylaştırır.
VS Code gibi bir editör ve canlı sunucu eklentisiyle çalışabilir durumda olmak yeterlidir.
Programın gün gün akışı aşağıdadır. Bir güne tıklayarak o günün modüllerini ve içeriklerini görebilirsiniz.
Program sonunda katılımcılar:
Önce küçük ekranı kurup ilerlemeli büyüterek bakımı kolay ve tutarlı duyarlı sayfalar tasarlayabilirsiniz.
rem, em, yüzde ve vw ile ölçeklenebilir, erişilebilir ve akışkan boyutlandırmayı uygulayabilirsiniz.
İçeriğe dayalı breakpoint'ler ve özellik sorgularıyla her ekrana uyumlu duyarlı davranışı kurabilirsiniz.
Tek eksenli esnek düzenleri Flexbox ile az kodla kurup öğeleri eksenlerde esnek biçimde hizalayabilirsiniz.
İki boyutlu yerleşimleri Grid ile tasarlayıp auto-fit ve minmax ile çatısız duyarlı ızgaralar üretebilirsiniz.
srcset, picture ve modern formatlarla farklı ekranlara uygun, hızlı yüklenen görseller sunabilirsiniz.
clamp ve vw ile ekran boyutuna göre akıcı değişen, okunabilir ve erişilebilir tipografi kurabilirsiniz.
Bileşenleri kaba göre uyarlayan container query ile her yerde doğru çalışan yeniden kullanılabilir parçalar üretirsiniz.
Bu eğitim Digital Vizyon Akademi Başarı Sertifikası ile tamamlanır.
Eğitim başında “Ön Test”, bitiminde “Son Test” uygulanarak gelişim ölçümlenir. Değerlendirme formunu dolduran katılımcılar sertifikalarını alır. Sertifikanızın geçerliliğini Sertifika Sorgulama sayfasından doğrulayabilirsiniz.
Cascade layers, :has, container query, subgrid, oklch ve scroll-driven animasyonlarla güncel CSS özelliklerini öğreten ileri seviye front-end eğitimi.
Detayları Gör →
Semantik HTML, form ve medya, seçiciler, kutu modeli, renk ve tipografiyle HTML ve CSS özelliklerini derinlemesine öğreten ön yüz geliştirme eğitimi.
Detayları Gör →
transition, transform, keyframe animasyonu ve performans teknikleriyle akıcı ve erişilebilir CSS tabanlı hareket tasarlamayı öğreten uygulamalı eğitim.
Detayları Gör →
Web'in çalışmasından HTML yapısına, CSS stillemeden Flexbox yerleşime ve gerçek bir sayfa projesine sıfırdan HTML ve CSS öğreten başlangıç eğitimi.
Detayları Gör →
Semantik HTML, WCAG, klavye ve ekran okuyucu, ARIA ve test araçlarıyla erişilebilir ve kapsayıcı web arayüzleri kurmayı öğreten uygulamalı eğitim.
Detayları Gör →
HTML belge yapısı, anlamsal etiketler, bağlantı, görsel, tablo ve form ile sıfırdan web içeriği yazma eğitimi. Erişilebilir ve doğrulanmış HTML temeli.
Detayları Gör →