Blogger İçin HTML Ders Planı

Blogger (Blogspot) kullanıcılarının büyük bir kısmı temalarını özelleştirmek, yazılarını şekillendirmek veya özel widget'lar eklemek için temel düzeyde HTML ve CSS bilgisine ihtiyaç duyuyor. Onların tam olarak işine yarayacak, sıkılmadan ve doğrudan uygulayarak öğrenebilecekleri pratik bir ders serisi hazırladık.Ders 1: HTML Nedir ve Blogger'da Nerede Bulunur?

• Amaç: HTML mantığını kavramak ve Blogger arayüzündeki yerini öğrenmek.

• İçerik:

  • HTML bir programlama dili midir? (Web sitelerinin iskeleti mantığı).

  • Etiket (Tag) mantığı: <açılış> ve </kapanış> etiketleri.

  • Blogger'da HTML ile çalışılan iki ana yer: Yazı Editörü (HTML Görünümü) ve Tema > HTML'yi Düzenle alanı.

  • İlk Pratik: Yazı editöründe HTML görünümüne geçip basit bir merhaba metni yazmak.

Ders 2: Metin Biçimlendirme ve Başlık (Heading) Etiketleri

• Amaç: Yazı içi SEO ve görsel düzen için metinleri HTML ile yönetmek.

• İçerik:

  • Başlık etiketleri (<h1> - <h6> arası) ve Blogger'daki karşılıkları (Ana Başlık, Başlık, Alt Başlık). SEO için başlık hiyerarşisinin önemi.

  • Kalın (<strong> / <b>), Eğik (<em> / <i>) ve Üstü Çizili (<del>) metinler.

  • Paragraf (<p>) ve Satır Atlama (<br>) etiketleri. (Blogger editörünün bazen fazladan boşluk bırakma sorununun çözümü).

Ders 3: Link (Bağlantı) Verme ve Görsel (Resim) Ekleme

• Amaç: Site içi/dışı köprüler kurmak ve görselleri HTML ile optimize etmek.

• İçerik:

  • <a> etiketi ve href niteliği (attribute).

  • Linkleri yeni sekmede açma (target="_blank") ve SEO dostu yapma (rel="nofollow" veya rel="noopener").

  • <img> etiketi, src, alt (Görsel alternatif metni - SEO için kritik) nitelikleri.

  • Blogger resimlerinin boyutlarını ve hizalamasını HTML ile müdahale etme.

Ders 4: Listeler ve Tablo Oluşturma

• Amaç: İçerikleri daha okunabilir ve düzenli hale getirmek.

• İçerik:

  • Sıralı Listeler (<ol> ve <li>) ve Sırasız/Maddeli Listeler (<ul> ve <li>).

  • Blogger yazılarında teknik veri veya karşılaştırma sunmak için temel Tablo (<table>, <tr>, <td>, <th>) yapısı.

Ders 5: Blogger Bölmeleri (Div ve Span) ve Sayfa Düzeni

• Amaç: Kodları gruplamayı ve yapısal bloklar oluşturmayı öğrenmek.

• İçerik:

  • Blok element (<div>) ve satır içi element (<span>) farkı.

  • Blogger temalarında sıkça gördüğümüz class ve id niteliklerinin mantığı (CSS'e hazırlık).

  • Uygulama: Yazı içine özel bir "Not Kutusu" veya "Uyarı Alanı" iskeleti kurma.

Ders 6: Iframe (Dışarıdan İçerik Çekme) ve Blogger Widget Mantığı

• Amaç: Bloga YouTube videosu, harita veya harici araçlar entegre etmek.

• İçerik:

  • <iframe> etiketi nedir, nasıl kullanılır?

  • YouTube veya Google Haritalar'dan "Yerleştirme (Embed)" kodu alıp bloga ekleme.

  • Blogger Yerleşim (Layout) kısmındaki "HTML/JavaScript" widget'ının gücü.