You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
4.2 KiB
4.2 KiB
HTML Uygulama Ödevi: Blog Taslağı Oluşturma
Amaç
Kişisel bir blog ana sayfası için HTML yapısını tasarlayın ve elle kodlayın. Bu alıştırma, semantik HTML, düzen planlama ve kod organizasyonu becerilerinizi geliştirmenize yardımcı olacaktır.
Talimatlar
-
Blog Taslağınızı Tasarlayın
- Blog ana sayfanızın görsel bir taslağını çizin. Başlık, navigasyon, ana içerik, yan panel ve alt bilgi gibi temel bölümleri ekleyin.
- Taslağınızı kağıt üzerinde çizip tarayabilir veya dijital araçlar (örneğin, Figma, Adobe XD, Canva veya PowerPoint) kullanabilirsiniz.
-
HTML Öğelerini Belirleyin
- Her bölüm için kullanmayı planladığınız HTML öğelerinin bir listesini oluşturun (örneğin,
<header>,<nav>,<main>,<article>,<aside>,<footer>,<section>,<h1>–<h6>,<p>,<img>,<ul>,<li>,<a>vb.).
- Her bölüm için kullanmayı planladığınız HTML öğelerinin bir listesini oluşturun (örneğin,
-
HTML Kodlamasını Yazın
- Taslağınız için HTML kodunu elle yazın. Semantik yapı ve en iyi uygulamalara odaklanın.
- En az 10 farklı HTML öğesi ekleyin.
- Seçimlerinizi ve yapınızı açıklayan yorumlar ekleyin.
-
Çalışmanızı Gönderin
- Taslağınızı ve HTML dosyanızı yükleyin.
- İsteğe bağlı olarak, tasarım kararlarınız hakkında kısa bir değerlendirme (2–3 cümle) yazın.
Değerlendirme Ölçütleri
| Kriter | Üstün Başarı | Yeterli | Geliştirme Gerekiyor |
|---|---|---|---|
| Görsel Taslak | Açık, detaylı taslak; bölümler etiketlenmiş ve düzen düşünülmüş | Temel taslak; bazı bölümler etiketlenmiş | Yetersiz veya belirsiz taslak; bölüm etiketleri eksik |
| HTML Öğeleri | 10+ semantik HTML öğesi kullanılmış; yapı ve en iyi uygulamalar konusunda anlayış gösteriyor | 5–9 HTML öğesi kullanılmış; bazı semantik yapı | 5'ten az öğe kullanılmış; semantik yapı eksik |
| Kod Kalitesi | İyi organize edilmiş, okunabilir kod; yorumlar eklenmiş; HTML standartlarına uygun | Çoğunlukla organize edilmiş kod; az sayıda yorum | Dağınık kod; yorumlar eksik |
| Değerlendirme | Tasarım kararları ve zorluklar hakkında içgörülü bir değerlendirme | Temel bir değerlendirme | Değerlendirme eksik veya alakasız |
İpuçları
- Daha iyi erişilebilirlik ve SEO için semantik HTML etiketlerini kullanın.
- Kodunuzu girintiler ve yorumlarla düzenleyin.
- MDN HTML Öğeleri Referansı adresine başvurabilirsiniz.
- Düzeninizin gelecekteki ödevlerde nasıl genişletilebileceğini veya stillendirilebileceğini düşünün.
Feragatname:
Bu belge, AI çeviri hizmeti Co-op Translator kullanılarak çevrilmiştir. Doğruluk için çaba göstersek de, otomatik çevirilerin hata veya yanlışlık içerebileceğini lütfen unutmayın. Belgenin orijinal dili, yetkili kaynak olarak kabul edilmelidir. Kritik bilgiler için profesyonel insan çevirisi önerilir. Bu çevirinin kullanımından kaynaklanan yanlış anlamalar veya yanlış yorumlamalar için sorumluluk kabul etmiyoruz.