İlk web siteni yap ve yayınla
HTML, CSS ve biraz JavaScript ile çok sayfalı bir kişisel site planlar, kurar, sınar ve lab sunucusunda yayınlarsın.
Seviye 101 · 13 ders · 12 pratik lab
Dersler
Planlamak
- Site planı: sayfalar ve içerik
- Klasör yapısı ve dosya adları
- Kâğıt üzerinde taslak
- Kısa görev: boş sayfa iskeletleri
Kurmak
- Ana sayfa
- Hakkımda ve projeler sayfaları
- Ortak stil dosyası ve renk düzeni
- İletişim formu sayfası
- Küçük etkileşimler: menü ve tema düğmesi
- Kısa görev: siteyi telefon boyutunda düzelt
Yayınlamak
- Bağlantı ve doğrulama denetimi
- Siteyi sunucuya yüklemek
- Bitirme görevi: bir arkadaşın için tanıtım sitesi
Pratik lablar
- Dağınık site klasörünü düzenle: Boşluklu ve büyük harfli dosya adlarıyla dolu bir site klasörünü düzenli bir yapıya taşıyıp bağlantıları güncelle.
- Mahalle fırını için site planı çıkar: Altın Başak Fırını için sayfaları, içerikleri ve menü sırasını gösteren bir site planı ile iskelet sayfaları hazırla.
- Tel kafes çizimini sayfa iskeletine çevir: Verilen tel kafes çizimini anlamsal HTML iskeletine çevirip her bölümü taslaktaki yerine oturt.
- Ortak stil dosyasına geç: Her sayfada tekrarlanan style bloklarını tek bir ortak CSS dosyasına taşı.
- Portföy kartlarını düzgün hizala: Bir tasarımcının portföy sayfasındaki farklı boylu proje kartlarını eşit ve düzgün bir ızgarada göster.
- Renk şemasını değişkenlere bağla: Sitedeki sabit renkleri CSS değişkenlerine taşıyıp tek satır değişiklikle tüm sitenin rengini değiştir.
- Mobil menüyü açılır kapanır yap: Telefon genişliğinde menüyü gizleyip bir butonla açılıp kapanan hale getir.
- Çiçekçinin iletişim formunu düzelt: Bir çiçekçinin iletişim formuna doğru alan türleri, etiketler ve zorunlu alan kontrolleri ekle.
- Galeriye büyütme penceresi ekle: Fotoğraf galerisine Escape ile kapanan, odağı içinde tutan ve kapanınca odağı geri veren bir büyütme penceresi ekle.
- Kırık bağlantıları ve eksik görselleri bul: Beş sayfalık bir sitedeki kırık iç bağlantıları ve eksik görselleri bulup düzelt.
- Doğrulayıcı hatalarını temizle: HTML doğrulayıcının bir sayfada bildirdiği hataları tek tek düzeltip temiz rapor al.
- Siteyi sunucuya yükleyip yayına al: Bitmiş bir siteyi lab sunucusuna yükleyip doğru izinlerle yayınla ve telefon görünümünde açıldığını doğrula.
Kurs hakkında
HTML, CSS ve biraz JavaScript ile çok sayfalı bir kişisel site planlar, kurar, sınar ve lab sunucusunda yayınlarsın.
Ne öğreneceksin
- Planlamak
- Kurmak
- Yayınlamak
Ön koşullar
Ön bilgi gerekmez; kurs sıfırdan başlar.
Lab ortamı
Dersler, tarayıcında açılan sana özel bir Kali Linux masaüstünde geçer; araçlar pencereli arayüzleriyle hazırdır. Kurulum gerekmez, bilgisayar ekranı önerilir.
Sık sorulan sorular
- Bu kurs benim düzeyime uygun mu?
- Kurs başlangıç düzeyindedir; her terim ilk geçtiği yerde açıklanır.
- Kurulum gerekir mi?
- Hayır. Her ders tarayıcında açılan sana özel bir lab ortamında geçer.
- Dersler nasıl işleniyor?
- Her ders 8 ile 10 adımdan ve bir kısa sınavdan oluşur. İlk adımlarda yazman gereken komut gösterilir, sonraki adımlarda yardım azalır; iki denemede takılırsan çözüm açılır.
- Ücretsiz deneyebilir miyim?
- Evet. Her kursun ilk üç dersi ücretsizdir.