Pengertian, Fungsi, dan Contoh HTML

Apa itu HMTL ? pengertian html adalah singkatan dari Hyper Text Markup Language sebuah bahasa pemrograman yang umum digunakan untuk membuat sebuah halaman website, dimana HTML ini bisa kita gunakan untuk menginput gambar, text, audio, video dan lainnya untuk membuat sebuah website. HTML adalah sebuah standar yang digunakan secara luas untuk menampilkan halaman web. Menggunakan tag-tag tertentu untuk menyatakan kode-kode yang harus ditafsirkan oleh browser agar halaman tersebut dapat ditampilkan di web browser.

HTML hingga saat ini merupakan standar Internet yang didefinisikan dan dikendalikan penggunaannya oleh World Wide Web Consortium (W3C). HTML dibuat oleh kolaborasi Caillau TIM dengan Berners-lee Robert ketika mereka bekerja di CERN pada tahun 1989 CERN adalah lembaga penelitian fisika energi tinggi di Jenewa

Sejarah Singkat HTML

Pada tahun 1980, IBM memikirkan pembuatan suatu dokumen yang akan mengenali setiap elemen dari dokumen dengan suatu tanda tertentu. IBM kemudian mengembangkan suatu jenis bahasa yang menggabungkan teks dengan perintah-perintah pemformatan dokumen. Bahasa ini dinamakan Markup Language, sebuah bahasa yang menggunakan tanda-tanda sebagai basisnya. IBM menamakan sistemnya ini sebagai Generalized Markup Language atau GML.

Tahun 1986, ISO menyatakan bahwa IBM memiliki suatu konsep tentang dokumen yang sangat baik, dan kemudian mengeluarkan suatu publikasi (ISO 8879) yang menyatakan markup language sebagai standar untuk pembuatan dokumen-dokumen. ISO membuat bahasa ini dari GML milik IBM, tetapi memberinya nama lain, yaitu SGML (Standard Generalized Markup Language). ISO dalam publikasinya meyakini bahwa SGML akan sangat berguna untuk pemrosesan informasi teks dan sistem-sistem perkantoran. Tetapi di luar perkiraan ISO, SGML dan terutama subset dari SGML, yaitu HTML juga berguna untuk menjelajahi internet. Khususnya bagi mereka yang menggunakan World Wide Web. Versi terakhir dari HTML saat ini adalah HTML5.

Fungsi HTML

Fungsi dari HTML adalah digunakan untuk membuat sebuah halaman website dan juga menampilkan berbagai informasi yang di inputkan ke dalam html tersebut seperti gambar, teks, video, dan lainnya sehingga bisa di tempilkan melalui web browser. Selian itu HTML juga bisa digunakan untuk membuat sebuah link yang nantinya menuju ke sebuah halaman website lainnya dengan kode tertentu.

Contoh HTML

setelah mempelajari pengertian, sejarah dan fungsi dari html, selanjutnya adalah mempelajari contoh bahasa HTML yang bisa digunakan untuk membuat sebuah website. Dan dibawah ini merupakan salah satu contoh dasar HTML yang u,u, digunakan untuk membuat sebuah website sederhana.

<html>

<head>

<title>Belajar HTML</title>

</head>

<body>

<body bgcolor="red">

<h1>Saya Sedang Belajar HTML</h1>

<center>

<font size="13" color="black" face="arial">

<p>Membuat HTML Itu Mudah Lo</p>

<b>HTML adalah Hyper Text Markup Leanguage</b>

<i>Dan Fungsi HTML itu adalah Untuk menginput Text, Gambar, Audio, Video</i>

<u>Itu semua mudah jika anda serius mempelajarinya :)</u>

</font>

<br>

<marquee>

<img src="gambar.jpg atau memasukan URL gambar"> //* Satukan File HTML dengan gambar yg anda masukan agar dapat dibaca

</marquee>

</center>

</body>

</html>

Keterangan : 

• <html>  :Untuk memulai sebuah HTML
• <title>:Untuk memberi judul pada yang nantinya akan muncul di TabBrowser
• <head> : Untuk Bagian Header atau Atas
• </head>: Untuk Penutup Header dan diawali dengan garis miring "/"
• <body>  : Untuk Bagian Body atau Isi dalam HTML
• </body>: Untuk Penutup/menutup Body dan diawali dengan garis miring "/"
• </html>: Untuk Menutup Sebuah HTML dan diawali juga dengan garis miring "/"

diatas merupakan kode-kode Dasar untuk membuat sebuah HTML

Dalam HTML juga ada Tag-tag tertentu untuk mendukung  membuat sebuah website dibawah ini ada beberapa Tag dasar yang harus anda ketahui dalam HTML.

