Selasa, 24 Februari 2009

Cara membuat website dengan Notepad

Bagaimanapun juga, HTML adalah sebuah bahasa. Sama seperti bahasa Jawa, kalau Anda 5 tahun saja tinggal di Kebumen, saya yakin Anda akan medog dengan sendirinya. HTML pun merupakan bahasa yang jika Anda terbiasa menulisnya, Anda akan mejadi mahir. Dijamin! (duh..siapa yang memberi jaminan? )

Membuat halaman website sebenarnya sangat mudah. Bahkan Anda hanya perlu Notepad. Saya ingin mengajak Anda mengenal HTML dengan memulai dari yang sederhana. Berikut cara mudah membuat halaman web hanya dengan Notepad.

Jika Anda pemula, anggap ini latihan sederhana dan untuk selanjutnya jangan bosan-bosan datang ke sini yah..!

Langkah 1

Cari di PC Anda aplikasi NotePad (seharusnya ada). Kemudian ketik sama persis dengan yang di bawah ini (Saya harap Anda tidak melakukan copy & paste. Kalo Anda lakukan itu, percuma dong belajar nulis HTML?)

<HTML>
<HEAD>
<TITLE>Belajar menulis dengan HTML</TITLE>
</HEAD>
<BODY>
<H1>Selamat Datang</H1>
<HR>
<P>Ini adalah halaman web pertama saya. Hore... Saya bisa!!</P>
<HR>
</BODY>
</HTML>


Jika sudah, simpan itu di folder Anda dengan pilihan:
File Name : contoh.html
Save as type: All files

Klik ganda pada file yang sudah Anda buat tadi. Maka seharusnya halaman web Anda tampil seperti ini:

belajar cara membuat website. Oleh:Widodo Purnomosidi

Untuk menuliskan paragraf-paragraf Anda, awali selalu dengan tag <P> dan tutup dengan </P>. Jika Anda ingin meng-editnya, cukup klik kanan pada file html Anda, point to open with, pilih NotePad. Sebagai bahan untuk belajar buat Anda, masih pada halaman ini, silahkan ketik CTRL + U - jika Anda menggunakan Mozila FireFox, atau pilih menu View kemudian Source - jika Anda menggunakan IE.

Cara Membuat Link atau Navigasi

Edit dengan NotePad file contoh.html kemudian tambahkan isi sebagai berikut:

<HTML>
<HEAD>
<TITLE>Belajar menulis dengan HTML</TITLE>
</HEAD>
<BODY>
<H1>Selamat Datang</H1>
<HR>
<P><a href="contoh.html">Home</a> | <a href="contoh2.html">Halaman 2</a> | <a href="contoh3.html">Halaman 3</a></P>
<HR>
<P>Ini adalah paragraf pertama dari halaman homepage. Belajar HTML itu mudah dan tidak susah apalagi harus pake kursus, ngga banget lah yah...</P>
</BODY>
</HTML>


Jika Sudah, klik SAVE. Masih pada jendela NotePad yang sama, ubah paragraf Anda dengan kaliman Anda sendiri, kemudian SAVE AS sebagai contoh2.html. Jangan ditutup dulu, ubah lagi paragraf Anda untuk menandakan itu halaman ke-tiga dengan kaliman Anda sendiri, kemudian SAVE AS sebagai contoh3.html.

Sekarang buka salah satu file HTML Anda kemudian coba klik pada navigasi / link yang baru Anda buat. Jika link Anda bekerja, selamat! Anda telah menjadi seorang webmaster. Perlu belajar lagi untuk membuat situs yang lebih menawan tampilannya. Untuk itu, besok ke sini lagi yah..!

belajar cara membuat website. Oleh:Widodo Purnomosidi








