Sabtu, 05 Maret 2011

3

Membuat tabel HTML

Dalam format html,Tabel didefinisikan dengan tag awal <table> dan tag akhir </table>. Secara dasar pada sebuah tabel terdapat beberapa elemen yaitu baris yang ditandai dengan tag <tr>, dan setiap baris atau tag <tr> terdiri atas sel-sel data yang ditandai dengan tag <td> singkatan dari "data tabel" . Didalam tag <td> inilah tempat meletakkan sebuah data atau dokumen seperti  teks, link, gambar, video, animasi, daftar, bentuk suatu bidang, dll, termasuk bisa diisi sebuah tabel itu sendiri, dengan kata lain tabel didalam tabel.

Secara keseluruhan, dalam pembuatan sebuah tabel, terdapat banyak unsur atau elemen tag, yang perlu diperhatikan sesuai dengan bentuk dan fungsinya masing-masing. Langsung saja silahkan perhatikan beberapa bentuk tabel dan perbedaan penulisannya dalam format html :

1. Tabel 1 kolom, dan 1 baris
<table width="500" border="1">
<tr>
<td scope="col">Tabel 1 kolom, dan 1 baris</td>
</tr>
</table>

Berikut hasilnya :

Tabel 1 kolom, dan 1 baris


2. Tabel 1 kolom, dan 2 baris
Untuk membuat tabel 2 baris dan seterusnya, kita tinggal menambahkan elemen tag <tr></tr>  diantara tag <table> </table>  yaitu :
<table width="500" border="1">
<tr>
<td>Tabel 1 kolom, dan baris pertama</td>
</tr>
<tr>
<td>Tabel 1 kolom, dan baris kedua</td>
</tr>
</table>

Berikut hasilnya :
Tabel 1 kolom, dan baris pertama
Tabel 1 kolom, dan baris kedua


3. Tabel 2 kolom, dan 1 baris

Untuk membuattabel 2 kolom dan seterusnya kita tinggal menambahkan elemen tag <td></td> diantara <tr></tr>  yaitu :
<table width="500" border="1">
<tr>
<td> Kolom Pertama</td>
<td>Kolom Kedua</td>
</tr>
</table>

Berikut hasilnya :
Kolom Pertama Kolom Kedua


4. Tabel 2 kolom dengan 2 baris
<table width="500" border="1">
<tr>
<td>Baris pertama dan Kolom Pertama</td>
<td>Baris pertama dan Kolom Kedua </td>
</tr>
<tr>
<td>Baris Kedua dan Kolom Pertama</td>
<td>Baris Kedua dan Kolom Kedua</td>
</tr>
</table>

Berikut hasilnya :
Baris pertama dan Kolom Pertama Baris pertama dan Kolom Kedua
Baris Kedua dan Kolom Pertama Baris Kedua dan Kolom Kedua



5. Tabel dengan garis tebal

Garis tebal ditentukan oleh Nilai border, semakin besar nilainya semakin Tebal garisnya dan terlihat seperti 3D (efek bevel)

<table width="500" border="5">
<tr>
<td><div align="center">Teks</div></td>
</tr>
</table>

Berikut hasilnya :
Teks


6. Tabel dengan garis berwarna
Untuk memberi  warna border kita tinggal menambah  “bordercolor

<table width="0" border="1" bordercolor="#3083FF">
<tr>
<td><div align="center">Teks</div></td>
</tr>
</table>

Berikut hasilnya :
Teks


7. Tabel dengan warna background sama

Untuk memberi warna Background dengan warna sama seluruh tabel kita tinggal menambah  “bgcolor “.
<table width="500" border="1" bgcolor="#00FF00">
<tr>
<td><div align="center">Teks</div></td>
<td><div align="center">Teks</div></td>
</tr>
</table>

Berikut hasilnya :
Teks
Teks


8. Tabel dengan warna beda
Untuk memberi warna Background dengan warna berbeda pada setiap kolomnya :

<table width="500" border="1">
<tr>
<td bgcolor="#D9F5FF"><div align="center">Teks</div></td>
<td bgcolor="#E1FACD"><div align="center">Teks</div></td>
</tr>
</table>

Berikut hasilnya :
Teks
Teks


9. Tabel dengan Judul

<table width="500" border="1">
<tr> <th colspan="100%" scope="col"bgcolor="#FFF7DB">JUDUL TABEL</th> </tr>
<tr>
<td bgcolor="#E4FADE"><div align="center"><strong>Judul Kolom 1</strong></div></td>
<td bgcolor="#EDFBFF"><div align="center"><strong>Judul Kolom 2</strong></div></td>
<td bgcolor="#FDF0FF"><div align="center"><strong>Judul Kolom 3</strong></div></td>
</tr>
<tr>
<td bgcolor="#E4FADE"><div align="center">Teks</div></td>
<td bgcolor="#EDFBFF"><div align="center">Teks</div></td>
<td bgcolor="#FDF0FF"><div align="center">Teks</div></td>
</tr>
<td bgcolor="#E4FADE"><div align="center">Teks</div></td>
<td bgcolor="#EDFBFF"><div align="center">Teks</div></td>
<td bgcolor="#FDF0FF"><div align="center">Teks</div></td>
</tr>
</table>

Berikut hasilnya :
JUDUL TABEL
Judul Kolom 1
Judul Kolom 2
Judul Kolom 3
Teks
Teks
Teks
Teks
Teks
Teks


10. Tabel header atau Judul
  • Judul diatas

<table border="1">
<tr>
  <th>Nama</th>
  <th>Alamat</th>
  <th>Telephone</th>
</tr>
<tr>
  <td>Siti Mariam</td>
  <td>Jogja</td>
  <td>555 77 855</td>
</tr>
</table>

Berikut hasilnya :



Nama Alamat Telephone
Siti Mariam Jogja 555 77 855



  • Judul disamping

<table border="1">
<tr>
  <th>Nama :</th>
  <td>Siti Mariam</td>
</tr>
<tr>
  <th>Alamat :</th>
  <td>Jogja</td>
</tr>
<tr>
  <th>Telephone :</th>
  <td>555 77 855</td>
</tr>
</table>

Berikut hasilnya :



Nama : Siti Mariam
Alamat : Jogja
Telephone : 555 77 855




11. Tabel Header dan keterangan



<table border="1">
  <caption>Pendapatan bulanan :</caption>
  <tr>
    <th>Bulan</th>
    <th>Hasil</th>
  </tr>
  <tr>
    <td>Januari</td>
    <td>Rp.4000.000,-</td>
  </tr>
  <tr>
    <td>Februari</td>
    <td>Rp.5000.000,-</td>
  </tr>
</table>

Berikut hasilnya :



Pendapatan bulanan :
Bulan Hasil
Januari Rp.4000.000,-
Februari Rp.5000.000,-




12. Tabel dengan sel-sel yang lebih dari satu baris / kolom
  • Sel yang mencakup dua kolom:Sel yang mencakup dua kolom:
<table border="1">
<tr>
  <th>Nama</th>
  <th colspan="2">Telephone</th>
</tr>
<tr>
  <td>Siti Mariam</td>
  <td>000 000 001</td>
  <td>000 000 002</td>
</tr>
</table>

Berikut hasilnya :


Nama Telephone
Siti Mariam 000 000 001 000 000 002
  • Sel yang mencakup dua baris:


<table border="1">
<tr>
  <th>Nama :</th>
  <td>Siti Mariam</td>
</tr>
<tr>
  <th rowspan="2">Telephone:</th>
  <td>000 000 001</td>
</tr>
<tr>
  <td>000 000 002</td>
</tr>
</table>

Berikut hasilnya :


Nama : Siti Mariam
Telephone: 000 000 001
000 000 002


13. Tag di dalam tabel 
Bagaimana menampilkan elemen-elemen di dalam unsur-unsur lain.

<table border="1"><tbody>
<tr>
<td>Hewan kesukaan :
<ul>
<li>Kucing</li>
<li>Burung</li>
<li>Kelinci</li>
<li>Kuda</li>
</ul>
</td>
<td>
<table border="1">
<tbody>
<tr>
<td>Gambar 1</td>
<td>Gambar 2</td>
</tr>
<tr>
<td>Gambar 3</td>
<td>Gambar 4</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td>Teks</td>
<td>Teks</td>
</tr>
</tbody>
</table>  

Berikut hasilnya :


Hewan kesukaan :

  • Kucing
  • Burung
  • Kelinci
  • Kuda


Gambar 1 Gambar 2
Gambar 3 Gambar 4
Teks Teks


14. Cell padding 
Cellpadding berfungsi agar teks atau gambar tidak terlalu dekat dengan garis pada tabel.


<table border="1"
cellpadding="10">
<tr>
  <td>Teks</td>
  <td>Teks</td>
</tr> 
<tr>
  <td>Teks</td>
  <td>Teks</td>
</tr>
</table>

Berikut hasilnya :


Teks Teks
Teks Teks


15. Cell jarak 
Cara menggunakan cellspacing untuk meningkatkan jarak antara sel.



<table border="1"
cellspacing="10">
<tr>
  <td>Teks</td>
  <td>Teks</td>
</tr> 
<tr>
  <td>Teks</td>
  <td>Teks</td>
</tr>
</table>

Berikut hasilnya :


Teks Teks
Teks Teks


OK....Selamat membaca artikel yang lain dan semoga bermanfaat....
Anda juga bisa berlangganan artikel-artikel terbaru dari saya, silahkan anda masukkan email pada forum Langganan Via Email yang ada disebelah kanan halaman ini.
Jangan lupa luangkan waktu untuk beri komentar ya......terima kasih.

Ping your blog, website, or RSS feed for Free




0

Penggunakan Atribut Hyperlinks

Hyperlinks atau link digunakan untuk mengarahkan pembaca menuju kesebuah dokumen baru, yang berada antar halaman maupun antara halaman web menuju halaman web yang lain. Biasanya link ditempatkan pada sebuah kata, kalimat, ataupun gambar. Ciri - ciri Hyperlinks yaitu bila pembaca mengarahkan kursor diatas sebuah kata, kalimat, ataupun gambar, maka kursor yang berbentuk panah akan berubah berbentuk gambar tangan.
HTML Link ditandai dengan tag awal <a> dan tag akhir </a> , dan tag ini biasanya diikuti oleh atribut href yang digunakan untuk mengarahkan link menuju ke dokumen lain.

1. Menempatkan Link pada teks
<a href="http://www.carabuatwebgratis.com/2011/03/cara-membuat-website-gratis.html">Cara membuat web gratis</a>

Berikut hasilnya :

2. Menempatkan Link pada Gambar
<a href="http://www.carabuatwebgratis.com/2011/03/penggunakan-atribut-hyperlinks.html"><img border="0" height="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgHQSJdEIxckiOgVOrjOlnIvI2laWDy6Usv4FxtOExDkytDbs56fINcL6fcsm5dahvmpemnxn37AhPapHBG6j7ufjpZloAUFd1CgJ39DuYQabkmg88k6EHGaSPtBaPR68Z6h8A3l-wkyqLj/s200/Link.jpg" width="200" /></a>

Berikut hasilnya :

3. Membuat Link agar terbuka pada tab atau jendela baru
<a href="http://www.carabuatwebgratis.com/2011/03/cara-membuat-website-gratis.html" target="_blank" > Cara membuat web gratis </a>

Berikut hasilnya :
Catatan : Tinggal menambahkan kode target="_blank" setelah ULR.

OK....Selamat membaca artikel yang lain dan semoga bermanfaat....
Anda juga bisa berlangganan artikel-artikel terbaru dari saya, silahkan anda masukkan email pada forum Langganan Via Email yang ada disebelah kanan halaman ini.

Jangan lupa luangkan waktu untuk beri komentar ya......terima kasih.

Ping your blog, website, or RSS feed for Free




Menggunakan Atribut Style pada Font

Atribut Style digunakan untuk menentukan gaya atau bentuk dan memberi fariasi pada font. Dengan Atribut Style, kita bisa merubah atau menentukan ukuran besar dan kecil pada font, memberi warna pada font, memberi background warna atau warna latar pada font, merubah bentuk atau jenis font, dan menentukan penempatan letak teks baik disebelah kiri, tengah, serta kanan.

Berikut penggunaan Atribut Style beserta contoh hasilnya :

1. Menentukan ukuran pada font
<span style="font-size: 20px;">Teks ini menggunakan ukuran font 20 px</span>

Berikut hasilnya :
Teks ini menggunakan ukuran font 20 px

2. Memberi warna pada font
<span style="color: #0b5394; font-size: 20px;">Teks ini menggunakan ukuran font 20 px, dan warna biru</span>

Berikut hasilnya :
Teks ini menggunakan ukuran font 20 px, dan warna biru

3. Memberi Warna latar pada font
<span style="color: #0b5394; font-size: large;"><span style="background-color: #cccccc;">Teks dengan background abu-abu</span></span>

Berikut hasilnya :
Teks dengan background abu-abu

4. Menentukan penempatan letak teks
<div style="text-align: left;">
<span style="color: #0b5394; font-size: large;">Teks berada disebelah kiri (align Left)</span></div>

Teks berada disebelah kiri (align Left)


<div style="text-align: center;">
<span style="color: #0b5394; font-size: large;">Teks berada disebelah kiri (align Center)</span></div>

Teks berada disebelah kiri (align Center)


<div style="text-align: right;">
<span style="color: #0b5394; font-size: large;">Teks berada disebelah kiri (align Right)</span></div>

Teks berada disebelah kiri (align Right)

5. Merubah bentuk atau jenis font
<span style="font-family: Algerian ;">
<span style="color: #0b5394; font-size: 20px;">Teks dengan bentuk font</span></span>
Berikut hasilnya :
Teks dengan bentuk font

Dibawah ini daftar nama - nama bentuk font, silahkan anda bida gunakan daftar dibawah ini untuk latihan :

Nama-nama Font
Agency FB

Algerian

Arial

Arial Rounded MT

Baskerville Old Face

Bauhaus 93

Bell MT

Berlin Sans FB

ArialBernard MT

Blackadder ITC

Bodoni MT

Bodoni MT Poster

Book Antiqua

Bookman Old Style

Bradley Hand ITC

Britannic

Broadway

Brush Script MT

Calibri

Century Gothic

Century Schoolbook

Chiller

Colonna MT

Comic Sans MS

Cooper

Copperplate Gothic

Courier

Curlz MT

Edwardian Script ITC

Elephant

Engravers MT

Eras ITC

Felix Titling

Fixedsys

Footlight MT

Forte

Franklin Gothic

Freestyle Script

French Script MT

Futura Md BT

Gabriola

Georgia

Gigi

Gill Sans

Gloucester MT

Goudy Old Style

Goudy Stout

Haettenschweiler

Harlow Solid

Harrington

High Tower Text

Impact

Informal Roman

Jokerman

Juice ITC

Kristen ITC

Kunstler Script

Latin

Lucida Calligraphy

Lucida Console

Lucida Handwriting

Lucida Sans

Magneto

Maiandra GD

Matura MT Script Capitals

Microsoft Sans Serif

Mistral

Modern

Modern No. 20

Monotype Corsiva

MS Sans Serif

MS Serif

Niagara Engraved

Niagara Solid

OCR-A BT

Old English Text MT

Onyx

Palace Script MT

Palatino Linotype

Papyrus

Playbill

Poor Richard

Pristina

Rage

Ravie

Rockwell

Roman

Script

Script MT

Segoe Print

Segoe Script

Segoe UI

Showcard Gothic

oooooooooooooo
Small Fonts

Snap ITC

Stencil

System

Tahoma

Tempus Sans ITC

Terminal

Times New Roman

Trebuchet MS

Tw Cen MT

Verdana

Viner Hand ITC

Vivaldi

Vladimir Script

OK....Selamat membaca artikel yang lain dan semoga bermanfaat....
Anda juga bisa berlangganan artikel-artikel terbaru dari saya, silahkan anda masukkan email pada forum Langganan Via Email yang ada disebelah kanan halaman ini.
Jangan lupa luangkan waktu untuk beri komentar ya......terima kasih.

Ping your blog, website, or RSS feed for Free




Jumat, 04 Maret 2011

Blockquote html

Blockquote ditandai dengan tag awal <blockquote> dan tag akhir </blockquote>. Tag ini berfungsi untuk menampilkan sebuah blok berisi teks atau kutipan teks, dan dengan tag ini browser akan menampilkan kutipan teks tersebut pada bagian sisi kanan dan sisi kiri lebih menjorok ke dalam dari pada teks yang lain.
Berikut ini cara penerapan blockquote :

<b>Blockquote html :</b>
<blockquote>
DISINI TEKS ANDA
</blockquote>

Silahkan anda perhatikan perbedaan antara kutipan teks yang menggunakan tag awal <blockquote> dan tag akhir </blockquote> dengan yang tidak mengunakan :

Blockquote :
Krupuk Rambak kami bukan hanya sekedar makanan sebagai camilan, Lebih dari itu Krupuk ini sangatlah cocok sebagai pendamping atau pelengkap makanan disaat anda makan, disaat anda nonton Tv, disaat anda berkumpul bersama keluarga, teman atau saat-saat yang lain.


Tanpa blockquote :
Krupuk Rambak kami bukan hanya sekedar makanan sebagai camilan, Lebih dari itu Krupuk ini sangatlah cocok sebagai pendamping atau pelengkap makanan disaat anda makan, disaat anda nonton Tv, disaat anda berkumpul bersama keluarga, teman atau saat-saat yang lain.


OK....Selamat membaca artikel yang lain dan semoga bermanfaat....
Anda juga bisa berlangganan artikel-artikel terbaru dari saya, silahkan anda masukkan email pada forum Langganan Via Email yang ada disebelah kanan halaman ini.

Jangan lupa luangkan waktu untuk beri komentar ya......terima kasih.

Ping your blog, website, or RSS feed for Free




Kamis, 03 Maret 2011

13

Cara Upload template blogger


Cara Upload template
Membuat website memang tidak sesulit yang kita bayangkan, sebab kita tak perlu lagi repot - repot membuat desain web atau template sendiri. Banyak pilihan template menarik yang bisa kita manfaatkan sebagai desain web atau blog kita.Kita tinggal pilih dan download template disitus-situs yang menyediakan template secara gratis. Bila anda ingin juga tertarik ingin menggunakan template gratis, silahkan anda bisa kunjungi di DISINI

OK..., sekarang kembali pada pokok masalah, yaitu bagaimana cara Upload template blogger. Sebelum kita upload template, yang perlu diperhatikan adalah ketika kita download, biasanya file yang kita terima  dengan  format ZIP. Silahkan buka folder ZIP tersebut dan copy file yang berformat XML DOCUMENT dan paste file tersebut diluar file ZIP. Setelah itu baru kita menuju ke blogger. Silahkan anda ikuti langkah-langkah berikut :

1. Login ke blogger dengan ID anda.
2. Klik Rancangan.
3. Dan KLik tab Edit HTML.
4. Silahkan  Upload file template dengan format XML DOCUMENT yang tadi sudah dipisah dengan file asli berformat ZIP.  Perhatikan gambar berikut :
5. Setelah  Template terupload, silahkan anda simpan Template.
6. Selesai.

Nah..., sekarang silahkan anda lihat web yang baru anda......
Selamat mencoba... dan semoga bermanfaat untuk anda semuanya....amiin.
Jangan lupa, silahkan anda tinggalkan komentar pada forum dibagian bawah.


Ping your blog, website, or RSS feed for Free




5

Cara membuat website gratis

Perkembangan teknologi informasi kini sudah berkembang sangat cepat, siapa yang tidak mengikutinya akan ketinggalan informasi. Jika kita menguasai atau paling tidak kita mengikuti informasi yang ada dimedia internet dan kita mampu memanfaatkannya dengan baik, bukan hal yang mustahil jika kita mendapat penghasilan yang tidak sedikit dari internet.

Perlu diketahui bahwa jumlah website kian hari kian bertambah, dan setiap website menjakankan peluang atau bisnisnya masing - masing, baik memasarkan produk sendiri maupun produk orang lain atau affiliate program. Dengan demikian dapat dipastikan bahwa didunia internet, sebuah website sangat diperlukan dan menjadi sesuatu yang sangat berperan sebagai media informasi, media pendidikan, jejaring sosial, bahkan sebagai media yang sangat menguntungkan untuk berbisnis.

Sebuah website menjadi media yang sangat menjanjikan sebagai peluang usaha didunia online. Dengan website, kita dapat menyebarkan informasi yang paling tidak masuk akal sekalipun, dan membuat ribuan orang percaya. Dengan cara membuat website, bisnis yang paling kecilpun dapat menjadi besar, asal bisa mengelola website tersebut.

Lalu bagaimana kita bisa mempunyai website sendiri ?
OK...,Untuk mempunyai website sendiri, ada banyak cara yang bisa kita lakukan, baik berbayar ataupun gratis :

1. Memesan pada penyedia jasa pembuatan website.
Dengan memesan pada penyedia jasa pembuatan website, kita tak perlu ribet dan tidak harus mengerti bahasa pemrograman, website langsung online. Dengan cara ini kita bisa langsung mulai menjalankan bisnis lewat internet. Tapi yang jelas cara ini berbayar.

2. Membeli Ebook panduan lengkap cara membuat website.
Bagi kita yang masih merasa pemula apalagi tidak mempunyai produk sendiri dan belum tahu dari mana saja sumber penghasilan yang ada di internet, cara ini sangat tepat.
Pembelajaran cara membuat website pada ebook ini sangat detail dan mudah dipahami secara menyeluruh hingga website kita menghasilkan. Selain itu pemilik produk menyediakan pembelajaran gratis secara offline, jadi kita tidak kesulitan.

3. Membuat website sendiri dari awal.
Kita bisa menggunakan program seperti Dreamweaver, Front page, NVU, Web page maker. Dengan cara Ini jauh lebih fleksibel karena kita bisa merancang sendiri bentuk website anda dari nol, sesuai dengan keinginan kita. Tapi cara yang ini sangat merepotkan, terutama sangat menyita waktu kita tentunya, apa lagi kita tidak faham cara menggunakan program tersebut.

4. Membuat website dengan Template gratis.
Kita bisa membuat website profesional dengan menggunakan template yang sudah ada tanpa harus buat sendiri. Template ini mudah kita dapatkan dan gratis.

Dari keempat cara diatas, yang terakhir adalah cara yang paling mudah dan cepat menurut saya, disamping itu semuanya kita dapatkan dengan cara mudah dan gratis semua.

Bila anda berminat untuk membuat website dengan cara ini, silahkan ikuti langkah - langkah yang akan saya berikan dan silahkan anda praktekan langsung.

Tapi perlu diingat, sebelum membuat website sebaiknya kita menentukan terlebih dahulu tujuan utama kita membuat website, misalnya akan menawarkan sebuah produk, maka template yang kita butuhkan juga menggunakan template yang lebih profesional untuk bisnis. Dengan kita tahu untuk apa website kita buat, tentu kita akan lebih fokus mengelola website yang kita buat.

Setelah kita menentukan tujuan untuk apa kita membuat website, kemudian silahkan ikuti langkah - langkah cara membuat website berikut :

1. Domain
Domain merupakan nama yang kita pakai untuk website kita, misalnya: www.carabuatwebgratis.com . Untuk mendapatkan nama domain kita harus mendaftarkan nama domain pada penyedia layanan pemilihan nama domain. Untuk mendapatkan nama domain tentu kita harus membayar sejumlah uang. Tapi jangan khawatir didunia internet semuanya serba mungkin dan bisa kita lakukan. Sebab tidak semua domain berbayar, ada juga penyedia layanan domain yang gratis seperti co.cc, apalagi seperti yang sudah kita ketahui, bahwa co.cc adalah top level domain yang bisa kita dapatkan secara gratis. 
LANGKAH PERTAMA :  
Cara dapat domain gratis, silahkan anda baca DISINI.
 
2. Hosting
Hosting adalah perusahan penyedia ruangan atau space untuk website kita. Supaya website kita bisa dikunjungi orang, maka website tersebut harus mempunyai ruangan dagang. Dan ruangan tersebut harus bisa online agar orang dari tempat manapun bisa mengunjungi website atau toko kita sepanjang ada sambungan internet. Dan untuk penggunaan hosting, saya juga akan memberikan cara yang gratis.
LANGKAH KEDUA : 
Cara mendapat hosting gratis, silahkan anda baca  DISINI 

Setelah dapat domain gratis dan hosting gratis, langkah selanjutnya tinggal seting domain dihosting gratis.
LANGKAH KETIGA :
Cara seting domain dihosting gratis, silahkan anda baca  DISINI 

Kita harus memilih bentuk tampilan dan fungsi template sesuai dengan tujuan yang sudah kita tentukan. Silahkan anda bisa lihat, ada ratusan bentuk template yang bisa anda pilih.
LANGKAH KEEMPAT :  
Silahkan anda pilih dan download gratis DISINI.

5. Upload Template
Nah bila ketiganya sudah kita selesaikan, maka website sudah bisa kita diakses termasuk olah orang lain dari tempat manapun di muka bumi sepanjang ada sambungan internet. Selanjutnya kita bisa langsung memanfaatkannya untuk menjalankan bisnis atau yang lain sesuai kebutuhan anda.
LANGKAH KELIMA :  
Cara Upload Template, silahkan anda baca  DISINI

Selamat mencoba... dan semoga bermanfaat untuk anda semuanya....amiin.
Anda juga bisa berlangganan artikel-artikel terbaru dari saya, silahkan anda masukkan email pada forum Langganan Via Email yang ada disebelah kanan halaman ini.
Mohon jangan lupa luangkan waktu untuk beri komentar ya......terima kasih.

Keywordsweb, website, buat web, cara buat website, cara buat web gratis, cara buat web, cara buat wesite gratis, cara membuat web, cara membuat website, cara membuat website gratis

Ping your blog, website, or RSS feed for Free




Rabu, 02 Maret 2011

8

Domain Gratis

Cara dapat domain gratis
Melanjutkan tulisan cara membuat website gratis, artikel ini akan memberi petunjuk langkah - langkah mendaftarkan nama domain yang gratis pula. Dan penyedia nama domain yang pilih adalah dari domain co.cc, sebab seperti yang sudah kita ketahui, bahwa co.cc adalah top level domain yang bisa kita dapatkan secara gratis. Disamping itu kita bisa mengontrol DNS Records, A, MX, dan CNAME records, sehinga domain co.cc bukan hanya sekedar "URL Forwarding".

OK..., sebelum kita menuju tahap memilih nama domain, sebaiknya kita mengetahui fitur yang disediakan pada layanan ini. Ada 3 tipe pengaturan di co.cc. Ketiganya memiliki fungsi tersendiri. Berikut ini akan saya coba menjelaskan tentang cara setting domain di co.cc:

1. MENEJER DNS
Ini biasanya digunakan untuk sebuah web yang memerlukan web hosting dan mengharuskan untuk mengarahkan Name Server-nya ke hosting tersebut. Misal untuk membuat web di 000webhost, atau bisa juga untuk blog wordpress yang menggunakan hosting dari luar. Metode ini tidak cocok digunakan untuk blogger/blogspot yang menggunakan hosting default dari blogger/blogspot.
Cara setting untuk metode ini yaitu dengan mengisi pada kolom "Name Server 1 dan Name Server 2 dengan name server yang sesuai dengan hosting yang digunakan. Misal, bagi yang menggunakan hosting dari 000webhost maka untuk kolom "Name Server 1" disi dengan "ns01.000webhost.com" dan kolom "Name Server 2" disi dengan "ns02.000webhost.com". Kemudian klik tombol "Setup". Selesai

2. ZONE RECORDS
Dengan Metode inilah saya menggunakannya. Dan Penjelasan cara setting untuk Zone Records akan saya uraikan dibawah.

3. URL FORWARDING
URL forwarding bisa digunakan untuk apa aja, bisa web ato blog. Tapi URL Forwarding ini hanya memforward domain yang baru (di co.cc) ke domain lama. Jadi domain lama akan seperti semula tanpa ada perubahan apapun, cuma kita bisa mengakses web/blog kita dengan mengetikkan nama domain baru kita di browser. Jika menggunakan URL Forwarding maka yang terindex di google atau Search engine yang lain adalah tetap Domain kita yang lama.
Untuk setting URL Forwarding sangat mudah, kita hanya mengisikan data-data yang diminta dan disesuaikan dengan web/blog kita, seperti "Redirect to:, Page Title, URL Hiding, Meta Description dan Meta Keywords". Kita tidak perlu lagi mensetting domain di web/blog kita lagi.

Catatan:
Untuk metode Forwarding ini tidak dianjurkan jika tidak betul-betul diperlukan.

Sekarang baru ketahap pembuatan dan pengecekan nama domain, apakah masih tersedia atau sudah terpakai di co.cc. Anda bisa coba melakukannya lagi berulang-ulang bila masih belum tersedia, sampai kita mendapat nama domain yang tersedia. Untuk tip cara memilih nama domain yang bagus, silahkan anda bisa baca artikelnya DISINI.

Kemudian Langkah pertama silahkan anda menuju ke http://www.co.cc. Pada halaman pertama silahkan masukkan dan cek nama domain anda.


Berikut gambaran antara nama domain yang masih tersedia  dan tidak tersedia. Disini saya contohkan nama domain saya "buatblog-mudah" :


Kalau nama domain anda sudah tersedia, KLIK lanjutkan pendaftaran. Pada halaman berikutnya anda diminta mengisi data anda pada forum yang disediakan, silahkan and isi dengan lengkap.

Setelah selesai berlanjut ke SETUP :


Karena saya menggunakan hosting gratis dari google.com, maka dihalaman setup pada Zone

records, isi forum seperti :
Host  : www.Nama Domain.co.cc
TTL   : Biarkan tetap 1D
Type  : CNAME
Value : ghs.google.com

Perhatikan gambar dibawah ini :


Pada halaman terakhir silahkan anda Lihat gambar berikut dan nama domain anda sudah aktif, lalu LOG UOT.

Akhirnya pembuatan dan pendaftaran nama domain sudah selesai.

MENUJU LANGKAH KEDUA : 
Cara mendapat hosting gratis, silahkan anda baca  DISINI 

Selamat mencoba... dan semoga bermanfaat untuk anda semuanya....amiin.
Jangan lupa, silahkan anda tinggalkan komentar pada forum dibagian bawah.

Ping your blog, website, or RSS feed for Free




0

Cara mendapat hosting gratis

Cara mendapat hosting gratis
Lanjutan langkah cara pembuatan website gratis adalah Upload Template dan seting nama domain ke hosting gratis. Dan untuk membuat web pada layanan yang gratis, saya memilih membuat web dilayanan gratis blogger.com, sebab untuk cara seting dan edit template lebih mudah dan simpel (itu menurut saya lho...).
Sebenarnya prosesnya sama dengan kita membuat blog, dan template yang akan kita gunakan terserah kita, selain untuk blogging kita bisa upload template profesional yang digunakan untuk berbisnis ataupun template yang lain sesuai selera dan kebutuhan kita.

OK...lanjutkan...
Berikut langkah demi langkah membuat web gratis dengan blogger.com cepat, mudah dan praktis :

1.Membuat Akun Google
Dengan akun google anda bisa menggunakan berbagai macam layanan dari google termasuk blog dari blogger.com. Bila anda sudah memiliki sebuah akun google dari Gmail, Google Groups, atau Orkut, silahkan anda bisa langsung Login terlebih dulu DISINI

2. Beri Nama web atau blog Anda
Karena kita akan menggunakan nama domain dari co.cc, maka disini kita bisa memberi nama domain secara asal saja. Nanti setelah selesai, baru kita seting dengan nama domain co.cc.

3 Pilih Template Awal dan Mulai Blogging
Silahkan pilih template secara asal dulu, nanti kita ganti lagi pada "Rancangan" atau "edit html".


Sampai disini kita sudah memiliki hosting secara gratis.

MENUJU LANGKAH KETIGA :
Cara seting domain dihosting gratis, silahkan anda baca  DISINI 

Selamat mencoba... dan semoga bermanfaat untuk anda semuanya....amiin.
Jangan lupa, silahkan anda tinggalkan komentar pada forum dibagian bawah.

Ping your blog, website, or RSS feed for Free




3

Cara seting co.cc di Blogger

Cara seting domain gratis dihosting gratis
Seperti yang sudah kita ketahui, bahwa co.cc adalah top level domain yang bisa kita dapatkan secara gratis. Disamping itu kita bisa mengontrol DNS Records, A, MX, dan CNAME records, sehinga domain co.cc bukan hanya sekedar "URL Forwarding". Pada artikel ini, kita akan mempelajari cara seting co.cc di Blogger. Bila anda belum mempunyai nama domain co.cc, silahkan anda baca artikel "Domain Gratis" DISINI. Tapi bila sudah mari kita lanjut kelangkah cara seting nama domain co.cc di hosting gratis yaitu blogger.com.

1. Silahkan anda login di Blogger anda.

2.Klik menu "Pengaturan" dan pilih "Publikasikan"


3. Kemudian akan terbuka jendela baru dan silahkan klik tulisan "Beralihlah kepengaturan Lanjut"


4. Pada jendela berikutnya silahkan isi forum seperti gambar dibawah ini :

5. Setelah "Simpan Setelan" beralih kejendela baru lagi dan jangan lupa beri tanda centang dengan meng Klik kotak kecil seperti gambar dibawah ini :

OK..., kita sudah berhasil mengganti nama domain blogspot menjadi co.cc, dengan ulr yang lebih ringkas. Silahkan anda coba ketik nama domain web anda yang baru di Browser untuk melihat hasilnya. Bila belum berhasil atau belum ditemukan, anda tunggu beberapa jam sampai 2 hari, baru anda bisa coba lagi.

MENUJU LANGKAH KEEMPAT :  
Silahkan anda pilih dan download Template gratis DISINI.

MENUJU LANGKAH KELIMA :  
Cara Upload Template, silahkan anda baca  DISINI

Selamat mencoba... dan semoga bermanfaat untuk anda semuanya....amiin.
Jangan lupa, silahkan anda tinggalkan komentar pada forum dibagian bawah.

Ping your blog, website, or RSS feed for Free




27

Buku Tamu


Ping your blog, website, or RSS feed for Free




Selasa, 01 Maret 2011

6

Kontak

Forum kontak saya sediakan agar interaksi kita lebih mudah. Disini saya menampung segala aspirasi, kritik, saran, atau testimonial anda. Silahkan gunkan forum ini untuk menyampaikan segala aspirasi, kritik, saran serta testimoial anda tentang materi yang ada pada blog ini. Dengan forum ini diharapkan selain agar interaksi kita lebih mudah, tentunya sangat bermanfaat untuk anda terutama untuk saya, agar kedepan blog ini akan menjadi lebih bagus.



Silahkan hubungi saya lewat forum ini :










Terima kasih atas segala aspirasi, kritik, saran, serta testimonial anda ....

Ping your blog, website, or RSS feed for Free




3

HTML Dasar

Bila anda sudah membaca artikel saya mengenai Definisi HTML, kali ini kita akan belajar bersama mengenal keseluruhan tentang HTML secara bertahap.
Seperti yang sudah saya utarakan pada artikel mengenai Definisi HTML, Tujuan dari sebuah web browser (seperti Internet Explorer atau Firefox)  adalah untuk membaca HTML dokumen tersimpan, dan mereka menampilkannya sebagai halaman web. Browser tidak menampilkan tag HTML, tapi menggunakan tag HTML untuk menafsirkan isi halaman.

OK..., Mari terlebih dahulu kita mulai dari HTML  Dasar.  Untuk membuat halaman sebuah web, kita harus tahu dasar-dasar dari elemen HTML.

1. HTML HEADING atau JUDUL

Heading ditandai dengan tag <h1>. Tag <h1> adalah elemen HTML yang digunakan untuk menampilkan sebuah judul pada artikel atau dokumen data pada sebuah halaman web. HTML heading terdiri atas 6 tingkatan menurut ukuran besar dan kecilnya, yaitu dari Tag <h1> <h2> <h3> <h4> <h5> dan <h6>.  Dan Tag <h1> merupakan tag heading yang berukuran paling besar. Sedang tag <h2> dan seterusnya biasanya berfungsi sebagai elemen HTML yang digunakan untuk menampilkan sub-judul.

Lihat perbedaan penulisan dan hasil yang tampil pada halaman web :

<h1>Ini Judul 1</h1>
<h2>Ini Judul 2</h2>
<h3>Ini Judul 3</h3>
<h4>Ini Judul 4</h4>
<h5>Ini Judul 5</h5>
<h6>Ini Judul 6</h6>
Ini Judul 1
Ini Judul 2
Ini Judul 3
Ini Judul 4
Ini Judul 5
Ini Judul 6


2. HTML PARAGRAF
HTML Paragraf didefinisikan dengan tag <p>

<p>Disini Paragraf teks yang merupakan isi dari artikel</p>
Disini Paragraf teks yang merupakan isi dari artikel


3. HTML LINK
HTML Link didefinisikan dengan tag <a>

<a href="http://www.carabuatwebgratis.com/"> KLIK DISINI </a>

KLIK DISINI


4. HTML  GAMBAR
HTML  Gambar didefinisikan dengan tag <img>

<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEizVLRnF3x_5GkN79cMMeEjg6OE-XC49egPVTJsPRBUj27Sq6HQFqBXNBXGwPKIhnM1zGsE8dU6J7bs12ECEyuf9xNI1wgM3mNqRQvjAm3F3LWBlhBuovLi_tuUIEW1RVOClesdisTe6_UO/s104/DASAR.jpg" width="104" height="142" />


Nah...., mudah kan?
Silahkan anda mencoba dan mengexplore sendiri.... semoga bermanfaat untuk anda.
Jangan lupa baca tentang pendalaman HTML di bab- bab selanjutnya.

Oh ya....., sebelum pergi jangan lupa tinggalkan komentarmu ya......
Terima kasih......

Ping your blog, website, or RSS feed for Free




HTML

HTML singkatan dari HyperText Markup Language adalah sebuah bahasa markup yang dalam bahasa Indonesia disebut Bahasa markah yaitu kombinasi antara teks dan informasi mengenai struktur dan presentasi teks. Dalam penggunaan modern Bahasa markah adalah HTML (HyperText Markup Language).

HTML digunakan untuk membuat sebuah halaman web yang menghasilkan tampilan atau wujud yang terintegerasi seperti seperti texs, grafik, animasi, hyperlink maupun audio-video. Untuk menuliskan kode-kode HTML anda bisa menggunakan Texs Editor misalnya Notepad, Word Pad, Microsoft Word dll.

Perintah didalam dokumen HTML terdiri dari berbagai struktur penyusun seperti Tag, elemen, atribut dan nilai. Tag terdiri dari lambang-lambang khusus seperti: "<", ">" dan "/", untuk menuliskannya di dalam dokumen HTML dimulai dengan tag pembuka "<...>"dan diakhiri dengan tag penutup "</...>". Kemudian di dalam tag tersebut terdapat Elemen HTML seperti html, head, title,body dll. Versi terakhir dari HTML adalah HTML 4.01, meskipun saat ini telah berkembang XHTML yang merupakan pengembangan dari HTML.

Secara garis besar, terdapat 4 jenis elemen dari HTML:
1. structural
Yaitu sebuah tanda yang menentukan level atau tingkatan dari sebuah tulisan seperti tag <h1><h2><h2> dan seterusnya, tag ini menampilkan tulisan lebih tebal dan besar yang digunakan sebagai penulisan judul.

2. presentational
Adalah tag yang menentukan tebal tipisnya tampilan dari sebuah tulisan yang sering kita lihat lihat sebagai tanda bold, tag ini berlaku untuk semua teks pada sebuah paragraf termasuk Heading atau judul. (contoh, <b>Teks Tebal</b>).

3. hypertext
Yaitu Tag <a>, sebuah tanda yang menunjukkan sebuah Link yang mengarahkan ke bagian dari dokumen tersebut atau Link yang mengarahkan ke bagian kedokumen yang lain.

4. Elemen widget
Sebuah tag yang berfungsi untuk membuat objek-objek seperti tombol ditandai dengan tag <button>), list ditandai dengan tag <li>, dan garis horizontal ditandai dengan tag <hr>. Dan hypertext pada HTML memungkinkan kita untuk membuat atau memberi sebuah link pada suatu kelompok kata atau frase untuk mengarahkan kedokumen atau halaman web manapun.


Jadi dari keseluruhan tadi dapat saya simpulkan menjadi sebagai berikut :

*   Definisi :
HTML adalah bahasa untuk mendeskripsikan halaman web :
    * HTML singkatan dari Hyper Text Markup Language
    * HTML bukan bahasa pemrograman, ini adalah bahasa markup
    * Sebuah bahasa markup adalah serangkaian tag markup
    * HTML menggunakan tag markup untuk menjelaskan halaman web

* Tag HTML
Tag markup HTML biasanya disebut tag HTML :
    * HTML tag kata kunci yang dikelilingi oleh tanda kurung siku seperti <html>
    * Tag HTML biasanya datang dalam pasangan seperti <b> dan </ b>
    * Dalam pasangan Tag pertama adalah tag awal, tag kedua adalah tag akhir
    * Tag untuk Mulai dan akhir juga disebut tag pembuka dan tag penutup

* HTML  Dokumen
 HTML Dokumen atau bisa disebut halaman web :
    * HTML dokumen mendeskripsikan halaman web
    * HTML dokumen berisi tag HTML dan teks biasa
    * HTML dokumen juga disebut halaman web

Tujuan dari sebuah web browser (seperti Internet Explorer atau Firefox) adalah untuk membaca HTML dokumen dan mereka menampilkannya sebagai halaman web. Browser tidak menampilkan tag HTML, tapi menggunakan tag untuk menafsirkan isi halaman.

Contoh bentuk penulisan HTML sederhana :
<html>
  <head>
   
<h1>JUDUL POS</h1>
  </head>
  <body>
    <p>Paragraf Teks</p>
  </body>
</html>

Penjelasan contoh diatas adalah :
    * Kode html antara <html> dan </ html> menggambarkan halaman web
    * Kode html <body> dan </ body> adalah isi halaman yang terlihat
    * Kode html <h1> dan </ h1> cara penulisan Judul post
    * Kode html <p> dan </ p> cara penulisan sebuah paragraf teks ( isi post )

OK....Selamat membaca artikel yang lain dan semoga bermanfaat....
Anda juga bisa berlangganan artikel-artikel terbaru dari saya, silahkan anda masukkan email pada forum Langganan Via Email yang ada disebelah kiri halaman ini.

Jangan lupa luangkan waktu untuk beri komentarmu ya......terima kasih.

Ping your blog, website, or RSS feed for Free




BLOGGER

TUTORIAL BLOGGER

TUTORIAL BLOGGER

REKOMENDASI

REKOMENDASI

Artikel Terbaru

POST POPULER

Entri Populer



BACKLINK

INFO

Bagi anda yang berminat tukar link, silahkan copy linknya lalu pasang di Blog anda. Dan bila sudah terpasang, jangan lupa beritahu saya, agar link anda segera saya pasang di Blog tercinta ini.

CEO
BLOG MAS NOER

Noer cholis


Plosokuning V, Minomartani, Ngaglik, Sleman, Yogyakarta.

TUKAR LINK

TUKAR LINK






Baca artikel "Manfaat Tukar Link"













Baca artikel "Manfaat Tukar Link"

LINK SAHABAT

LINK SAHABAT


CHAT

CHAT




TESTIMONI

Follow Us

Bila anda merasa artikel ataupun tutorial yang ada di Blog ini bermanfaat, anda bisa berikan suport comment melalui form ini. Form ini sangat bagus sebagai BACKLINK buat blog anda, silahkan tinggalkan link anda....

RECENT COMMENT

Recent Comments


top down