<h1> : ini adalah Tag Heading, yang berlevel 1, selain <h1> ada juga <h2>, <h3>, <h4>, <h5>, <h6>

<b>  : (Bold) Fungsinya untuk membuat Huruf menjadi Tebal

<i>  : (Italic) Fungsinya untuk membuat Huruf menjadi Miring

<u>  : (Underline) Fungsinya untuk membuat dibawah huruf berisi garis

<p>  : Untuk membuat sebuah Paragraf

<br> : untuk Membuat sebuah baris baru atau enter

<hr> : untuk membuat sebuah garis Horizontal

<center> : untuk membuat tulisan atau gambar berada di tengah-tengah

<img src="gambar-anda.jpg atau Url gambar anda"> : fungsinya untuk memasukan sebuah gambar

<body bgcolor="black"> : Fungsinya untuk memberi warna untuk background atau latar belakang dan "black" bisa diganti sesuai keinginan anda, misalnya "red", "yellow"

<font color="red"> : Untuk mengatur warna Text dan ditutup dengan </font>

<font size="12"> : untuk mengatur Ukuran Sebuah Text dan ditutup dengan </font>

<font face="arial"> : Untuk mengatur jenis Font atau Text yang akan digunakan

<marquee> : untuk membuat sebuah text ataupun gambar bergerak

Sekian Pengertian HTML Fungsi HTML dan Contoh HTML dari saya. Terima kasih karna telah berkunjung ke Blog Saya,

Read More

Definisi WML (Wireless Markup Language)

Wireless Markup Language atau disingkat dengan WML merupakan standar bahasa yang digunakan oleh protokol WAP[1]. WML hampir mirip dengan HTML, namun demikian WML merupakan bahasa yang diturunkan dari Extensible Markup language (XML). WML bukan suatu bahasa pemrograman, akan tetapi bahasa pengkodean yang ditulis berdasarkan suatu aturan tertentu sehingga dengan menggunakan bahasa inilah suatumicro browser akan mengubah isi file suatu homepage menjadi halaman WAP. Suatu alasan mengapa HTML tidak digunakan sebagai standar bahasa untuk protokol WAP diantaranya adalah feature yang dimiliki oleh HTML sangat kompleks, sehingga menjadi tidak relevan untuk digunakan pada mobile device

1    Membuat File WML

Penggunaan  WML antara lain  untuk melakukan pengaturan terhadap tampilan aplikasi.  Suatu dokumen WML dapat dibuat dengan menggunakan program teks editor atau program pengolah kata atau dengan kata lain semua program pengolah kata yang mampu menghasilkan file teks biasa dapat digunakanuntuk merancang dokumen WML. Dokumen WML hams disimpan dengan menggunakan ekstensi WML.  Beberapa aturan yang harus diperhatikan saat membuat dokumen WML adalah :

•     Case sensitive, dimana tag - tag WML harus dituliskan dalam huruf kecil.

•     Tidak mendukung overlapping. Sebagai contoh pada dokumen HTML tagberikut ini :

<b><i>SI     SISTEM     INFORMASI     SEKOLAH    TINGGI   MANAJEMEN INFORMATIKA DAN KOMPUTER  "AMIKOM"  YOGYAKARTA </i></b>

bisa saja digunakan. Namun pada penulisan dokumen WML, penulisan tag seperti itu tidak dibenarkan.

•     Setiap tag yang digunakan harus menggunakan tag penutup seperti '/’.Sebagai contoh tag <br> pada HTML, akan tetapi pada WML menjadi <br/>.

•     Setiap dokumen WML harus diawali dengan prolog yang menyatakan versi
WML yang digunakan dan DTD yang digunakan.

2    Cara Kcrja Client Side Scripting

Clint side scripting dikerjakan langsung dalam browser. Client side scripting dikerjakan secara urut dari bagian paling atas script kebagian paling bawah tanpa ada lompatan, perulangan dan sebagainya.

Gambar  Cara Kerja Client Side Scripting

3    Struktur File WML

Suatu dokumen WML memiliki beberapa bagian yaitu header, template (optional), dan beberapa body yang disebut dengan decks. Maksudnya, sebuah dokumen WML dipandang sebagai sebuah tumpukan (decks) yang terdiri dari banyak kartu (cards). Cara pandang ini berbeda dengan dokumen HTML yang memandang sebuah dokumen HTML sebagai suatu halaman. Hal ini disebabkan oleh keterbatasan WAP deviceuntuk menampilkan dokumen WML yang tidak seperti web browser umumnya pada PC.

                        Gambar  Perbandingan Struktur HalamanHTML dan WML

Berikut adalah contoh dari sebuah dokumen WML sederhana dengan nama file testing.wml.

1       | <?xml  version="1.0"?>

