Dasar-dasar kode HTML - Bekal Awal Menjadi Seorang Design Web dengan Penjelasan Mudah Di Pahami

Dasar-dasar kode HTML - Bekal Awal Menjadi Seorang Design Web dengan Penjelasan Mudah Di Pahami.

HTML kode pada umumnya terdiri perintah sebagai berikut :

<HTML>
<BODY>

Mengenal Dasar-Dasar dari Kode-Kode HTML

</BODY>
</HTML>


Coba perhatikan kode diatas, kode kode HTML selalu di batasi dengan tag pembuka dan penutup <....>

Sekarang bagaimana tampilan tag untuk membuat Title pada Sebiah blog atau web ?. Untuk membuat title pada sebuah web atau blog anda harus menambahkan kode <HEAD><TITLE>..........</TITLE></HEAD>
Diantara kode <HTML> dan <BODY> 

Contohnya seperti ini :

<HTML>
<HEAD>
<TITLE>
Dasar-Dasar dari Kode-Kode HTML</HEAD>
</HEAD> 
<BODY>

Mengenal Dasar-Dasar dari Kode-Kode HTML

</BODY>
</HTML>


Seepzz… sampe disini pasti udah paham ya..



Kode-kode HTML yang banyak digunakan untuk memanipulasi text dalam  sebuah web/Blog
CODE
KETERANGAN
<b> TEXT </b>
 kode ini digunakan untuk membuat cetak tebal pada tulisan.
<i> TEXT </i>
 kode ini digunakan untuk membuat text miring pada tulisan.
<u> TEXT </u>
 Kode ini digunakan untuk membuat garis bawah pada tulisan.
<b><i><u> TEXT </u></i></b>
 ini dalah kode kombinasi yang menghasilkan text seperti ini.
Selain Kode Diatas anda jugadapat menggunakan kode berikut ini :
CODE
KETERANGAN
<strong> TEXT </strong>
 kode ini digunakan untuk membuat cetak tebal.
<em> TEXT </em>
 kode ini digunakan untuk membuat text miring.
Selain itu anda dapat menggunakan Kode HTML untuk memanipulasi warna dan besar huruf pada Text :
CODE
KETERANGAN
<FONT SIZE="..." COLOR="..." FACE="..."> TEXT </FONT>.
 SIZE untuk mengatur ukuran huruf, biasanya dengan satuan Pixel.

 COLOR untuk mengatur warna huruf.

 FACE untuk mengatur jenis huruf.
Misalnya anda ingin mengatur warna pada sebuah Text :

<FONT COLOR="blue"> text akan berwarna biru </FONT>
<FONT COLOR="red"> 
Text akan berwana merah </FONT>
<FONT COLOR="white"> 
text akan berwanar putih </FONT>

 Apabila anda ingin mengatur Ukuran text contohnya sebagai berikut :

<FONT SIZE="1">
Ukuran 1 akan seperti in.</FONT>
<FONT SIZE="2">
Ukuran 1 akan seperti in.</FONT>
<FONT SIZE="3">Ukuran 1 akan seperti in.</FONT>


Bagaimana jika ingin memilih jenis text :

<FONT FACE="Arial">
Ini memakai font arial black.</FONT>
<FONT FACE="Helvetica">
Ini memakai font Helvetica.</FONT>
<FONT FACE="Gorgia">
Ini memakai font Impact.</FONT>

Terus bagaimana menggabungkan semuanya, agar lebih akurat coba kita perhatikan kode dibawah.

Contoh :

Kita akan menggabungkan kode warna besar huruf dan jenis hurup, cetak tebal , miring dan bergaris bawah seperti ini.

<FONT SIZE="3" COLOR="red" FACE="Arial"><b><i><u>
Hasilnya seperti ini</u></i></u></FONT>.

Seepzz.. dah… keren. Gampang.kan-?
Ya.. yaa… pasti :D
hehehe..




