Kamis, 26 Juni 2014

Cara Atau Tutorial Singkat Membuat Web Sederhana

          Pada Posting kali ini saya akan memberikan sebuah tutorial bagaimana cara untuk membuat suatu web sederhana sesuai tugas yang diberikan oleh dosen Soft Skill Pengenalan Teknologi Internet & New Media.


 Dalam membuat suatu web ini kami membutuhkan software yaitu sebagai berikut :


1. Xampp = Digunakan untuk merancang web server secara offline

2. Adobe Photoshop = untuk Design Template atau tampilan dari web  

3. Notepad ++ = Berfungsi untuk memasukan Coding dari web

4. Mozila firefox / Chrome = untuk membuka hasil web yang sudah di rancang

6. Domain +Hosting = Menyimpan Dokumen web ke webserver online dalam
                                dalam tugas ini kami menggunakan domain gratis yaitu
                                realhoster.net 


  • Tahap awal yang dilakukan yaitu Design Layout

1. Pertama Buka Adobe Photoshop,Lalu kita mendisain Layout sesuai yang 
    akan kita ingin buat
2. Potong Gambar menjadi kecil2 dengan Tool Slice Photoshop ini berguna
    untuk mencocokan pada tampilan yang akan dibuat pada web tersebut 
    hasilnya seperti dibawah ini :



3. Kemudian kita  harus mematiskan ukaran dari Gambar tidak terlalu besar, 
    Agar Website tidak lambat karena besar data yg besar.

4. Buka Notepad ++ Lalu Coding CSS untuk membuat layout yang diinginkan



  • Tahap selanjutnya yaitu membuat Data Base dari web tersebut

1. Buka Xampp, Lalu start pada Apache dan Mysql
2. Buka Browser Lalu ketik Http://localhost/phpmyadmin
3. Buat database Elearning dengan mengklik tombol Create
4. Buat table Baru :
    I.  Tb_admin : user varchar(30) Password(30) hakakses(30)
    II. Tb_bab : id int AutoIncrement nama_bab varchar(20) detail 
         text file varchar(20)
    III. Tb_soal : id int AutoIncrement id_bab int soal text
    IV. Tb_jawaban : id int Autoincrement id_soal int jawaban text value int





  • Pada Tahapan ini kita akan menuliskan Codingnya

1. Buka Notepad ++ Lalu Klik File -> New

2. Import File css yang sudah dibuat sebelumnya ke dalam PHP dengan script 

3. Pastikan Layout telah dibuat sudah sesuai 

4. lalu lakukan coding di Notepad ++ 



  • Setelah web sudah selesai dibuat pada tahap ini kita akan hosting web pada tugas ini kami menggunakan web hosting gratis yaitu http://www.realhoster.net/ 

1. Buat akun pada web tersebut dengan mengisi data pribadi
2. Setelah itu kita akan bisa membuat domain yang kita ingginkan pada web 
    yang kami buat menggunakan http://afejirob.realhoster.net/web.html
3. Selanjutnya kita dapat mengupload dengan web kita yang telah kita buat 
    dalam bentuk zip dengan fasilitas File Manager yang telah disediakan
    web hosting tutorial untuk upload bisa dilihat di sini :





5. Kemudian Web telah selesai dibuat

Demikianlah tutorial singkat untuk membuat suatu web secara sederhana tutorial tersebut merupakan posting ulang dari blog saya sebelumnya yaitu http://nubijustshare.blogspot.com/2014_01_01_archive.html. Demikian postingan yang telah saya buat semoga bermanfaat bagi pembaca. 

Sumber : 

Tidak ada komentar :

Posting Komentar