2       | <!DOCTYPE   wml   PUBLIC   "-//WAPFORUM//DTD WML   1.1//EN"

3       | "http://www.wapforum.org/DTD/wml_1.1.xml">

4       |

5       |  <wml>

6     | <card id="cardl" title="Selamat Datang">

7     | <p align="center">

8     |      S1 TEKNIK INFORMASTIKA <br/>

9     |       SEKOLAH TINGGI MANAJEMEN INFORMATIKA DAN

KOMPUTER "AMIKOM" YOGYAKARTA

10  |  </p>

11  |  </card>

12  |  </wml>

Pada contoh diatas, baris 1 - 3 merupakan deklarasi XML dari dokumen WML yang kita kenal dengan prolog atau header. Sedangkan decks atau body dari dokumen WML diatas dimulai dari baris 5-12 yang diawali dengan tag <wml> dan diakhiri dengan tag </wml>. Didalam deck terdapat card yang berada pada baris 6-11 yang diawali dengan tag <card> dan diakhiri dengan tag </card>. Dalam suatu dokumen WML atau dalam suatu decks, kita dapat membuat lebih dari 1 cards.

Sumber : http://babdua.blogspot.co.id/

Read More

Pengertian dan Kegunaan XML (Extensible Markup Language)

XML adalah bahasa markup – menggunakan tag label, mengkategorikan dan mengatur informasi dalam spesifikasi cara. Markup menjelaskan dokumen atau data struktur dan organisasi. Konten, seperti teks, Gambar, dan data, adalah bagian dari kode yang berisi markup Tag. Hal ini juga yang paling menarik untuk kebanyakan manusia sehari-hari yang membaca atau berinteraksi dengan data dan kebutuhan dokumen. fleksibilitas XML telah berkembang yang menyebabkan digunakan untuk bertukar data dalam berbagai bentuk.

Pengertian XML

definisi xml adalah bahasa markup untuk keperluan umum yang disarankan oleh W3C untuk membuat dokumen markup keperluan pertukaran data antar sistem yang beraneka ragam.

XML didesain untuk mempu menyimpan data secara ringkas dan mudah diatur. Kata kunci utama XML adalah data (jamak dari datum) yang jika diolah bisa memberikan informasi.

XML menyediakan suatu cara terstandarisasi namun bisa dimodifikasi untuk menggambarkan isi dari dokumen. Dengan sendirinya, XML dapat digunakan untuk menggambarkan sembarang view database, tetapi dengan suatu cara yang standar.

Tipe XML

• XML, merupakan standar format dari struktur berkas (file).
• XSL, merupakan standar untuk memodifikasi data yang diimpor atau diekspor.
• XSD, merupakan standar yang mendefinisikan struktur database dalam XML.

Keunggulan XML

• Pintar (Intelligence). XML dapat menangani berbagai tingkat (level) kompleksitas.
• Dapat beradaptasi. Dapat mengadaptasi untuk membuat bahasa sendiri. Seperti Microsoft membuat bahasa MSXML atau Macromedia mengembangkan MXML.
• Mudah pemeliharaannya.
• Sederhana. XML lebih sederhana.
• Mudah dipindah-pindahkan (Portability). XML mempunyai kemudahan perpindahan (portabilitas) yang lebih bagus.

Penggunaan XML

XML untuk saat ini bukan merupakan pengganti HTML. Masing-masing dikembangkan untuk tujuan yang berbeda. Kalau HTML digunakan untuk menampilkan informasi dan berfokus pada bagaimana informasi terlihat, XMLmendeskripsikan susunan informasi dan berfokus pada informasi itu sendiri. XMLterutama dibutuhkan untuk menyusun dan menyajikan informasi dengan format yang tidak mengandung format standard layaknya heading, paragraph, table dan lain sebagainya.

Contoh XML

1 2 3 4 5 6

<Film> <Judul>Transformers 4</Judul> <genre>Action<genre> <durasi>90:00:00</durasi> <size>1 Gb</size> </Film>

Penulisan tag pada XML adalah bebas, tidak seperti HTML yang sudah ada.

Belajar XML

Penulisan secara formal XML adalah sbb.

1 2 3 4 5 6 7 8 9

<?xml version="1.0" encoding="iso-8859-1"?> <?xml-stylesheet type="text/xsl" href="belajar.xsl"> <Film> <Judul>Transformers 4</Judul> <genre>Action<genre> <durasi>90:00:00</durasi> <size>1 Gb</size> </Film>

Mari kita bahas XML di atas.

1	<?xml version="1.0" encoding="iso-8859-1"?>

Baris pertama adalah heading standard pada XML. Versi yang digunakan adalah versi 1.0. encoding iso-8859-1 adalah nama resmi dari character encoding yang biasa disebut ANSI. iso-8859-1 banyak digunakan di Eropa dan Amerika. Bila anda menggunakan text editor yang mendukung penggunaan character encoding yang lainnya, anda bisa menggunakannya juga.

1	<?xml-stylesheet type="text/xsl" href="belajar.xsl">

syntax diatas adalah heading standard untuk XLST. Atribut xmlns:xsl maksudnya adalah mendeklarasikan namespace XML bahwa awalan xsl akan digunakan untuk elemen yang didefinisikan pada W3C XSLT Specification.

Bagian Dokumen XML

Sebuah dokumen XML terdiri dari bagian bagian yang disebut dengan node. Node-node itu adalah:

• Root node yaitu node yang melingkupi keseluruhan dokumen. Dalam satu dokumen XML hanya ada satu root node. Node-node yang lainnya berada di dalam root node.
• Element node yaitu bagian dari dokumen XML yang ditandai dengan tag pembuka dan tag penutup, atau bisa juga sebuah tag tunggal elemen kosong seperti <anggota nama=”budi”/> . Root node biasa juga disebut root element.
• Attribute note termasuk nama dan nilai atribut ditulis pada tag awal sebuah elemen atau pada tag tunggal.
• Text node adalah text yang merupakan isi dari sebuah elemen, ditulis diantara tag pembuka dan tag penutup.
• Comment node adalah baris yang tidak dieksekusi oleh parser.
• Processing Instruction node adalah perintah pengolahan dalam dokumenXML. Node ini ditandai awali dengan karakter <? Dan diakhiri dengan ?>. Tapi perlu diingat bahwa header standard XML <?xml version=”1.0” encoding=”iso-8859-1”?> bukanlah processing instruction node. Header standard bukanlah bagian dari hirarki pohon dokumen XML.
• NameSpace Node node ini mewakili deklarasi namespace.

Pengertian dan Fungsi XML – Porsot

Membuat XML

Heading Standar XML
Biasakanlah setiap membuat dokumen XML diawali dengan heading standardXML. Formatnya adalah sebagai berikut:

1	<?xml version="1.0" encoding="iso-8859-1"?>

Dokumen XML harus memiliki Root tag.
Sebuah dokumen XML yang baik harus memiliki root tag. Yaitu tag yang melingkupi keseluruhan dari dokumen. Tag-tag yang lain, disebut child tag, berada didalam root membentuk hirarki.

1 2 3 4 5

<root>          <child>                   <subchild></subchild>          </child> </root>

XML hirarki – porsot

Tag XML harus berpasangan, Tag tunggal hanya diperbolehkan untuk elemen kosong.

1	<Film Judul="Transformers 4" />

 Tag HTML Case Sensitive
Artinya penulisan tag A dengan a berbeda.

Struktur penulisan tag XML adalah LIFO
Artinya struktur penulisannya Last In First Out.

XML mempertahankan spasi
Spasi yang terdapat antara 2 kata elemen, tidak akan dihilangkan secara otomatis oleh XML.

Isi atribut tag diletakkan diantara kutip 2 “ 
Jika tag memiliki atribut, dan atribut tsb memiliki value/nilai maka wajib diletakkan antara ” ” (kutip 2). Contoh pada value atribut judul.

1 2 3

<Film Judul="Transformers 4"> <durasi>90 menit</durasi> </Film>

Penamaan tag
Nama tag bisa terdiri dari huruf, angka dan underscore(“_”). Karakter awal nama tag harus berupa huruf atau underscore (“_”), tidak diawali dengan kata xml atauXML, (misal:<xmlstring>), dan tidak mengandung spasi. Aturan penamaan atribut sama dengan aturan penamaan tag.

Menyisipkan Komentar
Pada bahasa pemrograman atau scripting kita mengenal adanya komentar (comment). Komentar adalah kalimat/baris yang tidak dieksekusi oleh compiler, browser atau parser. Untuk menyisipkan komentar pada dokumen XML caranya adalah sebagai berikut:

1 2 3 4

<Film Judul="Transformers 4"> <!-Ini adalah penulisan komentar--> <durasi>90 menit</durasi> </Film>

Karakter Ilegal pada XML
Sama seperti pada HTML, anda tidak bisa menggunakan karakter seperti kurung siku (< atau >), petik tunggal (‘), dan petik ganda (“) . Contoh dibawah ini akan menghasilkan error kalau di eksekusi oleh browser.

1 2 3 4

<Film Judul="Transformers 4"> <!-Ini adalah penulisan komentar--> <durasi> <90 menit</durasi> </Film>

Maka < harus diganti dengan entity reference &alt.

1 2 3 4

<Film Judul="Transformers 4"> <!-Ini adalah penulisan komentar--> <durasi> &alt90 menit</durasi> </Film>

Sumber : http://porsot.org/

Read More