Membuat Website CV Sederhana ~ Irpantips4u

Kali ini saya akan membuat sebuah tutorial sederhana untuk membuat sebuah website. Website yang akan dibuat adalah sebuah website curiculum vitae yang terdiri dari 2 halaman.

berikut adalah langkah-langkah dalam pembuatan website :
tulislah script dibawah ini, script ini merupakan script halaman 1

 <head>  
 <style>  
 body{  
 background-color:#2D2F2B;  
 font-family:verdana,Arial, Tahoma,Century gothic, sans-serif;  
 font-size: 12px;  
 }  
 .block {  
 background-color: #D4D4D4;  
 width: 370px;  
 padding: 9px 35px 35px 35px;  
 border-radius: 11px;  
 margin: auto;  
 margin-top:180px;  
 border: 1px solid #EEE;  
 -moz-box-shadow: 0px 0px 25px black;  
 -webkit-box-shadow: 0px 0px 25px;  
 }  
 .ribbon {  
 margin-top: -17px;  
 width: 38px;  
 float: right;  
 background-color: rgb(120, 5, 185);  
 -moz-box-shadow: 0px 0px 25px black;  
 -webkit-box-shadow: 0px 0px 3px;  
 text-align: center;  
 padding: 10px 0;  
 }  
 table{  
 font-size: 12px;  
 }  
 tr {  
 vertical-align: top;  
 }  
 </style>  
 </head>  
 <body>  
 <div class='block'>  
 <div class='ribbon'><img src='gunadarma.png' style='width:36px'></div>  
 <h3 style="border-bottom: 1px solid rgb(146, 146, 146);">BIODATA</h3>  
 <img src="photo.jpg" style="width: 60px;float: left;margin-right: 14px;"/>  
 <div>  
 <table>  
 <tr><td>Nama         </td><td>:</td><td style="width: 56%;">Muhamad Irpan Ramdani</td></tr>  
 <tr><td>Jenis kelamin     </td><td>:</td><td>Laki-laki</td></tr>  
 <tr><td>Kewarganegaraan        </td><td>:</td><td>Indonesia</td></tr>  
 <tr><td>Alamat        </td><td>:</td><td>Jl. R Kosasih RT.04/07<br/> Cikaret-Bogor 16132</td></tr>  
 <tr><td>E-mail        </td><td>:</td><td>irpanramdani@gmail.com</td></tr>  
 <tr><td>Website        </td><td>:</td><td><a href='http://blogitemplate.com/'>BlogiTemplate.com</td></tr>  
 </table>  
 <a href='page2.php' title='Next'><img src='arrow_next.png' style="width: 31px;float: right;"></a>  
 </div>  
 </div>  
 </body>

setelah itu simpan dengan nama index.php.. kemudian new project pada notepad++ untuk membuat script halaman 2. Berikut ini script untuk halaman 2 :

 <head>  
 <style>  
 body{  
 background-color:#2D2F2B;  
 font-family:verdana,Arial, Tahoma,Century gothic, sans-serif;  
 font-size: 12px;  
 }  
 .block {  
 background-color: #D4D4D4;  
 width: 370px;  
 padding: 9px 35px 35px 35px;  
 border-radius: 11px;  
 margin: auto;  
 margin-top:180px;  
 border: 1px solid #EEE;  
 -moz-box-shadow: 0px 0px 25px black;  
 -webkit-box-shadow: 0px 0px 25px;  
 }  
 .ribbon {  
 margin-top: -17px;  
 width: 38px;  
 float: right;  
 background-color: rgb(120, 5, 185);  
 -moz-box-shadow: 0px 0px 25px black;  
 -webkit-box-shadow: 0px 0px 3px;  
 text-align: center;  
 padding: 10px 0;  
 }  
 table{  
 font-size: 12px;  
 }  
 </style>  
 </head>  
 <body>  
 <div class='block'>  
 <div class='ribbon'><img src='gunadarma.png' style='width:36px'></div>  
 <h3 style="border-bottom: 1px solid rgb(146, 146, 146);">Tentang Saya</h3>  
 <div style='text-align:justify;'>  
 <p>  
 Nama lengkap saya Muhamad Irpan Ramdani sehari-hari bisanya saya dipanggil Irpan, namun ketika saya masuk ke Universitas Gunadarma banyak teman saya yang memanggil saya dengan sebutan Baim, itu pun berawal dari candaan-candaan teman sekelas saya.   
 <p/><p>  
 Kampung halaman saya ada di Bogor dan Alhamdulillah sampai saat ini saya masih tinggal di kampung halaman saya yang masih sejuk dan asri.   
 <p/><p>  
 Saat ini saya kuliah di Universitas Gunadarma jurusan Sistem Informasi. Sedikit saya ceritakan awal mula saya mendaftar di universitas ini. Sebenarnya awalnya saya tidak tahu mengenai Universitas Gunadarma ini saya hanya di daftarkan oleh kakak saya yang merupakan salah satu mahasiswa di Universitas Gunadarma. Setelah saya masuk dan mulai mengenal Univeristas ini saya merasa senang dan beruntung telah masuk di univeristas yang sangat bagus dalam bisang Teknologi Informasi.  
 </p>  
 <a href='index.php' title='Previous'><img src='arrow_prev.png' style="width: 31px;float: right;"></a>  
 </div>  
 </div>  
 </body>

berikut ini merupakan penjelasan berupa print screen gambar dari listing program :