aboutsummaryrefslogtreecommitdiff
path: root/files/id/learn/html/howto/index.html
blob: ef45d155adeaadd2165c0909169655bbb4d2d4dd (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
---
title: Menggunakan HTML dalam masalah umum
slug: Learn/HTML/Howto
translation_of: Learn/HTML/Howto
---
<div>{{LearnSidebar}}</div>

<p class="summary">Daftar berikut menunjukkan solusi untuk masalah umum sehari-hari yang harus kamu selesaikan dengan menggunakan HTML.</p>

<div class="column-container">
<div class="column-half">
<h3 id="Struktur_Dasar">Struktur Dasar</h3>

<p>Penerapan HTML yang paling dasar adalah struktur dokumen. Jika kamu baru mengenal HTML, kamu harus mulai dengan ini.</p>

<ul>
 <li><a href="/en-US/Learn/HTML/Introduction_to_HTML/Getting_started#Anatomy_of_an_HTML_document">Cara membuat dokumen HTML dasar</a></li>
 <li><a href="/en-US/docs/Learn/HTML/Howto/Divide_a_webpage_into_logical_sections">Cara membagi halaman web menjadi beberapa bagian yang logis</a></li>
 <li><a href="/en-US/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals#The_basics_headings_and_paragraphs">Cara mengatur struktur judul dan paragraf yang tepat</a></li>
</ul>

<h3 id="Dasar_semantik_tingkat_dasar">Dasar semantik tingkat dasar</h3>

<p>HTML mengkhususkan dalam memberikan informasi semantik untuk dokumen, jadi HTML menjawab banyak pertanyaan yang mungkin kamu miliki tentang bagaimana cara menyampaikan pesan kamu dengan baik di dokumen kamu.</p>

<ul>
 <li><a href="/en-US/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals#Lists">Cara membuat list item dengan HTML</a></li>
 <li><a href="/en-US/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals#Emphasis_and_importance">Cara menekankan (stressed) atau menekankan (empashed) konten</a></li>
 <li><a href="/en-US/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals#Emphasis_and_importance">Cara menambahkan text important</a></li>
 <li><a href="/en-US/Learn/HTML/Introduction_to_HTML/Advanced_text_formatting#Representing_computer_code">Cara menampilkan kode komputer dengan HTML</a></li>
 <li><a href="/en-US/Learn/HTML/Multimedia_and_embedding/Images_in_HTML#Annotating_images_with_figures_and_figure_captions">Cara membuat anotasi gambar dan grafik</a></li>
 <li><a href="/en-US/Learn/HTML/Introduction_to_HTML/Advanced_text_formatting#Abbreviations">Bagaimana menandai singkatan dan membuatnya bisa dimengerti</a></li>
 <li><a href="/en-US/Learn/HTML/Introduction_to_HTML/Advanced_text_formatting#Quotations">Bagaimana menambahkan quote dan cite ke halaman web</a></li>
 <li><a href="/en-US/docs/Learn/HTML/Howto/Define_terms_with_HTML">How to define terms with HTML</a></li>
</ul>
</div>

<div class="column-half">
<h3 id="Hyperlinks">Hyperlinks</h3>

<p>Salah satu alasan utama HTML adalah memudahkan navigasi {{Glossary("hyperlink", "hyperlinks")}}, which can be used in many different ways:</p>

<ul>
 <li><a href="/en-US/Learn/HTML/Introduction_to_HTML/Creating_hyperlinks">Bagaimana cara membuat hyperlink</a></li>
 <li><a href="/en-US/Learn/HTML/Introduction_to_HTML/Creating_hyperlinks#Active_learning_creating_a_navigation_menu">Cara membuat daftar isi dengan HTML</a></li>
</ul>

<h3 id="Gambar_multimedia">Gambar &amp; multimedia</h3>

<ul>
 <li><a href="/en-US/Learn/HTML/Multimedia_and_embedding/Images_in_HTML#How_do_we_put_an_image_on_a_webpage">Bagaimana cara menambahkan gambar ke halaman web</a></li>
 <li><a href="/en-US/Learn/HTML/Multimedia_and_embedding/Video_and_audio_content">Bagaimana cara menambahkan video ke halaman web</a></li>
</ul>

<h3 id="Scripting_styling">Scripting &amp; styling</h3>

<p>HTML hanya mengatur struktur dokumen. Untuk mengatasi masalah tampilan, gunakan{{glossary("CSS")}}, atau gunakan scripting atau javascript untuk membuat halaman Anda interaktif.</p>

<ul>
 <li><a href="/en-US/Learn/CSS/Introduction_to_CSS/How_CSS_works#How_to_apply_your_CSS_to_your_HTML">Cara menggunakan CSS dalam halaman web</a></li>
 <li><a href="/en-US/docs/Learn/HTML/Howto/Use_JavaScript_within_a_webpage">Cara menggunakan JavaScript dalam halaman web</a></li>
</ul>

<h3 id="Embedded_content">Embedded content</h3>

<ul>
 <li><a href="/en-US/Learn/HTML/Multimedia_and_embedding/Other_embedding_technologies">Cara mengembed halaman web di dalam halaman web lain</a></li>
 <li><a href="/en-US/Learn/HTML/Multimedia_and_embedding/Other_embedding_technologies#The_%3Cembed%3E_and_%3Cobject%3E_elements">Bagaimana cara menambahkan konten Flash dalam halaman web</a></li>
</ul>
</div>
</div>

<h2 id="Masalah_yang_tidak_umum_atau_tingkat_lanjut">Masalah yang tidak umum atau tingkat lanjut</h2>

<p>Selain dasar-dasarnya, HTML sangat kaya dan menawarkan fitur-fitur canggih untuk memecahkan masalah yang kompleks. Artikel ini membantu kamu menangani kasus penggunaan yang kurang umum yang mungkin kamu hadapi:</p>

<div class="column-container">
<div class="column-half">
<h3 id="Forms_Formulir">Forms (Formulir)</h3>

<p>Forms adalah struktur HTML kompleks yang dibuat untuk mengirim data dari halaman web ke server web. Kami mendorong kamu untuk membaca panduan lengkap kami. Di sinilah kamu harus memulai:</p>

<ul>
 <li><a href="/en-US/docs/Web/Guide/HTML/Forms/My_first_HTML_form">Cara membuat formulir Web sederhana</a></li>
 <li><a href="/en-US/docs/Web/Guide/HTML/Forms/How_to_structure_an_HTML_form">Bagaimana menyusun formulir Web</a></li>
</ul>

<h3 id="Tabular_information_Informasi_Tabel">Tabular information ( Informasi Tabel)</h3>

<p>Beberapa informasi, yang disebut data tabular, perlu diatur ke dalam tabel dengan kolom dan baris. Itu salah satu struktur HTML paling kompleks, dan menguasainya tidaklah mudah:</p>

<ul>
 <li><a href="/en-US/docs/Learn/HTML/Tables/Basics">Cara membuat tabel data</a></li>
 <li><a href="/en-US/docs/Learn/HTML/Tables/Advanced">Bagaimana membuat tabel HTML dapat diakses</a></li>
</ul>

<h3 id="Data_representation_Representasi_data">Data representation (Representasi data)</h3>

<ul>
 <li>Bagaimana merepresentasikan nilai numerik dan kode dengan HTML — Lihat <a href="/en-US/docs/Learn/HTML/Introduction_to_HTML/Advanced_text_formatting#Superscript_and_subscript">Superscript and Subscript</a>, dan <a href="/en-US/docs/Learn/HTML/Introduction_to_HTML/Advanced_text_formatting#Representing_computer_code">Representasi kode komputer</a>.</li>
 <li><a href="/en-US/docs/Learn/HTML/Howto/Use_data_attributes">Cara menggunakan atribut data</a></li>
</ul>
</div>

<div class="column-half">
<h3 id="Sematik_text_tingkat_lanjut">Sematik text tingkat lanjut</h3>

<ul>
 <li><a href="/en-US/docs/Web/HTML/Element/br">Cara membuat garis baru</a></li>
 <li>How to mark changes (added and removed text) — see the {{htmlelement("ins")}} and {{htmlelement("del")}} elements.</li>
</ul>

<h3 id="Advanced_images_multimedia">Advanced images &amp; multimedia</h3>

<ul>
 <li><a href="/en-US/docs/Learn/HTML/Multimedia_and_embedding/Responsive_images">Bagaimana cara menambahkan gambar responsif ke halaman web</a></li>
 <li><a href="/en-US/docs/Learn/HTML/Multimedia_and_embedding/Adding_vector_graphics_to_the_Web">Bagaimana cara menambahkan gambar vektor ke halaman web</a></li>
 <li><a href="/en-US/docs/Learn/HTML/Howto/Add_a_hit_map_on_top_of_an_image">Bagaimana cara menambahkan peta di atas gambar</a></li>
</ul>

<h3 id="Internationalization">Internationalization</h3>

<p>HTML tidak monolingual. Alat ini menyediakan sesuatu untuk menangani masalah internasionalisasi umum.</p>

<ul>
 <li><a href="/en-US/docs/Learn/HTML/Introduction_to_HTML/The_head_metadata_in_HTML#Setting_the_primary_language_of_the_document">Bagaimana cara menambahkan banyak bahasa ke dalam satu halaman web</a></li>
 <li><a href="/en-US/docs/Learn/HTML/Introduction_to_HTML/Advanced_text_formatting#Marking_up_times_and_dates">Bagaimana menampilkan waktu dan tanggal dengan HTML</a></li>
</ul>

<h3 id="Performa">Performa</h3>

<ul>
 <li><a href="/en-US/docs/Learn/HTML/Howto/Author_fast-loading_HTML_pages">Cara membuat halaman HTML yang dimuat dengan cepat</a></li>
</ul>
</div>
</div>

<p><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span> </p>

<div id="gtx-trans" style="position: absolute; left: 50px; top: 3011.2px;">
<div class="gtx-trans-icon"></div>
</div>