Her ekrana uyum sağlayan arayüzler tasarlayın
Advanced Options & Responsive Web Design Eğitimi, her ekran boyutunda düzgün çalışan modern arayüzleri ileri CSS teknikleriyle kurmayı öğretir.
Mobil öncelikten Grid yerleşimine, responsive görsellerden performans optimizasyonuna akış
Advanced Options & Responsive Web Design Eğitimi, her ekran boyutunda düzgün çalışan modern arayüzleri ileri CSS teknikleriyle kurmayı öğretir. Katılımcılar mobil öncelikli yaklaşımı, media query stratejilerini ve esnek kesme noktalarını öğrenir. Flexbox ve CSS Grid ile karmaşık yerleşimler, container query ile bileşen bazlı tasarım, clamp ile akışkan tipografi ve responsive görseller işlenir. Program erişilebilirlik ve performans optimizasyonuyla tamamlanır.
4 Gün. Her gün dört modül; tek bir arayüz, masaüstünden mobile kadar tüm ekranlara uyumlu olacak şekilde kurulur.
İleri Seviye — Flexbox, CSS Grid, container query ve akışkan tipografiyle her ekrana uyumlu modern arayüz
Her modülde yazılan CSS farklı ekran boyutlarında test edilir; teknikler gerçek bir responsive arayüz üzerinde adım adım uygulanır.
Mobil öncelikli yaklaşım ve esnek kesme noktalarıyla telefondan geniş ekrana her cihazda düzgün görünen arayüzler tasarlarsınız.
Flexbox ve CSS Grid ile float ve konumlandırma zahmetine girmeden karmaşık ve esnek sayfa düzenlerini temiz kodla kurarsınız.
Responsive görseller ve performans tekniklerini erişilebilirlik ilkeleriyle uygulayarak hızlı ve herkese açık arayüzler üretirsiniz.
Eğitimden verim almak için faydalı olacak bilgi ve ortam
Semantik HTML yapısına ve temel etiketlere aşinalık beklenir; yerleşim bu yapı üzerine kurulur.
Seçiciler, kutu modeli, renk ve tipografi gibi temel CSS konularını bilmek eğitimden verim için gereklidir.
Tarayıcı geliştirici araçlarıyla cihaz modunu açmak ve denetim yapmak örneklerde sıkça kullanılır.
VS Code gibi bir editör ve güncel bir tarayıcı gereklidir; canlı önizleme ile değişiklikler görülür.
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:
Mobil öncelikli yaklaşımı ve viewport yönetimini uygulayarak küçük ekrandan büyüğe doğru ölçeklenen arayüzler kurarsınız.
rem, em, vw ve clamp gibi göreli birimlerle sabit piksele bağlı kalmadan akışkan ve erişilebilir ölçekler oluşturursunuz.
Esnek kesme noktaları ve kullanıcı tercih sorgularıyla içeriğe göre uyarlanan responsive düzen stratejileri kurabilirsiniz.
Flexbox ile tek eksenli esnek düzenler kurar, öğeleri hizalar ve büyüme davranışıyla responsive bileşenler tasarlarsınız.
CSS Grid ile satır ve sütunu birlikte yöneten iki boyutlu, isimli alanlara dayalı karmaşık sayfa düzenleri kurarsınız.
Container query ile konteyner boyutuna göre uyarlanan, gerçekten yeniden kullanılabilir responsive bileşenler geliştirirsiniz.
clamp ve modüler ölçekle ekran boyutuna göre akışkan ölçeklenen, okunabilir ve tutarlı tipografi sistemleri kurarsınız.
Responsive görseller, kritik CSS ve Lighthouse ölçümüyle hızlı yüklenen, erişilebilir ve optimize arayüzler ü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.
Sass ile değişken, mixin, fonksiyon, @use modül sistemi ve 7-1 mimarisini uygulamalı öğreten kurumsal SCSS eğitimi. Modüler ve ölçeklenebilir CSS.
Detayları Gör →
Sıfırdan HTML öğreten temel seviye kurumsal eğitim. Doküman yapısı, metin, bağlantı, görsel, tablo, form ve semantik etiketler uygulamalı.
Detayları Gör →
Temel etiketlerden semantik HTML5, gelişmiş form, çoklu ortam, Canvas, Web Storage ve web bileşenlerine uzanan kapsamlı kurumsal HTML eğitimi.
Detayları Gör →
HTML'i hypermedia olarak kullanarak REST, HATEOAS ve htmx ile sunucu odaklı sade API mimarisi kurmayı öğreten uygulamalı kurumsal eğitim.
Detayları Gör →
Adobe Dreamweaver CC ile HTML, CSS kod yazımı, CSS Designer, Emmet, Bootstrap ve FTP ile site yayınlamayı öğreten uygulamalı kurumsal eğitim.
Detayları Gör →
Bootstrap 5 grid, kart ve bileşenleriyle duyarlı yönetim paneli kurma eğitimi. Chart.js grafikleri, koyu tema ve Sass ile uygulamalı dashboard.
Detayları Gör →