Scribd Logo
Upload

Welcome to Scribd!

  • Mengelola Isi Halaman Web

    Uploaded by

    Tria Inventa
    911 views15 pages

    Copyright

    © Attribution Non-Commercial (BY-NC)

    Available Formats

    DOCX, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document

    Copyright:

    Attribution Non-Commercial (BY-NC)
    Download as DOCX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    911 views15 pages

    Mengelola Isi Halaman Web

    Uploaded by

    Tria Inventa

    Copyright:

    Attribution Non-Commercial (BY-NC)
    Download as DOCX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    of 15

    Memeriksa informasi untuk relevansi dan currency

    Software Web Design Software web design nmerupakan perangkat lunak yang berguna untuk membangun / membuat / mendisain halaman - halaman web, baik yang bersifat statis maupun dinamis. Software web design terpopuler yang ada saat ini antara lain: 1. Adobe Image Ready, 2. Macromedia Dreamweaver 3. Macromedia Fireworks, 4. Microsoft Frontpage 5. Dan lain sebagainya. Mengenal Macromedia Dreamweaver MX Macromedia Dreamweaver yang merupakan salah satu softwarewebdesignterpopuler dipilih sebagai softwarewebdesignyang akan digunakan dalam proses pemelajaran ini Macromedia Dreamweaver dipilih karena kompatibilitas dan dukungannya terhadap berbagai bahasa pemrograman web, antara lain : 1. ASP 2. JSP 3. CFM 4. ASP 5. NET 6. PHP 7. JavaScript 8. CSS dan XML Window Dreamweaver MX ini dibagi menjadi 7 bagian, yaitu : 1.Insert Bar, 2.Document Toolbar, 3.Document Window, 4.Panel Groups, 5.Tag Selector 6.Property Inspector

    7.Files Panel

    HTML HTML yang merupakan kepanjangan dari Hyper Text MarkUp Languagememiliki fungsi untuk memformat dokumen teks biasa agar bisa digunakan pada World Wide Web (WWW). HTML bukan merupakan suatu bahasa pemrograman, karena sifatnya yang hanya memberikan tanda (marking up) pada suatu dokumen teks dan bukan sebagai program

    Struktur dasar dokumen HTML berisi elemen-elemen atau tag, seperti pada gambar berikut : Keterangan : <html> </html> <head> </head> <title> </title> <body> </body> : mendefinisikan bahwa teks yang berada diantara kedua tag tersebut adalah file HTML. : mendefinisikan head dalam sebuah file HTML. : mendefinisikan judul yang hendak ditampilkan pada browser. : mendefinisikan teks beserta formatnya yang hendak ditampilkan sebagai isi halaman web.

    Format Teks Dasar dalam HTML: Heading, HTML mengenal 6 level heading, mulai 1 (terbesar) sampai 6. heading ditampilkan dengan font lebih besar dan tebal daripada teks normal Paragraf, setiap ada paragraf baru diawali dengan <p> List, HTML mendukung daftar (list) tidak bernomor, bernomor dan definisi Performatted Text, dalam HTML, spasi, tab dan baris baru (enter) tidak memiliki pengaruh Extended Quotations, untuk membuat kutipan panjang, sehingga hasilnya menjorok ke dalam, digunakan tag <blockquote>. Ganti baris (line break), untuk menulis alamat surat dengan baris-baris pendek, tidak bagus jika menggunakan tag <p>(spasi terlalu lebar) Garis datar (horizontal rule), untuk membuat garis horizontal yang digunakan untuk membatasi bagian-bagian digunakan tag <hr>. Memformat karakter, <b> atau <strong>untuk membuat teks Bold. <i> atau <em>untuk membuat teks Italic. <tt> atau <code>untuk membuat teks typewriter. Dasar Link HTML Hyperlink merupakan sesuatu yang sangat penting di website, sebab hyperlink akan menghubungkan antara satu halaman dengan halaman lainnya baik dalam satu website maupun antar website. Untuk membuat hyperlink digunakan tag <a>. Huruf a artinya "anchor". Tag <a> biasanya diikuti atribut "href" dimana nilai dari atribut ini merupakan alamat halaman yang akan dituju. Macam-macamlink 1. Relative dan Absolute Link, link ke suatu dokumen pada direktori lain dapat dibuat dengan menentukan relative path dari posisi dokumen asal berada. Ini disebut sebagai relative link a href=Harga/index.html>Daftar Harga</a> Alamat (URL) dokumen secara lengkap (absolute path) dapat digunakan untuk menentukan tujuan link, disebut link absolute : a href=http://gmail.google.com>E-mail Google</a> 2. Link ke suatu bagian di dokumen lain, misalnya : satu.html dilink ke suatu bagian di dua.html, caranya adalah Pada dokumen satu.html, dituliskan : <a href=dua.html#BT>Tiga</a> Pada bagian yang dituju, dituliskan :<a name=BT>Tiga</a> 3. Link ke suatu bagian di dokumen yang sama, caranya hampir sama dengan langkah di atas : Pada dokumen satu.html, dituliskan : <a href=#BT>Tiga</a>

    Pada bagian yang dituju, dituliskan :<a name=BT>Tiga</a> 4. Mailto, link yang langsung menuju ke alamat e-mail.<a href=mailto:saya@gmail.com?subject=Masuk ga?>Kirim E-mail</a> Menyisipkan Gambar Atribut ukuran gambar, bila tidak dituliskan, maka ukuran gambar sesuai ukuran aslinya. Namun ukuran gambar bisa dibuat dengan nilai tertentu dengan cara menuliskan atribut height dan width. Membuat Tabel Tabel merupakan cara untuk menampilkan informasi dalam bentuk sel yang terdiri dari kolom dan baris. Membuat Frame Frame HTML digunakan untuk membuat tampilan HTML yang terbagi menjadi beberapa bagian di mana setiap bagiannya merupakan satu halaman HTML yang terpisah. Membuat Form Form merupakan elemen HTML yang berupa blanko (form) yang dipergunakan untuk menjaring informasi dari pengguna Macam-macam form : Input, dengantipe: 1.Text, password, checkbox, radio button, reset, submitdanhidden. 2.Text area. 3.Select. Memperbaharui Halaman WEB Memperbaharui halaman situs web dengan sesuatu yang baru, dengan mempertimbangkan kebutuhan pengunjung dan situ sweb itu sendiri Untuk memperbaharui (update) halaman situ web yang perlu menjadi bahan pertimbangan sejak halaman web tersebut dirancang adalah kita harus memastikan agar elemen-elemenyang ada pada setiap halaman mudah untuk dirubah (edit). Memeriksa informasi untuk relevansi dan keterkinian Pada dasarnya dalam proses pembuatan situs web diperlukan kerja sama antara pihak pengembang dengan klien yang memesan situs web tersebut. Dalam menentukan content (contentawal, tambahan maupun revisi) pihak pengembang harus lebih banyak mendengar apa yang menjadi kebutuhan klien. Interaktivitas penggunan menjadi jantung sebuah situs web. Beberapa Gagasan yang disampaikan Tord Yard (programmer flash diWWW.EGO7.COM) tentang pentingnya menambahkan interaktivitas pada content halaman sebuah situs web: 1. Gunakan umpan balik grafik untukmenginformasikan penggunan tentang elemen interaktif, seperti status tombol yang bergulung

    2. Sertakan suara sebagai bentuk umpan balik tambahan agar content tidak terlihat membosankan 3. Pertimbangkan pemakaianan imasi untuk menerangkan elemen penting, atau untuk meminta keikut sertaan pengunjung Beberapa cara untuk memeriksa informasi content situs web untuk relevansi dan keterkinian, adalah sebagai berikut: 1. Sesuaikan content situs web dengan tujuan dan fungsi situs tersebut 2. Lakukan rise untuk mencari informasi terbaru yang sesuai dengan content situs 3. Content tambahan atau revisi juga bisa dengan meminta content tersebut kepihak klien baik berupa data tertulis maupun elektronik 4. Lakukan konfirmasi dalam menentukan batasan umur sebuah links, apakah akan dipertahankan atau dihapus 5. Pihak pengembang selaku pembuat situs web bila perlu merevisi content yang mungkin diperlukan dengan mengkonfirmasikan dahulu dengan pihak klien Memeriksa linksdan navigasi Link dan Navigasi adalah bagian yang terpenting dalam organisasi situs web karena keduanya sangat berpengaruh pada kenyamanan pengunjung situs web. Navigasi adalah gabungan dari struktur representasi informasi situs web dan mekanisme link yang mendukung pengunjung untuk melakukan penjelajahan situs. Kemudahan bernavigasi dalam situs web melibatkan system navigasi situs web secara keseluruhan dan desain interface situs web tersebut. Navigasi dapat ditampilkan dalam berbagai media, yaitu: 1. Teks, 2. Image 3. Animasi

    Syarat navigasi yang baik : 1. Mudahdipelajari 2. Tetapkonsisten 3. Memungkinkan feedback 4. Muncul dalam konteks 5. Menawarkan alternative lain 6. Memerlukan perhitungan waktu dan tindakan 7. Menyediakan pesanvisual yang jelas 8. Menggunakan label yang jelas dan mudah dipahami 9. Mendukung tujuan dan perilaku user 10. Beberapa hal yang perlu diperhatikan untuk membuat navigasi yang baik : 11. Rencanakan dengan benar sebelum membuat 12. Navigasi atau struktur situs web nantinya akan sulit diubah. Jadi sebelum membuat navigasi sebuah situs, tentukan konsepnya 13. Kelompokkan link navigasi dan aturlah sepeerlunya 14. Buat halaman dengan mock up navigasi elemen, jenis konten yang akan ada di setiap halaman dan prioritasnya. 15. Buatlah tampilan navigasi berbeda dari tampilan lainnya 16. Agar pengunjung lebih mudah mengenali bahwa bagian tersebut adalah navigasi 17. Buatlah navigasi yang singkat, tepat dan jelas 18. Buat navigasi yang logika susunannya mudah dipahami.

    Mengedit informasi sesuai kebutuhan


    Dreamweaver Dreamweaver merupakan piranti lunak yang sangat baik untuk membuat halaman web. Opsi-opsi dalam dreamweaver dirancang begitu detail, sehingga designer mahir bisa mengembangkan situsnya secara menyeluruh. Dreamweaver memungkinkan kita berpindah secara mudah antar design view dan code view, ini berarti kita bisa explore code HTML begitu selesai menata halaman dengan menggunakan tampilan antar muka (GUI). Semua tool yang diperlukan tersedia di bagian depan interface. Berikut adalah langkah-langkah untukproses pengeditan halaman web dengan menggunakan fasilitas dreamweaver: 1. Mengubah Objek menjadi Background 2. Memasukkan Obyek 3. Memperbaharui situs web yang bersifatstatis 4. Memperbaharui situs web melalui fasilitas admin (yang bersifat dinamis) Menguji dan memastikan perubahan-perubahan Pengujian yang dilakukan terhadap situs web tidak sama dengan pengujian sebuah program aplikasi walaupun situs web juga dapat dibuat dengan web programming. Secara umum, hal-hal yang harus diuji adalah sebagai berikut : 1. Code Quality 2. Compatibility 3. Navigasii 4. User Interaction 5. Usability and Accessbility 6. Scalability 7. Reliability 1.Code Quality Pengujia nterhadap code quality maksudnya adalah pengujian terhadap kualitas kode HTML yang digunakan untuk membangun halamanhalaman situs web. Yang termasuk kedalam kategori ini adalah sebagai berikut :

    a. ValidasiHTML b. ValidasiGambardanhurufyang digunakan 2.Compatibility Pengujian terhadap compatibility situs web maksudnya adalah pengujian yang dilakukan terhadap situs web tentang seberapa kompatibel dengan berbagai macam sistem operasi, browser dan hardware. Pengujian dengan sistem operasi akan membuktikan bagaimana kemampuan pada berbagai sistem operasi yang digunakan, misalnya Windows, Unix, OS/2, Macintos. 3.Navigasi Pengujian navigasi dilakukan untuk menguji kemampuan situs web dalam menyajikan link-link yang ada dalam seluruh halaman situs web. Pengujian ini dilakukan karena pentingnya aspek navigator dalam situs webYang termasuk pengujian untuk navigasi situs web adalah : a. link, b. frame, c. organisasisitus. 4.User Interaction Pengujian user interaction maksudnya adalah bahwa situs web diuji sejauh mana dapat berinteraksi dengan pengunjung yang mengunjungi situs web. Yang termasuk kedalam user interaction adalah: a. pengujianpadafasilitasform, b. validasiCGI script, c. validasiproses, d. interface, e. cookies, f. session g. dll 5. Usability and Accessbility Pengujian usability dan accesbility situs web adalah pengujian yang dilakukan terhadap situs web guna melihat sejauh mana situs dapat memenuhi keinginan pengunjung atau target pengguna situs web. Contoh pertanyaan berikut dapat digunakan untuk menguji tingkat usability dan accesbility situs web :

    1. Halaman web yang menggunakan script atau aplet haru stetap dapat ditampilkan pada browser yang tidak mendukung fungsi aplet dan script tersebut. 2. Jika menggunakan image maps, maka seharusnya halaman situs juga menyediakan link yang digunakan sebaga ialternatif 3. Situs web seharusnya juga dapat dipahami ketika dibuka menggunakan browser berbasis teks 6. Performance Pengujian terhadap performance atau performa situs web maksudnya adalah pengujian yang dilakukan terhadap situs web untu melihat sejauh mana kinerja situs web dalam berbagai keadaan. Contoh standar yang harus dimiliki oleh sebuah situs yang memiliki kinerja yang baik: 1. 95% halaman web dapat didownload kurang dari10 detik pada modem 28,8 kbps 2. Proses pemesanan dapat dilakukan dalam waktu 2 menit 3. Konfirmasi suatu transaksi dikirimkan pada user dalam30 detik 7. Scalability Pengujian scalability maksudnya adalah pengujian terhadap sejauh mana situs web/system yang dibangun dapat dikembangkan sebagai antisipasi terhadap perubahan teknologi dimasa yang mendatang. Evaluasi scalability dapat dilakukan dengan menguji sejauh mana situs web dalam: 1. Jumlah maksimal transaksi/detik yang masih dalam batas response-time-requirement 2. Jumlah rata-rata transaksi pada saat normal 3. Jumlah memori yang diperlukan untuk setiap transaksi 8. Reliability Pengujian reliability situs web maksudnya menguji sejauh mana situs web masih dapat melakukan tugasnya dalam kondisi yang berat. Yang termasuk kedalam pengujian ini adalah: 1. Low-resource testing: apakah aplikasi masih dapat berjalan pada reduced system resources. 2. Endurance testing : menguji tingkat stress system dalam waktu yang cukup lama 3. Volume testing : menguji unjuk kerja system dengan data yang besar 4. Peak testing : menguji system pada saat yang paling sibuk

    Mengakses Halaman Web Secara Cepat


    1. Perhatikan jam akses. Biasanya kecepatan akses computer Siang hari,kira-kira pukul 09.00s/d15.00, jalur komunikasi telepon sangat sibuk. Hal ini tentu saja akan sangat berpengaruh terhadap kecepatan akses dimana dalam satu jalur yang sempit, dimasuki oleh banyak data (bottleneck). Akan lebih baik jika mengakses internet pada malam hari atau bahkan dinihari, sewaktu banyak orang sedang beristirahat Disable auto load image. Untuk anda yang hanya ingin membaca berita atau sekedar menulis dan mengirim email, akan lebih bijaksana jika fasilitas Auto Load Image -atau Auto Load Multimedia untuk IE 4 -dinonaktifkan. Hal ini penting sebab bukan rahasia lagi bahwa yang paling domiman mempengaruhi lambatnya akses internet adalah banyaknya grafik (gambar) dalam suatu homepage. Perhatikan indikator. Terkadang suatu website akan tampak lama sekali untuk diakses. Ada dua sebab yang membuatnya demikian. Pertama, mungkin saja jalur komunikasi telah penuh sehingga menyebabkan antri data, atau data yang telah dikirim dan akan diterima "hilang" di tengah jalan. Solusinya, akan lebih baik jika anda menekan tombol "reload" (atau "refresh") agar data dimuat kembali. Buka beberapa jendela browser. Pada saat kita menunggu suatu website selesai dimuat seluruhnya, akan lebih bijaksana jika kita membuka jendela browser yang baru dan mengakses alamat website yang baru pula. Membuka satu per satu alamat website pada satu jendela browser adalah tidak bijaksana dan tidak efisien. Tutup jendela yang tidak perlu. Ini adalah kebalikan dari point di atas. Ada kalanya, kita terlalu bersemangat sehingga jendela browser yang kita buka sangat banyak, sehingga alamat web yang kita akses pun tak kalah banyaknya. Tentu saja hal ini sangat mempengaruhi kecepatan akses internet, karena banyaknya data yang harus dikirim dan diterima. Untuk itu, tutuplah jendela browser yang tidak perlu.

    2.

    3.

    4.

    5.

    Tips Menampilkan Tulisan di halaman Web Web seperti sebuah brosur atau resume dari pada laporan yang ditulis secara lengkap dan terperinci. Maka, untuk menampilkan tulisan pada halaman Web haruslah mudah dan cepat untuk discan dengan panduan hyperlink untuk mengarahkan pengunjung. Maka anda harus memiliki tujuan: Tulis karangan seperti sebuah piramid Tulislah hal-hal yang menjadi pokok pemikiran terlebih dahulu pada tulisan tersebut.

    Kurangi jumlah kataTulisan yang pendek dan tajam lebih mudah dibaca dari pada halaman yang panjang Gunakan satu pokok pikiran per paragrafIde yang terkubur dalam paragraf-paragraf yang banyak seringkali tidak dapat dicerna dengan baik. Gunakan bullet list, teks tebal, dan heading untuk menandakan bagian-bagian penting. Gunakan kata/title pada hyperlink yang mudah dimengerti Hyperlink harus mudah dimengerti dan memberikan gambaran seperti apa tujuan dari halaman setelah ia mengklik hyperlink tersebut. Hindari KekacauanHalaman Web yang penuh sesak dapat menciptakan kebisingan visual Kunci utamanya adalah pengunjung kurang sabara nuntuk membaca tiap baris pada tulisan Anda, jadi halaman web haruslah didesain untuk memberikan panduan kepada mata pengunjung menuju informasi yang terpenting dalam tulisan tersebut
    RANGKING Search Engine memiliki halaman web yang enak dipandang mata, belum tentu memberikan hasil yang baik pada search engine. Ada hal-hal yang harus anda perhatikan untuk optimasi ini. Anda perlu mengetahui bagaimana cara mengoptimalkan halaman web dengan tag-tag HTML khusus, dan hal-hal apa saja yang mempengaruhi rangking pada Search Engine. 1. Keyword pada domain name Jika Anda memiliki website yangberisi koleksi lagu-lagu mp3 atau jika situs anda menjual buku-buku alangkah baiknya jika menggunakan nama yang mengandung kata ebook. Cara ini masih terbilangefektif untuk saat ini. 2. Keyword pada nama file Misalnya Anda memiliki halamanweb yang berisi informasi mengenai cara promosi online,sebaiknya disimpan dengan nama promosi.html atau marketing.html, ini juga akan mempengaruhi rangking. 3. Keyword pada page title Tag <title> pada halaman HTML sangat penting untuk dioptimalkan. Usahakan agar title yang digunakan mengandung keyword yang relevan dengan isi halaman web. 4. Keyword pada headline

    Bagi Anda yang sudah menguasai HTML tentu mengenal tag <H1>,<H2>, dst. Tag headline sangat baik dipakai untuk judul sebuah paragraf, misalnya : <H1>TokoBuku Online</H1>. Headline sangat diperhitungkan oleh SearchEngine. 5. Keyword yang relevan pada meta tag Janganlah menggunakan keyword yang sama sekali tidak ada hubungannyadengan isi halaman web anda. Hal ini bisa dideteksi oleh search engine dan akan dianggap spamming 6. Keyword pada page content keyword yang diharapkan harus terdapat pada isi halaman web. Gunakan juga frase atau kata-kata lain yang berhubungan dengan keyword utama. 7. Meta tags Adalah tag-tag HTML khusus yang digunakan untuk menggambarkan keseluruhan dari isi web anda. Meta tag akan kita bahas secara khusus di bagian berikutnya 8. Link Popularity Adalah jumlah halaman web lain yangmemasang link ke web site anda. Beberapa search engine utama sangat memperhatikan hal ini. Semakin besar link popularity suatu web site, rangkingn ya akan semakin tinggi. Jika situs anda ingin muncul pada posisi atas di Google banyak-banyaklah bertukar link dengan web lain.

    Merancang Navigasi Website Navigasi pada sebuah website yang tertampil pada menu dan links adalah petunjuk bagipengunjungterhadaphalamanhalamanyangterdapatdalamwebsite.Pengunjungakansemakinmudahmenemukanhalaman-halamandalamwebsiteAndajikamenumenudanlinkyangadatampilsecaraterstruktur.Sudahpastipengunjungakankesalapabilatidakmendapatkanhalamanwebsiteyan acarigara-garanavigasiyangruwet.

    You might also like