Selasa, 19 Mei 2015

Cara memasukkan gambar, video, audio ke dalam HTML

0 komentar
1. Memasukkan gambar
Untuk memasukkan gambar kedalam HTML, kita menggunakan tag < img >. Atribut-atribut yang bisa kita gunakan adalah :
  • src untuk menunjukkan lokasi file gambar
  • align untuk menentukan posisi gambar
  • height untuk menentukan tinggi gambar dalam pixel ketika di tampilkan di browser
  • width untuk menentukan lebar gambar dalam pixel ketika di tampilkan di browser, apa bila tidak disebutkan atribut height dan width, maka ukuran gambar akan di tampilkan ke dalama browser dengan ukuran asli file nya
  • hspace untuk menentukan jarak antara gambar dengan text secara horizontal
  • vspace untuk menentukan jarak antara gambar dengan text secara vertikal
·         border untuk menentukan batas batas pada gambar.
Contoh :
<img src="gambar/arif.jpg" height="120" width="80">
2. Memasukkan Audio
Untuk memasukkan audio kedalam HTML, kita menggunakan tag < embed >. Atribut-atribut yang bisa kita gunakan adalah :
  • src digunakan untuk menentukan lokasi file music
  • align digunakan untuk menentukan posisi.
  • border digunakan untuk menentukan batas-batas.
  • height digunakan untuk menentukan tinggi dari object yang dimasukkan.
  • width digunakan untuk menentukan lebar dari object yang dimasukkan.
  • hspace digunakan untuk menentukan jarak horizontal antara object dengan text.
  • vspace digunakan untuk menentukan jarak vertikal antara object dengan text.
Contoh:
<html>
<head>
<title> Contoh memasukkan file audio </title>
<body>
<h2>
 Ini Contoh memasukkan file audio ke dalam dokumen HTML
<br>
<embed src = "mp3/01. Ada Apa Denganmu.mp3" border ="2" 
autostart="false" height = "45" width = "400"
align="middle"></embed>
</body>
</html>
Apa bila ingin menjadikannya bgsound (Suara latar belakang) dalam halaman web kita maka di gunakan tag < bgsound >
Contoh :
<html>
<head>
<title> Contoh memasukkan file audio sebagai background sound </title>
<bgsound src="pangandaran.mp3" loop="-1">
</head>
<body>
</body>
</html>
3. Memasukkan Video
Dan untuk memasukkan video ke dalam dokumen HTML, juga digunakan tag yang sama yaitu tag < embed > Penulisan kode HTML-nya juga menyerupai penulisan kode HTML untuk memasukkan file audio. Hanya saja bedanya di format file nya saja, misalnya jika
format audio: .mp3
format video: .mp4, .flv, .avi dll
Contoh :
<html>
<head>
<title> Contoh memasukkan file video </title>
</head>
<body>
<h3>
 Ini Contoh memasukkan file audio ke dalam dokumen HTML </h3>
<embed src = "video/Ek Pal Ka Jeena.mp4" border ="2" align="middle"
autostart="false" height = "180" width = "400"></embed>
</body>
</html>
</body>
</html>

Editor HTML

0 komentar
Berikut adalah 10 software text editor yang digunakan dalam pemrograman web :
1. Notepad
Notepad adalah editor asli bawaan dari windows/Microsoft. Bagi pengguna Operating System windows pasti sudah terbiasa melihat atau menggunakan applikasi ini. Biasanya untuk pemula direkomendasikan menggunakan notepad biasa ini. Karena notepad yang harus serba manual mengajarkan kita cara menghafal penempatan coding-coding.
2. Notepad ++
Notepad++ hampir sama dengan notepad biasa, namun fitur lebihnya adalah pewarnaan pada code-code tertentu sehingga akan sedikit memudahkan penggunanya.
3. Sublime-Text
Memiliki banyak fitur yang mempermudah penggunanya dan eye catching (tampilan menarik). Kekurangannya adalah software ini adalah software berbayar tidak gratis.
4. NetBeans
Cukup baik untuk coding web, namun tidak direkomendasikan untuk PC yang memory seadanya. Karena akan membuat process yang memakan memory cukup besar.
5. Adobe Dreamweaver
Editor yang paling sering saya gunakan, bisa multi-tab. Tampilan keren eye catching dan tidak terlalu memakan banyak memori PC anda. Kekurangan software ini adalah software berbayar.
6. Araneae
Merupakan teks editor yang digunakan untuk file html dengan syntax highlighting, panjang dokumen tidak terbatas, mendukung drag & drop gambar, instan browser preview, dapat membuka beberapa tab sekaligus, dan sudah support untuk berbagai bahasa.
7. Crimson Editor
Free text editor ini sementara dapat berfungsi sebagai pengganti yang baik untuk Notepad, CE juga menawarkan banyak fitur canggih untuk bahasa pemrograman seperti html, C/C + +, Perl, dan Java.
8. ATPad
ATPad adalah pengganti dari Notepad standar. Berikut fitur-fitur didalamnya: multi tab, tampilan editornya dapat disesuaikan, terdapat garis penomoran, recent documents, bookmark, reload on-demand, change tracking, reloading ininterval, serta portability.
9. EditPad Lite
Merupakan free text editor yang menyajikan banyak aspek di luar Windows Notepad. Jika Anda menggunakan sebuah text editor untuk hal-hal seperti HTML coding atau menulis script atau file batch maka EditPad bisa jadi opsi baru. Untuk fiturnya sebagai berikut:
- Multi tabs, kamu bisa membuka banyak tab sekaligus
- Tidak ada batasan untuk ukuran file atau panjang baris teks
- Memiliki kemampuan untuk mengedit Unicode, DOS, KO18, dan halaman kode EBCDIC
- Support untuk berbagai jenis bahasa
10. Google Web Designer
Baru-baru ini google juga meluncurkan text editor. Design yang keren dan fitur-fitur yang memanjakan penggunanya. Beberapa fitur tersebut diantaranya adalah fitur manipulasi 3D, ilustrasi tools, dsbnya.