STRATEGY & CREATIVITY

Phasellus iaculis dolor nec urna nullam. Vivamus mattis blandit porttitor nullam.

PORTFOLIO

We pride ourselves on bringing a fresh perspective and effective marketing to each project.

artikel HTML 5

HTML5

HTML (HyperText Mark up Language) merupakan suatu metoda untuk mengimplementasikan

konsep hypertext dalam suatu naskah atau dokumen. HTML sendiri bukan tergolong pada suatu

bahasa pemrograman karena sifatnya yang hanya memberikan tanda (marking up) pada suatu naskah teks dan bukan sebagai program.

Berdasarkan kata-kata penyusunnya HTML dapat diartikan lebih dalam lagi menjadi :

Hypertext

Link hypertext adalah kata atau frase yang dapat menunjukkan hubungan suatu naskah dokumen

dengan naskah-naskah lainnya. Jika kita klik pada kata atau frase untuk mengikuti link ini maka web browser akan memindahkan tampilan pada bagian lain dari naskah atau dokumen yang kita tuju.

Markup

Pada pengertiannya di sini markup menunjukkan bahwa pada file HTML berisi suatu intruksi

tertentu yang dapat memberikan suatu format pada dokumen yang akan ditampilkan pada World

Wide Web.

Language

Meski HTML sendiri bukan merupakan bahasa pemrograman, HTML merupakan kumpulan dari

beberapa instruksi yang dapat digunakan untuk mengubah-ubah format suatu naskah atau dokumen.

Pada awalnya HTML dikembangkan sebagai subset SGML (Standard Generalized Mark-up

Language). Karena HTML didedikasikan untuk ditransmisikan melalui media Internet, maka HTML relatif lebih sederhana daripada SGML yang lebih ditekankan pada format dokumen yang

berorientasi pada aplikasi.

Penggunaan HTML memungkinkan kita untuk memodifikasi tampilan atau format dokumen yang akan kita transmisikan melalui media Internet. Beberapa hal yang dapat dilakukan dalam menentukan format dokumen ini adalah :

• Kita dapat menampilkan suatu kelompok kata dalam beberapa ukuran yang dapat digunakan untuk judul, heading dan sebagainya.

• Kita dapat menampilkan teks dalam bentuk cetakan tebal

• Kita dapat menampilkan sekelompok kata dalam bentuk miring

• Kita dapat menampilkan naskah dalam bentuk huruf yang mirip dengan hasil ketikan mesin ketik

• Kita dapat mengubah-ubah ukuran font untuk suatu karakter tertentu.

FITUR – FITUR TAMBAHAN HTML5

HTML5 Canvas

Untuk memberikan suatu 'interaksi' pada website yang kita miliki, misalnya Flash atau Java. Hal ini akan diganti oleh elemen <canvas> pada HTML5 sebagai canvas WEB – kertas yang bias dicoreti sesuai imajinasi – atau dalam hal lain, Canvas memungkinkan untuk bereksperimen lebih pada HTML5.

Audio dan Video

Di HTML5 akan ada tag khusus untuk audio dan video file. Tag tersebut adalah <audio> dan <video> yang berfungsi untuk menyisipkan file audio dan video. Berbeda dengan versi HTML pendahulunya yang harus menyisipkan flash untuk memutar audio/video, HTML5 akan dengan mudah menyisipkan file multimedia tersebut ke dalam webnya.

Local Storage

Berfungsi sebagai pengganti cache sebagai media penyimpanan history halaman web. Local Storage memungkinkan web untuk menyimpan data cache lebih besar di storage local-nya daripada cache pada browser biasa.

Web Workers

Seringkali kita menemukan jika halaman web yang memiliki banyak Javascript membuat browser melambat dan komputer nge-hang. Tetapi dengan adanya Web Workers memungkinkan halaman web untuk memproses Javascript yang mereka miliki dengan respon yang lebih cepat dan multitasking.

Semantics

Ini adalah fitur yang paling menawan untuk web designer. Para web designer yang suka sekali memainkan elemen div, nav, dan lainnya, akan di-stop oleh fitur Semantics dalam HTML5. Semantics akan menjadi masa depan bagi para tetua tag layout dan format. Pastinya web akan menjadi lebih dinamis dan menarik akibat fitur ini.

YANG PERLU DIKETAHUI TENTANG HTML5

1. DOCTYPE

DOCTYPE ditulis sebelum tag <html>. Fungsi dari DOCTYPE adalah memberitahukan kebrowser

bahwa tipe dokumen yang digunakan adalah HTML.

Dalam dokumen HTML versi sebelumnya DOCTYPE dituliskan dengan :

<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “http://www.w3.org/TR/html4/loose.dtd”>

Sedangkan dalam HTML5 DOCTYPE Cuma ditulis :

<!DOCTYPE HTML>

2. Tidak adanya Type pada script dan link

source code yg baru :

source code yg lama :

3. Attribute Required

Form mempunyai fitur baru yaitu required attribute, yang akan mengecek isi dari sebuah input text apakah kosong atau tidak saat di-submit. Jika kosong maka form tidak akan di-submit.

4. Mendukung audio

HTML 5 mengenalkan <audio> element sudah mendukung penuh terhadap penggunaan audio pada

halaman web.

Penggunaannya seperti kode dibawah

Unduh File ini.

</audio>

9. Mendukung video

Dan hebatnya lagi HTML juga mengenalkan <video> element. Tapi karena codec format video tidak

semua browser mendukung, jadi video yang bisa diputar tergantung dari browser.

Penggunaannya seperti kode dibawah :

<p> Browser tidak mendukung, <a hreh=”contohvideo.mp4> Silahkan unduh video.</a> </p>

</video>

Tag-tag baru yang letaknya didalam <body>

<header>

Didalam <header> ini bisa kita isi macam-macam, misal logo, navigasi, heading dan lain-lain. Bahkan diisi <div> pun tidak masalah.

<hgroup>

Jika kita memiliki satu atau lebih dari satu heading berurutan <h1> - <h6> maka kita bisa mengelompokkannya dengan <hgroup>.

<nav>

<nav> digunakan untuk ngelink kehalaman-halaman utama dari website atau bagian dari halaman itu sendiri. Kalau untuk paging, Social Networking atau list-list yang lain yang menggunakan <ul> nggak perlu dikasih <nav>.

Sesuai namanya <article> digunakan untuk membungkus teks artikel atau teks utama dalam halaman web. Apabila kita memiliki list atau daftar <article>, misal blog, maka kita perlu membungkusnya dengan <section> jika ada elemen lain yang bukan <article> dan menerangkan tentang <article>.

<time>

digunakan untuk menunjukan waktu, biasanya digunakan untuk menunjukkan waktu publish artikel, komentar, forum dan lain sebagainya. <time>memiliki atribut datetime yang berisi waktu bisa dalam format yyyy-mm-dd atau jam seperti 19:00.

<figure> dan <figcaption>

<figure> digunakan sebagai pembungkus untuk tag <img>. Tetapi tidak selalu semua tag<img> kita bungkus dengan <figure>, hanya gambar-gambar yang utama saja atau gambar-gambar yang ingin kita beri label. Nah kita memberi labelnya dengan <figcaption>.

<aside>

<aside> digunakan sebagai sidebar pada website.

<footer>

<footer> diletakkan dibagian bawah website.

HTML format karakter

perhatikan baik-baik dear :)

Memformat Karakter
Melakukan format terhadap karakter yang ditampilkan akan sangat berguna untuk
membuat sebuah dokumen menjadi menarik dan informatif.

Logical Format
Logical format akan menerapkan layout dokumen secara logis dan terstruktur. Semua tag
ini memerlukan tag penutup. Tag-tag yang termasuk logical format adalah sebagai
berikut :
• <cite>, digunakan untuk menandai suatu kutipan (citation).
• <code>, digunakan untuk menampilkan kode-kode pemrograman, misalnya bahasa
C.
• <em>, digunakan untuk menandai suatu teks yang ditekankan (cetak miring) oleh
penulis.
• <kbd>, digunakan untuk menandai suatu teks yang harus dimasukkan oleh user
melalui keyboard.
• <samp>, digunakan untuk menandai suatu teks yang dimaksudkan sebagai contoh.
• <strong>, digunakan untuk menandai bagian yang penting (cetak tebal) dari suatu
teks.
• <var>, digunakan untuk menampilkan nama variabel.
• <dfn>, digunakan untuk menandai sebuah subdefinisidari daftar definisi.

Physical format adalah format terhadap fisik suatu font. Semua tag ini memerlukan tag
penutup. Tag-tag yang termasuk physical format adalah sebagai berikut :
• <b>, untuk menampilkan huruf tebal.
• <i>, untuk menampilkan huruf miring.
• <u>, untuk menampilkan garis bawah pada teks. <tt>, untuk menampilkan huruf
seperti huruf mesin ketik.
• <strike>, untuk menampilkan garis horizontal pada bagian tengah huruf.
• <big>, untuk menampilkan ukuran huruf yang lebih besar.
• <small>, untuk menampilkan ukuran huruf yang lebih kecil.
• <sub>, untuk menampilkan subscript.
• <sup>, untuk menampilkan superscript.

this is simple example :

1. scrpitnya :

2. Hasilnya :

good luck and get lucky :)

HTML List

materi ini adalah materi HTML list

1. berikut scriptnya :

2. dan hasilnya seperti ini :

good luck :)

HTML dengan Table

kali ini kita akan membuat table dengan HTML :

1.ini scriptnya :

2. dan berikut hasilnya :

Selamat mencoba :)

HTML dengan tampilan Form

kita sekarang masuk ke materi HTML dengan menggunakan tampilan Form, mulai dari Checkbox, Radio Button, Text area, text field, dan submit button

NEXT>>>>>>>>>>>

1. ini scriptnya :

<html>

<head>

<title bgcolor="#FFFFCC">Latihan-9: Membuat Form</title>

</head>

<body>

<p>Alamat : <textarea name=alamat cols=25 rows=4></textarea>

<p>Jenis kelamin:

<input type=radio name=gender value=Pria>Pria

<input type=radio name=gender value=Wanita>Wanita

<p>Tgl. Lahir:

<option value=1>01

<option value=2>02

<option value=3>03

<option value=31>31

</select> -

<option value=1>01

<option value=2>02

<option value=3>03

<option value=12>12

</select> -

<option value=1901>1901

<option value=1902>1902

<option value=1903>1903

<option value=2000>2000

</select>

<p>Pekerjaan :

<option value=Pelajar>Pelajar/Mahasiswa

<option value="Pegawai Negeri">Pegawai negeri

<option value=Karyawan>Karyawan

<option value=Wiraswasta>Wiraswasta

</select>

<p>Hobby :

<input type=checkbox name=hobby value=Membaca>Games

<input type=checkbox name=hobby value=Kesenian>Sport

<input type=checkbox name=hobby value=Olahraga>Music

<input type=checkbox name=hobby value=Belanja>learn

<p>Komentar : <textarea name=komentar cols=25 rows=4></textarea>

</form

</body>

</html>

2. dan berikut hasilnya :

Semoga bermanfaat :)

HTML Tampilan CV

teman, kali ini materi y g ingin saya share kepada teman-teman sekalian adalah membuat tampilan CV (Curriculum Vitae) dengan HTML, kebetulan saya pribadi membuat dengan data diri pribadi saya sendiri
berikut cuplikannya :

1.tulis scriptnya di DW(DreamWeaver) :

<html>
<head>
<title>Curriculum Vitae</title> 
</head>
<body bgcolor="#f6e6b4" width="800px"> 
<div align="center">

<center>
<h1>
Curriculum Vitae</h1>

</center>
<hr />
<h2>
Personal Details</h2>

<table width="800px"> 
<tr>
<td width="25%">Full Name</td>
<td width="1%">:</td>
<td><b>Ayu Rizki</b></td>
<td rowspan="5"><img src="ayuaa.jpg" alt="Foto Rico" title="Foto Ayu" height="200px" width="150px"></td>
</tr>
<tr>
<td>Place, Date of Birth </td>
<td>:</td>
<td>Jakarta, July 14, 1995</td>
</tr>
<tr>
<td>Address</td>
<td>:</td>
<td>Jl.Srikandi, Demangan Kidul</td>
</tr>
<tr>
<td>E-mail</td>
<td>:</td>
<td><a href="mailto:ayurizki348@gmail.com">email Ayu Rizki</a></td>
</tr>
</tbody>
</table>
<h2>
Educational Background</h2>
<table width="800px">
<tbody>

