Breaking

Showing posts with label HTML. Show all posts
Showing posts with label HTML. Show all posts

Tuesday, October 15, 2019

October 15, 2019

TUTORIAL HTML PART 7 : MEMBUAT HYPERLINK PADA HTML


Assalamu'alaikum Wr.Wb

Pengertian
 Hyperlink  yang sering dikenal dengan sebutan link merupakan penghubung antara satu dokumen dengan dokumen yang lain pada HTML . Tujuan utama Hyperlink yaitu untuk membuat gambar atau tulisan yang apabila diklik akan ditujukan atau dialihkan ke halaman yang telah ditetapkan dalam penulisan hyperlink tersebut.

Pembahasan
  Hyperlink sendiri ditulis dengan menggunakan tag <a> . Tag <a> ini sendiri biasanya diikuti oleh penggunaan href (hypertext references), nah pada href inilah alamat diberikan, tujuannya agar ketika gambar / text diklik akan dialihkan ke dokumen lain. Cara penulisan Tag Hyperlink seperti yang dibawah ini :



<a href="https://rizkamalaalfiana13.blogspot.com//">klik disini</a>
Dan apabila sudah menuliskan script seperti yang diatas pasti akan tampil seperti gambar dibawah :


Nah setelah kita jalankan / liat di browser maka akan muncul seperti gambar dibawah ini


 Nah, coba kita klik kata "klik disini" maka akan tampil seperti gambar dibawah


Kesimpulan
   Nah mudah bukan penggunaan Hyperlink, jadi penggunaan dan kegunaan Hyperlink ini untuk membuat semacam gambar atau tulisan yang apabila di klik kita langsung di arahkan ke halaman web yang telah ditentukan sewaktu menulis url href nya.


Refrensi
https://id.wikipedia.org/wiki/HTML 

Wassalamu'alaikum Wr.Wb

0
By at No comments:
Labels:
October 15, 2019

TUTORIAL HTML PART 5 : MEMBUAT PARAGRAF PADA HTML

Assalamu'alaikum wr.wb

Pendahuluan
 Pada kesempatan kali ini saya kan share tentang Membuat Paragraf pada html.

Pengertian
Hypertext Markup Language (HTML) adalah sebuah bahasa markah yang digunakan untuk membuat sebuah halaman web, menampilkan berbagai informasi di dalam sebuah penjelajah web Internet dan pemformatan hiperteks sederhana yang ditulis dalam berkas format ASCII agar dapat menghasilkan tampilan wujud yang terintegerasi

Pembahasan
Untuk memahami pembuatan paragraf <p> pada HTML, diharapkan anda terlebih dahulu sudah memahami penulisan dan apa itu tag, element, atribut. paragraf disini merupakan suatu tag untuk membuat penulisan dalam bentuk paragraf.

Tag Paragraf di bagi menjadi 3 atribut / tag yang bisa dikombinasikan langsung dengan tag paragraf <p>. Atribut tag tersebut yaitu :

  • Membuat paragraf rata kiri menggunakan syntax <p align="left"> Yakinlah </p>
  • Membuat paragraf rata kanan menggunakan syntax <p align="right"> Kamu </p>
  • Membuat paragraf rata tengah menggunakan syntax <p align="center"> Pasti </p>
  • Membuat paragraf rata kiri kanan menggunakan syntax <p align="justify"> Bisa </p>
Perhatikan contoh berikut :

Gambar 1 Tutorial Membuat Paragraf

Gambar 2 Tutorial Membuat Paragraf
NB : Paragraf menggunakan <p>, berikut akan diimplementasikan dalam dokumen HTML

 Dari contoh di atas dapat anda lihat bahwa penulisan paragraf pertama dan paragraf kedua di pisahkan. untuk memisahkan antara paragraf satu dan dua ini menggunakana <p>.

JENIS PARAGRAF
Berikut ini adalah beberapa contoh Jenis Paragraf pada HTML.

Paragraf rata kiri
<p align="left">1. Ini merupakan penulisan paragraf rata kiri dalam dokumen HTML</p>

Paragraf rata kanan
<p align="right">2. Ini merupakan penulisan paragraf rata kanan dalam dokumen HTML</p>

Paragraf rata tengah
<p align="center">3. Ini merupakan penulisan paragraf rata tengah dalam dokumen HTML</p>

