0Pricing
HTML Academy icon

HTML Academy

HTMLWebFrontendBeginner

Web geliştirmede sağlam temellerini HTML Academy'de HTML öğrenerek inşa et.

🤖 Yapay Zeka Destekli📚 40 kurs👥 100.000+ öğrenci⭐ 4,9 puan
Kurs Özeti

HTML: Her Web Sayfasının Arkasındaki Dil

HTML, web'in yapısal temelidir — her tarayıcı sekmesi, form gönderimi ve gömülü video işaretlemeden başlar. Bu program, geçerli bir belgeyi yönetim kurallarından modern üretim sitelerinde kullanılan tarayıcı API'lerine ve bileşen modellerine kadar HTML'de gerçek akıcılığı inşa eder. Amaç sadece etiketler yazmak değil, her öğenin neden var olduğunu ve tarayıcılara, yardımcı teknolojilere ve arama motorlarına ne bildirdiğini anlamaktır.

Öğrenecekleriniz

Belge yapısı, metin içeriği, bağlantılar, görüntüler ve listelerle başlayacak, ardından tablolar, formlar ve form doğrulama özelliklerine geçeceksiniz. Program, semantic HTML5 öğelerini, <head> ve meta verileri, ses ve videoyu ve ARIA rolleri ve özellikleri dahil olmak üzere erişilebilirlik temellerini kapsar. Sonraki kurslar özel veri özniteliklerini, HTML şablonlarını, Canvas ve SVG öğelerini, Web Storage'ı, Drag and Drop API'sini, SEO ve sosyal meta etiketlerini ve HTML e-posta şablonlarını ele alır. İleri bölümler Shadow DOM'u, Web Components ve özel öğelerini, HTML modüllerini ve import map'lerini, progressive enhancement'ı, uluslararasılaştırmayı, güvenliği, History ve Navigation API'sini, Intersection Observer'ı ve Progressive Web Apps için HTML oluşturmayı kapsar.

Öğrenme Yolu

Kırk kurs A1'den A2'ye ve B1'den B2'ye ilerler, HTML at Scale üzerine bir C1 tamamlayıcı projesiyle sona erer. A1 ve A2 kursları temel bilgileri — belge yapısı, semantic öğeleri, formlar ve meta verileri — ortaya koyar. B1, erişilebilirlik, ARIA, Canvas, SVG ve tarayıcı depolamasını tanıtır. B2, Web Components, Shadow DOM, performans, güvenlik, uluslararasılaştırma ve Intersection Observer'ı kapsayan en büyük bloğudur. Son C1 kursu, HTML at Scale, HTML'nin yazılıp, test edilip ve büyük kod tabanları arasında korunduğunda önemli olan desenleri ve kısıtlamaları ele alır.

Nasıl Çalışır

Her kurs, yerleşik kod editöründe gerçek zamanlı geri bildirimle tamamladığınız kısa, uygulamalı dersler halinde bölünür. Sıkıştığınız zaman bir yapay zeka öğretmeni kullanılabilir ve kendi hızınızda ilerlediğiniz — her ders bağımsızdır, böylece daha sonra herhangi bir konuya başvuru olarak geri dönebilirsiniz.

Öğrenmeye Başla →

Nasıl Öğreneceksin

🎯
Etkileşimli Dersler
Gerçek zamanlı geri bildirim ile uygulamalı kodlama alıştırmaları
🤖
AI Öğretmen
Takılırsan AI'dan anında yardım al
💻
Yerleşik Editör
Tarayıcında doğrudan kod yaz ve çalıştır
🏆
Sertifika
Kursu tamamladığında sertifika kazan
Müfredat

40 Kurs

HTML Academy öğrenme yolundaki tüm kurslar.

01

HTML Belge Yapısı

A13 ders

Tarayıcıların HTML'yi nasıl ayrıştırdığını, DOCTYPE'ın ne yaptığını ve html, head ve body öğelerinin her web sayfasını nasıl düzenlediğini…

02

Metin İçeriği Öğeleri

A14 dersPRO

HTML metin etiketleriyle başlıklarda, paragraflarda, vurgulamada, satır içi öğelerde ve boşluk denetiminde uzmanlaşın.

03

Bağlantılar ve Gezinme

A14 dersPRO

Bağlantı öğeleri, mutlak ve göreli URL'ler, yeni sekmede açılan bağlantılar ve parça tanımlayıcılarıyla gezinme oluşturun.

04

Görseller ve Şekiller

A14 dersPRO

img, srcset, picture öğesi ve anlamsal şekil açıklamalarıyla görselleri duyarlı şekilde görüntüleyin.

05

Listeler

A14 dersPRO

Uygun iç içe yerleştirme ve anlamsal anlamla sırasız, sıralı ve açıklama listeleri oluşturun.