<tr>
<td>2010-2013</td>
<td>:</td>
<td>Senior High School Piri, Yogyakarta</td>
</tr>
<tr>
<td>2007-2010</td>
<td>:</td>
<td>Sidoarjo Junior High School</td>
<tr>
<td>2001-2006</td>
<td>:</td>
<td>Badran Elementary School, Yogyakarta</td>
</tr>
</tr>
</table>
<br /><br /> 
<a href="achievements.html" title="achievements"><h2>
Achievements >> </h2>
</a> 
</div>
</body>
</html>

2. hasilnya seperti ini :

CONTOH HTML INSERT a COMMENT

jika kita ingin mengirim comment kita kepada orang lain melalui e-mail, caranya adalah seperti ini. ini contoh HTML sederhana yg saya buat :

1. ini scriptnya :

2. hasilnya seperti ini :

CONTOH HTML LIST, BUTTON, SUBMIT

kali ini kita memasuki season HTML submit, button, dan list, berikut contoh sederhana dari saya :

1. ini scrpitnya :

<!DOCTYPE html>
<html><style type="text/css">

</style>
<body>

<form action="">
<input type="radio" name="sex" value="male">Male<br>
<input type="radio" name="sex" value="female">Female
</form>

<p><b>Note:</b> pilih sesuai jenis kelamin.</p>

<!DOCTYPE html>
<html>
<body>

<form name="input" action="html_form_action.asp" method="get">
First name: <input type="text" name="FirstName" value="Barka"><br>
Last name: <input type="text" name="LastName" value="Satya"><br>
<input type="submit" value="Submit">
</form>

<p>jika diklik "Submit", form-data akan terkirim pada "html_form_action.asp".</p>

</body>
</html>

<!DOCTYPE html>
<html>
<body>

<form action="">
<select name="cars">
<option value="sangat baik">sangat baik</option>
<option value="baik">baik</option>
<option value="cukup" selected>cukup</option>
<option value="kurang">kurang</option>
</select>
</form>

</body>
</html>

</body>
</html>

</body>
</html>

2. hasilnya seperti ini :

CONTOH HTML INPUTAN FIELD

berikut kita memasuki HTML bagian inputan suatu field
ini adalah contoh sederhana yg saya buat :

1. ini sciptnya :

2. hasilnya seperti ini, kita bisa menginputkannya, sebagai contoh saya menginputkan nama depan, nama belakang, dan username beserta paswordnya dengan account saya :

CONTOH HTML FORMATTING

berikut adalah contoh sederhana HTML Formatting yang saya buat :
perlu diingat bahwa ketika kita membuat HTML formatting itu akan berdampak pada model penulisan (Bold, Italic) <b>, <i>

1. ini scriptnya :

2. dan hasilnya :

CONTOH HTML LINK

berikut contoh HTML Link sederhana yg saya buat :
perlu diingat ketika kita menggunakan HTML Link menggunakan <a href="http:// diikuti dengan website yg akan kita Link-kan. dan ketika link sudah aktif, maka kita bisa mengunjungi link tersebut.

1. ini scrpitnya :

2. dan hasilnya ini :

CONTOH HTML INSERT IMAGE

pada pemrograman web kali ini kita belajar HTML, ini contoh sederhana HTML yang saya buat dengan menggunakan software Dreamweaver :
perlu diingat, ketika kita akan memasukkan gambar, simbol yg kita gunakan adalah <img src> dengan memilih gambar apa yg akan kita tampilkan dengan mengklik browser.

1. ini scriptnya :

2. hasil tampilan ketika kita tekan F12 pada dreamweaver seperti ini :

ASIKnya BELAJAR HTML

