{"id":494,"date":"2021-08-13T16:59:44","date_gmt":"2021-08-13T09:59:44","guid":{"rendered":"https:\/\/aksaradata.id\/blog\/?p=494"},"modified":"2022-02-04T16:34:54","modified_gmt":"2022-02-04T09:34:54","slug":"html-adalah","status":"publish","type":"post","link":"https:\/\/aksaradata.id\/blog\/html-adalah\/","title":{"rendered":"HTML: Pengertian, Sejarah, &#038; Cara Kerjanya"},"content":{"rendered":"<p><span style=\"font-weight: 400;\">HTML adalah singkatan dari Hypertext Markup Language. Sebuah bahasa markup yang mungkin sudah sangat tidak asing di telinga Sahabat Aksara sekalian.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Ia memiliki berperan besar dalam pembangunan sebuah <a href=\"https:\/\/aksaradata.id\/blog\/apa-itu-website\/\" target=\"_blank\" rel=\"noopener\">website<\/a>, berdampingan dengan bahasa pemrograman lain seperti <a href=\"https:\/\/aksaradata.id\/blog\/php-adalah\/\" target=\"_blank\" rel=\"noopener\">PHP<\/a>, <a href=\"https:\/\/aksaradata.id\/blog\/css-adalah\/\" target=\"_blank\" rel=\"noopener\">CSS<\/a>, dan JavaScript.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Maka, sangat penting bagi Anda yang ingin menjadi website developer untuk memahami HTML dengan baik.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Jika Anda tertarik untuk mengenal HTML lebih lanjut, langsung saja simak artikel di bawah ini.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Dalam artikel kali ini, kami akan membahas seputar pengertian, sejarah, fungsi, hingga cara kerja HTML.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Selamat membaca!<\/span><\/p>\n<h2><b>Apa itu HTML?<\/b><\/h2>\n<p><span style=\"font-weight: 400;\">HTML adalah sebuah bahasa markup yang banyak digunakan sebagai kerangka utama dalam membangun struktur sebuah website.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Bahasa markup ini umumnya terdiri terdiri dari berbagai teks dan simbol yang disimpan pada sebuah file dan bersifat <\/span><i><span style=\"font-weight: 400;\">human-readable<\/span><\/i><span style=\"font-weight: 400;\"> (dapat dipahami oleh manusia).<\/span><\/p>\n<p><span style=\"font-weight: 400;\">HTML sendiri digunakan untuk memberi <\/span><i><span style=\"font-weight: 400;\">annotate text <\/span><\/i><span style=\"font-weight: 400;\">(membuat note pada komputer) agar komputer dapat memahami perintah yang diberikan.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Ketika perintah sudah dipahami oleh komputer, ia akan memanipulasinya ke dalam tampilan web browser sesuai dengan yang Anda inginkan.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Singkatnya, tanpa HTML, Anda tidak dapat menyusun teks, tabel, gambar, maupun video agar tampil secara terstruktur pada halaman website yang dimuat oleh browser.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Lebih lanjut, seperti yang sudah dipaparkan pada awal artikel tadi, HTML memiliki kepanjangan <\/span><i><span style=\"font-weight: 400;\">Hypertext Markup Language.<\/span><\/i><\/p>\n<p><span style=\"font-weight: 400;\">Kata <\/span><i><span style=\"font-weight: 400;\">Hypertext <\/span><\/i><span style=\"font-weight: 400;\">disini merujuk pada link yang menghubungkan antara satu halaman website dengan yang lain.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Baik dalam satu website maupun antar website yang berbeda.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Nah, link tersebut merupakan aspek pembangun fundamental yang membentuk jaringan World Wide Web (WWW).<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Sedangkan kata <\/span><i><span style=\"font-weight: 400;\">Markup <\/span><\/i><span style=\"font-weight: 400;\">merujuk pada dokumen teks di dalam tag yang kemudian disimpan pada sebuah dokumen.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Dalam membuat dokumen HTML tersebut, ada format penulisan khusus yang telah diatur dalam ASCII (American Standard Code for Information Interchange).<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Secara umum, format dalam membuat dokumen HTML terdiri dari tag, elemen, dan tag atribut.<\/span><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\" wp-image-496 aligncenter\" src=\"https:\/\/aksaradata.id\/blog\/wp-content\/uploads\/2021\/08\/Screenshot_26-300x144.png\" alt=\"Komponen HTML\" width=\"448\" height=\"215\" srcset=\"https:\/\/aksaradata.id\/blog\/wp-content\/uploads\/2021\/08\/Screenshot_26-300x144.png 300w, https:\/\/aksaradata.id\/blog\/wp-content\/uploads\/2021\/08\/Screenshot_26.png 310w\" sizes=\"auto, (max-width: 448px) 100vw, 448px\" \/><\/p>\n<p><span style=\"font-weight: 400;\">Nah, secara garis besar, saat menulis HTML Anda akan memulainya dengan membuat tag.\u00a0<\/span><\/p>\n<h3><b>1. Tag HTML<\/b><\/h3>\n<p><span style=\"font-weight: 400;\">Tag adalah tanda untuk mengawali dan mengakhiri suatu perintah HTML yang akan dibaca oleh web browser.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Tanda yang digunakan untuk mengawalinya adalah<\/span><b> &lt;<\/b><span style=\"font-weight: 400;\"> (tanda kurang dari), dan diakhiri dengan tanda <\/span><b>&gt;<\/b><span style=\"font-weight: 400;\"> (tanda lebih dari).\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Diantara tanda tersebut, terdapat <\/span><b>nama tag<\/b><span style=\"font-weight: 400;\"> yang berisi perintah kepada komputer.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Contohnya adalah tag<\/span><b> &lt;italic&gt; <\/b><span style=\"font-weight: 400;\">yang meminta agar komputer menampilkan huruf italic pada browser.<\/span><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"size-medium wp-image-497 aligncenter\" src=\"https:\/\/aksaradata.id\/blog\/wp-content\/uploads\/2021\/08\/Screenshot_28-300x149.png\" alt=\"Nama Tag HTML\" width=\"300\" height=\"149\" srcset=\"https:\/\/aksaradata.id\/blog\/wp-content\/uploads\/2021\/08\/Screenshot_28-300x149.png 300w, https:\/\/aksaradata.id\/blog\/wp-content\/uploads\/2021\/08\/Screenshot_28.png 705w\" sizes=\"auto, (max-width: 300px) 100vw, 300px\" \/><\/p>\n<p><span style=\"font-weight: 400;\">Tag sendiri memiliki 2 jenis yaitu <em>tag pembuka<\/em> dan <em>tag penutup<\/em>. Yang membedakan antara tag pembuka dan penutup adalah penggunaan tanda <\/span><b>\/<\/b><span style=\"font-weight: 400;\"> (garis miring).<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Garis miring ditambahkan di depan nama tag penutup, contohnya adalah <\/span><b>&lt;\/head&gt;<\/b><span style=\"font-weight: 400;\">.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Pada awal pembuatannya, tag HTML hanya terdiri dari 18 tag. Kini, tag HTML sudah berjumlah 250.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Berikut daftar tag HTML yang sering digunakan:<\/span><\/p>\n<ol>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><em><b>&lt;html&gt;<\/b><\/em> <span style=\"font-weight: 400;\">\u2013<\/span><span style=\"font-weight: 400;\"> digunakan untuk memulai suatu dokumen HTML yang mencakup semua konten dan elemen.<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><em><b>&lt;head&gt;<\/b><\/em> <span style=\"font-weight: 400;\">\u2013 digunakan untuk membuat dokumen HTML yang mencakup tampilan deskripsi hasil pencarian Google, style dalam konten (CSS), dan lainnya.<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><em><b>&lt;title&gt;<\/b><\/em> <span style=\"font-weight: 400;\">\u2013<\/span><span style=\"font-weight: 400;\"> digunakan untuk membuat judul website.<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><em><b>&lt;body&gt;<\/b><\/em> <span style=\"font-weight: 400;\">\u2013<\/span><span style=\"font-weight: 400;\"> digunakan untuk membuat bagian isi website.<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><em><b>&lt;h1&gt;<\/b><span style=\"font-weight: 400;\"> sampai dengan <\/span><b>&lt;h6&gt;<\/b><\/em> <span style=\"font-weight: 400;\">\u2013<\/span><span style=\"font-weight: 400;\"> digunakan untuk membuat heading pada artikel.<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><em><b>&lt;p&gt;<\/b><\/em> <span style=\"font-weight: 400;\">\u2013<\/span><span style=\"font-weight: 400;\"> digunakan untuk membuat paragraf.<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><em><b>&lt;!&#8211;&gt; <\/b><\/em><span style=\"font-weight: 400;\">\u2013<\/span><span style=\"font-weight: 400;\">\u00a0 digunakan untuk membuat komentar.<\/span><\/li>\n<\/ol>\n<h3><b>2. Tag Atribut<\/b><\/h3>\n<p><span style=\"font-weight: 400;\">Tag atribut merupakan informasi atau perintah tambahan yang berfungsi sebagai penjelas perintah tag HTML.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Jumlah tag atribut dalam suatu elemen HTML bisa berjumlah lebih dari satu.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Contohnya pada elemen HTML<\/span><b> &lt;img src=\u201dgambar.png\u201d alt \u201cDomain Premium. \u201c&gt;<\/b><span style=\"font-weight: 400;\">.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Dalam contoh elemen diatas, yang berperan sebagai tag html adalah<\/span><b> &lt;img&gt;<\/b><span style=\"font-weight: 400;\"> dan yang berperan sebagai tag atribut adalah <\/span><b><i>src <\/i><\/b><span style=\"font-weight: 400;\">dan <\/span><b><i>alt.<\/i><\/b><span style=\"font-weight: 400;\">\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Dengan perintah tambahan dari tag atribut, elemen HTML tersebut jadi memiliki arti browser harus menampilkan gambar jenis &#8220;png&#8221; dengan alt text \u201cDomain Premium\u201d.\u00a0<\/span><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\" wp-image-498 aligncenter\" src=\"https:\/\/aksaradata.id\/blog\/wp-content\/uploads\/2021\/08\/Domain-Premium-Blue-300x229.png\" alt=\"Tag Attribute \" width=\"431\" height=\"329\" srcset=\"https:\/\/aksaradata.id\/blog\/wp-content\/uploads\/2021\/08\/Domain-Premium-Blue-300x229.png 300w, https:\/\/aksaradata.id\/blog\/wp-content\/uploads\/2021\/08\/Domain-Premium-Blue-1024x781.png 1024w, https:\/\/aksaradata.id\/blog\/wp-content\/uploads\/2021\/08\/Domain-Premium-Blue-768x586.png 768w, https:\/\/aksaradata.id\/blog\/wp-content\/uploads\/2021\/08\/Domain-Premium-Blue-1536x1172.png 1536w, https:\/\/aksaradata.id\/blog\/wp-content\/uploads\/2021\/08\/Domain-Premium-Blue.png 2000w\" sizes=\"auto, (max-width: 431px) 100vw, 431px\" \/><\/p>\n<p><span style=\"font-weight: 400;\">Berikut contoh beberapa tag atribut:<\/span><\/p>\n<ol>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><em><b>src<\/b> <\/em><span style=\"font-weight: 400;\">\u2013<\/span><span style=\"font-weight: 400;\"> dapat digunakan pada tag HTML &lt;img&gt;, &lt;embed&gt;, &lt;audio&gt;, dan &lt;iframe&gt;.<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><b><em>href<\/em> <\/b><span style=\"font-weight: 400;\">\u2013<\/span><span style=\"font-weight: 400;\"> dapat digunakan pada tag HTML &lt;a&gt; dan &lt;link&gt;.<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><b><em>action<\/em> <\/b><span style=\"font-weight: 400;\">\u2013<\/span><span style=\"font-weight: 400;\"> dapat digunakan pada tag HTML &lt;form&gt;.<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><b><em>autoplay<\/em> <\/b><span style=\"font-weight: 400;\">\u2013<\/span><span style=\"font-weight: 400;\"> dapat digunakan pada tag HTML &lt;audio&gt; dan &lt;video&gt;.<\/span><\/li>\n<\/ol>\n<h3><b>4. Elemen<\/b><\/h3>\n<p><span style=\"font-weight: 400;\">Elemen merupakan keseluruhan kode HTML; mulai dari tag pembuka, konten, hingga tag penutup seperti yang telah ditunjukkan pada contoh diatas.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Oh iya, dalam satu elemen juga dapat mengandung elemen lainnya. Hal ini dinamakan nested element.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Sejatinya, semua dokumen HTML pasti terdiri dari berbagai nested elements.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Berikut adalah contoh dari dokumen HTML dengan empat HTML elemen yaitu &lt;html&gt;, &lt;body, &lt;h1&gt;, dan &lt;p&gt;:<\/span><\/p>\n<div style=\"-moz-border-radius: 10px; -webkit-border-radius: 10px; background-color: #ebe8e4; border-radius: 10px; border: 4px double #fff; padding: 10px; t-align: left;\">\n<blockquote><p><span style=\"font-weight: 400;\">&lt;!DOCTYPE html&gt;<\/span><\/p>\n<p><span style=\"font-weight: 400;\">&lt;html&gt;<\/span><\/p>\n<p><span style=\"font-weight: 400;\">&lt;body&gt;<\/span><\/p>\n<p><span style=\"font-weight: 400;\">&lt;h1&gt;Heading Pertama Artikel&lt;\/h1&gt;<\/span><\/p>\n<p><span style=\"font-weight: 400;\">&lt;p&gt;Paragraf Pertama Artikel.&lt;\/p&gt;<\/span><\/p>\n<p><span style=\"font-weight: 400;\">&lt;\/body&gt;<\/span><\/p>\n<p><span style=\"font-weight: 400;\">&lt;\/html&gt;<\/span><\/p><\/blockquote>\n<\/div>\n<p>Jika dijabarkan, elemen &lt;html&gt; merupakan root element yang berfungsi untuk mendefinisikan seluruh dokumen HTML.<\/p>\n<p><span style=\"font-weight: 400;\">Elemen tersebut diawali dengan tag &lt;html&gt; dan ditutup dengan &lt;\/html&gt;.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Kemudian, di dalam <\/span><b>elemen &lt;html&gt;<\/b><span style=\"font-weight: 400;\"> tersebut ada <\/span><b>elemen &lt;body&gt;<\/b><span style=\"font-weight: 400;\">, yang mendefinisikan isi dari dokumen HTML.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Ia diawali dengan tag &lt;body&gt; dan diakhiri dengan tag &lt;\/body&gt;.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Nah, di dalam <\/span><b>elemen &lt;body&gt;<\/b><span style=\"font-weight: 400;\"> masih disisipi lagi <\/span><b>elemen &lt;h1&gt; dan elemen &lt;p&gt;<\/b><span style=\"font-weight: 400;\">.<\/span><\/p>\n<p><b>Elemen &lt;h1&gt;<\/b><span style=\"font-weight: 400;\"> untuk mendefinisikan heading, dimulai dengan tag &lt;h1&gt; dan ditutup dengan tag &lt;\/h1&gt;<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Sedangkan, <\/span><b>elemen &lt;p&gt;<\/b><span style=\"font-weight: 400;\"> untuk mendefinisikan paragraf. Ia dimulai dengan tag &lt;p&gt; kemudian diakhiri dengan tag &lt;\/p&gt;.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Fun fact, ada beberapa elemen HTML yang akan tetap ditampilkan dengan benar meskipun Anda lupa untuk menulis tag penutup.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Nah, jika Anda ingin mengetahui susunan HTML pada suatu halaman website, Anda tinggal klik kanan, kemudian pilih opsi inspect.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Maka, Anda dapat melihat susunannya seperti contoh berikut ini:<\/span><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\" wp-image-499 aligncenter\" src=\"https:\/\/aksaradata.id\/blog\/wp-content\/uploads\/2021\/08\/Screenshot_23-300x142.png\" alt=\"Tampilan HTML dari Blog Aksara Data\" width=\"670\" height=\"317\" srcset=\"https:\/\/aksaradata.id\/blog\/wp-content\/uploads\/2021\/08\/Screenshot_23-300x142.png 300w, https:\/\/aksaradata.id\/blog\/wp-content\/uploads\/2021\/08\/Screenshot_23-1024x486.png 1024w, https:\/\/aksaradata.id\/blog\/wp-content\/uploads\/2021\/08\/Screenshot_23-768x364.png 768w, https:\/\/aksaradata.id\/blog\/wp-content\/uploads\/2021\/08\/Screenshot_23-1536x728.png 1536w, https:\/\/aksaradata.id\/blog\/wp-content\/uploads\/2021\/08\/Screenshot_23.png 1592w\" sizes=\"auto, (max-width: 670px) 100vw, 670px\" \/><\/p>\n<blockquote><p>&nbsp;<\/p>\n<p><strong>Baca juga:<\/strong> <a href=\"https:\/\/aksaradata.id\/blog\/bahasa-pemrograman\/\" target=\"_blank\" rel=\"noopener\"><strong>Bahasa Pemrograman Populer yang Sebaiknya Anda Ketahui<\/strong><\/a><\/p><\/blockquote>\n<h2><b>Sejarah Singkat HTML<\/b><\/h2>\n<p><span style=\"font-weight: 400;\">HTML diciptakan pada tahun 1991 oleh Tim Berners-Lee, seorang ahli fisika pada lembaga penelitian CERN di Swiss.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Tapi HTML tersebut belum dirilis secara resmi dan disebut sebagai HTML Tags.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">HTML Tags hanya terdiri dari 18 tags dan hanya dimaksudkan untuk mempermudah para ilmuwan dalam saling berbagi dokumen.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Baru pada tahun 1993, HTML 1.0 resmi dirilis. Namun, belum ada banyak developer yang membuat website pada periode ini.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Pada tahun 1995, IETF (Internet Engineering Task Force) merilis HTML 2.0 dengan fitur-fitur terbaru.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">HTML versi ini mampu menampilkan data dan form yang dapat diedit secara langsung.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Inilah cikal bakal dari dari lahirnya website interaktif.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">HTML 2.0 pun menjadi bahasa markup standar yang digunakan untuk membangun dan mendesain website hingga tahun 1997.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Oh iya, pada tahun 1996, W3C (World Wide Web Consortium) juga merilis HTML Standards versi mereka sendiri.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Kemudian, pada tahun 1997, Dave Raggett memperkenalkan rancangan HTML 3.0 yang mampu memberikan karakteristik desain website yang lebih powerful.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Salah satunya adalah mendukung tampilan gambar. Sayangnya, fitur-fitur baru tersebut malah memperlambat kinerja browser.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Dua tahun kemudian, tepatnya pada 24 Desember 1999, HTMl 4.01 diluncurkan dan meraih kesuksesan besar.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Pasalnya, versi ini sudah dapat digunakan oleh browser apapun secara internasional.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Akhirnya, pada tahun 2014 lalu, HTML 5.0 diluncurkan.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Dalam versi ini, HTML sudah bisa digunakan secara berdampingan dengan CSS dan JavaScript.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Versi 5.0 juga menjadi versi terbaik karena telah dilengkapi fitur-fitur terbaru, seperti menyisipkan video juga audio.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Pada tahun 2021 ini, dilansir dari <a href=\"https:\/\/w3techs.com\/technologies\/details\/ml-html5\" target=\"_blank\" rel=\"noopener\">w3techs<\/a>, HTML merupakan bahasa markup terpopuler yang telah digunakan oleh <\/span><span style=\"font-weight: 400;\">93%<\/span><span style=\"font-weight: 400;\"> website di seluruh dunia.\u00a0<\/span><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\" wp-image-500 aligncenter\" src=\"https:\/\/aksaradata.id\/blog\/wp-content\/uploads\/2021\/08\/Screenshot_29-300x102.png\" alt=\"Jumlah Pengguna HTML 2021\" width=\"598\" height=\"203\" srcset=\"https:\/\/aksaradata.id\/blog\/wp-content\/uploads\/2021\/08\/Screenshot_29-300x102.png 300w, https:\/\/aksaradata.id\/blog\/wp-content\/uploads\/2021\/08\/Screenshot_29.png 512w\" sizes=\"auto, (max-width: 598px) 100vw, 598px\" \/><\/p>\n<h2><b>Cara Kerja HTML<\/b><\/h2>\n<p><span style=\"font-weight: 400;\">HTML bekerja dengan memberi instruksi pada komputer untuk menampilkan susunan website pada browser sesuai dengan perintah yang diinput.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Pertama, dokumen HTML dibuat pada aplikasi HTML seperti Notepad++, Atom, Brackets, dan lain sebagainya.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Dokumen HTML yang telah selesai dibuat kemudian disimpan dengan format .html atau .htm.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Dokumen HTML berisi yang dibuat jumlahnya bisa lebih dari satu.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Pasalnya, dalam sebuah website, biasanya terdiri dari beberapa halaman seperti landing page, blog, kontak, about, dan lain sebagainya.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Dokumen HTML tersebut akhirnya dapat dibuka pada browser seperti Chrome, Safari, Opera, Firefox, dan lain sebagainya.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Untuk dapat diakses oleh pengguna internet yang lain, Anda perlu <\/span><a href=\"https:\/\/aksaradata.id\" target=\"_blank\" rel=\"noopener\"><span style=\"font-weight: 400;\">membeli domain<\/span> bagus<\/a><span style=\"font-weight: 400;\"> dan menyewa layanan hosting.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Setelah membeli hosting, Anda dapat mengupload file website Anda disana.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Nah, website Anda siap untuk dioperasikan secara maksimal.<\/span><\/p>\n<h3><b>Penutup<\/b><\/h3>\n<p><span style=\"font-weight: 400;\">Jadi, bisa kita simpulkan bahwa HTML berfungsi untuk membuat struktur konten dalam website agar terlihat seperti yang Anda inginkan.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Dan, perlu diingat bahwa HTML memang tidak ditujukan untuk membuat visual suatu website untuk menjadi lebih menarik. Itu adalah tugas dari CSS.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Bagaimana? Menarik sekali bukan mempelajari tentang HTML?<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Anda bisa meninggalkan pendapat maupun pertanyaan Anda mengenai HTML di kolom komentar ya!<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Agar tidak ketinggalan bacaan menarik lainnya, silahkan cek terus blog <a href=\"https:\/\/aksaradata.id\/\" target=\"_blank\" rel=\"noopener\"><strong>Aksara Data Digital<\/strong><\/a>, platform dengan pelayanan terbaik bagi reseller domain dan hosting!<\/span><\/p>\n","protected":false},"excerpt":{"rendered":"<p>HTML adalah singkatan dari Hypertext Markup Language. Sebuah bahasa markup yang mungkin sudah sangat tidak asing di telinga Sahabat Aksara sekalian. Ia memiliki berperan besar dalam pembangunan sebuah website, berdampingan dengan bahasa pemrograman lain seperti PHP, CSS, dan JavaScript. Maka, sangat penting bagi Anda yang ingin menjadi website developer untuk memahami HTML dengan baik.\u00a0 Jika [&hellip;]<\/p>\n","protected":false},"author":3,"featured_media":495,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_links_to":"","_links_to_target":""},"categories":[8,3],"tags":[70,71],"class_list":["post-494","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-home","category-website","tag-html","tag-hypertext-markup-language"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.4 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>HTML: Pengertian, Sejarah, &amp; Cara Kerjanya - Aksaradata<\/title>\n<meta name=\"description\" content=\"HTML adalah bahasa markup yang wajib dikuasi oleh website developer. Yuk, simak penjelasannya pada artikel berikut ini!\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/aksaradata.id\/blog\/html-adalah\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"HTML: Pengertian, Sejarah, &amp; Cara Kerjanya - Aksaradata\" \/>\n<meta property=\"og:description\" content=\"HTML adalah bahasa markup yang wajib dikuasi oleh website developer. Yuk, simak penjelasannya pada artikel berikut ini!\" \/>\n<meta property=\"og:url\" content=\"https:\/\/aksaradata.id\/blog\/html-adalah\/\" \/>\n<meta property=\"og:site_name\" content=\"Aksaradata\" \/>\n<meta property=\"article:published_time\" content=\"2021-08-13T09:59:44+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2022-02-04T09:34:54+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/aksaradata.id\/blog\/wp-content\/uploads\/2021\/08\/ADD-blog-HTML-Pengertian-Sejarah-Cara-Kerjanya.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1000\" \/>\n\t<meta property=\"og:image:height\" content=\"743\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Febriyani Suryaningrum\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Febriyani Suryaningrum\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"7 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/aksaradata.id\\\/blog\\\/html-adalah\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/aksaradata.id\\\/blog\\\/html-adalah\\\/\"},\"author\":{\"name\":\"Febriyani Suryaningrum\",\"@id\":\"https:\\\/\\\/aksaradata.id\\\/blog\\\/#\\\/schema\\\/person\\\/0388eddd08b4ba9644bd28c5338f4463\"},\"headline\":\"HTML: Pengertian, Sejarah, &#038; Cara Kerjanya\",\"datePublished\":\"2021-08-13T09:59:44+00:00\",\"dateModified\":\"2022-02-04T09:34:54+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/aksaradata.id\\\/blog\\\/html-adalah\\\/\"},\"wordCount\":1388,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\\\/\\\/aksaradata.id\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/aksaradata.id\\\/blog\\\/html-adalah\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/aksaradata.id\\\/blog\\\/wp-content\\\/uploads\\\/2021\\\/08\\\/ADD-blog-HTML-Pengertian-Sejarah-Cara-Kerjanya.jpg\",\"keywords\":[\"HTML\",\"Hypertext Markup Language\"],\"articleSection\":[\"Home\",\"Website\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/aksaradata.id\\\/blog\\\/html-adalah\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/aksaradata.id\\\/blog\\\/html-adalah\\\/\",\"url\":\"https:\\\/\\\/aksaradata.id\\\/blog\\\/html-adalah\\\/\",\"name\":\"HTML: Pengertian, Sejarah, & Cara Kerjanya - Aksaradata\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/aksaradata.id\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/aksaradata.id\\\/blog\\\/html-adalah\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/aksaradata.id\\\/blog\\\/html-adalah\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/aksaradata.id\\\/blog\\\/wp-content\\\/uploads\\\/2021\\\/08\\\/ADD-blog-HTML-Pengertian-Sejarah-Cara-Kerjanya.jpg\",\"datePublished\":\"2021-08-13T09:59:44+00:00\",\"dateModified\":\"2022-02-04T09:34:54+00:00\",\"description\":\"HTML adalah bahasa markup yang wajib dikuasi oleh website developer. Yuk, simak penjelasannya pada artikel berikut ini!\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/aksaradata.id\\\/blog\\\/html-adalah\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/aksaradata.id\\\/blog\\\/html-adalah\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/aksaradata.id\\\/blog\\\/html-adalah\\\/#primaryimage\",\"url\":\"https:\\\/\\\/aksaradata.id\\\/blog\\\/wp-content\\\/uploads\\\/2021\\\/08\\\/ADD-blog-HTML-Pengertian-Sejarah-Cara-Kerjanya.jpg\",\"contentUrl\":\"https:\\\/\\\/aksaradata.id\\\/blog\\\/wp-content\\\/uploads\\\/2021\\\/08\\\/ADD-blog-HTML-Pengertian-Sejarah-Cara-Kerjanya.jpg\",\"width\":1000,\"height\":743,\"caption\":\"HTML adalah\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/aksaradata.id\\\/blog\\\/html-adalah\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/aksaradata.id\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"HTML: Pengertian, Sejarah, &#038; Cara Kerjanya\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/aksaradata.id\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/aksaradata.id\\\/blog\\\/\",\"name\":\"Aksaradata\",\"description\":\"Platform Reseller Registrasi Domain\",\"publisher\":{\"@id\":\"https:\\\/\\\/aksaradata.id\\\/blog\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/aksaradata.id\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/aksaradata.id\\\/blog\\\/#organization\",\"name\":\"PT Aksara Data Digital\",\"url\":\"https:\\\/\\\/aksaradata.id\\\/blog\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/aksaradata.id\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/aksaradata.id\\\/blog\\\/wp-content\\\/uploads\\\/2021\\\/03\\\/small-aksara.png\",\"contentUrl\":\"https:\\\/\\\/aksaradata.id\\\/blog\\\/wp-content\\\/uploads\\\/2021\\\/03\\\/small-aksara.png\",\"width\":130,\"height\":64,\"caption\":\"PT Aksara Data Digital\"},\"image\":{\"@id\":\"https:\\\/\\\/aksaradata.id\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\"}},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/aksaradata.id\\\/blog\\\/#\\\/schema\\\/person\\\/0388eddd08b4ba9644bd28c5338f4463\",\"name\":\"Febriyani Suryaningrum\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/d1cd08837e8484ccb82750cbee5266838655f16e4cdc2d780d4d87a3cb33f819?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/d1cd08837e8484ccb82750cbee5266838655f16e4cdc2d780d4d87a3cb33f819?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/d1cd08837e8484ccb82750cbee5266838655f16e4cdc2d780d4d87a3cb33f819?s=96&d=mm&r=g\",\"caption\":\"Febriyani Suryaningrum\"},\"url\":\"https:\\\/\\\/aksaradata.id\\\/blog\\\/author\\\/febriyani\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"HTML: Pengertian, Sejarah, & Cara Kerjanya - Aksaradata","description":"HTML adalah bahasa markup yang wajib dikuasi oleh website developer. Yuk, simak penjelasannya pada artikel berikut ini!","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/aksaradata.id\/blog\/html-adalah\/","og_locale":"en_US","og_type":"article","og_title":"HTML: Pengertian, Sejarah, & Cara Kerjanya - Aksaradata","og_description":"HTML adalah bahasa markup yang wajib dikuasi oleh website developer. Yuk, simak penjelasannya pada artikel berikut ini!","og_url":"https:\/\/aksaradata.id\/blog\/html-adalah\/","og_site_name":"Aksaradata","article_published_time":"2021-08-13T09:59:44+00:00","article_modified_time":"2022-02-04T09:34:54+00:00","og_image":[{"width":1000,"height":743,"url":"https:\/\/aksaradata.id\/blog\/wp-content\/uploads\/2021\/08\/ADD-blog-HTML-Pengertian-Sejarah-Cara-Kerjanya.jpg","type":"image\/jpeg"}],"author":"Febriyani Suryaningrum","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Febriyani Suryaningrum","Est. reading time":"7 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/aksaradata.id\/blog\/html-adalah\/#article","isPartOf":{"@id":"https:\/\/aksaradata.id\/blog\/html-adalah\/"},"author":{"name":"Febriyani Suryaningrum","@id":"https:\/\/aksaradata.id\/blog\/#\/schema\/person\/0388eddd08b4ba9644bd28c5338f4463"},"headline":"HTML: Pengertian, Sejarah, &#038; Cara Kerjanya","datePublished":"2021-08-13T09:59:44+00:00","dateModified":"2022-02-04T09:34:54+00:00","mainEntityOfPage":{"@id":"https:\/\/aksaradata.id\/blog\/html-adalah\/"},"wordCount":1388,"commentCount":0,"publisher":{"@id":"https:\/\/aksaradata.id\/blog\/#organization"},"image":{"@id":"https:\/\/aksaradata.id\/blog\/html-adalah\/#primaryimage"},"thumbnailUrl":"https:\/\/aksaradata.id\/blog\/wp-content\/uploads\/2021\/08\/ADD-blog-HTML-Pengertian-Sejarah-Cara-Kerjanya.jpg","keywords":["HTML","Hypertext Markup Language"],"articleSection":["Home","Website"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/aksaradata.id\/blog\/html-adalah\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/aksaradata.id\/blog\/html-adalah\/","url":"https:\/\/aksaradata.id\/blog\/html-adalah\/","name":"HTML: Pengertian, Sejarah, & Cara Kerjanya - Aksaradata","isPartOf":{"@id":"https:\/\/aksaradata.id\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/aksaradata.id\/blog\/html-adalah\/#primaryimage"},"image":{"@id":"https:\/\/aksaradata.id\/blog\/html-adalah\/#primaryimage"},"thumbnailUrl":"https:\/\/aksaradata.id\/blog\/wp-content\/uploads\/2021\/08\/ADD-blog-HTML-Pengertian-Sejarah-Cara-Kerjanya.jpg","datePublished":"2021-08-13T09:59:44+00:00","dateModified":"2022-02-04T09:34:54+00:00","description":"HTML adalah bahasa markup yang wajib dikuasi oleh website developer. Yuk, simak penjelasannya pada artikel berikut ini!","breadcrumb":{"@id":"https:\/\/aksaradata.id\/blog\/html-adalah\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/aksaradata.id\/blog\/html-adalah\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/aksaradata.id\/blog\/html-adalah\/#primaryimage","url":"https:\/\/aksaradata.id\/blog\/wp-content\/uploads\/2021\/08\/ADD-blog-HTML-Pengertian-Sejarah-Cara-Kerjanya.jpg","contentUrl":"https:\/\/aksaradata.id\/blog\/wp-content\/uploads\/2021\/08\/ADD-blog-HTML-Pengertian-Sejarah-Cara-Kerjanya.jpg","width":1000,"height":743,"caption":"HTML adalah"},{"@type":"BreadcrumbList","@id":"https:\/\/aksaradata.id\/blog\/html-adalah\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/aksaradata.id\/blog\/"},{"@type":"ListItem","position":2,"name":"HTML: Pengertian, Sejarah, &#038; Cara Kerjanya"}]},{"@type":"WebSite","@id":"https:\/\/aksaradata.id\/blog\/#website","url":"https:\/\/aksaradata.id\/blog\/","name":"Aksaradata","description":"Platform Reseller Registrasi Domain","publisher":{"@id":"https:\/\/aksaradata.id\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/aksaradata.id\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/aksaradata.id\/blog\/#organization","name":"PT Aksara Data Digital","url":"https:\/\/aksaradata.id\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/aksaradata.id\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/aksaradata.id\/blog\/wp-content\/uploads\/2021\/03\/small-aksara.png","contentUrl":"https:\/\/aksaradata.id\/blog\/wp-content\/uploads\/2021\/03\/small-aksara.png","width":130,"height":64,"caption":"PT Aksara Data Digital"},"image":{"@id":"https:\/\/aksaradata.id\/blog\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/aksaradata.id\/blog\/#\/schema\/person\/0388eddd08b4ba9644bd28c5338f4463","name":"Febriyani Suryaningrum","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/d1cd08837e8484ccb82750cbee5266838655f16e4cdc2d780d4d87a3cb33f819?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/d1cd08837e8484ccb82750cbee5266838655f16e4cdc2d780d4d87a3cb33f819?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/d1cd08837e8484ccb82750cbee5266838655f16e4cdc2d780d4d87a3cb33f819?s=96&d=mm&r=g","caption":"Febriyani Suryaningrum"},"url":"https:\/\/aksaradata.id\/blog\/author\/febriyani\/"}]}},"_links":{"self":[{"href":"https:\/\/aksaradata.id\/blog\/wp-json\/wp\/v2\/posts\/494","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/aksaradata.id\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/aksaradata.id\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/aksaradata.id\/blog\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/aksaradata.id\/blog\/wp-json\/wp\/v2\/comments?post=494"}],"version-history":[{"count":4,"href":"https:\/\/aksaradata.id\/blog\/wp-json\/wp\/v2\/posts\/494\/revisions"}],"predecessor-version":[{"id":1503,"href":"https:\/\/aksaradata.id\/blog\/wp-json\/wp\/v2\/posts\/494\/revisions\/1503"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/aksaradata.id\/blog\/wp-json\/wp\/v2\/media\/495"}],"wp:attachment":[{"href":"https:\/\/aksaradata.id\/blog\/wp-json\/wp\/v2\/media?parent=494"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/aksaradata.id\/blog\/wp-json\/wp\/v2\/categories?post=494"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/aksaradata.id\/blog\/wp-json\/wp\/v2\/tags?post=494"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}