Belajar HTML: Kursus Code
Belajar HTML: Kursus Code — Kursus HTML dengan editor pratinjau langsung di saku Anda
Belajar HTML: Kursus Code adalah kursus HTML untuk iPhone dan Android yang menghadirkan editor HTML dengan pratinjau langsung hanya dengan satu ketukan dari setiap pelajaran. Ketik sebuah tag, lihat halaman dirender, lalu berkembang dari heading pertama hingga formulir, tabel, HTML5 semantik, aksesibilitas, dan komponen web melalui 40 kursus singkat.
- Harga
- Gratis, peningkatan ke Pro
- Platform
- iOS dan Android
- Bahasa
- 22
- Rating usia
- 4+
- Memerlukan
- iOS 15.1 atau lebih baru
- App Store
- 3.0 ★ (1)
Sebuah tag akan lebih mudah dipahami setelah Anda melihatnya menghasilkan sesuatu.
HTML adalah bahasa markup, jadi cara tercepat untuk memahami elemen baru adalah dengan mengetikkannya dan melihat hasilnya. Setiap pelajaran di aplikasi ini berakhir dengan editor yang sudah terbuka, pratinjau berada di samping markup Anda, dan Anda hanya menambahkan file CSS atau JavaScript saat sudah siap menggunakannya.
Apa itu
Belajar HTML: Kursus Code adalah kursus HTML untuk iOS dan Android yang bisa dimulai secara gratis, mengajarkan markup halaman web melalui 40 kursus dan 159 pelajaran singkat, yang disusun dari tingkat pemula (A1) hingga mahir (C1). Setiap topik dipadukan dengan editor kode HTML bawaan dan pratinjau instan, 20 proyek terpandu seperti formulir kontak dan tabel harga yang aksesibel, 20 misi debugging, serta mentor AI, sehingga pemula total dapat beralih dari dokumen kosong ke halaman yang semantik, aksesibel, dan tersusun dengan baik.
Di dalam aplikasi
Tampilannya
Kursusnya
Materi dalam kursus HTML
40 kursus dan 159 pelajaran dari daftar kursus bawaan aplikasi, dalam urutan yang diajarkan oleh jalur belajar.
Struktur Dokumen, Teks, Tautan, Gambar, dan Daftar
Kerangka setiap halaman: struktur dokumen, heading dan paragraf, tautan dan navigasi, gambar dan figure, serta daftar berurutan dan tidak berurutan.
Tabel, Atribut, dan Atribut Global
Menyusun data dalam tabel, lalu mempelajari atribut yang menyesuaikan elemen, termasuk atribut global yang berfungsi pada setiap tag.
Formulir: Dasar, Kontrol Lanjutan, dan Validasi
Mulai dari input dasar, lalu kontrol yang lebih lengkap, kemudian atribut validasi yang memungkinkan browser memeriksa kolom sebelum dikirim.
HTML5 Semantik, Head dan Metadata, Audio dan Video
Elemen semantik, head dokumen dan metadatanya, serta elemen audio dan video.
Aksesibilitas, Peran ARIA, dan Pola ARIA Lanjutan
Dasar-dasar aksesibilitas, peran dan atribut ARIA, serta pola lanjutan yang digunakan untuk widget kustom.
Atribut Data, Template, Canvas, SVG, dan iframe
Atribut data kustom, template HTML, elemen canvas, SVG di dalam HTML, serta konten tersemat dalam iframe.
Web Storage, Drag and Drop, SEO, dan Template Email
Web storage dan API drag and drop, SEO dan tag meta sosial, serta aturan khusus template email HTML.
Web Components, Performa, dan HTML dalam Skala Besar
Elemen kustom, shadow DOM, import maps, dan progressive enhancement, ditambah performa, keamanan, PWA, dan pengujian, hingga HTML dalam skala besar.
Cara kerjanya
Cara mempelajari tag, dari membaca hingga merender
Sebuah pelajaran dibuat singkat dan editor berada di sebelahnya, sehingga membaca konsep dan mencobanya berlangsung dalam sesi yang sama.
Baca satu pelajaran singkat
Lanjutkan jalur pembelajaran dari titik terakhir Anda. Setiap pelajaran membahas satu ide, seperti daftar tak berurutan atau gambar dengan teks alt, dan hanya membutuhkan waktu beberapa menit.
Ketikkan ke editor dan lihat pratinjaunya
Buka editor dan tulis markup-nya. Pratinjau akan menggambar ulang halaman Anda, sementara tab CSS dan JavaScript tersedia saat Anda ingin menata halaman atau membuatnya merespons.
Periksa, perbaiki, dan bangun dengannya
Kuis dan tantangan coding menutup setiap topik. Saat sebuah tag atau kesalahan masih membingungkan, mentor AI akan menjelaskannya, misi debugging memberi Anda halaman rusak untuk diperbaiki, dan proyek terpandu membantu membangun sesuatu yang dapat Anda tunjukkan.
Apa saja isinya
Isi Learn HTML
40
Kursus dari A1 hingga C1
159 pelajaran mencakup struktur dokumen, teks, tautan, gambar, dan daftar, lalu berlanjut ke tabel, formulir, dan HTML5 semantik hingga aksesibilitas, komponen web, keamanan, serta History and Navigation API.
Langsung
Editor HTML dengan pratinjau
Tulis markup dan lihat halaman yang dirender diperbarui. Anda dapat menambahkan file CSS dan JavaScript ke proyek yang sama, sehingga dokumen biasa berubah menjadi situs web kecil yang berfungsi.
20
Proyek terpandu
Proyek langkah demi langkah, termasuk halaman kotak resep, formulir kontak, galeri foto, bilah navigasi, dan tabel harga yang aksesibel.
20
Misi debugging
Masalah nyata untuk dilacak: formulir pendaftaran yang tidak mengirim apa pun, label yang tidak dapat diketuk, dan halaman yang dimuat dalam tampilan diperkecil pada ponsel.
80
Lembar contekan tag
Daftar referensi 80 tag, elemen, dan atribut HTML untuk saat Anda tahu apa yang ingin digunakan, tetapi belum tahu namanya.
50
Pertanyaan wawancara
Lima puluh pertanyaan wawancara untuk developer web dengan jawaban yang jelas, ditambah pustaka kode berisi contoh-contoh singkat yang dapat Anda buka dan edit, serta ruang untuk menyimpan kode dan catatan Anda sendiri.
Latar belakang
Apa itu HTML, dan bisakah Anda mempelajarinya dengan mengetik di ponsel?
HTML (HyperText Markup Language) adalah bahasa yang menjelaskan struktur halaman web: teks mana yang menjadi heading, mana yang menjadi paragraf, ke mana sebuah tautan mengarah, dan apa yang diminta oleh sebuah formulir. HTML bukan bahasa pemrograman, jadi tidak ada loop atau variabel yang perlu dihadapi, sehingga HTML biasanya menjadi langkah pertama dalam pengembangan web. Karena hasilnya terlihat segera setelah Anda menulisnya, HTML cocok dipelajari dalam sesi singkat melalui ponsel: sebuah tag cukup kecil untuk diketik dengan ibu jari, dan pratinjau langsung menunjukkan apakah hasilnya benar.
Elemen, tag, dan atributtiga istilah yang digunakan di setiap pelajaran
Elemen adalah bagian konten yang memiliki makna, ditulis di antara tag pembuka dan tag penutup, misalnya paragraf atau item daftar. Atribut berada di dalam tag pembuka dan menyesuaikan elemen tersebut, seperti alamat tujuan tautan atau teks yang mendeskripsikan gambar. Hampir semua kesalahan pemula berupa tag penutup yang hilang atau atribut yang salah tempat.
HTML semantikheading, navigasi, main, dan footer
Elemen semantik menjelaskan fungsi sebuah blok halaman, bukan tampilannya. Bilah navigasi, artikel, dan footer masing-masing memiliki elemen sendiri, sehingga membantu pembaca layar, mesin pencari, dan siapa pun yang nantinya harus mengedit halaman tersebut. Inilah kebiasaan yang membedakan halaman yang rapi dari tumpukan kontainer generik.
HTML, CSS, dan JavaScriptsiapa melakukan apa
HTML menampung struktur dan konten, CSS mengatur tampilan konten tersebut, dan JavaScript menambahkan perilaku seperti merespons klik. Mempelajari HTML terlebih dahulu memberi tempat bagi dua teknologi lainnya untuk terhubung. Editor di aplikasi menyediakan tab HTML, CSS, dan JavaScript terpisah, sehingga Anda dapat memisahkan ketiga tugas tersebut sejak awal.
Formulir dan aksesibilitassaat halaman sederhana mulai serius
Formulir adalah cara halaman meminta apa pun dari pengunjung, dan formulir juga menjadi tempat sebagian besar masalah aksesibilitas bermula: label yang tidak dapat diketuk, atau kolom yang tidak dapat diberi nama oleh pembaca layar. Label, atribut validasi, dan peran ARIA adalah bagian-bagian kecil markup yang menentukan apakah sebuah halaman dapat digunakan oleh semua orang.
Kesesuaian
Untuk siapa — dan bukan untuk siapa
Cocok untuk Anda jika Anda
- Apakah Anda sedang menulis halaman web pertama dan ingin setiap tag dijelaskan sebelum digunakan
- Belajar paling efektif saat Anda bisa langsung melihat hasil setiap baris
- Menjalankan blog, halaman toko, atau portofolio dan ingin mengedit markup di baliknya
- Berencana beralih ke CSS, JavaScript, atau pekerjaan front-end dan ingin membangun dasar yang kuat terlebih dahulu
- Mempersiapkan diri untuk wawancara web developer dan ingin berlatih dengan pertanyaan
Bukan alat yang tepat untuk Anda jika Anda
- Membutuhkan alur kerja desktop lengkap dengan file, folder, dan server lokal
- Mengharapkan semua kursus gratis; kursus pertama, proyek terpandu pertama, dan dua misi tersedia gratis, sementara Pro membuka sisanya
- Sudah menulis HTML untuk produksi setiap hari dan menginginkan referensi, bukan kursus
- Ingin mempelajari alat desain; aplikasi ini berfokus pada markup dan kode di balik halaman
Pertanyaan
Pertanyaan yang sering diajukan
Apa itu Belajar HTML: Kursus Code?
Belajar HTML: Kursus Code adalah aplikasi untuk iPhone dan Android yang mengajarkan HTML mulai dari tag pertama hingga topik lanjutan. Aplikasi ini menggabungkan 40 kursus singkat dengan editor HTML bawaan dan pratinjau langsung, 20 proyek terpandu, 20 misi debugging, serta mentor AI. Aplikasi ini gratis untuk memulai dan tersedia dalam 22 bahasa.
Benarkah saya bisa menulis dan melihat pratinjau HTML di ponsel?
Ya. Editor dalam Belajar HTML: Kursus Code memiliki tab HTML, CSS, dan JavaScript, sementara pratinjau menampilkan halaman yang dihasilkan markup Anda. Ponsel nyaman digunakan untuk latihan terfokus yang dibutuhkan HTML karena tag-tag HTML singkat. Layar yang lebih besar baru berguna ketika Anda mengelola banyak file sekaligus.
Apakah saya perlu pengalaman coding sebelum mulai?
Tidak. Jalur belajar dimulai dengan menjelaskan cara menyusun dokumen HTML dan menerangkan setiap istilah dalam bahasa sederhana sebelum menggunakannya. HTML tidak memiliki loop atau variabel yang perlu dipelajari terlebih dahulu, jadi Belajar HTML: Kursus Code menganggap pemula total sebagai kondisi yang wajar, bukan pengecualian.
Apa perbedaan antara HTML dan CSS?
HTML menentukan apa yang ada di halaman dan makna setiap bagiannya, seperti heading, tautan, atau kolom formulir. CSS menentukan tampilannya, termasuk warna, jarak, dan tata letak. Aplikasi ini mengajarkan HTML terlebih dahulu dan memungkinkan Anda menambahkan file CSS di editor, sehingga Anda dapat melihat keduanya bekerja bersama tanpa mencampur fungsinya.
Berapa lama waktu yang dibutuhkan untuk mempelajari dasar-dasar HTML?
Kebanyakan orang dapat menulis halaman sederhana yang benar setelah beberapa sesi singkat, karena elemen intinya hanya sedikit: heading, paragraf, tautan, gambar, daftar, dan formulir dasar. Materi yang lebih mendalam seperti aksesibilitas, struktur semantik, dan web components membutuhkan waktu lebih lama. Pelajaran di sini dirancang untuk diselesaikan dalam hitungan menit, sehingga kebiasaan belajar setiap hari dapat dilakukan.
Proyek seperti apa yang bisa saya buat di aplikasi ini?
20 proyek terpandu mencakup halaman kotak resep, formulir kontak, galeri foto, bilah navigasi, dan tabel harga yang mudah diakses. Setiap proyek dibuat langkah demi langkah. Proyek-proyek ini sengaja dibuat kecil agar Anda dapat menyelesaikannya dan menyimpan kodenya dalam cuplikan tersimpan.
Apakah Learn HTML membahas aksesibilitas dan formulir?
Ya, dan cukup mendalam. Formulir memiliki tiga kursus yang mencakup dasar-dasar, kontrol lanjutan, dan atribut validasi. Aksesibilitas memiliki kursus tersendiri tentang dasar-dasar, peran ARIA, dan pola ARIA lanjutan. Misi debugging juga mencakup masalah seperti label yang tidak dapat diketuk siapa pun, sehingga topik-topik ini menjadi praktis, bukan sekadar teori.
Apakah aplikasi ini gratis, dan apa yang ditambahkan Pro?
Anda dapat mengunduhnya secara gratis dan langsung mulai: kursus pertama, proyek terpandu pertama, dua misi, dan editor langsung sudah termasuk, bersama jatah harian mentor AI. Pro membuka semua kursus, seluruh proyek dan misi, ujian sertifikat, serta pertanyaan tanpa batas kepada mentor AI, dan menghapus iklan.
Mulai
Ketik tag pertama Anda dan lihat hasil render-nya
Gratis untuk memulai di iOS dan Android, dalam 22 bahasa.
Lainnya dari CoddyKit
Tersedia di iOS dan Android.