HyperText Markup Language (HTML) adalah sebuah bahasa markah yang digunakan untuk membuat sebuah halaman web, menampilkan berbagai informasi di dalam sebuahpenjelajah web Internet dan pemformatan hiperteks sederhana yang ditulis dalam berkas format ASCII agar dapat menghasilkan tampilan wujud yang terintegerasi. Dengan kata lain, berkas yang dibuat dalam perangkat lunak pengolah kata dan disimpan dalam formatASCII normal sehingga menjadi halaman web dengan perintah-perintah HTML. Bermula dari sebuah bahasa yang sebelumnya banyak digunakan di dunia penerbitan dan percetakan yang disebut dengan SGML (Standard Generalized Markup Language), HTML adalah sebuah standar yang digunakan secara luas untuk menampilkan halaman web. HTML 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).

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 diluar 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.

Kegunaan

Mengintegerasikan gambar dengan tulisan.
Membuat Pranala.
Mengintegerasikan berkas suara dan rekaman gambar hidup.
Membuat form interaktif.^[2]

HTML dokumen tersebut mirip dengan dokumen tulisan biasa, hanya dalam dokumen ini sebuah tulisan bisa memuat instruksi yang ditandai dengan kode atau lebih dikenal dengan TAG tertentu. Sebagai contoh jika ingin membuat tulisan ditampilkan menjadi tebal seperti: TAMPIL TEBAL, maka penulisannya dilakukan dengan cara: < b> TAMPIL TEBAL</b>. Tanda < b> digunakan untuk mengaktifkan instruksi cetak tebal, diikuti oleh tulisan yang ingin ditebalkan, dan diakhiri dengan tanda </b> untuk menonaktifkan cetak tebal tersebut. HTML lebih menekankan pada penggambaran komponen-komponen struktur dan format di dalam halaman web daripada menentukan penampilannya. Sedangkan penjelajah web digunakan untuk menginterpretasikan susunan halaman ke gaya built-in penjelajah web dengan menggunakan jenis tulisan, tab, warna, garis, dan perataan text yang dikehendaki ke komputer yang menampilkan halaman web. Salah satu hal Penting tentang eksistensi HTML adalah tersedianya Lingua franca (bahasa Komunikasi) antar komputer dengan kemampuan berbeda. Pengguna Macintosh tidak dapat melihat tampilan yang sama sebagaimana tampilan yang terlihat dalam pc berbasis Windows. Pengguna Microsoft Windows pun tidak akan dapat melihat tampilan yang sama sebagaimana tampilan yang terlihat pada pengguna yang menggunakan Produk-produk Sun Microsystems. namun demikian pengguna-pengguna tersebut dapat melihat semua halaman web yang telah diformat dan berisi Grafika dan Pranala.

Menyunting format tulisan

HTML memungkinkan seseorang untuk menyunting tampilan atau format berkas yang akan dikirimkan melalui media daring. Beberapa hal yang dapat dilakukan dalam menentukan format berkas adalah:

Menampilkan suatu kelompok kata dalam beberapa ukuran yang dapat digunakan untuk judul, heading dan sebagainya.
Menampilkan tulisan dalam bentuk cetakan tebal
Menampilkan sekelompok kata dalam bentuk miring
Menampilkan naskah dalam bentuk huruf yang mirip dengan hasil ketikan mesin ketik
Mengubah-ubah ukuran tulisan untuk suatu karakter tertentu.
Markah/Tanda

Secara garis besar, terdapat 4 jenis elemen dari HTML:
- Struktural. Tanda yang menentukan level atau tingkatan dari sebuah tulisan (contoh, < h1> Golf</h1> akan memerintahkan peramban untuk menampilkan "Golf" sebagai tulisan tebal besar yang menunjukkan sebagai Heading 1
- Presentasional. Tanda yang menentukan tampilan dari sebuah tulisan tidak peduli dengan level dari tulisan tersebut (contoh, < b> boldface</b> akan menampilkan bold. Tanda presentasional saat ini sudah mulai digantikan oleh CSS dan tidak direkomendasikan untuk mengatur tampilan tulisan,
- Hiperteks. Tanda yang menunjukkan pranala ke bagian dari dokumen tersebut atau pranala ke dokumen lain (contoh, < a href="http://www.wikipedia.org/"> Wikipedia</a> akan menampilkan Wikipedia sebagai sebuah hyperlink ke URLtertentu),
- Elemen widget yang membuat objek-objek lain seperti tombol (< button>), list (< li>), dan garis horizontal (< hr>). Konsep hypertext pada HTML memungkinkan pembuatan link pada suatu kelompok kata atau frasa untuk menuju ke bagian manapun dalam World Wide Web,
Ada tiga macam pranala (link) yang dapat digunakan:
- Pranala menuju bagian lain dari page.
- Pranala menuju page lain dalam satu web site.
- Pranala menuju resource atau web site yang berbeda.^[4]
Selain markup presentasional, markup yang lain tidak menentukan bagaimana tampilan dari sebuah tulisan. Namun untuk saat ini, penggunaan tag HTML untuk menentukan tampilan telah dianjurkan untuk mulai ditinggalkan, dan sebagai gantinya digunakanCascading Style Sheets.

Contoh dokumen HTML sederhana

<!DOCTYPE html>

<html>

 <head bgcolor=black text=white>

 <title>'''Selamat Datang''' HTML</title>

 </head>

 <body>

 <p>Halo dunia!</p>

 </body>

</html>

Head

Dokumen HTML diapit oleh tag < HEAD></HEAD>. Di dalam bagian ini biasanya dimuat tag TITLE yang menampilkan judul halaman pada titlenya browser. Selain itu Bookmark juga menggunakan tag TITLE untuk memberi mark suatu web site. Browser menyimpan “title” sebagai bookmark dan juga untuk keperluan pencarian (searching) biasanya title digunakan sebagai keyword. Header juga memuat tag META yang biasanya dapat digunakan untuk menentukan informasi tertentu mengenai document HTML. Anda bisa menentukan author name, keywords, dan lainnya pada tag META.

Contoh:

<meta name="author" content="ubuntu-online">

Elemen Body

Bagian BODY, yang dinyatakan dengan tag < BODY>…</BODY>, merupakan tubuh atau isi dari dokumen HTML dimana anda meletakan informasi yang akan ditampilkan pada browser.

Tag

HTML tidak membedakan penggunaan huruf besar ataupun huruf kecil dari suatu elemen. Suatu elemen HTML terdiri dari tag-tag beserta teks yang ada dalam tag-tag tersebut. Tag ini dinyatakan dengan tanda lebih kecil (<) dan tanda lebih besar (>).

Tag biasanya merupakan suatu pasangan yang disebut dengan:

Tag awal, dinyatakan dalam bentuk <nama tag>
Tag akhir, dinyatakan dalam bentuk </nama tag>

Formatnya: <nama tag> teks yang ditampilkan </nama tag>.

Contoh: untuk menampilkan teks dalam format teks miring Teks ini terlihat miring di browser anda dengan perintah HTML < i>Teks ini terlihat miring di browser Anda</i>

Atribut

Tag awal bisa memiliki beberapa buah atribut yang menyatakan karakteristik dari tag tersebut. Misalnya, <P ALIGN=”left”>digunakan untuk membuat rata kiri suatu paragraf. Tag yang digunakan adalah <P> dan atribut yang menyertainya adalah ALIGN dengan nilai left. Nilai atribut ALIGN hanya bisa berupa center, left, right atau justify.

Referensi

^ Wendy willard (2006). HTML. ISBN 9790072263787.

^ David Willard (2005). Crash Course. ISBN 0071422420.

^ Andi (2001). Desain Web dengan Microsoft FrontPage 97. Wahana Komputer & Andi Yogyakarta. ISBN 9795335219.

^ Shelly woods (2001). Introductory Concepts and Techniques. Gex publising service. ISBN 978142927206.

^ Steven E. Callihan (2006). HTML 4 in a Weekend. USA. ISBN 1592000592.

di dalam mata kuliah pemrograman web, kebetulan dosen yang mengampu adalah pak Barka Satya, M.Kom. permulaan kita masih belajar HTML (Hyper Text Marquee Language).

berikut contoh pembuatan HTML basic yang akan saya paparkan

untuk

1. HTML document, scriptnya :

<!DOCTYPE html>

<html>

<body>

<h1>My First Heading</h1>

<p>My first paragraph.</p>

</body>

</html>

2.HTML Heading,scrpitnya :

<!DOCTYPE html>

<html>

<body>

<h1>This is heading 1</h1>

<h2>This is heading 2</h2>

<h3>This is heading 3</h3>

<h4>This is heading 4</h4>

<h5>This is heading 5</h5>

<h6>This is heading 6</h6>

</body>

</html>

3. HTML paragraph, scrpitnya :

<!DOCTYPE html>

<html>

<body>

<p>This is a paragraph.</p>

</body>

</html>

4. HTML Link, scrpitnya :

<!DOCTYPE html>

<html>

<body>

This is a link</a>

</body>

</html>

5. HTML images,scriptnya :

<!DOCTYPE html>

<html>

<body>

</html>

6. HTML untuk memasukkan garis horizontal, scriptnya :

<!DOCTYPE html>

<html>

<body>

<p>The hr tag defines a horizontal rule:</p>

<hr>

<p>This is a paragraph.</p>

<hr>

<p>This is a paragraph.</p>

<hr>

<p>This is a paragraph.</p>

</body>

</html>

7. HTML untuk parafgraf yang lebih, scriptnya :

<!DOCTYPE html>

<html>

<body>

<p>

This paragraph

contains a lot of lines

in the source code,

but the browser

ignores it.

</p>

<p>

This paragraph

contains a lot of spaces

in the source code,

but the browser

ignores it.

</p>

<p>

The number of lines in a paragraph depends on the size of your browser window. If you resize the browser window, the number of lines in this paragraph will change.

</p>

</body>

</html>

8. HTML untuk line break, scrpitnya :

<!DOCTYPE html>

<html>

<body>

<p>This is<br>a para<br>graph with line breaks</p>

</body>

</html>

9. HTML poem problem, scrpitnya :

<!DOCTYPE html>

<html>

<body>

<p>

My Bonnie lies over the ocean.

My Bonnie lies over the sea.

My Bonnie lies over the ocean.

Oh, bring back my Bonnie to me.

</p>

<p>Note that your browser ignores the layout!</p>

</body>

</html>

10. HTML menambahkan background dan color, scriptnya :

<!DOCTYPE html>

<html>

<h2 style="background-color:red;">This is a heading</h2>

<p style="background-color:green;">This is a paragraph.</p>

</body>

</html>

11. HTML untuk font, colour and size, scriptnya :

<!DOCTYPE html>

<html>

<body>

<h1 style="font-family:verdana;">A heading</h1>

<p style="font-family:arial;color:red;font-size:20px;">A paragraph.</p>

</body>

</html>

12. HTML untuk alignment of text, scriptnya :

<!DOCTYPE html>

<html>

<body>

<h1 style="text-align:center;">Center-aligned heading</h1>

<p>This is a paragraph.</p>

</body>

</html>

WHAT WE DO

We've been developing corporate tailored services for clients for 30 years.

ABOUT US

OUR TEAM

Neila Jovan

Mathew McNalis

Michael Duo

OUR SKILLS

Marketing

Websites

PR

ACHIEVEMENTS

STRATEGY & CREATIVITY

PORTFOLIO

artikel HTML 5

HTML format karakter

HTML List

HTML dengan Table

HTML dengan tampilan Form

HTML Tampilan CV

CONTOH HTML INSERT a COMMENT

CONTOH HTML LIST, BUTTON, SUBMIT

CONTOH HTML INPUTAN FIELD

CONTOH HTML FORMATTING

CONTOH HTML LINK

CONTOH HTML INSERT IMAGE

ASIKnya BELAJAR HTML

Kegunaan

Menyunting format tulisan

Markah/Tanda

Contoh dokumen HTML sederhana

Head

Elemen Body

Tag

Atribut

Referensi

Template Information

Sample Footer

Template Information

Hot Articles

AYOESOB CUSTOME STORE

Test Footer

Popular Posts

Labels

Like Us

Blog Archive

Arsip Blog

STMIK AMIKOM YOGYAKARTA

Labels

Kategori

Mengenai Saya

WHAT WE DO

ANALYTICS

CONSULTING

DESIGN

DEVELOPMENT

MARKETING

SEO

CONTACT US

Ayus Blog