Oke selanjutnya kita bahas cara mengubah text dengan tag heading <h1> sampai dengan<h6>. <h1>  merupakan ukuran huruf yang paling terbesar dan <h6> adalah ukuran huruf terkecil

Perhatikan huruf yang menggunakan <h2> dan <h3>

<h2>
ukurannya seperti ini </h2>
<h3>
ukurannya seperti ini </h3>

Anda juga harus mengetahui beberapa kode-kode yang digunakan untuk mengetur paragraf :

<p> Untuk membuka paragraf
</p> 
untuk menutup paragraf
<br> 
Untuk membuat baris baru
<center> 
Untuk membuat tulisan berada di tengah </center>

Contohnya :

<P align="left"><FONT COLOR="red"><b> Paragraf ini menggunakan rata kiri dengan warna tulisan biru dan bercetak tebal
<br> tag ini membuat tulisan ini dalam baris baru</b></FONT></P>


Hasilnya akan seperti ini :
Paragraf ini menggunakan rata kiri dengan warna tulisan merah dan bercetak tebal
tag ini membuat tulisan ini dalam baris baru 

<P align="center"><FONT COLOR="blue"><U> Paragraf ini menggunakan rata tengah dengan warna tulisan biru dan bergaris bawah
<br> tag ini membuat tulisan ini dalam baris baru</U></FONT></P>


Hasilnya :
Paragraf ini menggunakan rata tengah dengan warna tulisan biru dan bergaris bawah
tag ini membuat tulisan ini dalam baris baru

Ok kita lanjut pada pembahasan berikutnya.Dengan HTML kode anda juga dapat membuat sebuah link didalam text:

Kode yang digunakan adalah sebagai berikut :

<a href="Link yang dituju">Link yang dimaksud/anchor text</a>

Contohnya disini anda memasukan link 
https://sekilas-coding.blogspot.com

 maka hasilnya adalah sebagai berikut :
<a href="https://sekilas-coding.blogspot.com">Sekilas Coding</a>

sekarang pada Tulisan "Sekilas Coding" terdapat link http://sekilas-coding.blogspot.com untuk mengecek silahkan letakan kursor mouse anda pada Tulisan "Sekilas Coding"
 dan klik maka text tersebut akan membawa anda kehalaman HOME blog sekilas-coding.blogspot.com

Anda juga dapat mengatur text link tersebut terbuka pada jendela baru dengan menambahkan kode

TARGET="_Blank"

Contoh:

<a HREF="https://
sekilas-coding.blogspot.com" TARGET="_Blank"> Sekilas Coding<a>
Berfungsi saat sobat Mengklik Link tersebut, maka akan masuk pada alamat link yang dituju dengan menambahkan tab baru pada browser.

Huuffftt…
Cape juga nih, sebenernya gampang kok.
Tinggal focus kita pada setiap kode yang ditulis, jadi tidak ada kesalahan dalam penulisannya. Mungkin saat ini hanya seperti yang dapat saya berikan untuk saat ini. Semoga bermanfaat bagi sahabat yang membacanya.
Saya ucapakan terimakasih, dan maaf bila ada penulisan yang salah atau ada kata yang tidak berkenan dihati sobat, kami mohon maaf…

Sampai ketemu di posting selanjutnya, kunjungi terus yaah.. :D

Sumber: https://rafi-orilya.blogspot.com/2012/08/dasar-dasar-kode-html-bekal-awal.html

Komentari Artikel "Dasar-dasar kode HTML - Bekal Awal Menjadi Seorang Design Web dengan Penjelasan Mudah Di Pahami"

0 Komentar
Silahkan Berkomentar Melalui Akun Facebook Anda
Silahkan Tinggalkan Komentar Anda

Posting Komentar

Kode Smiley Untuk Komentar


:a   :b   :c   :d   :e   :f   :g   :h   :i   :j   :k   :l   :m   :n   :o   :p   :q   :r   :s   :t  

Iklan Infeed

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel