wahyu nobe_44: Apa itu HTML, Apa fungsinya, Dan Bagaimana Membuatnya?

HTML singkatan dari Hyper Text Markup Language adalah file teks atau file ASCII yang berisi instruksi/script kepada web browser untuk menampilkan suatu tampilan grafis dari sebuah halaman web. Didalam file HTML terdapat beberapa "tag" atau kode-kode yang dimengerti oleh web browser dan dapat menampilkannya di layar monitor.
File HTML dapat dibuat dengan aplikasi text editor apapun di sistem operasi apapun, antara lain : Notepad di Windows, emasc atau vi di Unix atau SimpleText di Macintosh. File HTML ini juga bisa dibuat di aplikasi word processor apapun asalkan saat menyimpan file tersebut disimpan dengan format text-only.
Salah satu kelebihan file HTML adalah cross platform, artinya file HTML dapat ditampilkan di beberapa Operating System (OS) yang berbeda dan memiliki tampilan yang sama walaupun saat pembuatannya menggunakan satu OS tertentu saja.

-->>

Image courtesy @elasticmind.ca

Post kali ini akan sangat teknikal sekali. Dalam beberapa post kedepan, kami berencana mengupas tuntas blogging dari sisi teknologi atau pemrograman. harapan kami, blogger – blogger yang belum memiliki dasar pemahaman pemrograman web dan penasaran bagaimana aplikasi blogging berjalan akan tercerahkan melalui seri post ini. Well, enjoy then

Apa itu HTML?

HTML = HyperText Markup Language. Bahasa Markup ( berdasarkan id.wikipedia, bahasa markup berarti kombinasi teks dan informasi tambahan mengenai teks tersebut. markup = markah/penanda, atau dalam HTML <tag> yang memberikan fungsi tertentu ) yang digunakan untuk membuat sebuah halaman web. HTML adalah standar yang digunakan untuk sebuah halaman web. HTMl di definisikan dan dikendalikan penggunaannya oleh World Wide Web Consortium (W3C).

Itu tadi definisi dari HTML. bisa dijelaskan lebih detil lagi?

Hmm… Sederhananya begini. Saya yakin anda semua mengetahui file .doc nya microsoft word. nah, ini ada jenis file, yang namanya HTML. kalau file microsoft word itu .doc, file HTML ini ekstensinya .htm atau .html. HTML ini merupakan file yang di taruh pada satu komputer ( server ) dan dapat di akses oleh komputer lain melalui aplikasi web browser. isi file HTML terdiri dari dua jenis :konten dan atribut. konten merupakan informasi dari file HTML itu sendiri, yang ditampilkan pada halaman browser. sedangkan atribut merupakan tag yang memiliki fungsi tertentu, dan tidak ditampilkan di halaman browser.

Contoh :

<html>

<head>

</head>

<body>

<p>ini konten. <a href=”">ini link</a></p>

</body>

</html>

tulisan ini konten dan ini link merupakan konten. dan ini ditampilkan pada browser. yang berada di dalam tanda < dan > merupakan atribut. Atribut tidak di tampilkan di halaman browser.

masih agak bingung? ok. buka aplikasi notepad anda, copy kode diatas dan paste pada notepad. Save dengan nama contoh1.html. File HTML dapat dibuat menggunakan berbagai aplikasi editor kode. Namun sederhananya, Anda dapat membuat file HTML menggunakan aplikasi notepad yang pastinya terinstall di semua komputer ber OS windows. cukup tuliskan kodenya, lalu save dengan nama file + .htm atau .html . Contoh : namafile.htm. sekarang, buka file yang anda save tadi. dobel klik, dan file tersebut akan terbuka pada browser default anda. Anda akan paham apa maksud kami setelah itu.

File HTML PASTI dimulai dengan dengan tag <html> ( kecuali deklarasi file. hanya deklarasi file yang ditulis sebelum tag <html>. kita bicarakan ini nanti )dan ditutup dengan tag </html>. Setiap file html di dalam tag <html> terbagi kedalam dua bagian : head dan body.

bagian head dimulai dengan tag <head> dan ditutup dengan tag </head>.Bagian head ini berisikan atribut – atribut yang berisi informasi mengenai halaman web, dan link menuju file file CSS atau JavaScript yang memberi efek untuk halaman web tersebut
bagian body dimulai dari tag <body> dan ditutup dengan tag </body>bagian body berisi konten yang ditampilkan pada browser, dan atribut – atribut pendukungnya, http://bloggingly.com/apa-itu-html/FUNGSI HTML

1. Konsep dan Fungsi HTML

Seperti telah dijelaskan pada bab sebelumnya bahwa HTML (Hypertext Markup Language) adalah bahasa dari World Wide Web (www) yang dipergunakan untuk menyusun dan membentuk dokumen agar dapat ditampilkan pada program browser. Tiap kali kita mengakses dokumen web, maka sesungguhnya kita mengakses dokumen seseorang yang ditulis dengan menggunakan format HTML. Jadi HTML itu sendiri merupakan protokol yang digunakan untuk mentransfer data atau document dari web server ke browser. HTML inilah yang menjadi dasar bila akan menjelajah internet dan melihat halaman web yang menarik.

HTML menentukan dua fungsi :

Membentuk tata letak dokumen, dalam hal ini menentukan jenis huruf, gambar, dan komponen dokumen lainnya.
Menentukan hubungan ke dokumen lain, HTML merupakan suatu bahasa komputer yang termasuk dalam katagori SGML (Standard Generalized Markup Language) dimana bentuknya merupakan file standar ASCII yang berisi kode-kode untuk mengatur dokumen.

Untuk melihat hasil pengaturan kode-kode standar HTML, maka dapat kita gunakan program web browser (program yang dipasang di komputer pemakai, dan fungsinya untuk mencari dan melihat informasi yang sudah disediakan oleh Web Server), seperti Netscape, Mosaic, atau Super Mosaic, melalui perintah File-Open File (atau Open Local). Pada tingkat yang lebih profesional, kita dapat menggunakan program khusus untuk membuat HTML, seperti HotMetal, Hot Dog, HTML Easy, InContext Spider, atau menggunakan program tambahan yang jalan di Microsoft Word atau WordPerfect.

Saat ini terdapat banyak sekali HTML authoring (software atau tool yang digunakan untuk membuat atau mendesain halaman web), yang biasa digunakan seperti : MS-FrontPage, Netscape Composer, Macromedia Dreamweaver, Adobe GoLive, Adobe Pagemill, HotDog, HotMetal, HTML Easy, InContext Spider, dan lain sebagainya.

Karena bentuk HTML mengikuti standar ASCII, maka file HTML dapat dibuat dengan menggunakan program editor biasa seperti Editor dari DOS, atau Notepad dari Microsoft Windows, MS Word, dan sebagainya. Namun yang paling mudah adalah menggunakan Notepad yang ada setiap kali kita menggunakan sistem operasi terutama windows.

Software lain yang dibutuhkan adalah browser yang digunakan untuk menampilkan web page yang akan hasilkan. Dua nama yang paling populer adalah Internet Explorer danNetscape Navigator, keduanya merupakan browser yang umum digunakan dan mudah didapatkan, beberapa yang lain yang juga terkenal seperti Opera, GodZilla, dan sebagainya. Kita bisa memilih salah satu dari browser tersebut dimana masing-masing memiliki kelebihan dan kekurangan, namun secara umum sangat mudah untuk digunakan terutama bagi para pemula.

Jadi, dengan menggunakan kombinasi program pembuat HTML dan program web browser, maka kita sudah dapat menayangkan informasi di Internet. Untuk memberikan nama domain dan menempatkan situs yang kita bangun, kita juga memerlukan providerbaik yang gratis maupun yang membayar atau berlangganan yang biasa disebut dengan ISP (Internet Service Provider).

Beberapa kalangan menyatakan keberatan jika dikatakan HTML merupakan sebuah bahasa pemrograman karena struktur yang dimilikinya dianggap terlalu sederhana, kode-kode dibaca oleh browser baris per baris, dari atas ke bawah. HTML juga tidak memiliki struktur pemrograman yang umum ada pada sebuah bahasa pemrograman standar, misalnya tidak adanya struktur ‘looping’. Pada HTML dipergunakan hypertext link atau hubungan antara teks dan dokumen lain. Dengan demikian pembaca dokumen bisa melompat dari satu dokumen ke dokumen yang lain dengan mudah. Namun banyak kalangan umum yang menganggap bahwa HTML merupakan bahasa dokumen program meskipun tidak terstruktur. Yang jelas bahwa HTML merupakan bahasa yang menspesifikasi isi (content) suatu halaman web.

HyperText menunjuk ke fakta bahwa halaman web lebih tepat berupa text yang dapat memuat multimedia, dan melakukan link dengan atau tanpa lompatan. Markup menunjuk ke fakta bahwa bekerja pada kebanyakan text dengan simbol-simbol spasial (tags) yang mengidentifikasi struktur dan type dokumen.

Perkembangan standar HTML dari waktu ke waktu adalah sebagai berikut :

HTML 1 (Berners-Lee, 1989): sangat dasar, integrasi terbatas dengan multimedia, pada 1993, Mosaic menambahkan beberapa fitur baru (seperti terintegrasi image)
HTML 2.0 (IETF, 1994): lembaga resmi HTML adalah World Wide Web Consortium(W3C), yang bekerja sama dengan Internet Engineering Task Force (IETF) mencoba untuk menyetandari kode-kode HTML dan menambah fitur-fitur lain, tetapi kenyataanya hingga 1994-1996 Netscape dan Microsoft dengan IE (Internet Explorer)nya, seringkali juga telah mengembangkan berbagai tag “perluasan” bagi HTML mereka, di luar proses standard, serta menerapkannya dalam browser mereka. Pada kasus tertentu seperti tag <CENTER> dari Netscape, tag perluasan ini telah menjadi standard de facto yang diterapkan oleh banyak pencipta browser lainnya.
HTML 3.2 (W3C, 1996): Berhasil mennyatukan kedalam standar tunggal tetapi tidak mengarah ke teknologi yang lebih baru seperti Java Applet dan video streaming.
HTML 4.0 (W3C, 1997): Saat itulah usaha standarisasi menunjuk ke fitur diluar peta HTML. Tetapi tidak menunjuk ke suatu vendor.
XHTML 1.0 (W3C, 2000): HTML 4.01 dimodifikasi untuk menyesuaikan diri ke standar XML http://ajimedia.com/33/belajar-dasar-dasar-web-dengan-html-bab2-dasar-html
Cara membuat HTML

Ini merupakan artikel pertama yang saya tulis di website saya ini.Karena diwebsite ini saya akan membagi-bagikan ilmu apa aja tentang pembuatan website, maka kita pelajari biangnya dulu, dasar dari semua dasar pembuatan website yaitu HTML.

HTML (Hypertext Markup Language) merupakan bahasa yang digunakan untuk membuat website. Menggunakan tag untuk mendeklarasikan sesuatu dan tag tersebut tidak ditampilkan tetapi tag tersebut memberi tahu browser bagaimana cara menampilkan dokumen website. Serta dapat saling berhubungan dengan dokumen HTML lain yang dikenal dengan istilah link.

Suatu halaman website sebenarnya hanya sebuah halaman teks, jika anda menggunakan browser internet explorer dan anda mengklik view – source, maka anda dapat melihat teks dari web tersebut. Tetapi teks tersebut diterjemahkan oleh browser menjadi halaman website yang enak dilihat. Teks merupakan bahasa universal bagi komputer, yang berarti setiap dokumen teks (termasuk website) yang anda buat melalui Windows dapat dibaca di sistem perasi lain seperti Mac OS, Linux, Unix dan lainnya.

HTML dan hal-hal yang berkaitan dengan website distandarisasi oleh sebuah badan yang disebut World Wide Web Consortium (W3C). Standard terbaru, konsep dan proposal mengenai starndarisasi web dapat dilihat di http://www.w3.org. Standar untuk HTML terbaru adalah HTML 4.0 yang telah didukung oleh bermacam-macam browser seperti Microsoft Internet Explorer, Netscape Navigator, Opera, Mozilla, Safari dan masih banyak lagi. Browser menterjemahkan tagyang terdapat pada dokumen HTML. Kita akan segera membicarakan mengenai tag.

Suatu halaman web merupakan file teks yang berarti anda dapat membuatnya hanya dengan menggunakan notepad saja. Bahkan jika anda masih pertama kali mempelajari HTML, notepad merupakan alat yang tepat. Saya menyarankan untuk menggunakan editplus karena menurut saya enak aja dipakainya, tetapi anda bebas menggunakan teks editor lain.

Jika anda baru pertama kali mengenal HTML, hindari Program WYSIWIG (What You See Is What You Get) seperti Dreamweaver atau Frontpage/Web Expression. Program-program ini memang memudahkan anda membuat website tetapi anda akan kurang memahami HTML, gunakan Frontpage atau Dreamweaver apabila anda sudah paham mengenai HTML.

Sekarang buka saja notepad anda dan kita mulai.

Kode HTML pertama

Buka notepad dan tuliskan kode dibawah ini

Hello World

Simpan file tersebut dengan nama hello.html didalam suatu folder (misal c:\webku) dan buka file HTML tersebut dengan browser kesukaan anda. Hasilnya seperti ini:

Hello World!!

Oke jadi apa yang dimaksud oleh “<” dan “>”, ketika anda menuliskan sesuatu diantara tanda “<” dan “>” maka anda membuat sesuatu yang disebut dengan tag, kalau anda lihat dikamus bahasa inggris tag artinya tanda/label. Sebagai contoh tag maksudnya untuk memulai huruf tebal (bold) dan tag merupakan tag penutup untuk menghentikan huruf tebal.

Sebuah halaman HTML yang baik harus memiliki tag dan , tapi kita akan membicarakan masalah ini belakangan. Yang penting sekarang pahami dulu mengenai tag HTML. Sekarang akan kita pelajari lebih jauh mengenai tag HTML.

Tag HTML dibagi menjadi dua, yaitu tag HTML yang memiliki penutup (containers) atau yang berdiri sendiri (standalone).

Containers

Kebanyakan tag HTML adalah containers (kita sebut containers saja sebab sulit mencari terjemahannya dalam bahasa Indonesia) yang berarti tag tersebut memiliki pembuka (batas awal) dan penutup (batas akhir). Teks yang berada diantara tag pembuka dan penutup akan berubah sesuai dengan fungsi dari tag tersebut. Perhatikan contoh berikut:

Hello World!!

Hasil:

Hello World!!

Tag berguna untuk memiringkan teks (italic) tag memiliki penutup yaitu . Tag penutup selalu ditandai dengan “/”. Contoh diatas terdapat teks World!! diantara tag pembuka dan tag penutup sehingga menghasilkan tulisan World!! yang miring. Tag pembuka memiliki atribut tetapi tag penutup tidak memiliki atribut.

Standalone Tag

Beberapa tag tidak memerlukan penutup sebab tag tersebut hanya berfungsi untuk menempatkan sebuah elemen pada halaman web. Sebagai contoh tag yang merupakan tag untuk memasang sebuah gambar didalam halaman web. Tag lain yang tidak memiliki penutup adalah

yang berguna untuk memberi jarak antar teks dan tag

untuk memberi garis. Tag HTML cukup banyak jumlahnya, anda dapat mencarinya dibuku-buku atau mencarinya melalui google untuk mengetahui apa saja jenis tag HTML. Tapi saya akan beritahu yangpenting-penting saja.

Atribut

Atribut dipasang didalam tag pembuka untuk menambahkan fungsi dari tag tersebut. Setiap tag memiliki beberapa atribut dan dipasang sesudah nama tag dibatasi oleh spasi. Urutan atribut tidak perlu diperhatikan. Kebanyakan atribut memiliki nilai yang dipanggil dengan menggunakan tanda “=” sesudah nama atribut. Bingung? coba kode berikut ini dijamin anda mengerti:

Hello World!!

Hasilnya:

Hello World!!

Tulisan World!! terletak ditengah tag nah tag memiliki atribut face, size dan color yang dapat anda ubah nilainya. Cobalah untuk mengubah ukuran (size) menjadi 3 atau jenis fontnya ubahlah dari verdana menjadi arial. Kira-kira seperti itu kegunaan atribut. Bagaimana? lanjut?

HTML Entity

Jika anda ingin menuliskan karakter khusus dalam web, maka anda perlu menulisnya menggunakan kode khusus. Kode khusus ini dikenal dengan istilah HTML entity. Sebagai contoh anda ingin menulis seperti ini:

Saya belajar web

Anda lihat ada jarak spasi antara belajar dan web. Anda tidak bisa membuat spasi dengan menekan tombol space bar berkali-kali. Meskipun pada kode HTML hasilnya terdapat jarak namun browser hanya membacanya sekali, jadi sebanyak apapun space bar yang tekan browser hanya membacanya satu spasi. Lalu bagaimana caranya? Spasi dalam HTML memiliki kode HTML entity yaitu jadi untuk membuat seperti contoh diatas anda perlu menulisnya seperti ini:

Saya belajar web

HTML entity selalu diawali dengan “&” dan diakhiri dengan “;” ada banyak sekali HTML entity anda dapat mencarinya, dan lagi-lagi saya akan menyuruh anda mencarinya sendiri melalui google.

Struktur Dokumen HTML

Tadi sudah saya katakan bahwa HTML yang baik memiliki tag dan .mendefiniskan bagian header dari dokumen HTML yang berisi informasi mengenai dokumen HTML tersebut. Tag tidak memiliki atribut tetapi memiliki container khusus didalam header seperti , , dan

Hello World!!

Hasilnya didalam Microsoft Internet Explorer :

Anda lihat teks yang berada diantara tag

http://3mcr.wordpress.com/cara-membuat-html/

jujur kawan.... saya masih bingung..

# s i n a u m a n e h . . . . . .. :)