HTML adalah bahasa markup standar untuk membuat halaman Web
Apa itu HTML?
- HTML adalah singkatan dari Hyper Text Markup Language
- HTML adalah bahasa markup standar untuk membuat halaman Web
- HTML menggambarkan struktur halaman Web
- HTML terdiri dari serangkaian elemen
- Elemen HTML memberi tahu browser cara menampilkan konten
- Elemen HTML memberi label potongan konten seperti "ini adalah judul", "ini adalah paragraf", "ini adalah tautan", dll
Dokumen HTML Sederhana
Contoh
Judul Pertama Saya
Paragraf pertama saya
Contoh Dijelaskan
- Deklarasi mendefinisikan bahwa dokumen ini adalah dokumen HTML5
- Elemen adalah elemen root dari halaman HTML
- Elemen berisi informasi meta tentang halaman HTML
element specifies a title for the HTML page [which is shown in the browser's title bar or in the page's tab]
- The
element defines the document's body, and is a container for all the visible contents, such as headings, paragraphs, images, hyperlinks, tables, lists, etc.
- The
element defines a large heading
- The
element defines a paragraph
What is an HTML Element?
An HTML element is defined by a start tag, some content, and an end tag:
Content goes here..
The HTML element is everything from the start tag to the end tag:
My First Heading
My first paragraph.
My First Heading | ||
My first paragraph. | ||
none | none |
Note: Some HTML elements have no content [like the
element]. These elements are called empty elements. Empty elements do not have an end tag!
Web Browsers
The purpose of a web browser [Chrome, Edge, Firefox, Safari] is to read HTML documents and display them correctly.
A browser does not display the HTML tags, but uses them to determine how to display the document:
HTML Page Structure
Below is a visualization of an HTML page structure:
Page title
This is a heading
This is a paragraph.
This is another paragraph.
Note: The content inside the section [the white area above] will be displayed in a browser. The content inside the
element will be shown in the browser's title bar or in the page's tab.HTML History
Since the early days of the World Wide Web, there have been many versions of HTML:
This tutorial follows the latest HTML5 standard.
Pada dasarnya, HTML adalah bahasa pemrograman dasar yang digunakan untuk membuat situs web. Jika Anda sedang mempertimbangkan untuk berkarir dalam desain atau pengembangan web, mengetahui bahasa ini adalah suatu keharusan—tetapi bahkan dalam profesi lain, seperti pemasaran digital, sedikit HTML dapat berguna
Setelah Anda menguasainya, menulis dan bekerja dengan HTML sangatlah mudah. Namun, jika Anda belum pernah menyentuhnya, ini bisa menjadi salah satu misteri terbesar di internet
Dalam posting ini, kami akan memberikan pengantar utama untuk HTML dasar
Sebelum kita mulai, jangan panik. Panduan ini ditujukan untuk siapa saja dan semua orang—tidak perlu pengetahuan teknologi
Siap untuk memulai dengan HTML?
1. Apa yang dimaksud dengan HTML?
HTML adalah singkatan dari Hypertext Markup Language—dan, seperti yang disebutkan sebelumnya, ini adalah bahasa komputer yang digunakan untuk membuat situs web. HTML menjelaskan bagaimana dokumen harus ditampilkan oleh browser internet. Itu dibuat oleh fisikawan Tim Berners-Lee pada akhir 1990-an dan, seperti semua bahasa pemrograman, terus direvisi dan diperbarui selama bertahun-tahun.
Hiperteks
Ini pada dasarnya adalah teks yang berisi tautan ke teks lain. Anda dapat mengeklik tautan ini untuk melompat ke halaman atau bagian teks lain
Markup
Bagian ini mengacu pada tag HTML dan teks di dalamnya. Kami akan berbicara lebih banyak tentang tag nanti
Bahasa
Terakhir, HTML adalah sebuah bahasa—cukup jelas, bukan?
2. Bagaimana cara kerja HTML?
Sederhananya, HTML bekerja dengan memberi tahu browser internet cara menampilkan halaman
Pertama, penulis menggunakan editor teks dasar di komputer [seperti TextEdit untuk Mac] untuk membuat dokumen HTML mereka. Penulis kemudian mengisi dokumen HTML mereka dengan serangkaian elemen HTML, menggunakan tag HTML
Apa itu tag HTML?
Pada dasarnya, tag HTML adalah penanda yang memberi tahu browser bagaimana teks terlampir harus ditampilkan. Ini contoh sederhana
This text should be bold.
Dalam hal ini, dan
adalah tag HTML. Mereka menandai teks terlampir sebagai "bold"—karenanya, elemen "markup" dari HTML. Kami akan menjelaskan bagaimana sebenarnya menulis tag di bagian selanjutnya
Setelah dokumen selesai, penulis menyimpannya sebagai file html dan membukanya di browser internet mereka. Browser kemudian membaca file dan mengikuti petunjuk untuk merender halaman dengan cara tertentu—seperti yang disediakan oleh tag HTML
Jadi, saat Anda menggunakan tag "tebal", pada dasarnya Anda memberi tahu browser untuk menampilkan kalimat ini dalam huruf tebal. This text should be bold.
Saat browser membaca ini, ia tahu untuk menampilkan kalimat seperti yang dijelaskan. Teks ini harus dicetak tebal
Tentu saja, tag HTML itu sendiri tidak ditampilkan di browser [kecuali jika Anda salah menulisnya. ]
3. Menulis HTML. Dasar
Tag
Tag HTML ditulis di dalam kurung siku, dan cenderung berpasangan—jadi, keduanya terdiri dari tag pembuka dan penutup
Misalnya, tag digunakan untuk menunjukkan paragraf baru. Tag pembuka ditulis sebagai berikut.
_. Setelah tag ini, Anda menulis paragraf Anda. Untuk menyelesaikan, tambahkan tag penutup Anda, yang sama dengan tag pembuka tetapi dengan garis miring. Dalam hal ini, itu akan terjadi.
Sepasang tag dengan teks tertutup dikenal sebagai elemen. Berikut adalah beberapa contoh elemen HTML umum dan tag yang sesuai
_This is a heading
This is a paragraph
This text should be bold.
0
This text should be bold.
1
Sebagian besar tag HTML mengikuti pola buka-dan-tutup ini, tetapi ada juga beberapa tag yang hanya memerlukan tag pembuka agar valid. Ini dikenal sebagai tag tunggal, dan menyertakan hal-hal seperti This text should be bold.
2 untuk menunjukkan jeda baris, dan This text should be bold.
3 untuk menyertakan gambar. Browser akan memahami dan menindaklanjuti tag ini tanpa memerlukan tag penutup
Atribut
You can also assign attributes to your HTML elements. Attributes provide extra information about the text contained within the tags. For example, if you wanted to hyperlink the phrase “my website” in your HTML document, you would first use the tag pairs and to specify that the text should be linked. To tell the browser where the text should be linked to—i.e. the link address—you use the href attribute. Attributes, like the text, are always enclosed within the tags:
HTML. This text should be bold.
_4
Ditampilkan sebagai. Situs web saya
Ini hanyalah pengantar yang sangat sederhana—Anda akan mempelajari lebih lanjut tentang atribut saat mempelajari HTML lebih dalam, tetapi untuk saat ini kami akan tetap berpegang pada dasar-dasarnya
Menulis dokumen HTML
When writing your HTML document, you need to tell the browser that it’s dealing with a HTML file—otherwise, it won’t be able to display the page. Each HTML doc must therefore contain the and tags. Don’t forget to close these tags at the very end of the document!
Berikut adalah contoh tampilan dokumen HTML Anda di editor teks
This is the title of my html document
This is a large heading
This is the first paragraph.
This is the second paragraph, which will be displayed in bold.
Untuk memastikan bahwa Anda telah menulis HTML dengan benar, Anda dapat menggunakan alat W3schools Tryit Editor. Cukup masukkan HTML Anda dan klik "jalankan" dan Anda dapat melihat bagaimana HTML Anda akan ditampilkan di browser
4. Mempelajari HTML. Apa selanjutnya?
Masih banyak lagi yang dapat Anda lakukan dengan HTML—mulai dari menyematkan gambar hingga menentukan gaya dan warna elemen halaman yang berbeda
Dalam hal membuat situs web yang profesional dan berfungsi penuh, HTML sejalan dengan CSS dan JavaScript. CSS adalah singkatan dari Cascading Style Sheets, dan digunakan untuk menata elemen HTML halaman web Anda. JavaScript adalah bahasa pemrograman lain yang memungkinkan Anda memperkenalkan elemen interaktif ke halaman web dasar Anda. Bersama-sama, HTML, CSS, dan JavaScript membentuk dasar untuk teknologi web standar
Sebelum beralih ke topik CSS dan JavaScript yang lebih kompleks, pastikan Anda benar-benar nyaman dengan HTML. W3schools menyediakan panduan komprehensif untuk setiap aspek HTML, dan Anda juga dapat menyelesaikan latihan latihan dan mengikuti kuis HTML mereka untuk memeriksa kemajuan Anda