06

Tablolar

A24 dersPRO

Uygun yapıya, hücre birleştirmeye ve tablo bölümlerine sahip erişilebilir veri tabloları oluşturun.

07

HTML Öznitelikleri ve Genel Öznitelikler

A24 dersPRO

Tüm HTML öğelerinde kullanılan id, class, style, hidden, tabindex ve özel data-* özniteliklerini anlayın.

08

HTML Formlarının Temelleri

A24 dersPRO

Giriş türleri, etiketler, düğmeler ve form öğesinin action ile method öznitelikleriyle erişilebilir web formları oluşturun.

09

İleri Düzey Form Denetimleri

A24 dersPRO

Açılır listeler, metin alanları, onay kutusu grupları, radyo düğmeleri ve datalist ile otomatik tamamlama kullanarak formları geliştirin.

10

Form Doğrulama Öznitelikleri

A24 dersPRO

Gönderimden önce kullanıcı girişini doğrulamak için required, pattern, min ve max gibi HTML5 doğrulama özniteliklerini kullanın.

11

Anlamsal HTML5

A24 dersPRO

Genel div öğelerini header, nav, main, footer, article ve section gibi anlamlı HTML5 öğeleriyle değiştirin.

12

Diğer Anlamsal Öğeler

A24 dersPRO

Sayfalara daha zengin anlam ve etkileşim eklemek için aside, details, summary, progress ve meter öğelerini inceleyin.

13

HTML Head Bölümü ve Meta Veriler

A24 dersPRO

head bölümünde uzmanlaşın: title, meta etiketleri, viewport, canonical URL'ler, robots yönergeleri ve favicon'lar.

14

Ses ve Video Öğeleri

A24 dersPRO

HTML5 ile ses ve videoyu yerel olarak gömün, birden fazla biçim sunun ve track ile WebVTT kullanarak altyazılar ekleyin.

15

HTML Erişilebilirliğinin Temelleri

B14 dersPRO

Kapsayıcı web sayfaları için WCAG düzeylerini, başlık hiyerarşisini, alt metni stratejisini ve klavye gezinmesini anlayın.

16

ARIA Rolleri ve Öznitelikleri

B14 dersPRO

ARIA rolleri, etiketleri ve açıklamalarıyla erişilebilirliği geliştirin ve önce yerel HTML kullanma kuralını öğrenin.

17

Özel Veri Öznitelikleri

B14 dersPRO

data-* öznitelikleri, dataset API'si ve CSS seçicilerini kullanarak HTML öğelerinde özel meta verileri depolayın ve bunlara erişin.

18

HTML Şablonları

B14 dersPRO

Etkisiz işaretlemeler tanımlamak için template öğesini kullanın, bu öğeyi verimli şekilde kopyalayın ve innerHTML tabanlı görüntülemeyle ka…

19

Canvas Öğesi

B14 dersPRO

2B bir canvas üzerinde şekiller, metinler ve görseller çizin ve bunları requestAnimationFrame ile canlandırın.

20

HTML'de SVG

B14 dersPRO

Ölçeklenebilir vektör grafiklerini satır içinde gömün, temel şekilleri kullanın, viewBox'ı denetleyin ve SVG'yi CSS ile canlandırın.

21

iframe ve Gömülü İçerik

B14 dersPRO

Harici içerikleri iframe ile gömün, güvenlik için korumalı alan kullanımını anlayın ve performans için tembel yükleme kullanın.

22

HTML Web Depolama

B14 dersPRO

İstemci tarafı verileri localStorage ve sessionStorage ile depolayın, depolama olaylarını dinleyin ve güvenlik yönergelerine uyun.

23

Sürükle ve Bırak API'si

B14 dersPRO

HTML5 Sürükle ve Bırak API'si ve dataTransfer nesnesiyle sürükle ve bırak etkileşimleri uygulayın.

24

SEO ve Sosyal Meta Veriler

B14 dersPRO

OpenGraph, Twitter Cards, JSON-LD ve hreflang ile sayfaları arama motorları ve sosyal paylaşım için optimize edin.

25

HTML E-posta Şablonları

B14 dersPRO

Tablo tabanlı yerleşimler, satır içi stiller ve istemciler arası görsel tekniklerini kullanarak e-posta uyumlu HTML oluşturun.

26

İleri Düzey ARIA Kalıpları

B24 dersPRO

Geçiş kalıplarını, sekme arayüzlerini ve canlı bölgeleri uygulayın ve gerçek ekran okuyucularla test edin.

27

HTML Performansı

B24 dersPRO

async ve defer betikleri, ön yükleme ipuçları, tembel yüklenen görseller ve kaynak ipuçlarıyla sayfa yüklemelerini hızlandırın.

