Thursday, March 31, 2016

MEMASUKAN LINK DAN FOTO MENGGUNAKAN KODE HTML

Posted on  by   with No comments:
Seteleh dipostingan kemarin kita mengatahui apa itu html , fungsi dan pemanfaatanya sekarang kita coba menggunakan kode html untuk menambahkan link ,foto dan foto yang terdapat link didalamnnya.

Kode tag yang akan digunakan adalah :

<a href="link tujuan"> Pesan  </a>    <= untuk menambahkan link dengan anchor text.

<img src="link foto"/>                <= untuk menambahkan foto.

<a href="link tujuan"><img src="link foto"/></a>    <= untuk menambahkan foto yang mengandung link jika di klik akan mengarah kepada link didalamnya.


untuk percobaan coba kode dibawah dan ubahlah sesuai keinginan Anda. Simpan dengan format html dan buka menggunakan browser dan lihat hasilnya.


<!DOCTYPE html>

<html>
<head>
<title>test judul</title>
</head>
<body>
           <h1> judul heading</h1>
<img src="https://goo.gl/biq7FY"/>
<p>isi paragraf 1 </p>
<p>isi paragraf 2 </p>
<p>isi paragraf 3 </p>

<h2>Contoh Foto Bisa di klik</h2>
<a href="http://justkode.blogspot.com"><img src="https://goo.gl/biq7FYm"/></a>






</body>
</html>



Pada dasarnya platform blog atau web saat ini sudah memberikan cara yang sangat simple untuk menaruh link , foto dan video hanya saja jika anda mengunakan plaform yang berdiri sendiri dan self hosted masih banyak yang menngunakan cara manual seperti kode diatas tadi.

Jika memang dasarnya untuk blog pribadi saran saya gunakan platform blogger dari google , karena selain kemudahan untuk editing yang tanpa harus paham kode html blogger juga menyediakan space yang lumayan besar dengan gratis bagi para blogger. Jadi untuk mereka yang awan dan baru mengenal akan sangat mudah mempelajari seluk beluk blogger.

nah mudah"an bisa dipahami ya sobat. semoga bermanfaat jangan sungkan untuk bertanya :)




Wednesday, March 30, 2016

MENGENAL DASAR ILMU KODE HTML

Posted on  by   with No comments:
MENGENAL DASAR ILMU KODE HTML

Dipostingan pertama ini yuk sama - sama belajar HTML , di mulai dari apa itu HTMl dan fungsi keberadaanya dalam sebuah situs web. HTML sendiri singkatan dari HyperText Markup Language , Hypertext berarti text dengan link di dalamnya ketika kapan saja kita klik pada text tersebut akan mengarahkan kepada halaman web baru. Dan Markup Language adalah bahasa pemrograman yang digunakan programer yang membuat text tidak hanya sebagai text tapi menambahkan fungsi yang lain selain untuk text itu sendiri.

Bahasa simplenya adalah HTML itu kerangka dari sebuah web , dan CSS yang nanti akan kita bahas selanjutnya adalah kulit yang membuat web kita semakin indah. gitu...

Hal pertama yang kita lakukan untuk memulai kode HTML adalah membuat awalan kode HTML itu sendiri

=> <!DOCTYPE html>

selalu letakan di garis awal pada web yang akan kita bangun ini untuk memberitahu pada browser bahasa yang digunakan oleh web dan dibaca oleh browser.


( <> ) Kode ini disebut tags Ingat anda membuat web dalam wadah html jadi berikan tag <html> untuk membuka dan untuk menutup dengan </html>, pada dasarnya nanti sobat akan ketahui kalau tag <> dan </> dalam kode dasar html berperan sangat penting, hampir semua kode nantinya sama hanya saja berbeda dalam misalkan tabel <table> dan penutupnya juga menggunakan </table> seperti itu.


contoh  tag :

 <tag1><tag2> pesan <tag3>


contoh tag HTML

1. <!DOCTYPE html>
2.<html>      <- pembuka
3.</html>     <- penutup

HEAD DAN BODY

Dalam web terdapat dua bagian penting yaitu HEAD dan Body , Head berisikan informasi tentang kode html anda, seperti judul web yang nantinya akan terliha di browser pengunjug web Anda. Sedangkan Body  adalah tempat konten dari web Anda , entah itu tulisan , foto , link atau apa saja yang akan Anda bagikandalam web Anda.

contoh kerangka html dengan head dan body


1. <!DOCTYPE html>
2. <html>
3. <head> <title> JUDUL BLOG </tittle>
4. </head>
5. <body>
6. <p> ISI WEB<P>
7. </body>
8.
9. </html>

PARAGRAF DAN HEADING

untuk memberikan judul atau titel dalam web kita gunakan tag title seperti contoh diatas , untuk membuat judul paragraf kita bisa menggunakan tag <h1> atau disebut "heading" dan tag <p> sebagai isi dari paragraf.

Dalam mengaplikasikan tag "heading" kita juga harus tahu untuk membedakan ukuran heading satu dengan yang lainnya <h1> berbeda ukuran dengan <h2>begitu pula seterusnya.


contoh kerangka html menggunakan tag "heading"dan "paragraf"

<!DOCTYPE html>
<html>

<head>
<title> judul web </title>

</head>
<body>
<h1> judul paragraf </h1>
<p>  isi paragraf </p>
<p>  isi paragraf </P>
                <h2> judul paragraf </h2>
<p>  isi paragraf </p>
<p>  isi paragraf </P>



</body>
</html>




jadi beberapa hal kita dapat ketahui dari dasar html diatas adalah

1.HTML structure dasar dari sebuah website
2.Yang kita temukan sebagai situs ternyata berisi kode-kode program html yang kemudian oleh browser  kita sebagai file yang kita temukan dalam situs itu.
3.HTML memiliki kepala dan badan seperti manusia, awalan dan akhiran , pembuka juga penutup.
4.Title tag yang ada pada head selain berfungsi sebagai judul juga berguna sekali untuk mengenalkan nama web kita lebih spesifikasi lagi.


Untuk belajar gunakan kode berikut ini , simpan di notepad dengan format .html lalu coba buka pada browser dan lihat hasilnya , ternyata lumayan mudah ya. jika ada kesulitan jangan sungkan untuk bertanya melalui komen ya sobat


<!DOCTYPE html>
<html>

<head>
<title>
TITLE WEB
</title>

</head>
<body>
<h1> HEADING 1 </h1>
      <p> isi paragraf 1 </p>
<h2> HEADING 2 </h2>
<p> isi paragraf  2  </p>
<h3> HEADING 3 </h>
      <p> isi paragraf 3 </p>
<h4> HEADING 4 </h4>
      <p> isi paragraf  4 </p>
<h5> HEADING 5 </h5>
      <p> isi paragraf 5 </p>
<h6> HEADING 6 </h6>
      <p> isi paragraf 6 </p>



</body>
</html>




Semoga bermanfaat ya sobat.