Melihat dan Membuat Web Page

Oke.. pakne dan para pengunjung blog nye pakne semue-muenye gale-gale... kite lanjutken lagi ye... pelajaran kite mengenai HTML dan sekitarnye. Yang mana daripada pelajaran ini kite ambil dari ebook yang kite rekomendasiken kepade pengunjung blog nye pakne ini untuk segera mendownload dan mempelajarinye.

Beneran deh! Pare pengunjung pakne sekalian gale-gale, ente-ente bakalan nyesel deh kalo kagak segere mendownload ebook tersebut, sebab ape pengunjung blognye pakne segale-gale semuenye? Sebab saye menghosting file tersebut dengan account biase alias gratisan, dan konsekuensinye ape pengunjung blognye pakne segale-gale?

Konsekuensinye file tersebut mungkin akan dihapus oleh pihak tempat ane menumpangken file tersebut jika file tersebut lame tak ade yang mendownloadnye. Jadi, sekali lagi ane peringatin ye, cepetan download kalo tidak ingin kehilangan kesempatan yang amat langka ini, buruan ye.. ye... ye... mumpung masih gratis!!!

Sudah nduk? Sudah puas promosinya? Sampean itu lho nduk... kalo mau promosi itu, mbok ya pakne mu ini dikasih komisinya, sebab pakne mu inikan berperan sebagai penyedia sarananya!

Welah pakne, numpang promosi dikit aje pake mintak komisi segale... ntar ye pakne... Lagiankan... hubungan kita ini sudah saling menguntungken. Pakne sebagai pemilik blog mendapatkan bahan dan cerita gratis dari saya, dan saya mendapatkan kendaraan gratis untuk mentenarkan diri saya. Jadi... kita sudah sama-sama untuk kan pakne?

Oke deh nduk... koe emang paling bisa mengelak dan memutarbalikkan omongan, pakne jadi heran, darimana koe mendapatkan kemampuan itu? However... koe sekarang mau cerita tentang opo lagi nduk? Opo masih seputar ebook yang kemarin-kemarin itu?

Membuat Web Page

Yo'i pakne, yang sudah kite bahas dari ebook itu kan baru sampe chapter atau bab 1, nah... sekarang kite akan membahas chapter 2 yang mana daripada topiknya adalah tentang cara membuat dan melihat atau menampilkan halaman HTML.

Jadi sekarang kita sudah bisa membuat halaman HTML yo nduk? Koq cepet sekali yo, padahal... yang baru kita pelajari kan baru sedikit sekali, opo menurut koe ini ndak berarti kita terlalu nafsu untuk segera mempraktekken ilmu yang belum seberapa dan masih mentah serta masih meraguken dalam hal keabsahan dan tingkat kehalalannya?

Wah, kalo soal itu aku juga ndak tahu pakne. Aku yo... cuma menuruti opo yang terdapat dalam ebook itu. Kalo pakne mau protes, protes saja sama yang membuat ebook itu. Tapi mungkin pakne, ini cuma mungkin lho pakne... mungkin saja si penulis ebook itu ingin agar supaya yang mana daripada kita segera mengenal dan terbiasa untuk yang mana daripada membuat dan menulis dalam versi HTML.

Oooiiiyooo.. yo nduk... mungkin saja koe bener... dengan belajar dan berlatih... maka kemungkinan besar ilmu opopun sing sedang dipelajari tersebut akan lekat lebih lama di kepala. Sebab, kalo cuma dibaca dan dingat saja, biasane akan cepat sekali terlupaken. Dengan segera mempraktekken dan segera mencoba apa yang baru saja dipelajari, maka kemungkinan besar pelajaran tersebut akan teringat lebih lama di kepala, iyo toh nduk?

Perangkat Yang Di Butuhkan

Ho'oh... Nah... jadi sekarang pakne sudah bisa menerima toh? Oke deh pakne, kalo gitu kite mulai saje ye... yuuuuk. Sebelum pakne mulai membuat halaman HTML atau halaman web atau web page, ada satu hal yang perlu pakne perhatiken yaitu, membuat halaman HTML ini pakne, tidak sama atau tidak sama persis dengan saat pakne membuat halaman atau dokumen biasa.