65 komentar:

  1. pak pelajarannya ditambah biar saya bisa donlot punya bapak sekalian blajar

    BalasHapus
  2. Kalau bikin template untuk Blogspot gimana ya?

    BalasHapus
  3. makasih, oke banget Om....

    BalasHapus
  4. @ nia : dari pimp-my-profile.com aja, disitu anda bisa membuat template sendiri, atau memakai yang sudah ada..

    BalasHapus
  5. wah makasih infonya,bisa dicoba nih..salam kenal..

    BalasHapus
  6. TRIMA KASIH ATAS INFORMASINYA PAK
    TAPI MSH ADA YANG KURANG NI
    SAYA D SURUH MASUKIN FOTO K DLM HALAMAN WEB ITU PAK
    GMNA Y?????

    BalasHapus
  7. lagi donk sekalian jelasin koding dan fungsi2nya ...tanks bgt ya.ni ferry good

    BalasHapus
  8. pak cranya buat domain nya gmana

    BalasHapus
  9. sdfsdd
    bagus
    aku isak!!!

    BalasHapus
  10. cara menggunakan PHPTRIADnya gmn ?

    BalasHapus
  11. irsyaad suharyadi5 Juli 2010 19.00

    pak boleh minta alamt emailnya tidak pak, saya ingin benar2 belajar buat web...

    ini alamat email saya
    panggilabdi_irsyaads@yahoo.co.id

    BalasHapus
  12. waaahhhh....hebat pak,saya pengen yang lebih lagi...

    BalasHapus
  13. saya akan mulai blajar......

    BalasHapus
  14. mau tanya,kalau web yang kita buat mau kita jadikan situs ato blog di internet ieu gimana caranya???mohon bantuannya

    BalasHapus
  15. permisi.. kalo mau buat tabel gimana ya?

    BalasHapus
  16. Terima kasih !!!!!!!!!!! Ternyata berhasil juga !!!!!!!!!!!!!!!!!!!!!!! Tapi , isinya jg gak sama dari punya aku . Poko'nya makasih deh :)

    BalasHapus
  17. wahh mansttappp pakk.. oh ya pak saya bingung untuk upload foto di web melalui notepad.. bisa g pak?? mohon infonya

    BalasHapus
  18. gambarnya ditimpa teks sgala om, takut ada yang ngikutin ???
    hahahahh

    BalasHapus
  19. terima ksih ie atas ilmu nya
    biar pun cedikit

    BalasHapus
  20. thank ilmunya...hehehe mau nanya dikit lagi ni..kalo mau nambahin animasi n domainnya gmna...?

    BalasHapus
  21. bagaimana cara membuat tempelate website???

    BalasHapus
  22. Cara bikin backgroundnya dong kasih tau lewat email yoo Hsevfakhri@gmail.com atau invite my pin 3008a204 tq

    BalasHapus
  23. kolo cara meng-up-loadnya gimana?

    BalasHapus
  24. makasih, saya jd lebih tau apa itu HTML. wahh ilmu baru nihh ^_^

    BalasHapus
  25. ga guna lo pak jadi sampah aja sana tai babi jadi babi lo semua waakkkakaka -Dimas beck

    BalasHapus
  26. setelah d simpen file x!
    apa kita harus kluar dr program dulu baru klik Ganda atau langsung saja!
    *bingung

    BalasHapus
  27. yagn ada halam 2 halaman 3 di klik kok ga ada isi ?
    dgn kata lain tidak bisa. ?

    BalasHapus
  28. postingannya mantab Gan, sangat cocok untuk menambah pengetahuan khususnya yang lagi belajar html seperti saya ini gan, salam kenal jangan lupa kunjung balik ya.....

    BalasHapus
  29. thax jadi tambah ilmu untuk HTML. kunjung baliknya

    BalasHapus
  30. makasih banget gan sekali lagi makasih banget

    berguna banget :)

    BalasHapus
  31. bro yang Cara Membuat Link atau Navigasi ada videonya gak kalo ada kirimin ke:michaelifebrian@yahoo.com ya aku gak ngerti caranya

    BalasHapus
  32. bro gak usah deh yang Cara Membuat Link atau Navigasi aku udah ngerti

    BalasHapus
  33. mantap gan...
    nice info...

    BalasHapus
  34. Kayaknya,Blog Ini Aja yang Langsung Ksih Tau,yang Lain Tunggu Tunggu Terus -.-

    BalasHapus
  35. kalo bikin background gambar pd html gmn ?

    BalasHapus
  36. udah tak tulis sama di atas tp jdinya msh tetep notepad aja nih, tolong solusinya gan?

    BalasHapus
  37. komunitasbki2011.blogspot.com

    BalasHapus
  38. kalo edit tema gratisan gimana ya? apa ada kursus tentang edit tema blog dengan notpade ++?

    BalasHapus
  39. cara buat web yang dari dot(.) com tapi gratis,hahahaa bagaimana om bagi-bagi ilmu dong dikit....

    BalasHapus
  40. mas kalo di kasih header gmana ?

    BalasHapus
  41. saya terbantu sekali terima kasih pak

    BalasHapus
  42. SAYA SANYAT TERBATU SKALI DENGAN SITUS INI
    TRIMAKSAIH YA PAK ??

    BalasHapus
  43. Cara masang gambar ke blog gimana caranya ya om???

    BalasHapus
  44. kalo bikin gituan aku bisa. tapi aku pengen websiteku dilihat orang lain secara online dan gratis.

    BalasHapus
    Balasan
    1. nah itu mas maksudnya kalau pake gitu saya bisa , cuma kalau di search oleh orang lain bisa apa engga , masih binggung disitu . u.u

      Hapus
  45. iya.. aku juga pengen websitequu bisa diliat sma org lain secara online, dan gratiss...

    BalasHapus
    Balasan
    1. Astari andriani14 Desember 2012 22.33

      hmm.. aku juga pengen website aku bis adiliat sma orang laen,, lwat online dan free

      Hapus
  46. maksud nya klik ganda .,. tapi di klik 2x mlah ke buka notepad nx

    BalasHapus
  47. Itu bukan website itu boongan

    BalasHapus
  48. ridwan emng bgtu x perogrman web prnh skla ga?

    BalasHapus
  49. Gan...ane mau belajar lebih jauh tentang cara membuat web...bisa belajar melalui email ga...

    thanks
    tois

    email : toisletto@gmail.com
    plis ya gan..

    BalasHapus
  50. GAN KEREN BANGET JADI INGIN TAMBAH GIAT BELAJAR NYA :)

    BalasHapus
  51. sangat menarik infonya..
    blog agan dah q follow di followback ya di http://pixmasoftware.blogspot.com/
    trims....

    BalasHapus
  52. mau tanya dong di situ kan ada halaman 1,2 dan 3 nah bagaimana cara mengisi halaman yang 2 dan 3 thanks

    BalasHapus
  53. terima kasih infonya. menambah wawasan

    BalasHapus
  54. thanks gan..'' kunbal ye

    BalasHapus
  55. o ya gan sampean kan yang ngajarin buat web dengan html coba posting lagi dong : cara membuat web menggunakan html5 dan css

    BalasHapus