RSS

Cara sederhana membuat website dengan Microsoft FrontPage 2003

03 Agu

Seperti halnya Microsoft Publisher 2007, Microsoft FrontPage 2003 juga menganut ilmu WYSIWYG (What You See is What You Get) alias apa yang kita buat designya, jika dibuka dengan web browser persis seperti design yang kita buat. Sebenarnya boleh dibilang Microsoft FontPage 2003 ini adalah “Adik Kandung” dari Microsft Publisher 2007, karena program ini lahir duluan.

Microsoft FrontPage 2003 ini bisa anda dapatkan dengan cara mengistall Microsoft Office 2003. Keunggulan program ini adalah mudah penggunaannya, anda tidak perlu dipusingkan dengan urusan pembuatan kode HTML, karena akan otomatis dibuatkan oleh program, memiliki tampilan yang mirip dengan Microsoft Word. Jadi saya yakin anda tidak akan mengalami kesulitan yang berarti jika sudah terbiasa “Utak Atik dan Surat suratan” dengan Microsoft Word.

Selain mode WYSIWYG (mode Normal), Anda bisa mendesain menggunakan tampilan HTML. Mode ini berguna saat Anda ingin menyisipkan kode JavaScript. Ini salah satu kekurangan FrontPage, yaitu tidak memiliki fasilitas dukungan penuh JavaScript.

Okey deh, nggak usah panjang panjang ceritanya, langsung aja kita praktek secara sederhana, anda siap kan?…

Langkah awal buatlah folder di computer anda, Misalkan nama folder MyWebsite. Folder ini akan digunakan untuk menyimpan web yang anda buat melalui Microsoft FrontPage 2003. Selanjutnya buat juga Sub Folder, Misalkan MyImages, dan kopikan (simpan) semua gambar yang akan ditampilkan di website anda pada sub folder ini.

Selanjutnya buka program Microsoft FrontPage 2003. Jika sudah terbuka, amati!! Mirip Microsoft Word kan? Kumudian Klik Menu Format >> Theme.. (maka dilayar sebelah kanan akan tampil pilihan tema yang bisa anda pilih. Pilih misalkan “Slate

Klik Menu Table >> Insert >> Table, kemudian isi kolom sesuai dengan yang anda inginkan misalkan seperti gambar dibawah ini ( lihat kotak warna merah)

Maka akan muncul table yang terdiri dari 4 baris, dimana baris ke 1 untuk Header, ke 2 untuk  menu halaman, misalnya Home, Product, Contact, About dll, baris ke 3 untuk konten (isi) dari halaman website dan baris ke 4 untuk footer.

Nah, sekarang kita buat headernya. Seperti yang saya katakan di awal tadi kita harus membuat sub folder MyImages. Sudah punya gambar header belum?, jika belum terpaksa minta bantuan “Mbah Google”. Cari gambar header dengan keyword “header” pasti banyak tuh..!! pilih aja mana yang anda suka, tapi jangan lupa lebarnya dibuat 950 pixel sesuai dengan kolom yang kita buat diatas. Jika sudah punya, arahkan kursor pada baris ke 1 selanjutnya Klik Menu Insert >> Picture >> From File. Nah pilih gambar heradernya.

Selanjutnya pada baris ke 2, kita buat menu link untuk halaman misalkan Home, Product, About Us, Contact Us dll. Caranya tempatkan kursor pada baris ke 2, selanjutnya Klik Menu Table >> Insert Cells, Isi “Number Of Culomns, misalkan diisi dengan angka 6. Dan tuliskan Rencana menu yang akan dibuat.

Pada baris ke 3 adalah konten (isi) dari web kita. Disini anda bisa membagi menjadi 2 atau 3 kolom, terserah mana yang anda suka. Cara membaginya sama dengan membuat menu untuk link halaman.

Dan pada bagian baris ke 4 adalah untuk footer, caranya sama dengan anda membuat header. Jika tidak punya gambar untuk footer, lagi lagi anda harus minta bantuan “Mbah Google” atau anda bisa membuatnya sendiri.

Selanjutnya simpan hasil design website anda. Jangan lupa anda harus menyimpannya dengan nama index.html. Untuk membuat halaman baru, anda tinggal mengcopy index.html kemudian di rename dengan nama yang lain, misalnya Product.html, Contact.html, About.html dll, dan selanjutnya edit halaman tersebut.

Tahap selanjutnya anda harus membuat hyperlink untuk menghubungkan halaman yang satu dengan halaman yang lain. Caranya : blok kata yang akan dipasang hyperlink, misalnya: Blok menu Product  >> klik kanan pada mouse anda >> hyperlink properties >> isi bagian addres dengan alamat yang akan dituju, misalnya Product.html >> klik ok. Daaaaaaan selesai…!!! Sekarang lihat index.html dengan web browser anda…!!! Keren kan..???

Dan tahap akhir adalah meng-upload website anda ke server. Caranya sama dengan Upload website yang dibuat dengan Publisher 2007

 
20 Komentar

Ditulis oleh pada Agustus 3, 2012 in Tips Membuat Blog / Website

 

Tag: , ,

20 responses to “Cara sederhana membuat website dengan Microsoft FrontPage 2003

  1. Dennis SI Motor Ungu

    Januari 15, 2013 at 8:27 pm

    thank’s bro sngat membantu skali lagi makasih🙂

     
  2. ulinnuha

    Februari 12, 2013 at 7:21 pm

    bung, ini seharusnya pelajaran kelas brp?

     
    • Moh Ikhsan

      Februari 13, 2013 at 9:29 am

      Bung ulinnuha: kelas berapa aja boleh kok… hehehe thank yah…..

       
  3. fathur

    April 9, 2013 at 8:25 pm

    makasih bg.
    Saya sdg mempelajari ini.
    pelajaran smk jurusan RPL sama TKJ.

     
    • Moh Ikhsan

      April 10, 2013 at 2:37 pm

      Fathur, Thanks juga, semoga sukses………

       
  4. yoma

    Mei 19, 2013 at 4:29 pm

    saya juga dl belajar waktu di palcomtech skgr mau ngajarin anak murid saya tp harus instal dl ya ms office 2003…,office saya 2007….semoga nemu deh 2003 nya ,mkasih banyak ya …

     
    • Moh Ikhsan

      Juli 7, 2013 at 9:27 am

      Ok Yoma: semoga sukses yah ngajarin muridnya

       
  5. antonius_sitanggang

    Juli 10, 2013 at 12:46 pm

    terima kasih … atas pembelajarannya.. soalnya saya ingin mengikuti perlombaan merancang website di kampus saya,,

     
  6. ridwan

    Juli 26, 2013 at 12:06 pm

    cara membuat konten nya gimana

     
    • Moh Ikhsan

      Juli 26, 2013 at 2:16 pm

      Ridwan: Konten seperti apa yg anda maksud?

       
  7. cahaya

    Agustus 30, 2013 at 10:01 am

    thanks all your tutorial..

     
  8. mohamadsafiiz

    September 21, 2013 at 1:10 pm

    mending di sini aja brooo….

    Software Spektakuler
    Penambah Saldo Rekening Bank Anda.
    Cukup Anda Install di Komputer Anda
    dan Jalankan TRIK RAHASIA nya, dalam waktu
    24 jam, Saldo Rekening Bank Anda Akan Bertambah
    Anda Penasaran dan Ingin Tahu Rahasianya??
    Buruan DOWNLOAD Softwarenya di :
    http://goo.gl/GoSL0X

    Dan ini tutorial cara untuk mendownloadnya :
    http://goo.gl/E6in4A

    dan ini cara aktivasi full version :
    http://softwarepsr.com/aktifasi

    buktikan saya telah membuktikannya🙂

     
  9. gerrard

    September 24, 2013 at 8:50 pm

    joooooooosss bray🙂

     
  10. aldrobert

    Oktober 15, 2013 at 12:05 am

    Pak, terima kasih tutorialnya, sangat bermanfaat. Mau tanya bagaimana membuat drop down menu menggunakan frontpage 2003, seperti di web http://www.banualogistics.co.id dan http://www.anugerahtujuh.co.id yang bapak buat.

     
  11. yuanie

    November 14, 2013 at 9:35 pm

    tabel sya koq gbsa muncul se wkt d preview

     
  12. Sendy Winanta

    Januari 29, 2014 at 3:55 pm

    Cara install gimana, mas? Saya ada file extension.daa. Mohon bantuannya.

     
  13. fahmi TKJ

    Agustus 20, 2014 at 2:40 pm

    makasih banget ya.buat belajar gua anak tkj cocok banget ni thanks ya

     

Silakan tinggalkan pesan disini

Isikan data di bawah atau klik salah satu ikon untuk log in:

Logo WordPress.com

You are commenting using your WordPress.com account. Logout / Ubah )

Gambar Twitter

You are commenting using your Twitter account. Logout / Ubah )

Foto Facebook

You are commenting using your Facebook account. Logout / Ubah )

Foto Google+

You are commenting using your Google+ account. Logout / Ubah )

Connecting to %s

 
%d blogger menyukai ini: