Minggu, April 07, 2013

Membuat CV Menggunakan Bahasa Pemrograman HTML

HTML (Hyper Text Markup Language) merupakan bahasa pemrograman yang biasanya digunakan untuk pemrograman website.  Kali ini, saya akan menggunakan script-script HTML sederhana untuk membuat Curriculum Vitae atau biasa dikenal "CV" yang berjumlah 2 halaman. Dengan langkah-langkah sebagai berikut :
  • Dimulai membuka text editor, salah satunya yang saya gunakan adalah Notepad++ untuk mengetikkan script HTML yang akan dibuat.
  • Script yang ada di halaman 1 adalah : 
<html><!--Memulai script HTML-->
<head><title>CV Page 1</title> <!--Judul Program-->
<style> <!-- Ketentuan output text-->
    #fcurr {
            color:black;
            font-family: Book Antiqua;
            font-size: 20px;}
</style>
</head>
<body> <!--isi program-->
<form name="fcurr" align="middle" id="fcurr">
<table bgcolor="white" width="95%" height="400"> <!--pembuatan tabel 1-->
<tr><td align="center" valign="middle">
<h2><font color="black"><b><u>CURRICULUM VITAE</u></b></font></h2><br> <!--Judul-->
<table width="75%" border="2" align="left" cellpadding="5" cellspacing="0" height="80"> <!--pembuatan tabel 2-->
            <tr> <!--membuat baris pertama-->
            <td rowspan="12"></td> <!--penggabungan 12 baris di kolom pertama-->
            <img src="me.jpg"width="170" height="202"/> <!-- meletakkan gambar-->
            </tr> <!--akhir baris pertama-->
            <tr>
                <td>Nama</td>
                <td>:</td>
                <td>Seli Widiastuti</td>
            </tr>
            <tr>
                <td>Alamat</td>
                <td>:</td>
                <td>Jl. RH Panji 2 Bojonggede Bogor</td>
            </tr>
            <tr>
                <td>Tempat, Tanggal, Lahir</td>
                <td>:</td>
                <td>Jakarta, 27 Oktober 1992</td>
            </tr>
            <tr>
                <td colspan="4"><b>Pendidikan</b></td>
            </tr>
            <tr>
                <td>1996-2002</td>
                <td>:</td>
                <td>SDN 14 Pagi Utan Kayu Selatan Jakarta Timur</td>
            </tr>
            <tr>
                <td>2003-2005</td>
                <td>:</td>
                <td>SMP Negeri 1 Bojonggede</td>
            </tr>
            <tr>
                <td>2006-2009</td>
                <td>:</td>
                <td>SMK Taruna Andigha Bogor Jurusan Akuntansi</td>
            </tr>   
            <tr>
                <td>2009-sekarang</td>
                <td>:</td>
                <td>Universitas Gunadarma FIKTI Jurusan Sistem Informasi</td>
            </tr>
            <tr>
                <td colspan="4"><b>Kegiatan</b></td>
            </tr>
            <tr>
                <td>Januari-April 2008</td>
                <td>:</td>
                <td>Praktek Kerja Industri di Bank Jabar Banten cabang Cibinong</td>
            </tr>
            <tr>
                <td>2008-2010</td>
                <td>:</td>
                <td>Anggota Pemuda Karang Taruna (Bendahara 1)</td>
            </tr>
</table> <!--akhir dari script tabel kedua-->
<tr>
<td align="right"><a href="CV_2.html">Hal 2 >></td> <!--Link Halaman berikutnya-->
</tr>
</td></tr>
    <tr>
    <td height="11" bgcolor="white"></td>
  </tr>
</table> <!--akhir dari tabel pertama-->
</form> <!--akhir dari form-->
</body> <!--akhir dari body-->
</html> <!--akhir program dieksekusi-->
  • Kemudian simpan dengan nama file contohnya CV_1.html pada folder yang diinginkan misalnya folder latihan.
  • Dalam menyisipkan foto/image yang akan ditampilkan pada program, maka foto/image tersebut juga diletakkan dalam folder yang sama dengan file html lainnya.
  • Kemudian, untuk melakukan link untuk halaman ke dua maka dibuat file dengan nama CV_2.html yang telah di cantumkan dalam file CV_1.html.
  • Script pada file CV_2.html adalah :
<html> <!--mulai script HTML-->
<head><title>CV page 2</title> <!--Judul Program-->
<style> <!--Ketentuan output-->
    #fcurr2 {
            color:Black;
            font-family: Harrington;}
</style>
</head>
<body> <!--isi program-->
<form name="fcurr2" align="middle" id="fcurr2">
<table bgcolor="lightblue" border= "4" bgcolor="white" width="100%" height="100%"> <!--Membuat tabel-->
<tr><td align="center" valign="middle">
<h1><font color="RED"> <!--tulisan berwarna merah-->
<b>Demikian contoh CV menggunakan Script HTML</b> <!--Membuat tulisan tebal-->
</font><br><br><blink>Terima Kasih .. ^^</blink> <!--Membuat baris baru dengan kalimat berkedip-->
<br><br><img src="bye.jpg"width="250" height="100"/> <!--Menyisipkan gambar-->
<br><br>--- Selamat Mencoba ..!! --- <br><br></h1> <!--Membuat baris baru dengan ukuran font heading 1-->
<h2><b>- Seli Widiastuti -</b></h2> <!--Membuat baris baru dengan ukuran font heading 2-->
</body> <!--akhir isi program-->
</html> <!--akhir program dieksekusi-->

  • Kemudian simpan file dengan nama CV_2.html ke dalam folder latihan seperti menyimpan file CV_1.html sebelumnya.
  • Simpan file gambar/image yang akan ditampilkan ke dalam folder latihan bersama file-file .html lainnya.


Hasil Output Program :

  • CV_1.html



  • CV_2.html




Sekian script-script HTML sederhana yang telah dipraktekkan untuk membuat sebuah contoh CV. Semoga dapat bermanfaat, menambah pengetahuan dan latihan tentang script-script html. Selamat Mencoba ..^^

Diposting oleh di
Label:

Tidak ada komentar:

Posting Komentar

Langganan: Posting Komentar (Atom)