28

Web Components Özel Öğeleri

B24 dersPRO

Custom Elements API'si, yaşam döngüsü geri çağırmaları ve gözlemlenen özniteliklerle yeniden kullanılabilir özel HTML öğeleri tanımlayın.

29

Shadow DOM

B24 dersPRO

İşaretlemeleri ve stilleri Shadow DOM içinde kapsülleyin, içeriği yuvalarla dağıtın ve part ile stillendirme API'leri sunun.

30

HTML Modülleri ve İçe Aktarma Haritaları

B24 dersPRO

ES modül betiklerini, yalın belirteçler için içe aktarma haritalarını, dinamik içe aktarmaları ve modül federasyonu kavramlarını kullanın.

31

Aşamalı Geliştirme

B24 dersPRO

Aşamalı geliştirmeyle oluşturun: sağlam HTML ile başlayın, CSS ve JavaScript katmanlarını ekleyin ve özellikleri doğru şekilde algılayın.

32

Uluslararasılaştırma

B24 dersPRO

lang, dir, bdi, bdo, charset ve sağdan sola metin desteğiyle HTML'yi küresel kitlelere hazırlayın.

33

HTML Güvenliği

B24 dersPRO

CSP, korumalı alan, SRI ve güvenli HTML işleme uygulamalarıyla sayfalarınızı XSS, tıklama hırsızlığı ve enjeksiyon saldırılarına karşı koru…

34

HTML Formlarının Gelişmiş API'si

B24 dersPRO

FormData, Constraint Validation API, özel geçerlilik iletileri ve form durumu yönetiminden yararlanın.

35

HTML Geçmişi ve Gezinme API'si

B24 dersPRO

SPA yönlendirmesi için pushState, popstate olayları ve modern Navigation API ile tarayıcı geçmişini yönetin.

36

Intersection Observer

B24 dersPRO

Tembel yükleme, sonsuz kaydırma ve kaydırmayla bağlantılı animasyon tetikleyicileri uygulamak için IntersectionObserver kullanın.

37

PWA'ler için HTML

B24 dersPRO

Web uygulaması bildirimi, hizmet çalışanı kaydı ve çevrimdışı geri dönüş sayfalarıyla aşamalı web uygulamalarını yapılandırın.

38

HTML Doğrulama ve Test

B24 dersPRO

İşaretlemeyi W3C Validator ile doğrulayın, HTML'yi Lighthouse ile denetleyin ve erişilebilirliği pa11y ile axe kullanarak test edin.

39

HTML'nin Geleceği

B24 dersPRO

Ortaya çıkan HTML özelliklerini keşfedin: Declarative Shadow DOM, Popover API, selectlist ve command öznitelikleri.

40

Büyük Ölçekli HTML

C14 dersPRO

Büyük projelerde HTML'yi bileşenlere ayırma, sunucu tarafı şablon oluşturma, tasarım sistemleri ve stil kılavuzu belgeleriyle yönetin.

SSS

Sıkça Sorulan Sorular

HTML Academy kursu ücretsiz mi?

Evet. HTML Academy kursunu ücretsiz olarak başlayabilir ve etkileşimli derslerini hiç ücret ödemeden tamamlayabilirsin. İsteğe bağlı PRO aboneliği gelişmiş yapay zeka araçlarını ve paylaşılabilir bir sertifikayı açar.

HTML öğrenmek için önceki deneyim gerekli mi?

Hayır. Kurs temel bilgilerle başlar ve giderek daha ileri konulara ilerler, bu nedenle HTML deneyimi olmasa bile başlayabilirsin.

CoddyKit'te HTML nasıl öğreneceksin?

Yaparak öğrenirsin. Kısa etkileşimli dersler, açık bir açıklama ile gerçek zamanlı çalışan uygulamalı bir kodlama alıştırmasını bir araya getirir ve 24/7 AI öğretmen takılırsan kişiselleştirilmiş yardım sağlar.

HTML Academy kursunu tamamladığımda sertifika alır mıyım?

Evet. PRO öğrenenler sınav yapabilir ve HTML Academy kursu için doğrulanabilir bir koduyla paylaşılabilir bir tamamlama sertifikası kazanabilirler.

HTML öğrenimini telefonumda yapabilir miyim?

Evet. CoddyKit web ve yerel iOS ile Android uygulamaları olarak erişilebilir, böylece HTML öğrenimini herhangi bir cihazda yapabilir ve ilerlemeniz cihazlar arasında senkronize olur.

HTML Academy Kursuna Şimdi Başla

Yapay zeka destekli derslerle programlamayı öğrenen binlerce öğrenciye katıl.

Ücretsiz Başla →Tüm Kursları Gözden Geçir