PopülerYolculuk
HTML Öğren
HTML öğrenmeye sıfırdan başla. Ücretsiz online kursta belge yapısı, semantik etiketler, bağlantılar, formlar, görseller ve temel erişilebilirlik konularını pratik görevler, gerçek projeler, yapay zeka ipuçları ve bitirme sertifikasıyla öğren.
249,002+ codders kayıtlı
Bu yolculuk şunları içerir
Yapay zeka destekli kodlama yardımı
Uygulamalı interaktif dersler
Her derste sesli anlatım
Bilgini sınamak için testler
Ücretsiz tamamlama sertifikası
Müfredat
5 bölüm241 ders212 görev1,203 quiz sorusu01Bölüm 1
Fundamentals
Learn the core structure and syntax to create web pages from scratchÖĞRENMEYE BAŞLAHTML Temelleri
5 ders531- 01HTML Nedir?Görev
- 02HTML'in Temel YapısıGörevQuizSes
- 03Etiketler ve ElementlerGörevQuizSes
- 04İç İçe Geçirme ve Kapatma EtiketleriGörevQuizSes
- 05HTML'de YorumlarGörevQuizSes
Metin ve Biçimlendirme
6 ders1137- 01BaşlıklarGörevUstalıkQuizSes
- 02ParagraflarGörevUstalıkQuizSes
- 03Satır SonlarıGörevUstalıkQuizSes
- 04Kalın ve İtalik MetinGörevUstalıkQuizSes
- 05Yeniden Kalın ve İtalikGörevUstalıkQuizSes
- 06Özet - BiçimlendirmeGörev
Listelerle Çalışma
4 ders721- 01Sırasız ListeGörevUstalıkQuizSes
- 02Sıralı ListeGörevUstalıkQuizSes
- 03İç İçe ListelerGörevUstalıkQuizSes
- 04Özet - ListelerGörev
Tarif Kartı
Proje4 ders1- 01Projeye Genel BakışGörev
- 02Tarif Başlığı ve AçıklamasıProje
- 03MalzemelerProje
- 04AdımlarProje
İçerik Ekleme
5 ders837- 01HTML ÖznitelikleriQuizSes
- 02BağlantılarGörevUstalıkQuizSes
- 03Yeni Sayfa BağlantılarıGörevUstalıkQuizSes
- 04GörsellerGörevUstalıkQuizSes
- 05Görsel ÖznitelikleriGörevUstalıkQuizSes
Sayfa Düzeni
5 ders931- 01BölümlerGörevUstalıkQuizSes
- 02Satır İçi Span'lerGörevUstalıkQuizSes
- 03Semantik EtiketlerGörevUstalıkQuizSes
- 04Section ve Article EtiketleriGörevUstalıkQuizSes
- 05Özet - DüzenGörev
Kişisel Profil Sayfası
Proje5 ders1- 01Projeye Genel BakışGörev
- 02Header BölümüProje
- 03Profil ResmiProje
- 04Hakkımda BölümüProje
- 05Sosyal BağlantılarProje
Formlar ve Inputlar Bölüm 1
6 ders937- 01Form TemelleriQuizSes
- 02Metin InputlarıGörevUstalıkQuizSes
- 03Input ÖznitelikleriGörevUstalıkQuizSes
- 04Şifre AlanıGörevUstalıkQuizSes
- 05Inputlar için EtiketlerGörevUstalıkQuizSes
- 06Özet - Temel FormGörev
Formlar ve Girdiler Bölüm 2
7 ders1239- 01Radyo DüğmeleriGörevUstalıkQuizSes
- 02Onay KutularıGörevUstalıkQuizSes
- 03Açılır MenülerGörevUstalıkQuizSes
- 04ButonlarGörevUstalıkQuizSes
- 05Formlardaki ButonlarGörevUstalıkQuizSes
- 06Özet - Formlar #1Görev
- 07Özet - Formlar #2Görev
Tablolar
4 ders725- 01Tablo TemelleriGörevUstalıkQuizSes
- 02Başlık EklemeGörevUstalıkQuizSes
- 03Satır ve Sütun BirleştirmeGörevUstalıkQuizSes
- 04Özet - TablolarGörev
Etkinlik Kayıt Sayfası
Proje5 ders1- 01Projeye Genel BakışGörev
- 02Header BölümüProje
- 03Etkinlik Detayları BölümüProje
- 04Kayıt FormuProje
- 05Footer BölümüProje
Final Meydan Okumaları
4 ders4- 01Basit Profil KartıGörev
- 02Etkinlik Davetiye KartıGörev
- 03Basit Makale SayfasıGörev
- 04Favori Kitaplar ListesiGörev
02Bölüm 2
Styling with CSS
Bring your web pages to life with colors, layouts, and stylesÖĞRENMEYE BAŞLAGiriş
5 ders540- 01CSS Nedir?GörevQuiz
- 02CSS SözdizimiGörevQuiz
- 03CSS Yorum SatırlarıQuiz
- 04Head EtiketiGörevQuiz
- 05Title EtiketiGörevUstalıkQuiz
CSS Ekleme
4 ders725- 01Satır İçi CSSGörevUstalıkQuiz
- 02Dahili CSSGörevUstalıkQuiz
- 03Harici CSSGörevUstalıkQuiz
- 04Temel Stil Verme MücadelesiGörev
Temel Seçiciler
7 ders1247- 01Seçicilere GirişGörevQuiz
- 02Tür SeçiciGörevUstalıkQuiz
- 03Sınıf SeçiciGörevUstalıkQuiz
- 04ID SeçiciGörevUstalıkQuiz
- 05Grup SeçicilerGörevUstalıkQuiz
- 06Evrensel SeçiciGörevUstalıkQuiz
- 07Seçim Meydan OkumasıGörev
Metin Temelleri
8 ders1450- 01Metin RengiGörevUstalıkQuiz
- 02Yazı Tipi AilesiGörevUstalıkQuiz
- 03Yazı Tipi BoyutuGörevUstalıkQuiz
- 04Yazı Tipi KalınlığıGörevUstalıkQuiz
- 05Metin HizalamaGörevUstalıkQuiz
- 06Metin SüslemeGörevUstalıkQuiz
- 07Tekrar Görevi #1Görev
- 08Tekrar Görevi #2Görev
Renkler ve Arka Planlar
5 ders834- 01Arka Plan RengiGörevUstalıkQuiz
- 02HEX RenkleriGörevUstalıkQuiz
- 03RGB RenkleriGörevUstalıkQuiz
- 04RGBA ile ŞeffaflıkGörevQuiz
- 05Tekrar Görevi #1Görev
Kafe Menüsü
Proje3 ders1- 01Tipografi TemelleriGörev
- 02Metin ŞekillendirmeProje
- 03Renk ve Arka PlanlarProje
Kutu Modeli Bölüm 1
6 ders943- 01Kutu Modeli Nedir?Quiz
- 02PaddingGörevUstalıkQuiz
- 03MarginGörevUstalıkQuiz
- 04KenarlıklarGörevUstalıkQuiz
- 05Genişlik ve YükseklikGörevUstalıkQuiz
- 06Özet Meydan OkumasıGörev
Kutu Modeli Bölüm 2
5 ders834- 01Kutu BoyutlandırmaGörevQuiz
- 02Kenarlık YarıçapıGörevUstalıkQuiz
- 03TaşmaGörevUstalıkQuiz
- 04Kutu GölgesiGörevUstalıkQuiz
- 05Tekrar Meydan OkumasıGörev
Flex Box
6 ders943- 01Flex Box Nedir?GörevQuiz
- 02Flex DirectionGörevUstalıkQuiz
- 03Justify ContentGörevUstalıkQuiz
- 04Align ItemsGörevUstalıkQuiz
- 05Kusursuz OrtalamaGörevQuiz
- 06Flex Box Meydan OkumasıGörev
Giriş Formu
Proje4 ders1- 01GövdeGörev
- 02Form KapsayıcısıProje
- 03InputProje
- 04ButonProje
Yerleşim Teknikleri
7 ders1152- 01Block ve Inline ÖğelerGörevQuiz
- 02Konumlandırma TemelleriGörevUstalıkQuiz
- 03Relative KonumlandırmaGörevUstalıkQuiz
- 04Absolute KonumlandırmaGörevUstalıkQuiz
- 05Fixed KonumlandırmaGörevUstalıkQuiz
- 06Z-Index TemelleriGörevQuiz
- 07Özet Meydan OkumasıGörev
Duyarlı Tasarım Temelleri
6 ders1052- 01Responsive Tasarım Nedir?GörevQuiz
- 02Viewport Meta EtiketiGörevQuiz
- 03Akışkan DüzenlerGörevUstalıkQuiz
- 04Viewport BirimleriGörevUstalıkQuiz
- 05Media Queries TemelleriGörevUstalıkQuiz
- 06Esnek GörsellerGörevUstalıkQuiz
Tonga Web Sayfası
Proje6 ders1- 01Gezinme MenüsüGörev
- 02Karşılama BaşlığıProje
- 03Hakkında BölümüProje
- 04İletişim BölümüProje
- 05Viewport EtiketiProje
- 06Media QueryProje
Son Meydan Okumalar
4 ders4- 01Öğeleri DüzenleGörev
- 02Film ListesiGörev
- 03Düğün DavetiyesiGörev
- 04Yüzen BildirimGörev
03Bölüm 3
CSS Mastery
Take you css skills to the next level!ÖĞRENMEYE BAŞLASeçici Uzmanlığı – Kombinasyon
6 ders539- 01GirişQuiz
- 02Alt Öğe SeçicisiGörevQuiz
- 03Çocuk SeçiciGörevQuiz
- 04Bitişik Kardeş SeçicisiGörevQuiz
- 05Genel Kardeş SeçicisiGörevQuiz
- 06Özet Meydan OkumasıGörev
Etkileşimli Sözde Sınıflar
5 ders431- 01Sözde SınıflarQuiz
- 02Hover EfektleriGörevQuiz
- 03Odaklanma EfektleriGörevQuiz
- 04Aktif StillerGörevQuiz
- 05Özet Meydan OkumasıGörev
Yapısal sözde sınıflar
5 ders432- 01Yapısal sözde sınıflarQuiz
- 02İlk Çocuğu HedeflemeGörevQuiz
- 03Son Çocuğu HedeflemeGörevQuiz
- 04Desen Gücü: nth-child KullanımıGörevQuiz
- 05Özet Meydan OkumasıGörev
Açılır Menü Projesi
4 ders4- 01Alt Menüyü EkleGörev
- 02Alt Menüyü GösterGörev
- 03Daha Fazla Stil VermeGörev
- 04Input ve ButonGörev
Görsel Efektler
5 ders536- 01GradyanlarGörevQuiz
- 02CSS FiltreleriGörevQuiz
- 03TransformGörevQuiz
- 04Geçişler ve Hover EfektleriGörevQuiz
- 05Tekrar Meydan OkumasıGörev
Açılış Sayfası
5 ders5- 01Header Bölümünü Stilize EtGörev
- 02Butonu Stilize EtGörev
- 03Bölüm DüzeniGörev
- 04Kart DüzeniGörev
- 05Son Dokunuşları EkleGörev
CSS Grid ile İnşa Edin
4 ders426- 01Grid TemelleriGörevQuiz
- 02Grid-row Öğe YerleşimiGörevQuiz
- 03İsimlendirilmiş AlanlarGörevQuiz
- 04Tekrar GöreviGörev
Flavor Fiesta web sitesi
4 ders4- 01Grid yapısını kurmaGörev
- 02HeaderGörev
- 03Ana bölümGörev
- 04FooterGörev
Son Meydan Okumalar
5 ders5- 01Aktif Menüyü VurgulamaGörev
- 02Zebra Tablo SatırlarıGörev
- 03Buton Hover EfektiGörev
- 04Grid Kart DüzeniGörev
- 05Bulanık Hero GörseliGörev
04Bölüm 4
Practical Frontend
Combine structure and style to design complete, responsive web pagesÖĞRENMEYE BAŞLADeğişkenler
5 ders432- 01DeğişkenlerQuiz
- 02CSS Değişkenlerini KullanmaGörevQuiz
- 03Design Tokens için DeğişkenlerGörevQuiz
- 04Yerel DeğişkenlerGörevQuiz
- 05Özet Meydan OkumasıGörev
Mobil Öncelikli Strateji
6 ders643- 01“Mobil öncelikli” ne anlama gelirGörevQuiz
- 02Mobil Öncelikli TipografiGörevQuiz
- 03Mobil Öncelikli NavigasyonGörevQuiz
- 04Mobil Öncelikli GörsellerGörevQuiz
- 05Mobil Öncelikli FormlarGörevQuiz
- 06Özet Meydan OkumasıGörev
Temalandırma ve Görsel Stiller
5 ders535- 01CSS'te TemalandırmaGörevQuiz
- 02Karanlık/Aydınlık Mod TemelleriGörevQuiz
- 03Vurgu Renkleri ve Öne ÇıkarmaGörevQuiz
- 04Tipografi TemalandırmaGörevQuiz
- 05Özet Meydan OkumasıGörev
Ekstrem Sporlar
3 ders3- 01DeğişkenlerGörev
- 02Mobil ÖncelikliGörev
- 03TemalandırmaGörev
UI bileşenleri
6 ders642- 01Açılır menüGörevQuiz
- 02SekmelerGörevQuiz
- 03RozetlerGörevQuiz
- 04Araç ipuçlarıGörevQuiz
- 05Bildirim banner'larıGörevQuiz
- 06Tekrar meydan okumasıGörev
Responsive Tasarım Kalıpları
6 ders645- 01Holy Grail DüzeniGörevQuiz
- 02Kart Izgara DüzeniGörevQuiz
- 03Yan Menü + İçerik DüzeniGörevQuiz
- 04Bölünmüş Ekran DüzeniGörevQuiz
- 05Yapışkan Üst / Alt BilgiGörevQuiz
- 06Genel TekrarGörev
Final Meydan Okumaları
4 ders4- 01Profil KartıGörev
- 02Çikolata Galerisi IzgarasıGörev
- 03Yedi HarikaGörev
- 04Yeni Yedi HarikaGörev
05Bölüm 5
JavaScript in Action
Explore how javascript is used with html and cssÖĞRENMEYE BAŞLAEtkileşim/UI Bileşenleri
4 ders433- 01SekmelerGörevQuiz
- 02Akordiyon (açılır/kapanır)GörevQuiz
- 03Modal (aç/kapat)GörevQuiz
- 04Açılır MenüGörevQuiz
Formlar ve Doğrulama
3 ders325- 01Girdi doğrulamaGörevQuiz
- 02Özel hata mesajlarıGörevQuiz
- 03Gönder butonlarıGörevQuiz
Bildirimler ve Geri Bildirim
3 ders327- 01Toast mesajıGörevQuiz
- 02Kapatılabilir banner'larGörevQuiz
- 03Yükleme göstergeleriGörevQuiz
Toast Bildirimli Form
2 ders2- 01Toast Mesajını GösterGörev
- 02Toast Mesajını GizleGörev
Navigasyon
3 ders329- 01Mobil burger menü açma/kapamaGörevQuiz
- 02Daraltılabilir yan navigasyonGörevQuiz
- 03Açılır menülerGörevQuiz
Temalandırma ve Kişiselleştirme
2 ders217- 01Koyu/açık temalarGörevQuiz
- 02Tema seçimini kaydetmeGörevQuiz
Animasyonlar ve Efektler
3 ders327- 01CSS geçişleriGörevQuiz
- 02Kaydırma ile öğe animasyonlarıGörevQuiz
- 03Buton tıklama animasyonlarıGörevQuiz
Animasyonlu Navigasyon
3 ders36- 01DeğişkenlerGörevQuiz
- 02Olay DinleyicileriGörev
- 03CSS TransitionGörev
Final Meydan Okumaları
4 ders4- 01Etkileşimli SSS AkordiyonuGörev
- 02Giriş FormuGörev
- 03Responsive NavbarGörev
- 04Temalı Blog SayfasıGörev
Neden Coddy ile HTML öğrenmelisin
- Online ve ücretsiz HTML kursu: kurulum yok, araç ayarı yok, başlamak için engel yok. Tarayıcıyı aç ve ilk dersten itibaren pratik yap.
- HTML dersleri basit bir tutorial’dan fazlasıdır: her konu gerçek kod yazacağın kısa bir alıştırmayla pekişir.
- Bir HTML egzersizinde takıldığında yapay zeka ipuçları bir sonraki adımı açıklar; cevabı tamamen vermeden öğrenmeni sağlar.
- HTML kursunu bitirdiğinde LinkedIn’de paylaşabileceğin veya CV’ne ekleyebileceğin ücretsiz tamamlama sertifikası alırsın.
HTML öğrenme hakkında sık sorulan sorular
HTML öğrenmek kolay mı?
Evet, daha önce deneyimin olmasa bile HTML ile başlayabilirsin. Coddy konuları kısa egzersizlere böler; söz dizimini anlar, belge yapısı, semantik etiketler, bağlantılar, formlar, görseller ve temel erişilebilirlik konularını uygular ve adım adım güven kazanırsın.
HTML öğrenmek ne kadar sürer?
HTML temelleri günlük pratikle genellikle bir iki haftada öğrenilir. Gerçek projeler üretirken rahat etmek için hızına göre bir ila üç ay ayırmak mantıklıdır.
HTML online ve ücretsiz nereden öğrenilir?
Coddy, HTML için ücretsiz online dersler, kodlama görevleri, quiz’ler ve projeler sunar. Hiçbir şey kurman gerekmez; her şey tarayıcıda çalışır.
HTML hızlı nasıl öğrenilir?
En hızlı yol her gün pratik yapmaktır. Coddy’de kısa açıklama, hemen ardından egzersiz ve yapay zeka destekli geri bildirim bulunur; uzun videolardan çok HTML yazarsın.
Kurs sonunda HTML sertifikası alıyor muyum?
Evet. Coddy’de HTML kursunu tamamladığında LinkedIn’de paylaşabileceğin veya CV’ne ekleyebileceğin ücretsiz bir tamamlama sertifikası alırsın.
HTML öğrendikten sonra ne geliştirebilirim?
Kurs sonunda web sayfaları, formlar, basit landing page’ler ve CSS/JavaScript projeleri için sağlam temeller geliştirebilirsin. Ayrıca daha ileri konulara geçmek için sağlam bir temel edinirsin.