Lho?? Beda ne opo nduk?

Begini pakne... saat membuat dokumen biasa, biasane pakne cuma membutuhkan satu software saja, yaitu software atau aplikasi untuk pengolah kata atau biasa disebut word processing. Sedangken saat pakne membuat halaman HTML, maka pakne akan membutuhken dua macam aplikasi, yakni HTML editor untuk membuat halaman HTML tersebut, dan browser untuk melihat dan menampilken hasilnya.

Ohhh... cuma itu toh bedanya nduk, pakne jadi lega sekarang... sebab pakne tadi sempat mengira bahwa perbedaannya yang akan koe kemukakan jauh lebih rumit dan jauh lebih sulit serta jauh lebih jauh, pokoknya jauh deh nduk.

Contohnya pakne?

Contohnya.... misalnya kalo saat membuat dokument biasa kita bisa membuatnya sambil duduk, sedangken saat membuat halaman HTML ini maka kita diharuskan untuk berdiri dengan satu kaki. Atau... misalnya saat membuat dokumen biasa kita bisa sambil meilihat monitor, sedangken saat membuat halaman HTML kita diharusken untuk membelakangi layar monitor, atau misalnya.... pokoknya yang aneh-aneh begitulah nduk...

Ooohh.. kalo itusih, emang pikiran pakne saja yang suka aneh-aneh. Lha.. wong pakne ini sendiri saja sudah aneh, apalagi pikirannya... yo makin aneh. Dan anehnya... saya juga jadi ikut-ikutan aneh. Dan yang lebih anehnya lagi nih pakne ya, saya koq menikmati keanehan-keanehan ini, anehkan pakne?

Iyo nduk... mungkin sudah nasib kita untuk menjadi orang-orang yang suka beraneh-aneh. Yo.. sudah... kita singkirken dulu pembicaraan mengenai hal-hal aneh, sekarang lanjutin lagi cerita koe tadi. Oh... ya... nduk, sekalian pakne mo tanya, koe tadi bilang bahwa untuk membuat halaman HTML itu butuh dua software atau aplikasi, yaitu HTML editor dan browser, lalu pertanyaannya sekarang... HTML editor apa yang bisa dipake dan browsernya pake yang mane?

Pertanyaan yang bagus pakne, walau pertanyaan tadi sedikit aneh. Begini pakne, untuk HTML editor atau untuk membuat dan mengedit halaman HTML, pakne bisa menggunaken text editor apa saja. Pakne bisa menggunaken aplikasi text editor mulai dari yang paling sederhana misalnya notepad, sampe yang paling rumit misalnya Dreamwaever ataupun FrontPage. Sedangken untuk browser, pakne bisa menggunaken browser apa saja, misalnya Internet Explorer ataupun FireFox dari Mozilla.

Sebentar nduk... tadi koe bilang untuk membuat halaman web atau HTML itu bisa menggunaken program text editor yang sederhana seperti Notepad? Opo nanti ndak akan malah menyulitken nduk, opo ndak sebaiknya kita menggunaken HTML editor yang lebih canggih saja, misalnya seperti Frontpage dan Dreamweaver tadi?

Betul pakne, pertanyaan pakne tadi emang masuk akal dan tidak aneh bagi orang yang berpikiran normal, rasional, dan profesional. Namun, akan tetapi, however pakne, tujuan kita disini kan untuk membiasaken diri mengenal dan menulisken kode-kode atau tag-tag HTML, nah.. jikalau... seandeinya... umpama... andeikata... saat ini pakne menggunaken HTML editor yang canggih, memang pekerjaan pakne akan lebih mudah dan cepat, namun ada satu kekurangan yang akan pakne dapatken.

Opo itu nduk?

HTML editor yang canggih seperti Frontpage dan Dreamwaever itu pakne, biasanya akan menyembunyiken kode-kode atau tag-tag HTML saat pakne sedang membuat sebuah halaman HTML. HTML editor yang canggih itu hanya akan menampilkan text-text atau komponen-komponen yang bisa pakne lihat di browser saja, sedangken tag-tag ataupun kode-kode nya akan disembunyiken dari penglihatan pakne.

Sedangken tujuan kita disini kan untuk mengenal dan membiasaken diri dengan tag-tag tersebut, bagaimana kita akan terbiasa dan hapal dengan tag-tag itu kalau kita tidak terbiasa menuliskennya sendiri? Betul ndak pakne?

Betul juga koe nduk! Tapi nduk, HTML editor seperti Frontpage atau Dreamwaever itukan juga menyediaken tampilan untuk melihat kode-kode HTML, jadi kita tetep bisa melihat kode-kode HTML dari halaman yang sedang kita buat?

Betul pakne, nah... kali ini pertanyaan pakne tidak aneh. HTML editor seperti Frontpage atau Dreamwaever bukan hanya menyediaken tampilan Design saja, tapi juga menyediaken layar yang menampilken kode-kode HTML nya. Itu artinya, editor seperti Frontpage dan Dreamwaever ini tetep bisa kita gunaken untuk berlatih menghapal dan membiasaken diri mengetik kode-kode HTML.

Yang perlu pakne perhatiken disini adalah bahwa kita ingin menghilangken ketergantungan akan editor-editor HTML yang canggih tersebut. Kita kan ndak tahu, apakah kita akan selalu menemuken program-program tersebut di komputer yang sedang kita gunaken. Misalnya saat kita sedang merental di warnet, nah... kan belum tentu komputer di warnet itu menyediaken program-program yang biasa kita gunaken tersebut.

Tapi kalo sekedar text editor seperti Notepad, rasanya setiap komputer yang menggunaken sistem operasi berbasis windows, pasti juga menyediaken software notepad ini. Sebab opo pakne, sebab notepad sudah menjadi salah satu assesoris dari sistem operasi windows. Pakne bisa menemuken dan membuka program ini dimanapun pakne nanti akan membuat halaman HTML atau web page, pakne mengerti maksudku bukan?

Berlatih Membuat Web Page

Nah pakne, dan pengunjung blog nye pakne segale-gale semuenye... berarti saat ini kita sudah siap untuk berlatih membuat halaman web kita yang pertama atau mungkin yang kesekian kalinya jika memang kalian semua pernah membuat halaman web sebelumnya.

Menurut ebook yang sedang kita bahas ini, untuk mulai membuat web page ini pakne dan pengunjung segale-gale semuenye, ada beberapa tahap yang harus dilakuken, yaitu:

  1. Merencanaken design atau mendesign bentuk halaman yang akan dibuat.
  2. Mengkombinasiken HTML dengan text dalam sebuah text editor untuk membentuk design yang sudah kita buat tadi.
  3. Menyimpan halaman atau file yang dibuat tadi.
  4. Melihat atau menampilken halaman yang kita buat tadi di web browser.

Langkah 1: Mendesign Halaman Web

Nah... pakne dan pengunjung segale-gale semuenye.. sebelum kite menulisken kode-kode HTML, text atau element-element lain yang ingin kita tambahken ke halaman web, akan lebih jika terlebih dulu kita mendesign atau merencanaken kira-kira akan seperti apa layout atau bentuk dari halaman web tersebut.

Karena disini kita akan membuat halaman web atau web page yang sederhana saja, maka saat ini kita ndak perlu memikirkan atau merencanaken sebuah design yang rumit-rumit dulu, kita cukup membuat desig yang sederhana saja, seperti yang dicontohken dalam ebook tersebut. Berikut ini design halaman web yang akan kita buat:

Contoh design halaman web yang akan kite buat ini pakne, memang sederhana. Halaman web ini hanya mempunyai beberapa element saja, yaitu:

  • Tittle atau judul.
  • Body atau isi yang terdiri dari satu atau beberape paragraph, dan
  • Penutup
  • Signature atau tanda tangan.

Halaman web ini mempunyai background atau latar belakang berwarna putih dengan text atau huruf berwarna hitam. Nah... pakne dan pengunjung segale-gale semuenye, pertama kita akan membuat judul atau title, carilah judul yang di inginken, terserah, bebas, suka-suka elo pade. Gimane? Sude dapet judulnye? Bagus! Berarti ente pade sudah siap untuk langkah selanjutnye.

Langkah 2: Menuliskan HTML

Untuk mulai membuat halaman HTML ini, ente pade semuenye punye due pilihan untuk melakukennye. Pilihan pertame yaitu dengan care membuat text atau isi dari halaman itu dulu, baru kemudian menambahken kode-kode HTML nye. Kalau ente semue pade sudah punya file text yang ingin dijadiken halaman HTML, ente semue pade bise membuke file text tersebut dan tinggal menambahken kode-kode HTML nye.

Sedangken untuk pilihan kedue, yaitu kebalikannye. Ente semue pade menulisaken terlebih dahulu kode-kode HTML nya, kemudian baru menyisipken text kedalam kode-kode tersebut. Mau pilih yang mane, itu terserah ente-ente pade, suke-suke elu pade.

Sebentar nduk, koq gaya bicara mu jadi berubah? Dan kalo pakne perhatiken, itu memang sudah menjadi kebiasaan elu. Bukan apa-apa nduk, pakne ini cuma khawatir, opo nanti pembaca ndak jadi bingung dan heran.

Wah.. ndak tahu ya pakne, emang sudah kebiasaan neh, mood nya suka berubah-ubah, banyak yang bilang saya ini punya kepribadian ganda. Tapi anehnya pakne, saya koq malah menikmatinya. Lagian, saya menulis biasanya berdasarken mood, jadi ya terserah si mood, kemana dia akan membawa. Semoga hal ini ndak terlalu jadi masalah buat pakne dan pengunjung segale-gale semuenye.

Oke deh nduk, terserah elo saje!

Nah.. gitu dong pakne. Oke deh... kita lanjutken lagi. Seperti yang dijelasken diatas, saat ingin membuat halaman HTML kita mempunyai dua pilihan cara. Tapi untuk saat ini dan juga dari contoh yang terdapat dalam ebook, kita akan menggunaken cara yang pertama, yaitu kita siapken dulu text atau isi dari halaman web yang akan dibuat.

Text ini bisa kita buat dengan program word processor seperti MS Word, lalu simpan file tersebut dalam format file text atau txt. Untuk melakuken ini, pakne tinggal melakukan Save As dan pilih TXT pada menu file type di MS Word.

Sebentar nduk, kalo pakne lihat dari beberapa pilihan yang terdapat dalam Save as type dari MS Word ini, disitu juga terdapat pilihan untuk menyimpan halaman atau dokumen yang kita buat di MS Word kedalam tipe file HTML. Berarti kita juga bisa membuat halaman HTML atau web page menggunaken MS Word ini, betul begitu nduk?

Betul pakne, MS Word memang menyediaken fasilitas untuk menconversi file Doc menjadi HTML. Dan pakne juga pengunjung segale-gale semuenye, bisa menggunaken MS Word untuk membuat halaman Web atau Web Page. Tapi ada satu hal yang tidak aku sukai dari cara ini pakne dan pengunjung segale-gale semuenye.

Jika kita menggunaken MS Word atau program pengolah kata lainnya, program-program pengolah kata seperti MS Word ini biasanya juga menyimpan atau menambahken informasi-informasi yang belum tentu atau bahkan terkadang tidak diperlukan sama sekali dalam file HTML yang kita buat.

Emang nya kenopo nduk? Emang ada yang salah jika program-progam itu menyimpan informasi-informasi tersebut?

Ini bukan soal salah ndak salah pakne, ini soal efisien dan ndak efisien. Pakne kan tahu, masalah kecepatan saat membuka suatu halaman yang ada di internet itu sangatlah penting untuk dipikirken. Bukan ndak mungkin banyak pengunjung yang lari atau malas mengunjungi suatu blog ataupun situs karena blog atau situs tersebut terlalu lama saat ingin ditampilken di browser.

Nah.. salah satu penyebab lamanya suatu blog ataupun situs saat ingin ditampilken di browser adalah karena file atau HTML ataupun design situs tersebut terlalu banyak mengandung komponen-komponen ataupun informasi-informasi yang belum tentu dibutuhken oleh pengunjung tersebut

Nah pakne dan pengunjung segale-gale, dalam rangka efisiensi dan minimalitasisme inilah, aku ndak suka menggunaken MS Word atau program sejenis untuk membuat halaman HTML. Ntar deh, kalo pakne sudah sering melihat dan membandingken kode-kode HTML dari banyak web page yang ada diinternet, pakne dan pengunjung segale-gale akan mengerti mengenai hal ini.

Kembali ke pembahasan kita tadi pakne, dari ebook itu kita bisa melihat listing source code dari halaman HTML yang ingin kita buat. Kita tinggal menyisipkan setiap komponen text kedalam kode atau tag yang sesuai.

Langkah 3: Menyimpan File

Tentu saja jika pakne dan pengunjung segale-gale tidak ingin hasil kerjanya hilang begitu saja ditelan kegelapan malam, pakne dan para pengunjung segale-gale harus menyimpan file atau halaman HTML yang baru di buat tadi. Berilah nama dan tentukan dimana lokasi file tersebut akan disimpen.

Sebentar lagi nduk, pakne sering memilhat ada file yang berekstensi atau berakhiran .htm, dan pakne juga sering menemuken file dengan akhiran .html, opo beda kedua ekstensi atau akhiran ini nduk?

Ah.. pakne pura-pura nggak tahu, dari ebook itu kan sudah dijelasken, bahwa kedua ekstensi itu sebenarnya sama saja. Ekstensi .htm dan .html itu sebenarnya sama saja. Ekstensi .htm itu pakne, ceritanya karena dulu, waktu jamannya masih menggunaken sistem operasi yang berbasis DOS, yang mana daripada sistem operasi ini hanya bisa menggunaken 8 karakter saja untuk penamaan file, dan hanya menyediaken 3 huruf untuk ekstensinya.

Tapi sekarang kan tidak. Kita bisa menggunaken banyak karakter untuk memberi nama sebuah file. Begitu juga dengan ekstensinya, kita tidak lagi harus menggunaken 3 karakter saja. Nah.. semenjak itulah ekstensi HTML mulai digunaken. Jadi pakne dan pengunjung segale-gale ndak perlu mengkhawatirken masalah ekstensi ini. Tapi untuk enaknya, gunaken ekstensi HTML saja ya.

Langkah 4: Menampilkan HTML

Oke... setelah file HTML tadi kita simpan, sekarang saatnya untuk melihat dan mereview hasil perbuatan kita. Untuk melakukan ini, kita memerluken web browser. Dan browser yang biasanya ada di komputer kita adalah Internet Explorer atau IE, so.. buka IE nya sekarang.

Untuk membuka dan menampilken file HTML yang sudah kita buat tadi di IE, bisa kita lakuken dengan cara mengakses meny File > Open. Lalu pada klik tombol Browse pada kotak dialog yang ditampilken.

Lalu arahken ke lokasi dimana file HTML tadi kita simpan dan klik tombol Open pada kotak dialog untuk membuka file. Jika semuanya sesuai dengan rencana, maka IE akan menampilkan file HTML yang pakne dan pengunjung segale-gale buat tadi. Saat itu, berarti kita sudah menyeleseiken misi kita untuk mendesign, menulisken, menyimpen, dan menampilken sebuah web page.

Nah... pakne, sampai disini kita sudahi saja cerita ini. Di chapter 2 pada ebook tersebut memang masih ada beberapa bagian lagi selain yang bagian yang kita bicaraken disini, bagian atau section tersebut yang tentang bagaimana mengedit dan mengonline kan file HTML yang kita buat.

Aku rasa hal itu bisa pakne dan pengunjung segale-gale pelajari sendiri melalui ebook tersebut. Tentu saja itu jika sampeyan-sampeyan sudah mendownload ebook tersebut, jika belum, buruan gih.

Oke pakne dan pengunjung segale-gale semuenye, di artikel mendatang kite akan membahas chapter 3 dari ebook itu, yaitu tentang???? Ssssttt.... ini rahasia lho.