Paragraf rata kira kanan
<p align="justify">4. Ini merupakan penulisan paragraf rata kiri kanan dalam dokumen HTML</p>

Berikut contoh ScreenShoot lengkapnya :

Gambar 3 Tutorial Membuat Paragraf

Gambar 4 Tutorial Membuat Paragraf

Dari Penggunaan Syntax Paragraf di atas kita mengetahui perbedaan syntax <p> dan penggunaan gimana cara menjadikan paragraf menjadi rata kanan, rata kiri, rata tengah, rata kiri-kanan . Jika kita ingin merata kirikan paragraf kita perlu menambahkan CSS inline di tag / syntax paragraf seperti <p align="left">, Nah... yang termasuk css inline nya itu sob.. adalah align="center" nya karena, align termasuk dalam CSS inline.

Refrensi
  https://id.wikipedia.org/wiki/HTML

Wassalamu'alaikum Wr.Wb

0
By at No comments:
Labels:
October 15, 2019

TUTORIAL HTML PART 4 : FORMAT TEXT PADA HTML TUTORIAL HTML PART 4 : FORMAT TEXT PADA HTML


Assalamu'alaikum Wr,Wb


Pengertian
  Dalam penuliasan HTML sangat sering menggunakan format text didalamanya. baik itu
dalam penulisan judul,ataupun isi dari content/halaman website sendiri. Berikut beberapa
penjelasan dan contoh dari Format Text Pada HTML.

Latar Belakang
  Untuk Tutorial ke - 4 ini Author akan menjelaskan tentang Format Text pada HTML, sebelum masuk ke Format Text / Tutorial ke-4 ini, alangkah baiknya kawan" mengikuti dari Tutorial Pertama agar lebih Paham .

Maksud dan Tujuan
  • Mendalami Bahasa Pemrograman HTML
  • Mememahami & Mengetahui Format Apa saja yang ada Beserta Kegunaannya
Alat dan Bahan
  • 1 Unit PC / Laptop
  • Text Editor
Pembahasan
  1. FORMAT TEXT Pada HTML 
Ada beberapa format text yang umumnya digunakan untuk Coding, antara lain :

Membuat huruf tebal (bold) pada HTML
Untuk membuat teks menjadi tebal pada tampilan halaman web, bisa menggunakan tag <b> berikut contoh Syntax HTML untuk membuat Format Text tebal :


<b>Text ini tebal</b>
Membuat huruf miring (italic) pada HTML
Untuk membuat text menjadi kelihatan miring pada halaman web, kita bisa menggunakan tag <i> berikut contoh Syntax HTML - nya :


<i>Text ini miring</i>

 Membuat huruf bergaris bawah (underline) pada HTML
Untuk membuat tulisan / text bergaris bawah, kita dapat menggunakan tag <u>, berikut contoh Syntax HTML - nya :

<u>Text ini bergaris bawah </u>

Berikut Format Text yang sering digunakan untuk penulisan pada halaman web / HTML :

Tag Description
<b> format text bold/tebal
<i> format text italic/miring
<u> format text underline/garis bawah
<small> format text kecil
<strong> format text yang hampir sama dengan format bold
<sub> format subscripted teks
<sup> format superscripted teks
<ins> format text garis bawah
<del> format text dengan garis di tengah
<mark> format text yang berwarna

Berikut contoh penulisan tag/element format text yang sudah di pelajari di atas :
Gambar 1 Tutorial HTML Format Text


Gambar 2 Tutorial HTML Format Text

 Nah... Sekian Tutorial HTML tentang Format Text kali ini Semoga Bermanfaat untuk teman"

Kesimpulan
Format Text merupakan bahasa pemrograman HTML yang pasti di gunakan diwaktu membuat halaman web, entah untuk penamaan, pembedaan arti dlsb. Maka dari itu Format Text juga perlu di pelajari Sob.

 REFERENSI
  https://id.wikipedia.org/wiki/HTML

Wassalamu'alaikum Wr.Wb

0
By at No comments:
Labels:
October 15, 2019

TUTORIAL HTML PART 2 : “MENGENAL TAG, ATRIBUT, ELEMENT PADA HTML”

 Assalamu'alaikum wr.wb

 
Pendahuluan
Alhamdullilah author masih bisa melanjutkan TUTORIAL HTML ke Part 2 mengenai Tag, Atribut, dan Element , Setelah sebelumnya kita membahas tentang Pengenalan HTML, Text Editor. kini kita akan memasuki tutorial pengenalan dan penggunaan Tag, Element dan Atribut dalam HTML. Ketiga unsur pembahasan ini merupakan dasar dalam penulisan kode HTML atau dasar dari seluruh tampilan halaman web yang ada di internet.

Pengertian
   Sebagai sebuah bahasa markup, HTML membutuhkan cara untuk memberitahu web browser untuk apa fungsi sebuah text . Apakah text tersebut akan ditulis sebagai paragraf, list, link, menebalkan huruf dlsb. Hampir semua tag di HTML ditulis secara berpasangan, yakni tag pembuka dan tag penutup , dimana objek yang dikenai perintah tag berada di antara tag pembuka dan tag penutup. Penulisan tag  pembuka ialah <> sedangkan tag penutup menggunakan slash setelah kurung lancip buka </> .
Alat & Bahan 
  • 1 Unit PC / Laptop
  • Text Editor 

Pembahasan
  1. TAG
Tag merupakan kode yang digunakan untuk memperkenalkan pada web browser untuk apa text HTML yang ditulis. HTML membutuhkan cara memperkenalkan text yang ditulis didalamnya kepada web browser. baik text itu berupa list, paragraf, link dan sebagainya. disinilah di gunakan tag. dalam penulisan tag, hampir semua menggunakan pembuka dan penutup tag, dimana objek yang di maksudkan berada diantara pembuka dan penutup tag. Berikut penulisan tag yang digunakan dalam HTML.

Perbedaan antara tag pembuka dan tag penutup yaitu, pada tag pembuka di awali oleh pembuka kurung lancip pembuka dan di akhiri penutup kurung lancip penutup ( <> ), sedangkan tag penutup di awali dengan pembuka kurung lancip, backslash, dan di akhiri penutup kurung lancip ( </> ).
Berikut ini contoh beberapa jenis tag yang sering teman” jumpai di website – website tentang programming :
Tag Fungsi

<!-….-> Digunakan untuk memberi sebuah komentar atau keterangan <!DOCTYPE html> Digunakan untuk Mendefinisikan tipe document HTML5<a>link</a> Mendefinisikan sebuah anchor, digunakan untuk saling menautkan antara satu dokumen HTML ke dokumen HTML yang lain (membuat link). <b>..</b> Untuk mempertebal tulisan <p>..</p> Untuk membuat paragraf <h1>..</h1> Untuk membuat heading 1 dan tulisan agak besar <h2>..</h2> Untuk membuat heading 2 dan tulisan agak kecil dari h1 <body> Mendefinisikan body / isi dari dokumen html <head> Mendefinisikan bagian kepala HTML<title> Memberikan judul pada halaman web <link> Mendefinisikan hubungan antar dokumen <script> Mendefinisikan client-side script <table> Mendefinisikan table <th> Mendefinisikan sel header di dalam sebuah table <td> Mendefinisikan sel di dalam sebuah tabel <tr> Mendefinisikan baris di dalam sebuah tabel <ul> Mendefinisikan daftar dalam format bullet <li> Mendefinisikan list


  1. ELEMENT
Element pada HTML merupakan isi atau objek yang berada pada tag, maksudnya, isi yang terdapat diantara tag pembuka dan tag penutup di sebut elemen misalnya :



pada contoh diatas <h2> adalah heading dua <h2> merupakan element h2 dan isinya ini adalah heading dua. dalam element ini bisa berupa text ataupun tag lain misalnya <link> dan sebagainya.


  1. ATRIBUT
Atribut menurut saya hampir sama dg CSS namun di dalam tag, Atribut merupakan informasi tambahan yang digunakan di dalam tag pembuka, informasi ini bisa berupa instruksi untuk memberikan / menambahkan efek warna, ketebalan huruf, dll. Atribut biasanya memiliki 2 bagian yaitu nama dan nilai, dapat ditulis dengan (name:”value”) penulisannya diapit oleh dua tanda kutip (bisa menggunakan kutip satu maupun kutip dua).
Penulisan atribut pada HTML diawali dengan penulisan tag, didalam tag berikan atribut dan elemen dari tag itu sendiri ini dia contoh atribut pada HTML :



        Perhatikan pada syntax di atas :
  • <h2> adalah tag heading 2 yang huruf nya lebih kecil dari h1
  • align merupakan nama atribut
  • center merupakan nilai / value dari atribut
  • “Pengenalan atribut HTML” adalah element dari tag h2
Tidak semua tag ini membutuhkan atribut di dalamnya, namun bagi anda yang bergelut di web programing akan sering menjumpai tag yang didalamnya terdapat atribut.

Kesimpulan
   Jadi apa yang saya sharing dari atas sampai kebawah intinya, Tag sebagai tanda pengenal agar dapat di baca oleh sistem HTML, Element isi atau objek yang berada di antara tag. Atribut merupakan tag informasi yang gunanya menambahkan dan memberi instruksi untuk memberikan warna, dll.
 
Refrensi 
 
Penutup
 Cukup sekian yang dapat saya share pada hari ini semoga dapat bermanfa'at buat semuanya.

Wassalamu'alaikum wr.wb

0
By at No comments:
Labels:
TUTORIAL HTML PART 1 : “PENGERTIAN HTML”
October 15, 2019

TUTORIAL HTML PART 1 : “PENGERTIAN HTML”

Assalamu'alaikum wr.wb
Pengertian
   HTML (Hypertext Markup Language) adalah sebuah bahasa formatting yang di gunakan untuk membuat sebuah halaman website. HTML termasuk dalam bahasa pemrograman yang gunanya sebagai pondasi dasar pada halaman website. Jika kita ingin membuat sebuah file / document menjadi HTML maka yang perlu di perhatikan ialah ekstensi ketika kita mengesave / menyimpannya sebagai file apa. Untuk HTML sendiri eksitensi ketika di save agar format nya HTML harus di simpan dengan ekstensi .html (dot html). 
  HTML memiliki beberapa element yang tersusun dari tag-tag yang memiliki fungsi nya
masing-masing. seperti tag heading, paragraf, pembuatan form, tombol, list, membuat hyperlink
atau link yang menghubungkan antar halaman website dan banyak lagi lainnya yang akan kita
bahas pada buku ini.
Latar Belakang
   Alhamdullilah author masih bisa menulis sedikit artikel yang dapat bermanfaat untuk, teman” sekalian. Di sini author akan menyinggung sedikit tentang HTML. HTML merupakan bahasa pemrogrman dasar yang wajib di kuasai terlebih dahulu sebelum teman” melebu ke bahasa permrograman yang lain. Jadi ibarat HTML merupakan sebuah pondasi untuk membangun suatu rumah, tentunya rumah butuh pondasi terlebih dahulu kan sebelum menjadi rumah ?, agar tidak mudah hancur ketika keterak angin. Lha … bahasa pemrograman sendiri juga seperti itu.
Pembahasan

KEGUNAAN HTML
   HTMLberfungsi sebagai pondasi sebuah halaman website. Adapun yang dapat di lakukan dengan HTML adalah sebagai berikut :

  1. Membungkus elemen – elemen tertentu sesuai kebutuhan
  2. Membuat heading atau format judul
  3. Membuat Tabel
  4. Membuat List
  5. Membuat Paragraf
  6. Membuat Form
  7. Membuat Tombol
  8. Membuat Huruf Tebal
  9. Membuat Huruf Miring
  10. Menampilkan Gambar
  11. Menampilkan Video

 Dan banyak lainnya yang akan kita pelajari pada penjelasan selanjutnya.
Sampai saat ini HTML sudah sampai pada versi 5 / HTML5 juga mempunyai banyak fitur tambahan, khususnya streaming video tanpa adobe flash. Super bukan ??? , Jadi marilah kita juga mengikuti informasi IT terbaru dan terupdate ^_^ selalu. Oh iya HTML5 tentang Streaming Insyaallah juga akan buatkan tutorialnya.

Kesimpulan
Jadi kesimpulan dari HTML Part 1 ini ialah HTML merupakan pondasi dan merupakan bahasa pemrograman dasar untuk membangun sebuah rumah / halaman website. Dan ekstensi file HTML ialah . html(dot html).

Refrensi
 https://id.wikipedia.org/wiki/HTML

Penutup 
 Cukup sekian yang dapat saya share pada hari ini semoga dapat bermanfa'at buat semuanya.

Wassalamu'alaikum wr.wb

0
By at No comments:
Labels: