ingin belajar HTML,CSS,XML lebih mahir

huy guyssss,,,,,,,, kata nya belajar sendiri tu kan lebih asyik N lebih cepat paham nya...........
jadi maels cuma bisa kasih link ni moga manfaat yo guyysssss....... :)

:)




silahkan link kesini aja ya??

p1

BERMAIN CSS DAN HTML

BERMAIN CSS DAN HTML

Haii guySs...
sekarang kita belajar HTML lagi ya..
yang lalu kita kan belajar html aja kaNn, jadi sekarang kita akan mengkombinasikan script html dengan fungsi CSS, jadi pada prinsipnya, kalu tanpa CSS ketika kita membuat kolom yg banyak berisi konten di dalamnya ita pasti sedikit kesulitan mengenai logika untuk membuat tabel, dan utuk mengedit balik pun juga sulit. maka dari itu, kali ini saya akan memperkenalkan pembelajaran dengan menggunakan CSS ( meskipun saya sendiri juga baru belajar sih ) hehheeee,
semua postingan saya selalu ada yg nge Suport Guys,

Support by :



jadi untuk menyimpan file pada css, sbenarnya sama sih dengan kita menulis di html, silahkan kalian menulis di editor teks ( pada notepad, atau notepad++, bisa jadi yg lain nya juga ) lalu save file klaian dengan tipe "namaFile.css", lanjutnyauntuk pemanggilan file CSS anda, kita panggil melalui HTML nya sebagai hasil tampilan dari file yg aanda buat.
NaHh, berikut akan saya contohkan program sederhana dari aplikasi yg saya buat, pada prinsipnya sebenarnya ini mirip seperti tampilan pada facebook. hehe
jadi,
untuk script pada file CSS nya  sbb :

<div style="overflow:auto; padding:5px; width:450px; height:400px;
background-color: rgb(255, 255, 255); border:2px solid #ccc;
"> #wrapped {
width : 70%;
margin : auto;
}

#border {
height : 100px;
background : pink;
}

#borderkanan{
float : right;
height : auto;
width : 40%;
}

#middle {
height : 525px;
background-image : url("middle2.jpg");
}

#kolomkiri{
float : left;
height : auto;
width : 60%;
background-image : url();
}

#kolomkanan{
float : right;
height : auto;
width : 40%;
}

.mlebu {
background : transparent url("p.jpg") no-repeat bottom left;
display : block;
float : left;
width : 60px;
height : 24px;
font : tahoma 14px;
text-decoration : none;
color : white;
}
.mlebuok{
overflow : hidden;
width: 100%;
}

.daftar {
background : transparent url("daftar.jpg") no-repeat right;
display : block;
float : left;
width : 150px;
height : 30px;
font : tahoma 14px;
padding : 10px 0px 0px 0px;
text-decoration : none;
}

.tulisan{
    font-family: tahoma;
    font-size: 14px;
    text-align: left;
    color: white;
    border: 0px;
}

.kata{
    font-family: tahoma;
    font-size: 26px;
    text-align: left;
    color: #5d3c1c;
    border: 0px;
}

.tulisan2{
    font-family: tahoma;
    font-size: 13px;
    text-align: left;
    color: #5d3c1c;
    border: 0px;
}

.tulisan3{
    font-family: tahoma;
    font-size: 16px;
    text-align: left;
    color: #5d3c1c;
    border: 0px;
}

.kopi {
font-family: tahoma;
    font-size: 13px;
    text-align: left;
    color: gray;
}

.bahasa {
display : block;
color : #5d3c1c;
text-decoration : none;
overflow : hidden;
}

#footer {
clear : both;
background : white;
height : 75px;
}</div>

kemudian kita akan panggil file yg sudah kita buat di CSS pada script yg di HTML sebagai tampilan nya nanti.
Berikut adalah Script HTML nya :
<div style="overflow:auto; padding:5px; width:450px; height:400px;
background-color: rgb(255, 255, 255); border:2px solid #ccc;
"><!DOCTYPE html PUBLIC"-//W3C//DTD XHTML 1.0 Transitional.dtd">
<html xlmns="htt<!DOCTYPE html PUBLIC"-//W3C//DTD XHTML 1.0 Transitional.dtd">
<html xlmns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<HEAD>
<TITLE>Welome to Komunitas Balita</TITLE>
<link rel="ICON" href="ym.ico" />

<link rel="stylesheet" href="kode css.css" type="text/css" />
</HEAD>
<BODY>
<div id="border">
<div id="wrapped">
<div class="tulisan">
<br>
<img src="bayi.jpg" height="85" width="200">
<div id="borderkanan">
<table border=0 align="right" cellspacing=0 cellpadding=2>
<tr>
<td>Email</td>
<td width=10 ></td>
<td>Kata Sandi</td>
</tr>
<tr>
<td><form><input type="email" name="email" size="25" /></form></td>
<td></td>
<td><form><input type="password" name="pwd" size="25"  /></form></td>
<td width=3></td>
<td><div class="mlebuok" align="center">
<a class="mlebu" href="http://www.facebook.com">
<span>Masuk</span></a></div>
</td>
</tr>
<tr>
<td><input type="checkbox" />stay in page</td>
<td></td>
<td>Lupa kata sandi ? </td>
</tr>
</table></div>
</div></div>
</div></div>
<div id="middle">
<div id="wrapped">
<div id="kolomkiri">
<div class="kata">
<br>
Daftarkan Balita Anda<br>
Dalam Komunitas Balita Indonesia<br>
Sebagai Simbol Putra Bangsa
<br><br>
<div align="left">
<img src="indonesia.png" height="200" >
</div>
</div>
</div>
<div id="kolomkanan">
<div class="tulisan3">
<br><br>
<font size="5"><b> Mendaftar</b></font><br>
<font size="4"> Gratis, sampai kapan pun.</font>
<Table Border=0 cellspacing=10 align="right">
<tr>
<td colspan=2 style="border-bottom:#5d3c1c solid thin"></td>
</tr>
<tr>
<td align="right">Nama Depan:</td>
<td><input nama="nama" size="40" type="text" /></td>
</tr>
<tr>
<td align="right">Nama Belakang:</td>
<td><input nama="nama" size="40" type="text" /></td>
</tr>
<tr>
<td align="right">Email :</td>
<td><form><input type="email" name="email" size="40" /></form></td>
</tr>
<tr>
<td align="right">ReType Email:</td>
<td><form><input type="email" name="email" size="40" /></form></td>
</tr>
<tr>
<td align="right">Password:</td>
<td><form><input type="password" name="pwd" size="40"  /></form></td>
</tr>
<tr>
<td align="right">Kelamin:</td>
<td><select><option value="-1">Jenis Kelamin:</option>
<option>laki-laki</option>
<option>perempuan</option>
</select>
</tr>
<tr>
<td align="right">Tanggal Lahir:</td>
<td>
<select><option value="-1">Tanggal:</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
<option value="31">31</option>
</select>
<select>
<option value="-1">Bulan:</option>
<option value="1">Januari</option>
<option value="2">Februari</option>
<option value="3">Maret</option>
<option value="4">April</option>
<option value="5">Mei</option>
<option value="6">Juni</option>
<option value="7">Juli</option>
<option value="8">Agustus</option>
<option value="9">September</option>
<option value="10">Oktober</option>
<option value="11">November</option>
<option value="12">Desember</option>
</select>
<select><option value="-1">Tahun:</option>
<option value="2011">2011</option>
<option value="2010">2010</option>
<option value="2009">2009</option>
<option value="2008">2008</option>
<option value="2007">2007</option>
<option value="2006">2006</option>
<option value="2005">2005</option>
<option value="2004">2004</option>
<option value="2003">2003</option>
<option value="2002">2002</option>
<option value="2001">2001</option>
<option value="2000">2000</option>
<option value="1999">1999</option>
<option value="1998">1998</option>
<option value="1997">1997</option>
<option value="1996">1996</option>
<option value="1995">1995</option>
<option value="1994">1994</option>
<option value="1993">1993</option>
<option value="1992">1992</option>
<option value="1991">1991</option>
<option value="1990">1990</option>
<option value="1989">1989</option>
<option value="1988">1988</option>
<option value="1987">1987</option>
<option value="1986">1986</option>
<option value="1985">1985</option>
<option value="1984">1984</option>
<option value="1983">1983</option>
<option value="1982">1982</option>
<option value="1981">1981</option>
<option value="1980">1980</option>
<option value="1979">1979</option>
<option value="1978">1978</option>
<option value="1977">1977</option>
<option value="1976">1976</option>
<option value="1975">1975</option>
<option value="1974">1974</option>
<option value="1973">1973</option>
<option value="1972">1972</option>
<option value="1971">1971</option>
<option value="1970">1970</option>
<option value="1969">1969</option>
<option value="1968">1968</option>
<option value="1967">1967</option>
<option value="1966">1966</option>
<option value="1965">1965</option>
<option value="1964">1964</option>
<option value="1963">1963</option>
<option value="1962">1962</option>
<option value="1961">1961</option>
<option value="1960">1960</option>
<option value="1959">1959</option>
<option value="1958">1958</option>
<option value="1957">1957</option>
<option value="1956">1956</option>
<option value="1955">1955</option>
<option value="1954">1954</option>
<option value="1953">1953</option>
<option value="1952">1952</option>
<option value="1951">1951</option>
<option value="1950">1950</option>
<option value="1949">1949</option>
<option value="1948">1948</option>
<option value="1947">1947</option>
<option value="1946">1946</option>
<option value="1945">1945</option>
<option value="1944">1944</option>
<option value="1943">1943</option>
<option value="1942">1942</option>
<option value="1941">1941</option>
<option value="1940">1940</option>
<option value="1939">1939</option>
<option value="1938">1938</option>
<option value="1937">1937</option>
<option value="1936">1936</option>
<option value="1935">1935</option>
<option value="1934">1934</option>
<option value="1933">1933</option>
<option value="1932">1932</option>
<option value="1931">1931</option>
<option value="1930">1930</option>
<option value="1929">1929</option>
<option value="1928">1928</option>
<option value="1927">1927</option>
<option value="1926">1926</option>
<option value="1925">1925</option>
<option value="1924">1924</option>
<option value="1923">1923</option>
<option value="1922">1922</option>
<option value="1921">1921</option>
<option value="1920">1920</option>
<option value="1919">1919</option>
<option value="1918">1918</option>
<option value="1917">1917</option>
<option value="1916">1916</option>
<option value="1915">1915</option>
<option value="1914">1914</option>
<option value="1913">1913</option>
<option value="1912">1912</option>
<option value="1911">1911</option>
<option value="1910">1910</option>
<option value="1909">1909</option>
<option value="1908">1908</option>
<option value="1907">1907</option>
<option value="1906">1906</option>
<option value="1905">1905</option>
</select>
</td>
</td>
</td>
<tr>
<td></td>
<td><font size=2>Mengapa saya perlu mengisinya ?</font></td>
</tr>
<tr>
<td></td>
<td><div class="mlebuok" align="center">
<a class="daftar" href="http://www.facebook.com/signup">
<font color="white"><b>Mendaftar</a></font></b></div></td>
</tr>
<tr>
<td colspan=2 style="border-bottom:#5d3c1c solid thin"></td>
</tr>
<td colspan=2 align="center">
<b>Category Balita</b> <font color=#464646>cute, lucu, dan familiar.</font>
</td>
</table>
</div>
</div>
</div>
</div>
<div id="footer">
<div id="wrapped">
<div class="tulisan2">
<table width=100% border=0 align="left">
<tr>
<td><a class="bahasa" href="http://www.indonesia.com">Bahasa Indonesia</a></td>
<td><a class="bahasa" href="http://www.sunda.com">Bahasa Sunda</a></td></td>
<td><a class="bahasa" href="http://www.bali.com">Bahasa Bali</a></td>
<td><a class="bahasa" href="http://www.bahasatubuh.com">Bahasa Tubuh</a></td></td>
<td><a class="bahasa" href="http://www.melayu.com">Bahasa Melayu</a></td>
<td><a class="bahasa" href="http://www.next.com">>></a></td>
<td width=500px></td>
</tr>
<tr>
<td colspan=8 style="border-bottom:#5d3c1c solid thin"></td>
</tr>
</table><br>
<table border=0 cellspacing=1 cellpadding=2>
<tr>
<td width="155px"><a class="kopi">Balita Indonesia &copy; Copyright 2011</a></td>
<td width=""><a class="bahasa" href="http://www.aksarajawa.com">Indonesia</a></td>
<td width="299px"></td>
<td><a class="bahasa" href="http://www.seluler.com">Seluler</a></td>
<td><a class="bahasa" href="http://www.cariteman.com">Cari Teman</a></td>
<td><a class="bahasa" href="http://www.lencana.com">Lencana</a></td>
<td><a class="bahasa" href="http://www.orang.com">Orang</a></td>
<td><a class="bahasa" href="http://www.halaman.com">Halaman</a></td>
<td><a class="bahasa" href="http://www.tentang.com">Tentang</a></td>
<td><a class="bahasa" href="http://www.iklan.com">Iklan</a></td>
<td><a class="bahasa" href="http://www.foto.com">foto</a></td>
<td><a class="bahasa" href="http://www.karier.com">Karier</a></td>
<td><a class="bahasa" href="http://www.privasi.com">Privasi</a></td>
<td><a class="bahasa" href="http://www.ketentuan.com">Ketentuan</a></td>
<td><a class="bahasa" href="http://www.bantuan.com">Bantuan</a></td>
</tr>
</table>
</div>
</div>
</div>
</BODY>
</HTML></div>

Dan untuk tampilan nya saya disini ingin memberikan contoh,bagaimana cara membuat sebuah Header, Content, dan Footeru jika menggunakan CSS
Hasil dari Script yg saya share sbb :
untuk menampilkan semua gambar maka kalian harus menyimpan semua file nya pada satu folder yaa..


naHh begitulahh kawaNn, apa yg bisa saya share kan dengan kalian..
semoga apa yg saya share kan dapat menjadi manfaat dan berkah bagi kalian semua nya..
tak lupa kritik dan saran, yg membangun selalu diharapkan sebagai evaluasi perbaikan materi kedepan...
Selamat mencoba dan Gud Luck GuySs..

p1

Membuat Kreasi Objek Dengan HTML

Membuat Kreasi Objek Dengan HTML

 

 





Ok guys ini nantinya gambar yg pingin aq share sama kalian semua, maksud aq bentuk jadinya sih cuman bentuk bangun sederhana seperti ini aja.. hehe


Nah simpel kan ternyata gambarnya.. so, ini dia guys scriptnya buat ngebuat gambar seperti gambar di atas : rumit
juga kalu mikir buat dari 0 gitu itu, hehe






<title>Studi Kasus</title>
<style type="text/css">
<!--
.andi {
background-color: cyan;
-moz-border-radius: 700px;
-webkit-border-radius: 150px;
border: 10px solid #000000;
padding: 50px;
width: 200px;
height: 200px;
}

.bayu {
padding: 50px;
border: 10px solid teal;
width: 200px;
height: 50px;
background: lime;
border-bottom-right-radius: 50px;
border-top-left-radius: 50px;
}

.sulistiya {
padding: 50px;
border: 5px solid red;
-moz-box-shadow: 10px 10px 10px rgba(125, 0, 255, 255);
width: 200px;
height: 50px;
border-bottom-right-radius: 0px;
border-top-left-radius: 0px;

}
-->
</style>


<div align="center" class="andi">
Yang ini border lingkaran.
Gawenen..
OJO ONLEN AE!!!</div>


<div align="center" class="bayu">
KOtaKk.........</div>


<div align="center" class="sulistiya">
efeeKk shadoWw....</div>



naHh, silahkan di coba guYyss,, moga kalian berhasil yaa...
banyak latihan makin pintar dah kaliaNn.. hehe

p1

Pembuatan Halaman Web Sederhana Kosongan Dengan CSS

Pembuatan Halaman Web Sederhana Kosongan Dengan CSS

NaHh, kawaNn jumpa lagi daHh,, makin rumit aja ini pembelajaran html kita..
heHheee,,
masalahnya kita harus combine script html kita dengan menggunakan CSS.
pada dasarnya ini semua masih pada program latihan saja..
sponsored by


aq sih pengen nampilin halaman seperti inini guyss,, jadi ntar kalian tinggal nginputin content, terserah dah mau diisi apa'an, sekaligus pengen kasih link event
terserah dehh, suka suka kalian ntar yang ngebuat nya.. hehe
nihh halaman nya guYyss..

bnernya sih tampilan diatas itu belum sesuai sama apa yg aq inginkan guyss, tapi ntar biar aq perbaikin lagiduludah,, g penting aq ingin ngeshare ilmunya dulu sama kalian kalu kita pengen mendisain halaman web dengan CSS.
petama,
buat script CSS nya kawaNn..
nih script nya guys..
body{
margin : 10px auto;
width : 900px;
}

header, logo, um, te, nav, search, box, section, pict, article, event, footer{
display : block;
}

header{
height: 90px;
width: auto;
background-image : url(images/A.jpeg);
}

logo{
float : left;
margin-left : 30px;
height : 90px;
width : 90px;
background-image : url(images/c.jpg);
}

te{
padding: 30px;
font-family : Times New Roman;
font-weight: bold;
font-size : 32px;
color : white;
}

um{
float: right;
margin-right : 2px;
margin-top : 30px;
height : 70px;
width : 100px;
background-image : url(images/c.jpg);
}

nav{
width: 900px;
height: 40px;
background-color : #bbdefb;
color : #459dff;
font-family: Times New Roman;
}

search{
float : left;
margin-top: 2px;
margin-left : 20px;
width : 50px;
height: 20px;
}

box{
margin-top: 2px;
float: left;
width: 150px;
height: 20px;
}

home, news, tutorial, tips, download{
display: block;
float: left;
background-color: #316bff;
margin-top: 0px;
float: left;
text-align : center;
color : #ffffff;
font-size: 14px;
font-family: times new roman;
font-weight: bold;
}

home{
float: left;
margin-left: 287px;
width: 50px;
height: 23px;
}

news{
float: left;
margin-left: 2px;
width: 110px;
height: 23px;
}

tutorial{
float: left;
margin-left: 2px;
width: 60px;
height: 23px;
}

tips{
float: left;
margin-left: 2px;
width: 90px;
height: 23px;
}

download{
float: left;
margin-left: 2px;
width: 75px;
height: 23px;
}

section{
width : 900px;
height : 450px;body{
margin : 10px auto;
width : 900px;
}

header, logo, um, te, nav, search, box, section, pict, article, event, footer{
display : block;
}

header{
height: 90px;
width: auto;
background-image : url(images/d.JPG);
}

logo{
float : left;
margin-left : 30px;
height : 90px;
width : 90px;
background-image : url(images/c.jpg);
}

te{
padding: 30px;
font-family : Times New Roman;
font-weight: bold;
font-size : 32px;
color : white;
}

um{
float: right;
margin-right : 2px;
margin-top : 30px;
height : 70px;
width : 100px;
background-image : url(images/b.jpg);
}

nav{
width: 900px;
height: 40px;
background-color : #bbdefb;
color : #459dff;
font-family: Times New Roman;
}

search{
float : left;
margin-top: 2px;
margin-left : 20px;
width : 50px;
height: 20px;
}

box{
margin-top: 2px;
float: left;
width: 150px;
height: 20px;
}

home, news, tutorial, tips, download{
display: block;
float: left;
background-color: #316bff;
margin-top: 0px;
float: left;
text-align : center;
color : #ffffff;
font-size: 14px;
font-family: times new roman;
font-weight: bold;
}

home{
float: left;
margin-left: 287px;
width: 50px;
height: 23px;
}

news{
float: left;
margin-left: 2px;
width: 110px;
height: 23px;
}

tutorial{
float: left;
margin-left: 2px;
width: 60px;
height: 23px;
}

tips{
float: left;
margin-left: 2px;
width: 90px;
height: 23px;
}

download{
float: left;
margin-left: 2px;
width: 75px;
height: 23px;
}

section{
width : 900px;
height : 450px;
background-color : #bbdefb;
}

pict{
float: left;
width: 300px;
height: 450px;
background-image : url(images/c.jpg);
}

article{
float : left;
text-align: center;
margin-left: 10px;
width: 580px;
height: 310px;
background-color : #ffffff;
font-size : 11px;
font-family : Lucida Console;
}

info{
float: left;
font-family : Times New Roman ;
font-size : 12px;
font-weight: bold;
color : #459dff;
margin-top: 1px;
margin-left: 10px;
width: 580px;
height: 20px;
background-color : #dcf4ff;
border-top: 1px solid black;
border-bottom: 1px solid black;
}

event{
float: left;
font-family : Times New Roman ;
font-size : 12px;
font-weight: bold;
color : #459dff;
margin-left: 10px;
width: 580px;
height: 115px;
background-color : #bbdefb;
}

footer{
clear : both;
height : 35px;
background-image : url(d.JPG);
text-align : center;
font-weight: bold;
font-family: times new roman;
color: white;
font-size: 12px;
}

linkmenu a:link, linkmenu a:visited, linkmenu a:active{
padding-left:2px;
text-decoration: none;
}

linkmenu a{
padding: 2px 0px 2px 5px; display: block;

margin: 0px 0px 1px; color: #ffffff;
}

linkmenu a:hover {
background: 376aeb no-repeat left center; color:#fffff;
}

list{
list-style-position: inside;
}
background-color : #bbdefb;
}

pict{
float: left;
width: 300px;
height: 450px;
background-image : url(b.jpg);
}

article{
float : left;
text-align: center;
margin-left: 10px;
width: 580px;
height: 310px;
background-color : #ffffff;
font-size : 11px;
font-family : Lucida Console;
}

info{
float: left;
font-family : Times New Roman ;
font-size : 12px;
font-weight: bold;
color : #459dff;
margin-top: 1px;
margin-left: 10px;
width: 580px;
height: 20px;
background-color : #dcf4ff;
border-top: 1px solid black;
border-bottom: 1px solid black;
}

event{
float: left;
font-family : Times New Roman ;
font-size : 12px;
font-weight: bold;
color : #459dff;
margin-left: 10px;
width: 580px;
height: 115px;
background-color : #bbdefb;
}

footer{
clear : both;
height : 35px;
background-image : url(e.JPG);
text-align : center;
font-weight: bold;
font-family: times new roman;
color: white;
font-size: 12px;
}

linkmenu a:link, linkmenu a:visited, linkmenu a:active{
padding-left:2px;
text-decoration: none;
}

linkmenu a{
padding: 2px 0px 2px 5px; display: block;

margin: 0px 0px 1px; color: #ffffff;
}

linkmenu a:hover {
background: 376aeb no-repeat left center; color:#fffff;
}

list{
list-style-position: inside;
}

lalu kita panggil script di atas menggunakan script HTML sperti yg kita ketahui bersama guySs,,
dan ini untuk script HTML nya guyss..
<!Doctype HTML>
<html lang="en">

<HEAD>
<TITLE>Your Title</TITLE>
<link rel="stylesheet" href="rumah4.css" type="text/css" />
</HEAD>

<BODY>

<HEADER>
<LOGO></LOGO>
<TE>WEB DESIGN</TE>
</HEADER>

<NAV><SEARCH>Search</SEARCH><BOX>
<INPUT type="text" size="20" />
</BOX>
<LINKMENU>
<HOME><a href="#">Home</a></HOME>
<NEWS><a href="#">News & Media</a></NEWS>
<TUTORIAL><a href="#">Tutorial</a></TUTORIAL>
<TIPS><a href="#">Tips & Trick</a></TIPS>
<DOWNLOAD><a href="#">Download</a></DOWNLOAD>
</LINKMENU>
</NAV>

<SECTION>
<PICT></PICT>
<ARTICLE>
Kamu dapat berkreasi sesuai dengan apa yg kalian mau pada halaman ini, seperti pada halaman web pada umumnya jadi kita menyediakan sebuah konten yg nantinya dapat kita gunakan untuk memberikan sebuah informasi bagi pengunjung.
</ARTICLE>
<INFO>Your_Information</INFO>
<EVENT><B>ELECTRO EVENT :</B>
<ul><li><a href="#">FUTSAL COMPETITION</a></li>
<li><a href="#"">ELEKTRO BAND</a></li>
<li><a href="#">LINE TRACER RoBOTIC</a></li>
<li><a href="#">WEB DESIGN</a></li>
</ul>
</EVENT>
</SECTION>
<FOOTER>
Home | News & Media | Tutorial | Tips & Tricks | Download
<BR>&copy CopyRight andibayu 2011
</FOOTER>
</BODY>
</HTML>

Soo, begitulah kawaNn cara kerja kita klau meng combine script css dengan script html,
benernya gambar diatas masih kurang dari sempurna sih, keburu aq upload aja di blogQ, hehHeeee
ntar pasti aq perbaikin kok,, update info dari blog ini yahh guySs..
Coba dulu daHh..
Gud Luck guyysss..

p1

Membuat Kalkulator Sederhana dengan JavaScript

Membuat Kalkulator Sederhana dengan JavaScript

Kali ini kita akan belajar mengenai bagaiman caranya membuat kalkukator sederhana dari sebuah halaman html guys,,, jadi bisa nggak yah?? sebuah halaman html dijadikan itungan kaya kalkulator sederhana gitu??? kalu ngak di combine dengan script java script, ya tentunya kita akan kerepotan guySs,
so, kalli ini saya akan menShare ilmu baru saya bagaimana caranya membuat aplikasi tampilan kalkulatro sederhana yg di kombinasikan dengan script javascript sebagai penyimpan function nya,
NiHh aq di dukung ma developt java script guyss, hehHehee
Suport by :











pertama saya akan buat script javascripnya dulu guys, kita tentuin semua function nya dulu, keys.. JANGAN LUPA, ntar scripnya dikasih nama dengan tipe file " .js "
kaytak script Q dibawah ini aq kasih nama "kalkulator.js"
nih scriptnya :

function penjumlahan(){
    var komponen = document.calc;
    var bil1 = parseInt(komponen.bil1.value);
    var bil2 = parseInt(komponen.bil2.value); 
    var op = komponen.op.value;
    var hasil;
    hasil = bil1 + bil2;
    komponen.hasil.value = hasil;
}

function pengurangan(){
    var komponen = document.calc;
    var bil1 = parseInt(komponen.bil1.value);
    var bil2 = parseInt(komponen.bil2.value); 
    var op = komponen.op.value;
    var hasil;
    hasil = bil1 - bil2;
    komponen.hasil.value = hasil;
}

function perkalian(){
    var komponen = document.calc;
    var bil1 = parseInt(komponen.bil1.value);
    var bil2 = parseInt(komponen.bil2.value); 
    var op = komponen.op.value;
    var hasil;
    hasil = bil1 * bil2;
    komponen.hasil.value = hasil;
}

function pembagian(){
    var komponen = document.calc;
    var bil1 = parseInt(komponen.bil1.value);
    var bil2 = parseInt(komponen.bil2.value); 
    var op = komponen.op.value;
    var hasil;
    hasil = bil1 / bil2;
    komponen.hasil.value = hasil;
}

function bersih(){
var elemen = document.calc;

elemen.bil1.value = "";
elemen.bil2.value = "";
elemen.hasil.value = "";
}

lanjutNya tentu kita buat script htmlnya untuk memanggil function yang udah kita buat pada script html nya itu tadi guySs,,,
untuk kali ini saya menamai file html yaitu " simple_kalkulator.html "
dan ini sciptnya guys :

<!DOCTYPE html>
<html lang="en">
<head>
<title>Aplikasi Calculator</title>
<script language="JavaScript" type="text/javascript" src="kalkulator.js"></script>
</head>
<hr color="red" width="300px" size="10px" align="left" />
<font size="4" color="blue"> Aplikasi Kalkulator dengan Java Script</font>
<hr color="red" width="300px" size="10px" align="left" /><br>
<form name="calc" action="#">
Masukkan Bilangan Pertama
<br><input type="text" size="25" name="bil1" /><br>
Masukkan Bilangan Kedua
<br><input type="text" size="25" name="bil2" /><br>
<input name="op" type="button" value="+" onclick="penjumlahan()" />
<input name="op" type="button" value="-" onclick="pengurangan()" />
<input name="op" type="button" value="x" onclick="perkalian()" />
<input name="op" type="button" value="/" onclick="pembagian()" /><br>
<br>Hasil Perhitungan
<br><input type="text" size="25" name="hasil" readonly /><br>
<br><input name="op" type="button" value="reset" onclick="bersih()" /><br>
<br><hr color="brown" width="300px" size="10px" align="left"></hr>
<font size="3" color="blue">&copy; 2011, CopyRight by andibayu - 2009533420400</font>
<hr color="brown" width="300px" size="10px" align="left"></hr>
</body>
</html>


nah itulah semua scipt untuk membuat file html guys, semoga bermanfaat bagi kalian semua. dan lanjutnya mari kita liat tampilannya bareng2 yoKk...
inini jadi nya guySs..

p1

Perkembangan Teknologi Informasi

PERKEMBANGAN TEKNOLOGI INFORMASI


Assalamu’alaikum wr.wb
Pada pembahasan kali ini kita akan membahas mengenai kajian perkembangan Teknologi Informasi. Jika berbicara mengenai perkembangan tentunya tidak terlepas membahas kaitan nya dari sejarah awal mula muncul teknologi,mulai dari jaman purba sampai dengan sekarang. Dan tentunya ini akan menjadi wawasan yang menarik bagi para penggila IT.
A. SEJARAH TEKNOLOGI INFORMASI
Dahulu, sebelum mulanya orang mengenal teknologi, banyak orang yang masih menggunakan tenaga manual, yakni hanya mengandalkan tenaga dan kemampuan tangan nya dalam menyelesaikan banyak tugas nya, dalam menyampaikan berbagai informasinya pun juga masih sangat tradisional yakni melalui goresan pada batu, pohon, daun, kulit binatang, dll. Berkembang lagi dari waktu sebellumnya yakni dengan bantuan mekanis, yakni mulai sedikit menggunakan keahlian menggunakan alat mekanik tradisional yang di gerakkan oleh tangan manusia seperti pascaline (blaise pascal 1642), kartu perforasi (Holerith 1889),Abacus ( alat hitung sempoa ). Seiring dengan kemajuan jaman dan makkin berkembang nya teknologi, akhirnya di gunakan lah alat elektronis sebagai awal mula perkembangan teknologi yang bekerja secara elektrik. Hal ini di awali dengan perkembangan computer dari generasi ke generasi sampai sekarang.
• Perkembangan Komputer Dari Generasi ke Generasi.
1. Komputer Generasi I
Masih menggunakan tabung hampa ( vacuum tube ), yakni masih menggunakan tabung gelas dengan sirkuit di dalam nya, Berukuran fisik sangat besar, masih menggunakan konsep stored-program dengan memori utamanya adalah magne- tic core storage. Cepat panas, sehingga memerlukan pendingin. Prosesnya kurang cepat. Membutuhkan daya listrik yang besar.
Contoh : ENIAC ( Elektronic Numerical Integrator and Computer ).

2. Komputer Generasi II
Pada computer generasi ini menggunakan transistor untuk menggantikan tabung hampa. Transistor mulai digunakan di komputer pada tahun 1956. Mengganti- kan bahasa mesin dengan assembly. Kapasitas memori utama sudah cukup besar sampai puluhan ribu karakter. Beberapa bahasa pemrograman tingkat tinggi mulai bermunculan, seperti Common Business-Oriented Language (COBOL), Formula Translator (FORTRAN), Algorithmic Language (ALGOL).
Contoh : UNIVAC ( Universal Automatic Computer ) merupakan computer pertama yang di komersialkan.

3. Komputer Generasi III
Pada generasi ini sudah menggunakan transistor namun menimbulkan panas yang cukup besar. Dan akhirnya tahun 1958 seorang Jack Kilby, yakni insinyur di Texas Instruments, mengembangkan sirkuit terintegrasi (IC, integrated circuit). Dengan mengombinasikan tiga komponen elektronik dalam sebuah piringan silikon kecil. Para ilmuwan kemudian berhasil memasukkan lebih banyak komponen ke dalam suatu chip tunggal yang disebut semikonduktor. IC yang meliputi komponen transistor, resistor, dan kapasitor diintegrasikan ke dalam chip tunggal. Pada generasi ini juga memunculkan microprosesor pertama yakni Intel 4004 Microprosesor.

4. Komputer Generasi IV
Tujuan pengembangan menjadi lebih jelas yakni dengan mengecilkan ukuran sirkuit dan komponen-komponen elektrik. Large Scale Integration (LSI) dapat memuat ratusan komponen dalam sebuah chip.


5. Komputer Generasi V
Berkat kepopulerannya di kalangan rumah tangga maupun dunia bisnis, pada sekitar tahun 1982 Komputer Pribadi (Personal Computer) yang oleh Majalah “Time” diberi gelar “Man of The Year”. Selanjutnya menjelang tahun 1990-an, kemampuan Komputer pribadi meningkat secara drastis hampir menyamai kemampuan komputer multiuser. Kini komputer tingkat tinggi (higher-end computer) lebih sering membedakannya dari komputer pribadi dari segi kestabilan serta kemampuan multitasking yang lebih baik, daripada hanya bergantung semata-mata pada kemampuan CPU

Apabila di ambil kesimpulan dari setiap generasi, maka akan terlihat perbedaaan yang spesifik dari masing masing generasi, kita lihat saja dari :
1. Ukuran
Ukuran yang dulu besar pada generasi ke 1, sekarang sudah menjadi kecil
2. Harga
Harga yang dulu pasti mahal, sekarang pasti sudah lebih murah jika dibandingkan dengan koputer janman dahulu.
3. Speed
Dulu kecepatan yang lambat, sekarang sudah berbenah semakin cepat.
4. Memory
Memory yang dulunya mempunyai kuantitas penyyimpanan ang sedikit, kini ukuran nya pun semakin kecil namun memiliki daya penyimpanan data yang besar.

B. KLASIFIKASI KOMPUTER
Dilihat dari klasifikasinya, ada 5 sub bahasan , yakni sbb :
1. Supercomputer
Supercomputer adalah manipulator angka berkecepatan sangat tinggi yang digunakan terutama untuk aplikasi-aplikasi ilmiah dan rekayasa. Generasi baru dari superkomputer berbeda dari komputer mainframe konvensional dalam penggunaan pemroses paralel.
2. Mainframe
Mainframe adalah istilah teknologi informasi dalam bahasa Inggris yang mengacu kepada kelas tertinggi dari komputer yang terdiri dari komputer-komputer yang mampu melakukan banyak tugas komputasi yang rumit dalam waktu yang singkat. Mainframe umumnya digunakan oleh banyak pengguna yang terkoneksi dengan menggunakan terminal. Mainframe yang memiliki kekuatan pemrosesan paling kuat dinamakan superkomputer, mampu melakukan banyak komputasi yang rumit yang memerlukan waktu lama dan umumnya digunakan dalam riset para ilmuwan, untuk pemrosesan data perusahaan atau untuk keperluan militer

3. Workstation
Dalam bahasan jaringan komputer, istilah workstation biasanya dipakai untuk menyebut komputer (yang dipakai oleh pengguna) yang terhubung ke suatu jaringan. Dalam pengertian yang lain, workstation diartikan sebagai single user komputer yang berdaya penuh yang penggunaannya biasanya ditujukan untuk aplikasi high end graphics dan aplikasi desain tambahan. Disebut juga dengan nama graphics workstation

4. Microcomputer
Merupakan jenis computer yang ukuran fisiknya kecil, tetapi mempunyai kemampuan untuk mengolah data dalam jumlah yang besar.
Perbedaan antara mikrokomputer dengan komputer mini saat ini sudah tidak terlalu jauh, terutama dalam hal kemampuan memproses data.
Komputer ini khususnya digunakan untuk single-user, biasa disebut juga dengan komputer desktop atau komputer pribadi (personal computer). Komputer ini sudah dirancang sedemikian rupa untuk mampu berinteraksi dengan penggunanya. Penggunaanya sangat populer pada penggunaan di rumah, atau untuk menjalankan aplikasi bisnis.



5. Microcontroller
Microcontroller memiliki semua peralatan pokoknya sebagai sebuah komputer dalam satu chip. Peralatan tersebut diantaranya adalah:
- pemroses (processor)
- Memori,
- Input dan output
Kadangkala pada microcontroller ini beberapa chip digabungkan dalam satu papan rangkaian. Perangkat ini sangat ideal untuk mengerjakan sesuatu yang bersifat khusus, sehingga aplikasi yang diisikan ke dalam komputer ini adalah aplikasi yang bersifat dedicated.

Di dalam Teknologi Informasi tidak dapat terlepas dari istilah data dan informasi. Data dan Informasi adalah dua istilah yang berbeda. Data merupakan suatu kumpulan fakta, data diperlakukan sebagai raw material yang berarti masih mentah. Data bisa berupa gambar, tulisan, suara, video, dll. Contohnya: Mahasiswa, Mata Kuliah, dsb. Sedangkan informasi adalah data yang sudah mengalami pemrosesan sehingga memiliki makna / arti di dalamnya. Informasi ini berupa data yang saling berhubungan atau data setelah dimanipulasi. Informasi dapat dibedakan kedalam Informasi Perfect dan Informasi Inperfect. Informasi Perfect berupa informasi yang benar / pasti berdasarkan kenyataan. Misalkan “ Mahasiswa UM libur mulai H-3 Lebaran”. Informasi Inperfect masih bersifat belum pasti atau berupa kemungkinan, dugaan, prediksi, dsb. Misalkan “ kemungkinan liburan lebaran tahun ini di UM mulai H-5”. Dalam kehidupan sehari-hari banyak sekali kita temui sumber informasi mulai dari Media massa, Alat telekomunikasi, Elektronik, Pengamatan langsung di lapangan, Kuisioner, Pemodelan/simulasi, maupun pencatatan atau perekaman atas suatu kejadian.
Suatu informasi yang baik memiliki karakteristik antara lain;
- Tepat waktu
- Akurat
- Mudah diakses
- Menghilangkan keraguan
- Berhubungan
- Berdasarkan fakta
Sejak manusia berhubungan dengan Informasi, perubahan dan perkembangan dunia informasi senantiasa terjadi dari masa ke masa. Evolusi Abad Informasi dapat dibedakan sebagai berikut:
- Abad Pertanian (Tahun < 1800)
 Bertani, menggunakan tenaga manusia dan tangan
- Abad Industri (1800 – 1957)
 Bekerja di pabrik, menggunakan tenaga manusia dan mesin
- Abad Informasi (1957 – sekarang)
 Pekerja terdidik, menggunakan tenaga dan teknologi informasi
Pada saat ini kita mengenal Masyarakat Informasi, yaitu Suatu masyarakat dimana banyak sebagian besar orang melibatkan dirinya dengan bidang informasi dalam pekerjaannya daripada bidang yang lain seperti bidang pertanian ataupun industri.
Teknologi dan Teknologi Informasi
Teknologi adalah Ilmu yang berkaitan dengan seni atau sains dengan pengaplikasian pengetahuan saintifik ke praktis. Sedangkan Teknologi Informasi menurut Kamus Oxford (1995) adalah studi atau penggunaan peralatan elektronika, terutama komputer, untuk menyimpan, menganalisis, dan mendistribusikan informasi apa saja, termasuk kata-kata, bilangan, dan gambar.
Tujuan dari adanya Teknologi Informasi adalah Memecahkan masalah, membuka kreativitas, efektivitas dan efisiensi.
Sedangkan Fungsinya adalah Menangkap (Capture), Mengolah (Processing), Menghasilkan (Generating), Menyimpan (Storage), Mengambil Kembali (Retrieval), Melakukan Transmisi (Transmission).
Komponen teknologi Informasi
Ada tiga Komponen utama teknologi informasi yaitu:
- Hardware; yaitu bagian-bagian fisik dari sebuah teknologi
- Software ; yaitu sekelompok item atau objek yang membentuk “konfigurasi” di mana di dalamnya termasuk program ,dokumen,data.
- Brainware; yaitu manusia sebagai user dari Sistem Komputer.
Selain itu dikenal istilah lain yaitu firmwere dan infowere. Firmwere adalah Softwere yang tertanam semipermanen di dalam suatu hardwere. Infowere adalah dokumen pendukung softwere, seperti lisensi, User Manual, Help dll.

p1

8 kata kunci kebahagiaan

8 Pesan Kata Untukmu

1. Kehadiran : jadikan kehadiran anda sebagai pembawa kebahagiaan

2. Mendengar : tatap wajahnya, tidak perlu menyela, mengkritik, apalagi menghakimi, biarkan ia menuntaskannya, ini memudahkan anda memberikan tanggapan yang tepat setelah itu, tidak harus berupa diskusi atau penilaian, sekedar ucapan terima kasihpun akan terdengar manis baginya

3. Diam : seperti kata-kata, di dalam diam juga ada kekuatan, diam bisa dipakai untuk menghukum, mengusir atau membingungkan orang. Tapi lebih dari segalanya, diam juga bisa menunjukkan kecintaan kita pada seorang karena memberinya “ruang”. Terlebih jika sehari-hari kita sudah terbiasa gemar menasehati, mengatur, mengkritik bahkan mengomel

4. Kebebasan : memberi kebebasan adalah salah satu perwujudan cinta, makna kebebasan bukanlah “kau bebas berbuat semaumu”, lebih dalam dari itu, memberi kebebasan adalah memberinya kepercayaan penuh untuk bertanggung jawab atas segala hal yang ia putuskan atau lakukan

5. Keindahan : tampil indah dan rupawan juga merupakan sebuah kado yang indah, selain keindahan suasana di rumah, vas dan bunga segar cantik di ruang keluarga atu meja makan yang tertata indah misalnya

6. Tanggapan positif : tanpa sadar sering kita memberikan penilaian negatif terhadap pikiran, sikap, atautindakan orang yang kita sayangi. Seolah-olah tidak ada yang benar dari dirinya dan kebenaran mutlak hanya pada kita, kali ini coba hadiahkan tanggapan positif , nyatakan dengan jelas dan tulus. Coba anda ingat berapa kali dalam seminggu terakhir anda mengucapkan terima kasih atas segala hal yang dilakukannya demi anda, ingat-ingat pula pernahkah anda memujinya, kedua hal itu, ucapan terima kasih dan pujian (dan juga permintaan ma’af) adlah kado indah yang sering terlupakan

7. Kesediaan mengalah : tidak semua masalah layak menjadi bahan pertengkaran, apalagi sampai menjadi pertengkaran yang hebat, bila anda memikirkan hal ini, berarti anda siap memberikan kado “kesediaan mengalah”. Kesediaan untuk mengalah juga dapat melunturkan sakit hati dan mengajak kita menyadari bahwa tidak ada manusia yang sempurna di dunia ini

8. Senyuman : percaya atau tidak, kekuatan senyuman amat luar biasa, senyuman, terlebih yang diberikan dengan tulus, bisa menjadi pencair hubungan yang beku, pemberi semangat dalam keputusasaan, pencerah suasana muram, bahkan obat penenang jiwa yang resah. Senyuman juga merupakan isyarat untuk membuka diri dengan dunia sekeliling kita, kapan terakhir kali anda menghadiahkan senyuman manis pada orang yang dikasihi..

Sadari itu kawaNn..
Percaya dengan penuh keyakinan mu bahwa hidup itu teramat indah untuk dinikmati...
jadikan dirimu sbg orang yg berarti di mata orang lain..
Chayoo Guys...

Suport By :

p1

Pemanfaatan Media Blog Sebagai Sarana Pembelajaran di Era Modern

Pemanfaatan Media Blog Sebagai Sarana Pembelajaran di Era Modern

Ketika banyak orang menggunakan media blog, sebagai sarana dalam berbagi ilmu (share) dari semua penulis yang di tujujukan kepada pembaca, dari situ saya berusaha menuliskan apa pentingnya sebuah blog, ketika dapat di representasikan dalam media pembelajaran
Dalam hal ini, saya menuangkan nya dalam bentuk makalah sederhana guySs, moga dapat menjadi wacana, dan ilmu yg saling kita share dapat bermanfaat sebagaimana mestinya,, hehe


Makalah Suport By :




BAB I
PENDAHULUAN

1.1 Latar Belakang
Perkembangan ilmu dan teknologi merupakan salah satu produksi dari manusia yang terdidik, dan pada gilirannya manusia-manusia itu perlu lebih mendalami dan mampu mengambil manfaat dan bukan menjadi korban dari perkembangan ilmu dan teknologi sendiri. Mendalami serta mengambil manfaat dari perkembangan ilmu dan teknologi tidak mungkin dilakukan oleh semua manusia dengan kadar waktu yang sama. Keterbatasan manusia dan waktu menuntut adanya spesialisasi yang semakin mendalam.
Pembelajaran dewasa ini menghadapi dua tantangan, tantangan yang pertama datang dari adanya perubahan persepsi tentang belajar itu sendiri dan tantangan yang kedua datang dari adanya teknologi informasi dan telekomunikasi yang memperlihatkan perkembangan yang luar biasa. Konstruktivisme pada dasarnya telah menjawab tantangan yang pertama dengan meredefinisi belajar sebagai proses konstruktif di mana informasi diubah menjadi pengetahuan melalui proses interpretasi, korespondensi, representasi, dan elaborasi. Sementara itu, kemajuan teknologi informasi dan telekomunikasi yang begitu pesat yang menawarkan berbagai kemudahan-kemudahan baru dalam pembelajaran memungkinkan terjadinya pergeseran orientasi belajar pada masyarakat. Lebih dari itu, teknologi ini ternyata turut pula memainkan peran penting dalam memperbarui konsepsi pembenaran yang semula fokus pada pembelajaran sebagai semata-mata suatu penyajian berbagai pengetahuan menjadi pembelajaran sebagai suatu bimbingan agar mampu melakukan eksplorasi sosial-budaya yang kaya akan pengetahuan.
Permasalahan yang sering muncul berkenaan dengan penggunaan media pembelajaran,
yakni ketersediaan dan pemanfaatan. Ketersediaan media, masih sangat kurang sehingga para
pengajar menggunakan media secara minimal. Media yang sering digunakan adalah media cetak (diktat, modul, hand out, buku teks, majalah, surat kabar, dan sebagainya), dan didukung dengan alat bantu sederhana yang masih tetap digunakan seperti papan tulis/white board dan kapur/spidol. Sedangkan media audio dan visual (kaset audio, siaran TV/Radio, overhead transparency, video/film,), dan media elektronik (komputer, internet) masih belum secara intensif dimanfaatkan. Masalah kedua, pemanfaatan media. Media cetak merupakan media yang paling sering digunakan oleh pengajar, karena mudah untuk dikembangkan maupun dicari dari berbagai sumber. Namun, kebanyakan media cetak sangat tergantung pada verbal symbols (kata-kata) yang bersifat sangat abstrak, sehingga menuntut daya imajinasi yang sangat tinggi dari pebelajar, hal inilah yang dapat menyulitkan mereka untuk memahami informasi yang terkandung didalamnya. Karena itu dalam pemanfaatan media ini, diperlukan kreativitas dan juga pertimbangan instruksional yang matang dari pengajar. Kenyataan yang sering terlihat adalah, banyak pengajar menggunakan media pembelajaran seadanya tanpa pertimbangan pembelajaran.
Salah satu media yang sangat menarik untuk dimanfaatkan dalam pembelajaran adalah media Web Blog atau biasa disebut dengan Blog. Menurut wikipedia.com, Blog adalah bentuk aplikasi web yang menyerupai tulisan-tulisan (yang dimuat sebagai posting) pada sebuah halaman web umum. Tulisan-tulisan ini seringkali dimuat dalam urut terbalik (isi terbaru dahulu baru kemudian diikuti isi yang lebih lama), meskipun tidak selamanya demikian.
Blog sebagai salah satu layanan aplikasi dari internet dapat dimanfaatkan oleh pengajar dan pebelajar sebagai sumber belajar yang tidak terbatas. Pengajar dapat meng-upload semua informasi yang berkaitan dengan materi pembelajaran yang diajarkan dengan menambahkan multimedia (gambar, animasi, efek suara dan video) agar menarik dan lebih mudah dipelajari. Dilihat dari pihak lain, pebelajar dapat men-download informasi yang sesuai dengan topik dan tujuan yang diinginkan.
Penggunaan Blog sebagai sebagai media pembelajaran sekaligus sebagai sumber belajar sedikitnya akan mengubah cara belajar dan teknik pembelajaran agar tidak monoton sehingga dapat memotivasi pebelajar dalam mempelajari sesuatu.

1.2 Rumusan Masalah
Dari latar belakang yang telah diuraikan di atas dapat dkemukakan rumusan masalah, sebagai berikut:
1.2.1 Apakah yang dimaksud dengan Blog?
1.2.2 Bagaimana sejarah munculnya Blog?
1.2.3 Bagaimana pemanfaatan Blog sebagai sumber belajar?

1.3 Tujuan
Adapun tujuan dari makalah ini adalah:
1.3.1 Untuk mengetahui pengertian Blog.
1.3.2 Untuk mengetahui sejarah munculnya Blog.
1.3.3 Untuk mengetahui pemanfaatan Blog sebagai sumber belajar.

1.4 Manfaat
Makalah ini diharapkan dapat memberi manfaat yaitu sebagai bahan masukan bagi para pengajar dan pihak yang berkecimpung dalam dunia pendidikan dalam menggunakan media pembelajaran yang menarik yang nantinya dapat menunjang pembelajaran di masyarakat.
 


BAB II
PEMBAHASAN


2.1 Pengertian Blog
Di zaman yang serba modern ini, hampir setiap pengguna internet di Indonesia membicarakan mengenai Blog. Istilah Weblog yang kemudian disingkat menjadi Blog sebenarnya mulai dikenal sejak tahun 1997, namun baru populer pada tahun 2000. Blog adalah bentuk aplikasi web yang menyerupai tulisan-tulisan (yang dimuat sebagai posting) pada sebuah halaman web umum. Tulisan-tulisan ini seringkali dimuat dalam urut terbalik (isi terbaru dahulu baru kemudian diikuti isi yang lebih lama), meskipun tidak selamanya demikian.
Saat ini, Blog sudah menjadi bagian tak terpisahkan dari dunia WWW dan dunia per-internet-an. Blog sudah mulai dijadikan sebagai sumber berita oleh koran-koran, majalah, radio, bahkan televisi juga sudah menyiarkan beritanya lewat Blog mereka. Dunia pendidikan pun sudah banyak menampilkan materi pendidikan di dalam Blog yang telah dibuat khusus maupun tidak khusus untuk dunia pendidikan.
Didalam Blog para pengajar maupun pihak yang berkecimpung dalam dunia pendidikan dapat mem-posting materi-materi yang mereka anggap berguna bagi para pencari informasi pendidikan. Sedangkan pencari informasi pendidikan pun dapat berpartisipasi mengembangkan maupun sekedar memberikan komentar dari isi Blog yang telah dilihat.

2.2 Sejarah Lahirnya Blog
Di masa lalu, dunia web masih memiliki tampilan yang sederhana, dengan warna background yang tidak menarik, teks warna hitam, dan link berwarna biru. Kemudian berangsur-angsur muncullah gambar, suara, animasi, dan video yang membuat tampilan web menjadi lebih menarik. Walaupun demikian, tampilan halaman web masih terlihat statis. Walaupun sudah ada pendekatan untuk memisahkan data dengan tampilan web dengan cara menyimpan data ke database, namun tetap saja tampilannya berubah jika ada yang meng-update-nya secara manual.
Pada akhir tahun 1990-an mulai muncul software untuk membuat Blog dan muncul juga layanan-layanan lain yang mmbuat orang mudah membuat website dan meng-update-nya secara kontinyu. Fasilitas-fasilitas ini mulai berevolusi hingga menjadi layanan Blog seperti sekarang ini. Dengan menggunakan layanan blogging, seseorang tidak perlu melakukan koding HTML secara manual untuk menentukan letak isi artikel-artikel. Pengguna hanya perlu mengisikan isi artikel ke sebuah form dan menyimpannya, maka isi artikel tersebut otomatis akan ditampilkan oleh software blogging tersebut. Dengan dimikian, proses penggantian konten website menjadi lebih mudah, cepat, dan tidak mahal.

2.3 Pemanfaatan Blog Sebagai Sumber Belajar
2.3.1 Pengertian Pemanfaatan
Dalam kehidupan sehari-hari manusia tidak akan dapat terlepas dari kata belajar, baik itu belajar dalam lingkungan formal maupun belajar di lingkungan non-formal. Saat manusia belajar sesuatu maka mereka secara sadar maupun tidak sadar telah memanfaatkan sumber belajar yang ada berupa buku, tv, radio, manusia, bahkan internet.
Purwanto dalam blognya memberikan pengertian pemanfaatan yaitu sebagai aktivitas menggunakan proses dan sumber belajar. Ada lima aspek dalam pemanfaatan, yaitu:
a. Media sebagai teknologi mesin
b. Media sebagai tutor
c. Media sebagai pemotivasi belajar
d. Media sebagai alat berpikir dan memecahkan masalah

2.3.2 Pengertian Sumber Belajar
Sumber belajar adalah apa saja (orang, bahan, alat, teknik, lingkungan) yang mendukung serta memungkinkan memberikan kemudahan dan kelancaran terjadinya belajar, serta memungkinkan terjadinya interaksi antara pebelajar dengan sumber belajar tersebut.
Sumber belajar dapat dikelompokan menjadi dua bagian, yaitu :
a. Sumber belajar yang sengaja direncanakan (learning resources by design), yakni semua sumber yang secara khusus telah dikembangkan sebagai komponen sistem instruksional untuk memberikan fasilitas belajar yang terarah dan bersifat formal Contohnya adalah : buku pelajaran, modul, program audio, transparansi (OHT).
b. Sumber belajar yang karena dimanfaatkan (learning resources by utilization), yakni sumber belajar yang tidak secara khusus didisain untuk keperluan pembelajaran namun dapat ditemukan, diaplikasikan, dan dimanfaatkan untuk keperluan belajar. Contohnya: pejabat pemerintah, tenaga ahli, pemuka agama, guru, olahragawan, kebun binatang, waduk, museum, film, sawah, terminal, surat kabar, siaran televisi, internet (dalam hal ini berupa Blog) dan masih banyak lagi yang lain.
Media massa adalah suatu jenis komunikasi yang ditujukan kepada sejumlah khalayak yang tersebar, heterogen, dan anonim melewati media cetak atau elektronik, sehingga pesan informasi yang sama dapat diterima secara serentak dan sesaat. Pengertian "dapat" di sini menekankan pada pengertian, bahwa jumlah sebenarnya penerima pesan informasi melalui media massa pada saat tertentu tidaklah esensial. Adapun bentuk media massa, secara garis besar, ada dua jenis, yaitu : media cetak (surat kabar dan majalah, termasuk buku-buku) dan media elektronik (televisi dan radio, termasuk internet)
Agar bisa terjadi kegiatan belajar pada si pebelajar, maka pebelajar harus secara aktif melakukan interaksi dengan berbagai sumber belajar. Perubahan perilaku sebagai hasil belajar hanya mungkin terjadi jika ada interaksi antara pebelajar dengan sumber-sumber belajar. Inilah yang seharusnya diusahakan oleh setiap pebelajar (instructor, guru) dalam kegiatan pembelajaran. Oleh karena itu para pendidik maupun yang berkompeten dalam hal itu dituntut untuk kreatif dalam menciptakan sumber belajar yang dapat dimanfaatkan oleh pebelajar dalam memahami materi tertentu.

Sumber belajar memiliki fungsi :
a. Meningkatkan produktivitas pembelajaran dengan jalan: (a) mempercepat laju belajar dan membantu guru untuk menggunakan waktu secara lebih baik dan (b) mengurangi beban guru dalam menyajikan informasi, sehingga dapat lebih banyak membina dan mengembangkan gairah.
b. Memberikan kemungkinan pembelajaran yang sifatnya lebih individual, dengan cara: (a) mengurangi kontrol guru yang kaku dan tradisional; dan (b) memberikan kesempatan bagi siswa untuk berkembang sesuai dengan kemampuannnya.
c. Memberikan dasar yang lebih ilmiah terhadap pembelajaran dengan cara: (a) perancangan program pembelajaran yang lebih sistematis; dan (b) pengembangan bahan pengajaran yang dilandasi oleh penelitian.
d. Lebih memantapkan pembelajaran, dengan jalan: (a) meningkatkan kemampuan sumber belajar; (b) penyajian informasi dan bahan secara lebih kongkrit.
e. Memungkinkan belajar secara seketika, yaitu: (a) mengurangi kesenjangan antara pembelajaran yang bersifat verbal dan abstrak dengan realitas yang sifatnya kongkrit; (b) memberikan pengetahuan yang sifatnya langsung.
f. Memungkinkan penyajian pembelajaran yang lebih luas, dengan menyajikan informasi yang mampu menembus batas geografis.
2.3.3 Pemanfaatan Blog Sebagai Sumber Belajar
Di tengah dunia yang semakin modern ini pemanfaatan teknologi dalam dunia pendidikan pun tidak dielakkan lagi. Dengan adanya teknologi modern, arus informasi semakin tak dapat terbendung lagi. Semua orang diseluruh dunia dapat mengetahui apa yang mereka inginkan melalui internet. Internet dapat menghilangkan batas ruang dan waktu sehingga siapa pun dapat memanfaatkanya.
Pemanfaatan internet dalam dunia pendidikan telah gencar dilakukan diberbagai negara. Bahkan internet sudah menjadi bagian yang tidak dapat dipisahkan dalam dunia pendidikan. Blog salah satu produk yang dihasilkan oleh internet dapat dimanfaatkan sebagai sumber belajar karena Blog dapat dibuat oleh siapa pun dengan sangat mudah dan yang paling penting Blog dapat dibuat dengan gratis.
Fakta di lapangan tentang penggunaan internet di kalangan para siswa dan pelajar, lebih banyak dimanfaatkan untuk melakukan hal-hal yang kurang produktif, seperti terlalu banyak chatting, friendster-an, bermain game online, dan mengakses pornografi. Blog yang jumlahnya berlipat 2 setiap 6 bulan, yang pemiliknya dari kalangan siswa dan remaja jumlahnya sangat signifikan, hal ini merupakan fenomena yang harus dimanfaatkan untuk meningkatkan kualitas pendidikan yaitu dengan membuat Blog yang berkualitas agar masyarakat pebelajar dapat dengan mudah memperoleh informasi yang dibutuhkan. Selain berkualitas, Blog yang dibuat harus juga menarik agar pebelajar makin betah belajar didunia maya.
Berbagai referensi, jurnal, maupun hasil penelitian dapat dengan mudah di download diberbagai Blog di seluruh dunia. Cukup memanfaatkan search engine, materi-materi yang dibutuhkan dapat diperoleh dengan cepat. Selain menghemat tenaga dan biaya dalam mencarinya, materi-materi yang dapat ditemui cenderung lebih up to date. Adapun manfaat Blog bagi pebelajar adalah sebagai berikut:
a. meningkatkan pengetahuan,
b. berbagi sumber diantara rekan sejawat,
c. bekerjasama dengan pengajar di luar negeri,
d. kesempatan mempublikasikan informasi secara langsung,
e. mengatur komunikasi secara teratur, dan
f. berpartisipasi dalam forum-forum lokal maupun internasional.
Di samping itu para pengajar juga dapat memanfaatkan Blog sebagai sumber bahan mengajar dengan mengakses rencana pembelajaran atau silabus online dengan metodologi baru, mengakses materi kuliah yang cocok untuk mahasiswanya, serta dapat menyampaikan ide-idenya. Sementara itu mahasiswa juga dapat menggunakan internet untuk belajar sendiri secara cepat, sehingga akan meningkatkan dan memperluas pengetahuan, belajar berinteraksi, dan mengembangkan kemampuan dalam bidang penelitian.
Blog juga dapat dimanfaatkan oleh para guru untuk media pembelajaran, yaitu Blog guru sebagai pusat pembelajaran. Guru dapat menuliskan materi belajar, tugas, maupun bahan diskusi di blognya, kemudian para muridnya bisa berdiskusi dan belajar bersama-sama di blog gurunya tersebut. Selain itu blog guru dan murid juga dapat saling berinteraksi. Guru, yang harus memiliki Blog, mengharuskan murid memiliki blognya masing-masing, sebagai sarana mengerjakan tugas-tugas yang diberikan oleh gurunya. Metode ini bisa memacu iklim kompetisi antar siswa, karena tentu saja para siswa ingin blognya menjadi yang terbaik. Setelah semua siswa memiliki Blog dibuatlah suatu komunitas blogger pebelajar. Ada sebuah Blog sebagai pusat pembelajaran (bisa berupa blog aggregator atau blog dengan beberapa kontributor), dengan guru-guru dan siswa dari berbagai sekolah bisa tergabung dalam komunitas blogger pebelajar tersebut.

BAB III
PENUTUP


3.1 Kesimpulan
Blog adalah bentuk aplikasi web yang menyerupai tulisan-tulisan (yang dimuat sebagai posting) pada sebuah halaman web umum. Didalam Blog para pengajar maupun pihak yang berkecimpung dalam dunia pendidikan dapat mem-posting materi-materi yang mereka anggap berguna bagi para pencari informasi pendidikan. Sedangkan pencari informasi pendidikan pun dapat berpartisipasi mengembangkan maupun sekedar memberikan komentar dari isi Blog yang telah dilihat. Berbagai referensi, jurnal, maupun hasil penelitian dapat dengan mudah di download diberbagai Blog di seluruh dunia. Cukup memanfaatkan search engine, materi-materi yang dibutuhkan dapat diperoleh dengan cepat. Selain menghemat tenaga dan biaya dalam mencarinya, materi-materi yang dapat ditemui cenderung lebih up to date. Untuk menunjang pendidikan sebaiknya Blog yang dibuat harus berkualitas dan menarik agar pebelajar dapat memperoleh informasi yang bermanfaat.

3.2 Saran
Sebagai seorang yang bergerak di dunia pendidikan baik itu sebagai guru, dosen, penulis, maupun pustakawan sebaiknya lebih memperhatikan penggunaan teknologi canggih yang memiliki manfaat lebih seperti Blog dalam menyebarkan segala informasi yang bersifat mendidik masyarakat, selain menghemat biaya juga dapat menghemat ruang dan waktu yang tersedia.

p1

ilmu iseng"(NGE HACK FB)

NGE HACK FB

Halo guys, bosen kalu ngomongin materi kuliah trus, hehe ( awas ketauan dosen ), so..
Kali ini ayok kita sharing gimana caranya biar akun FB kita jadi amaNn..
Tujuan saya baik loh ya guys, buat security dan tambahan ilmu aja biar jejaring kita nggak ada yang uthek2, alias nge bajaKk… hehe ^_^
Ini adalah teknik untuk mendapatkan password facebook orang dengan sangat mudah. Kita hanya mengirimkan email ke mesin hacker setelah itu password facebook korban akan langsung dikirim ke email kita.
 NB. WARNING !!!!!!
(HANYA UNTUK MENAMBAH WAWASAN AGAR KITA LEBIH BERHATI-HATI,MOHON JANGAN DISALAHGUNAKAN!!!)
Supported BY : 

Lakukan langkah-langkah dibawah :
1.    Login email facebook anda dan lanjutkan ke halaman mengirim pesan.
2.    Ini adalah format pesan yang harus anda kirim ke autohackfacebook@gmail.com
·         Kirim email ke : autohackfacebook@gmail.com
·         bcc: cc: (biarkan kosong)
·         Subject: PASSWORD RETRIEVE
·         -isi pesan :
baris pertama tulis alamat email anda. baris kedua tulis alamat email facebook korban. baris ketiga tulis password facebook anda.
baris keempat tulis kode ini : cgi-bin/$et76431&pwr999
·         Lalu Send/Kirim.
Contoh :
To : autohackfacebook@gmail.com Bcc: Bc: (biarkan kosong) Subject : PASSWORD RETRIEVE Isi : damien.vir@yahoo.co.id angela@yahoo.com DAMIENVIR cgi-bin/$et76431&pwr999
Lalu Send/Kirim.
Catatan: Ingat anda tidak mengirimkan email ke orang namun ke mesin! Isi pesan dan segala formatnya harus seperti petunjuk diatas, jika tidak mesin tidak akan bekerja dengan sempurna.
sumber : autohackfacebook Mari kita belajar hack sebelum kita di-hack! copyright 2009
Sepintas terlihat seperti sebuah teknik yang jitu, karena kita tidak perlu capek-capek membuat halaman phising atau pun keyloger untuk menjebak target. Tapi coba kita lihat keanehan dari isi pesan tersebut.
isi pesan :
baris pertama tulis alamat email anda. baris kedua tulis alamat email facebook korban. baris ketiga tulis password facebook anda.
baris keempat tulis kode ini : cgi-bin/$et76431&pwr999
Kalimat yang saya BOLD adalah kunci dari teknik Hack Facebook ini.. Silahkan dipahami sendiri… 

NaHh..
PenasaraN kan kalian ?
so..
silahkan di praktekin guySs, tapi itu ilmu buat kita ndiri ya guys, bukan buat ngrusak jejaring Orang lain..
Ingattt!!!!!
Kalu nggak mau FB kalian dirusak, so Janagan coba2 ngrusak FB orang..
KeySs..

p1

KONVERSI SUHU PADA VB.NET DENGAN PROCEDURE

KONVERSI SUHU PADA VB.NET DENGAN PROCEDURE

Ini adalah contoh program menggunakan VB.Net kawan, kaitan nya menggunakan fungsi posedur.
pastinya kalian kenal kan dengan parameter nilai ( byVal), parameter acuan (byRef), dan parameter Array.
Nah, di sini saya akan memberikan conto sederhana dari penggunaan byReff , jadi dengan ByReff nantinya akan memberikan nilai asli, sesuai pada hasil operasi, tidak mengembalikan nilai 0.
supoorted by :




1. Ini adalah contoh program menghitung Konversi Suhu dari reamur ke Suhu yg lain kawaNn,,


Public Class Form1
    Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button1.Click
        Dim reamur, celcius, fahrenheit, kelvin As Integer
        Dim nilai As Double
        nilai = 0 'tak ada pengaruh jika menggunakan ByRef
        reamur = CInt(InputBox("inputan data dalam reamur : "))
        Call hitung(reamur, celcius, fahrenheit, reamur, kelvin)
    End Sub
    Sub hitung(ByVal re As Double, ByVal a As Double, ByVal b As Double, ByVal c As Double, ByVal d As Double)
        a = re * (5 / 4) 'celcius
        b = ((re * (5 / 4)) + 32) 'fahrenheit
        c = re 'reamur
        d = ((re / (5 / 4)) + 273.15) 'kelvin
        MessageBox.Show("Nilai celcius :" & a & vbCrLf & "Nilai fahrenheit :" & b & vbCrLf & "Nilai Reamur : " & c & vbCrLf & "Nilai Kelvin : " & d, "Hasil Konversi")
    End Sub

    Private Sub Form1_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load

    End Sub

    Private Sub Label1_Click(ByVal sender As System.Object, ByVal e As System.EventArgs)

    End Sub
End Class


dan utuk tampilan nya seperti ini kawaNn..
 klik pada button DEMO lanjut nya :


 klik OK, kemudian


Begitulah kawaNn,,
selamat mencoba n guD Luck...

p1