Minggu, 13 November 2011

Contoh Web Editor


Software pada kategori ini hanya bertugas untuk mengolah skrip HTML, CSS, PHP, atau JavaScript yang hanya terdiri dari teks. Jadi sebenarnya gak perlu software berat yang ribet-ribet amat. Hanya dengan Notepad bawaan Windows sebenarnya sudah bisa, tapi menggunakan aplikasi yang bukan dibuat untuk web editor tentu ada kekurangannya.
Dalam suatu file teks bisa saja terdapat berbagai skrip pemrograman web. Maka diperlukan sebuah web editor yang cerdas yang dapat membantu Anda membedakannya. Cara umum yang digunakan web editor adalah dengan memberikan warna yang berbeda pada masing-masing bahasa pemrograman juga perintah-perintahnya.
Salah satu web editor populer adalah Adobe Dreamweaver (dulu bernama Macromedia Dreamweaver). Web editor ini juga menggunakan sistem WYSIWYG (What You See Is What You Get). Jadi desain web yang Anda lihat pada Adobe Dreamweaver itulah yang akan Anda lihat pada browser. Selain fitur membedakan warna (syntax coloring) terdapat juga berbagai fasilitas lain yang banyak membantu seorang web designer.
Kalau mau cari yang gratisan tapi hebat maka pilihan saya jatuh kepada notepad++. Berbagai macam bahasa pemrograman juga didukungnya, kira-kira ada 48 bahasa pemrograman. Kekurangannya adalah Notepad++ bukan web editor WYSIWYG. Jadi Anda hanya akan melihat skrip yang berisi kumpulan sintaks pemrograman tanpa melihat tampilan aslinya sedikitpun. Oleh sebab itu biasanya Notepad++ jarang digunakan oleh web designer pemula karena lebih ditujukan bagi mereka yang suka coding secara murni. Jadi mau pilih Adobe Dreamweaver atau Notepad++

Pemahaman Web Designer

Desainer Web atau Web Designer adalah orang yang mempunyai keahlian menciptakan konten presentasi (biasanya hypertext atau hypermedia) yang dikirimkan ke pengguna-akhir melalui World Wide Web, melalui Web browser atau perangkat lunak Web-enabled lain seperti televisi internet, Microblogging, pembaca RSS.
Halaman Web dan situs Web dapat halaman statis, atau dapat diprogram untuk halaman dinamis yang secara otomatis mengadaptasi konten atau tampilan visual tergantung pada berbagai faktor, seperti masukan dari pengguna akhir, masukan dari para Webmaster atau perubahan dalam lingkungan komputasi (seperti situs yang terkait dengan database yang telah diubah).
Tugas seorang Desainer Web secara umum adalah menentukan ? look and feel? dari sebuah situs Web. Secara langsung atau tidak, kita harus menguasai dan memahami hal-hal yang berkaitan dengan tampilan dari sebuah situs Web. Seorang desainer Web harus pula memahami penerapan aspek-aspek yang terdapat di dalam desain Web, walaupuan tidak menguasai. Seperti halnya Java Script, kita tidak wajib mengetahui dan mampu membuat Java Script sendiri untuk kebutuhan desain, namun bagaimana dan estetika penerapan Java Script pada desain akan sangat menguntungkan bila kita memahaminya.
Dalam membuat Web, seorang desainer Web menentukan aspek-aspek desain yang diperlukan seperti pemilihan Font, warna, tataletak, dan lainnya. Tugas seorang desainer Web tidaklah semudah yang dibayangkan, penguasaan software-software grafis dan animasi dan HTML authoring saja tidak cukup untuk membuat situs Web yang baik. Banyak hal yang harus menjadi pertimbangan, terlebih bila dihadapkan dengan keinginan Klien, kita akan dihadapkan dengan kepuasan klien. Terkadang idealisme kita sebagai desainer Web akan kalah dengan idealisme klien.

Tujuan Perancangan Web



Desain   website adalah langkah awal sebelum melakukan  pembuatan website. Langkah desain   Web ini diawali dari tujuan pembuatan  website, diantaranya :

  • Sarana presentasi profil perusahaan yang bisa   diakses di seluruh Indonesia dan dunia.
  • Sarana promosi produk dan jasa.
  • Media Komunikasi antar individu dan saling bertukar informasi misalnya jejaring sosial.
  • Media expresi pribadi maupun kelompok.
  • Menyediakan sarana penyebar ilmu pengetahuan.
  • Tempat untuk belajar baik dengan interaktif langsung maupun forum.   
  • Sarana berbagi file baik berupa program maupun data.
  • Sebagai alat transaksi online sehingga memudahkan melakukan transaksi dimana saja dan   kapan saja.

Memahami Maksud Klien dalam Merancang Web



1. Tujuan Dari Bisnis
Hampir setiap bisnis yang dijalankan klien memiliki Visi dan Misi. Memahami dasar dari mengapa bisnis klien kita exist sangatlah penting jika kita ingin merancang sebuah situs web yang benar-benar mencerminkan bisnis kilen yang efektif bagi para pengunjungnya.

2. Spesifikasi Produk dan Layanan Klien
Setelah kita paham dan mengerti dasar bisnis klien, selanjutnya hal penting yang harus kita tau adalah apa yang ditawarkan klien kita kepada pelanggannya sehingga klien kita mendapatkan income dari bisnisnya. Apapun jenis website yang akan kita buat baik e-commerce atau macam-macam website yang lainnya, sangat penting untuk mengetahui apa yang klien kita tawarkan kepada pengunjung website.

3. Demografi Klien dan Pelanggan Klien Kita
Dapatkan informasi tentang demografi bisnis klien dan pelanggannya sebanyak-banyaknya, seperti informasi tentang usia, jenis kelamin, pekerjaan, pendapatan dari klien akan benar-benar membantu kita dalam menentukan gaya design dari website

4. Budaya Perusahaan
Website yang baik adalah website yang mencerminkan bisnis. Dengan demikian untuk dapat membuat website yang baik, kita harus memahami budaya dari perusahaan. Kita bisa memahami hal itu dengan cara beberapa kali berkunjung ke perusahaan dan melakukan observasi jika memungkinkan, atau melihat materi-materi bisnis yang ada seperti brosur, business card atau iklan-iklan klien kita.

5. Menentukan EstimasiProyek
Sebagai seorang desainer, tentunya penting bagi kita untuk membuat estimasi yang baik dengan desain yang akan dibuat, kita harus bisa mencerminkan bisnis klien dan memposisikan area-area yang memudahkan para pengunjung dalam mendapatkan informasi perusahaan. Sehingga proyek kita baru dikatakan sukses apabila tingkat penjualan klien kita meningkat

Tips Membuat CSS

1. Memberi Jarak yang Tepat
Berilah jarak indentasi saat menuliskan properti CSS, pisahkan antara properti CSS yang satu dengan yang lainya bila memang propertinya banyak. Pemberian jarak akan membuat kode CSS terorganisasi dengan baik sehingga mudah untuk menemukan properti yang kita cari. Bayangkan bila menuliskan CSS seperti sebuah paragraph cerita pendek dan memiliki 500 baris kode tentu mata kita akan tegang dan pusing saat menelusuri kode.


2. Penulisan Kode Secara Singkat
penulisan yang pendek akan mempercepat proses penulisan kode, selain itu juga akan mempercepat tingkat cluster dalam css sehingga bisa lebih cepat juga di render oleh browser.


3. Lakukan CSS Dengan Benar
Anda tidak boleh membuat file CSS sebelum anda selesai melakukan markup terhadap HTML anda. Buatlah dulu keseluruhan markup di HTML mulai dari kepala sampai kaki. CSS tidak bernilai sama sekali tanpa format Dokumen HTML yang baik.


4. Membuat Comment
membuat comment di setiap bagian pengerjaan adalah hal yang baik untuk membuat penulisan kita tetap bersih dan terorganisir dengan baik. ini juga membantu anda untuk mempermudah penelusuran kode.


5. Menulis Secara Terstruktur
sepertihalnya menggambar manusia anda akan menggambar kepalanya dahulu sebelum menggambar kaki, begitu juga dalam menuliskan kode sebaiknya anda mulai dari kepala HTML (header) terstruktur hingga bagian kaki (Footer). Penulisan kode secara tidak terstruktur akan memusingkan anda sendiri.


6. Hapus Kode Tak Terpakai
Mungkin saat menuliskan kode banyak atribut Class dan ID yang tidak jadi dipakai, buanglah segera semua atribut class dan ID yang tidak terpakai atau pisahkan dalam file referensi yang berbeda. Apabila anda belakangan ingin merubah CSS anda, anda tidak akan di pusingkan dengan banyaknya atribut class dan ID yang sudah tidak digunakan

Pemahaman HTML



HTML adalah sebuah bahasa markup yang digunakan untuk membuat sebuah halaman web dan menampilkan berbagai informasi di dalam sebuah browser Internet. Bermula dari sebuah bahasa yang sebelumnya banyak digunakan di dunia penerbitan dan percetakan yang disebut dengan SGML (Standard Generalized Markup Language), HTML adalah sebuah standar yang digunakan secara luas untuk menampilkan halaman web. HTML saat ini merupakan standar Internet yang didefinisikan dan dikendalikan penggunaannya oleh World Wide Web Consortium (W3C).

HTML berupa kode-kode tag yang menginstruksikan browser untuk menghasilkan tampilan sesuai dengan yang diinginkan. Sebuah file yang merupakan file HTML dapat dibuka dengan menggunakan browser web seperti Mozilla Firefox, Microsoft Internet Explorer, Google chrome dan beberapa browser lain.




Kode HTML,dalam setiap kodenya di awali dengan tanda <> dan di akhiri dengan </>

Contoh:
<html> merupakan penandaan bahwa halaman HTML di mulai

</html> merupakan tanda bahwa halaman html ditutup

<Head> ini adalah awal kepala

</Head> ini artinya merupakan akhir bagian kepala

<Title> menujukkan judul yang akan keluar pada Bar atas yang ditutup dengan </title>

<center> ini awal agar text berada di tengah

</center> ini merupakan akhir bagian dari membuat text rata tengah tersebut

<body> isi dari halaman tesebut,seperti contoh HTML diatas,isinya berupa kata "MY FIRST WEB"
yang ditutup dengan akhir isi halaman,yaitu </body>

Sedangkan tanda <p> yaitu pembentukan alinea baru,seperti halnya anda menekan Enter pada Microsoft Word untuk membentuk kursor baru pada alinea baru,yang mana diakhiri pula dengan tanda </p>
Untuk membentuk alinea baru bisa juga menggunakan kode <br> dan diakhiri dengan </br>

Pengertian CSS



 CSS adalah singkatan dari Cascending Style Sheet, digunakan untuk mengatur style atau tampilan dari dokumen HTML. CSS ini bersifat embeded pada tag HTML yang artinya menempel atau melekat pada tag HTML. Sebagai Contoh embeded seperti di bawah ini <h1 class=”header”>Pengantar</h1>.

Dengan CSS ini, kita bisa mengontrol/mengatur seluruh tampilan halaman web dengan hanya sebuah dokument CSS, biasan ekstensi untuk file CSS adalah .css (dot css).

Selain itu, CSS juga dapat menggantikan fungsi tabel dan dapat meminimalkan ukuran file HTML. Bayangkan jika Anda membuat sebuah kotak dengan tabel dan CSS jauh lebih efesien. Terdapat tiga jenis CSS yaitu : 
- Inline CSS
- Internal CSS
- External CSS



CSS merupakan alternatif bahasa pemrograman web masa yang akan datang, dimana mempunyai banyak keuntungan, diantaranya :
- Ukuran file lebih kecil
- Load file lebih cepat
- Dapat berkolaborasi dengan JavaScript
- Pasangan setia XHTML
- Menghemat pekerjaan tentunya, dimana hanya membuat 1 halaman CSS.
- Mudah mengganti-ganti tampilan dengan hanya merubah file CSS nya saja.
- Dan banyak lagi yang lainnya