Cara Membuat Dan Menjalankan file HTML

file dengan ekstensi [dot]html dan [dot]htm adalah file yang hanya bisa dijalankan oleh web browser(firefox, opera, ie, safari, chrome and other) sedangkan isi dari file dengan ekstensi[dot]html adalah markup code html

Visi bisa jadi adalah kekuatan terbesar kita. Ia selalu membangkitkan daya dan kesinambungan hidup; Ia membuat kita memandang masa depan dan memberi kerangka tentang apa yang belum kita ketahui. Li Ka Shing

file dengan ekstensi [dot]html dan [dot]htm adalah file yang hanya bisa dijalankan oleh web browser(firefox, opera, ie, safari, chrome and other) sedangkan isi dari file dengan ekstensi[dot]html adalah markup code html

Last Modif at July 8th, 2011

ini adalah tutorial paling dasar tentang html.

file dengan ekstensi [dot] html dan [dot] htm adalah file yang hanya bisa dijalankan oleh web browser(firefox, opera, ie, safari, chrome and other) sedangkan isi dari file dengan ekstensi[dot] html adalah markup code html, (bisa juga)cascading style sheet(css) dan (bisa juga)javascript.

apa itu html?

html adalah sebuah bahasa markup yang fungsinya untuk membuat halaman website, contoh html ada dibawah

apa itu css?

css(cascading style sheet) adalah salah satu bahasa pemrograman web yang fungsinya untuk merubah/mendesain tampilan halaman website, css juga berfungsi untuk merubah tampilan tag html, contohnya ada dibawah

apa itu javascript?

javascript adalah scripting browser(hanya bekerja di browser) yang fungsinya untuk menambah kemampuan website, contoh dasarnya ada dibawah

syarat untuk membuat dan mejalankan file html

  • editor, standardnya adalah notepad
  • web browser, (ie, firefox, opera, safari, chrome dll)

membuat file html

  • buka program notepad
  • copy markup/code/style berikut

<html>
<head>
<title>contoh html</title>
<style type="text/css">
<!--
/*fungsi style css untuk merubah tampilan tag-tag html, serta mendesai halaman website*/
/*contoh tag body*/
body{
background-color:black;/*warna latar belakang*/
color:white;/*umumnya warna text*/
margin:20 80px;/*jarak luar*/
}
/*************/
/*misal lagi tag h1*/
h1{
font-size:60px;/*ukuran font*/
}
/*misal lagi tag h2*/
h2{
font-size:45px;/*ukuran font*/
color:green;/**/
}
/*misal lagi tag p*/
p{font-weight:bold;/*font tebal*/}
/*yah, fungsi css adalah untuk merubah tampilan**/
-->
</style>
<script type="text/javascript">
//ini adalah contoh java script function
function contoh_js_simple()
{
alert("ini adalah javascript alert");
/*ini adalah komentar javascript untuk
lebih dari satu baris/line*/
//ini adalah komentar javascript hanya satu baris/line
//fungsi javascript adalah untuk menambah kemampuan web itu sendiri
}
</script>
</head>
<!-- fungsi html adalah untuk menampilkan content/web -->
<body onload="contoh_js_simple">
<h1>judul h1</h1>
<h2>judul h2</h2>
<p>ini adalah paragraf</p>
<script type="text/javascript">
//ini adalah contoh simplejava script
document.write ("<p>ini adalah paragraf yang dirulis dengan javascript</p>");/**/
</script>
<a href="javascript:contoh_js_simple()">ini adalah alert</a>
<p><a href="http://www.indaam.net" target="_blank">ini adalah link, salam indaam.net</a></p>
<!-- ini adalah komentar html, dan tidak akan ditampilkan-->
<!-- agar html ini bisa dilihat/dibuka oleh orang banyak, kita harus menguploadnya di hosting, namun jika hanya untuk belajar dengan komputerpun sudah cuku -->
</body>
</html>

  • paste ke notepad tadi
  • klik file(kiri atas)
  • pilih save ass
  • pada file name isi dengan contoh_html.htm atau contoh_html.html
  • pada seva all type pilih all files
  • lalu save
  • ekstensinya adalah [dot] html, bukan [dot] text

juga bisa dibuat dengan cara klik kanan diarea kosong lalu new – text document, kemudian ubah ekstensinya (dari [dot] txt menjadi [dot]html atau htm)

menjalankan file html

  • cari file yang telah dibuat tadi contoh_html.htm atau contoh_html.html
  • arahkan cursor ke file html tadi
  • lalu klik kanan
  • pilih open with pilih salah satu(firefox, ie, opera dll)
  • bisa juga dengan double click(tergantung konfigurasi komputer)

mengedit file html

  • arahkan cursor ke file html tadi
  • klik kanan
  • lalu pilih notepad
  • selakan edit
  • save
  • lalu jalankan lagi filenya

simple kan!?

Indam

A geek, frontend developer. Like you, coding & experiment.
#web #design #ui #ux #standard #dreamer
#welding #interisti #beer #coffee

17 thoughts on “Cara Membuat Dan Menjalankan file HTML”

  1. weno says:

    tolong program untuk html,css,dan java scriptnya jd stu halaman.so,w bnr” pusing.maap yee sblumnya.heheee

    1. indam says:

      Googling lagi gan, banyak kok :D

      1. Febbiez says:

        mohon bantuan gan, di blog saya ada script yang tidak berfungsi di browser tertentu, misal javascript berfungsi di firefox tapi tida berfungsi di chrome, gimana cara ngatasinnya?
        terima kasih.

  2. mur says:

    halo gan bagaimana cara buat blog wordpress yang punya extentension .com

    sorry…baru ajar nih

  3. Miftah Afina says:

    CSS bukanlah termasuk kedalam kategori “bahasa pemrograman”

    1. indam says:

      Yups bener banget gan, Definisi CSS ini menjadi sedikit rancu. Namu fakta memang CSS bukanlah bukan bahasa pemrograman. scara tidak ada logika didalamnya, walau terkadang kita pakai logika untuk CSS hack :D

  4. galihworsnop says:

    wah bermanfaat nih mantap, thanks sudah berbagi

  5. Paling suka belajar html meski agak sedikit membingungkan.
    Makasih sharing bagusnya mas.

  6. ambo dalle says:

    sangat bermanfaat bgku yang baru belajar.

  7. welly says:

    thank’s Gan Sangat berguna

  8. rendy says:

    sorry gan, klo w pake css3 trus tuh klo di jalanin di firefox malah brantakan tapi klo di crome rapih
    trus gmna tuh gan klo filenya bisa di jalanin di firefox..

  9. shandy says:

    gan jangan setengah – setengah tolong di perjelas lagi klo mau di liat orang banyak utuk html.html nya….
    thanks yahh

  10. bella says:

    kalau itu aku udah tau… hla itu cara meng-online kan web sitenya gimana?? semacam buat web pake xamp gitu hloo, jadi website online

  11. sahnty says:

    lg bingung dan baru bljr gimana c bikin tabel warna dan edit template mohon bantu iia

  12. imam says:

    kk,website html maupu CSS apa bisa dilihat lewat internet?

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Disclaimer, FAQ & License

Hello Gaes, untuk tujuan apapun semua content text di blog ini dapat di copas, tanpa harus menulis sumbernya. Namun content yang berupa gambar--harus Anda periksa kembali lisensinya.

Adapun(mungkin) sebagian content blog ini sudah kadaluarsa atau sudah tidak relevan, contoh :'Theme default WordPress 3+ adalah Twentyten 'apakah selamanya Twentyten?' ngga kan? Indam selaku pengelolah berharap melaporkan jika menemukan content basi yang mungkin dapat menimbulkan salah persepsi tentang content dan konsep itu sendiri. Oia, karena blog ini bersifat pribadi dan bukan untuk komersil, mungkin anda juga akan menemukan tulisan tentang aku dan hal-hal rancu yang sama sekali ngga ada hubungan dengan web dan blog-blogan. Perlu dicatat: Indam selaku pengelolah tidak bertanggung jawab atas kerugian materi, waktu, tenaga, pikiran yang mungkin ditimbulkan dari sini. So, pandai-pandai yah dalam memilah informasi. Thanks for reading.

Quote

Ketika Anda melihat orang lain mengangkat dirinya dengan cara merendahkan orang lain, sebenarnya orang itu lebih rendah dari mereka yang direndahkan. Phidias--greece filsuf

+
-