Dijital Vatandaşlık Özgeçmişi Projesi

Proje Özeti

Ne geliştirilecek?

Kurgusal bilgilerle mobil öncelikli, yazdırılabilir ve erişilebilir özgeçmiş sayfası.

Amaç

Neden uygulanmalı?

Kısa bilgi sunumu, responsive layout ve kişisel veri minimizasyonunu birlikte uygulamak.

Problem / İhtiyaç

Çözüm hangi ihtiyaçtan doğuyor?

Deneyim ve beceriler farklı ekranlarda düzenli görünürken hassas bilgiler korunmalıdır

Öğrenme Kazanımları

Mobil öncelikli CSS yazar.
Tarih listesini düzenler.
Gereksiz kişisel veriyi ayıklar.

Sınıfta Uygulama

Hedef Kitle: Temel bilgisi olan orta seviye lise öğrencileri
Önerilen Süre: 3–4 ders saati
Çalışma Biçimi: Bireysel veya 2–3 kişilik grup
Öğretmen Hazırlığı: Dijital Vatandaşlık Özgeçmişi için örnek girdileri, güvenlik sınırlarını ve test ölçütlerini dersten önce kontrol etmek.

Derse Giriş Etkinliği

Öğrencilere “Deneyim ve beceriler farklı ekranlarda düzenli görünürken hassas bilgiler korunmalıdır” durumu verilir; kod veya araç göstermeden önce olası çözüm adımlarını tahmin etmeleri istenir.

10 dk: Merak uyandıran problem ve tahmin
20 dk: Temel kavram ve örnek
35 dk: Uygulama
20 dk: Test ve hata ayıklama
15 dk: Geliştirme ve öğrenci açıklaması

Ön Koşullar

Temel dijital okuryazarlık
Kaynak ve veri güvenliği farkındalığı

Kullanılacak Araçlar ve Teknolojiler

HTML
CSS
Mobile First
Print CSS

Gerekli Malzemeler

Kod editörü
Kurgusal özgeçmiş içeriği

Uygulama Aşamaları

Kurgusal içerik hazırla.
Semantik bölümleri kur.
Mobil stili yaz.
Geniş ekranı ekle.
Yazdırmayı test et.

Örnek Kod veya Teknik İçerik

Mobil öncelikli temel

Akışkan genişlik, içeriği 375 px'de taşmadan gösterir.

css

* { box-sizing: border-box; } body { margin: 0; font: 1rem/1.6 system-ui; color: #172033; }
header, main, footer { width: min(100% - 2rem, 70rem); margin-inline: auto; }
nav { display: flex; flex-wrap: wrap; gap: 1rem; padding-block: 1rem; }
section { padding-block: clamp(2rem, 7vw, 5rem); }
.skip { position: absolute; left: -9999px; } .skip:focus { left: 1rem; top: 1rem; }
@media (min-width: 48rem) { main { display: grid; gap: 2rem; } }

Öğrenci Görevi

Uygula ve geliştir

Kurgusal bir aday için beceri, eğitim ve proje bölümleri oluştur; adres, kimlik ve telefon ekleme.

Beklenen Sonuç

Başarı nasıl görünecek?

Öğrenci, “Kurgusal bir aday için beceri, eğitim ve proje bölümleri oluştur; adres, kimlik ve telefon ekleme.” görevini tamamlayan çalışan bir ürün sunar; sonucunu test senaryoları, gözlemler ve teknik kararlarını açıklayan kısa bir değerlendirmeyle kanıtlar.

Değerlendirme Ölçütleri

Toplam: 100 puan

Ölçüt	Puan
Dijital Vatandaşlık Özgeçmişi gereksinimlerini karşılama	25
Teknik doğruluk ve kavram kullanımı	20
Test etme ve kanıt sunma	20
Problem çözme ve iyileştirme	20
Düzen, etik ve açıklama	15

Geliştirme Fikirleri

PDF yazdırma
Tema tercihi
Dil seçeneği

Test Senaryoları

375/768/1440 px
Yazdırma önizleme
Uzun başlık

Sık Karşılaşılan Hatalar

Hassas bilgi
Sabit piksel genişliği
Tarih hizası bozuk

Hata Ayıklama Önerileri

Hassas bilgi: Girdiyi veya bağlantıyı tek tek doğrula; değişiklikten sonra aynı testi yeniden çalıştır.
Sabit piksel genişliği: Girdiyi veya bağlantıyı tek tek doğrula; değişiklikten sonra aynı testi yeniden çalıştır.
Tarih hizası bozuk: Girdiyi veya bağlantıyı tek tek doğrula; değişiklikten sonra aynı testi yeniden çalıştır.

Güvenlik Notları

Gerçek kimlik, adres, telefon veya imza kullanmayın.

Öğretmen Notları

Hazır çözümü vermeden önce öğrenciden tahminini ve denediği adımı açıklamasını isteyin.
Sonucu yalnız çalışıyor/çalışmıyor olarak değil; test kanıtı ve açıklamayla değerlendirin.

Öğrenci Öz Değerlendirme Soruları

Çözümüm hangi problemi gideriyor ve bunu nasıl test ettim?
En zorlandığım hata neydi; hangi ipucu çözmeme yardım etti?
Bir sonraki sürümde neyi değiştirir ve neden değiştirirdim?

Sonraki Öğrenme Önerisi

Buradan sonra ne öğrenilebilir?

CSS print media ve erişilebilir tipografi çalış.

Ders Paketi

Materyaller

Projeyi sınıfta uygulamak için hazırlanan materyalleri PDF veya düzenlenebilir Word biçiminde indirebilirsin.

Öğretmen Kılavuzu
Dijital Vatandaşlık Özgeçmişi için amaç, hazırlık, ders akışı, uygulama, güvenlik, hata ayıklama ve geliştirme önerileri.
PDF İndir Word İndir
Öğrenci Çalışma Kâğıdı
Dijital Vatandaşlık Özgeçmişi için tahmin, uygulama, test, gözlem, sonuç ve öz değerlendirme alanları.
PDF İndir Word İndir
Değerlendirme Rubriği
Dijital Vatandaşlık Özgeçmişi için projeye özel, gözlenebilir ölçütlerden oluşan 100 puanlık değerlendirme rubriği.
PDF İndir Word İndir

Öğrenmeye Devam Et

Benzer Projeler

Tüm Projelere Dön İçerik Önerisi Paylaş

Dijital Vatandaşlık Özgeçmişi