belajar membuat website

share

  • belajar membuat website

    Belajar Membuat Website Sendiri


    Belajar membuat website sendiri di localhost menggunakan web server xampp dengan bahasa pemrograman HTML, CSS, PHP, dan JavaScript
  • belajar membuat website
    Service
    1. Complete Website
    2. Only web script
    3. Web modification
    4. Application program
    5. Free web template
    6. Free application
    7. Basic SEO
    8. Article request
    9. Tutorial programing
  • belajar membuat website
    MOTO
    "Kepuasan Pelanggan adalah Prioritas kami, Sebagai Pemicu Semangat Dalam Memberikan Pelayanan Terbaik".
  • belajar membuat website Teknologi dan Bahasa
    PHP-5, HTML-5, CSS3, SQL Server, MySQL Database, Access Database, Java, JavaScript, dan Visual Basic.
  • belajar membuat website
    VISI
    "Menjadi penyedia layanan yang terpercaya dan maju dalam dunia Teknologi Informasi."

Belajar Membuat Website Sendiri di Localhost

Belajar Membuat Website Sendiri di Localhost, pada kesempatan kali ini kami rajaputramedia.com sebagai penyedia jasa pembuatan website profesional di Indonesia akan memberikan sebuah tutorial tentang bagaimana cara belajar membuat website sendiri di localhost. Pada artikel sebelumnya kami telah menjelaskan tentang bagaimana Belajar Pemrograman HTML Tingkat Lanjutan, artikel tersebut sangat berkaitan dengan tutorial belajar membuat website sendiri ini, dimana HTML akan digunakan sebagai script yang membentuk dokumen-dokumen website. Kemudian setelah dokumen tersebut terbentuk maka langkah selanjutnya adalah membuat tampilan website pada browser, untuk membuat tampilan ini sebetulnya dapat digunakan HTML akan tetapi tidak sebagus menggunakan pemrograman CSS yang dapat membentuk tampilan / design web seperti yang kita inginkan, untuk itu pada tutorial belajar membuat website sendiri localhost ini, CSS akan kami implementasikan bersamaan dengan HTML. Untuk mengetahui apa itu CSS dapat Anda lihat sendiri di sini Pengertian CSS dan apa itu CSS.

Kemudian aplikasi atau software apa yang dibutuhkan untuk membuat website? jangan - jangan mahal? Tentu saja tidak, aplikasi yang dibutuhkan untuk mengikuti tutorial belajar membuat website sendiri ini telah tertanam di dalam Windows personal computer anda, yaitu:

  • Notepad
  • Web Browser ( Internet Explorer, Mozilla Firefox, Opera, Google Chrome )

Belajar Membuat Website Sendiri

belajar membuat website

Belajar Membuat Website

Jadi membuat website itu sederhana, tidak terlalu banyak membutuhkan software atau aplikasi khusus, semua telah tersedia di dalam komputer windows Anda. Berikut adalah langkah-langkah belajar membuat website sendiri di localhost:

Download Free eBook Belajar Membuat Website

1. Buat folder dengan nama "websiteku" di dalam directory D:\

2. Buka notepad, kemudian ketikan srcipt CSS di bawah ini.

style.css

/* 
	project: Design Web Template
	author: http://www.rajaputramedia.com
	Cascade Style Sheets file
*/

#art-main{
	background: #FCFCFC scroll;
	margin:0 auto;
	font-size: 13px;
	font-family: Arial, 'Arial Unicode MS', Helvetica, Sans-Serif;
	position: relative;
	width: 100%;
	min-height: 100%;
	left: 0;
	top: 0;
	cursor:default;
	overflow:hidden;
}
h1{
	font-size: 40px;
	font-family: vivaldi;
	color : #303780;
}
h2{
	font-size: 16px;
	font-family:Arial, 'Arial Unicode MS', Helvetica, Sans-Serif;
	color : #FFAF00;
}
h3{
	font-size: 16px;
	font-family:Arial, 'Arial Unicode MS', Helvetica, Sans-Serif;
}

.art-nav{ /* navigasi atas */
	background: #E0E0E0;
	width: 100%;
	padding:6px;
	margin:0 auto;
	position: relative;
	z-index: 100;
	font-size: 0;
	box-shadow: 0 5px 7px -5px #222;
}
.topmenu {
    height: 16px;
    margin : 0px;
    padding : 0px;
}
.topmenu p {
    position : relative;
    width : 400px;
    margin-left : 10px;
    margin-top : 8px;
    line-height : 8px;
    font-size : 11px;
    color : #6a6a6a;
}
.topmenu a{
    color : #6a6a6a;
    text-decoration: none;
}
.topmenu a:hover{
    text-decoration :underline;
}
.topmenu span {
    margin-left : 20px;
}

.art-header { /* web header */
    height: 120px;
	width: 75%;
    margin : 5px auto 0;
    padding : 2px;
}

.menumid { /* web menu */
	height: 38px;
	background: #22275A;
	background: -moz-linear-gradient(top, #22275A 0%, #94AED4 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #22275A), color-stop(100%, #94AED4));
	background: -webkit-linear-gradient(top, #22275A 0%, #94AED4 100%);
	background: -o-linear-gradient(top, #22275A 0%, #94AED4 100%);
	background: -ms-linear-gradient(top, #22275A 0%, #94AED4 100%);
	background: linear-gradient(top, #22275A 0%, #94AED4 100%);
	width: auto;
	margin-left: 12.5%;
	margin-right: 12.5%;
	box-shadow: 0 5px 5px -5px #333;
	vertical-align:middle;
}
.menumid ul {
	list-style: none;
}
.menumid > ul {
	float: left;
}
.menumid > ul > li {
	float: left;
}
.menumid > ul > li > a {
	color: #000000;
	font-size: 11px;
	font-weight:bold;
	font-family: Arial, 'Arial Unicode MS', Helvetica, Sans-Serif;
	text-decoration: none;
	line-height:12px;
	margin: 5px 30px 0 5px;
}
.menumid > ul > li:hover > a {
	text-decoration:none;
	color:#FFF;
}

.art-sheet{ /* web content */
	background: #FCFCFC;
	border-radius:0px;
	padding:5px 0 0 10px;
	margin:5px auto 0;
	position:relative;
	cursor:auto;
	width: 75%;
	z-index: auto !important;
}
.art-sheet p{
	position:relative;
	cursor:auto;
	width: 75%;
	line-height: 175%;
	font-family: Arial, 'Arial Unicode MS', Helvetica, Sans-Serif;
}
.art-sheet a{
	line-height: 175%;
	font-family: Arial, 'Arial Unicode MS', Helvetica, Sans-Serif;
	text-decoration:none;
	color:#6a6a6a;
}
.art-sheet a:hover{
	color: #ffa500;
	font-size: 12px;
	font-family: Arial, 'Arial Unicode MS', Helvetica, Sans-Serif;
	text-decoration: underline;
}

.art-footer{ /* footer */
	background:#94AED4;
	margin:40px auto 0;
	position: relative;
	font-family: Arial, 'Arial Unicode MS', Helvetica, Sans-Serif;
	text-align: left;
	width: 75%;
	height:100px;
	border-radius: 0px;
	box-shadow: 0 -7px 7px -7px #888;
	padding:20px 0 10px 10px;
}

.art-footer a, .art-footer a:link, .art-footer a:visited, .art-footer a:hover{
	color: #FFF;
	font-size: 12px;
	font-family: Arial, 'Arial Unicode MS', Helvetica, Sans-Serif;
	text-decoration: none;
	margin: 0 10px 0 10px;
}
.art-footer a:hover{
	color: #ffa500;
	font-size: 12px;
	font-family: Arial, 'Arial Unicode MS', Helvetica, Sans-Serif;
	text-decoration: underline;
}
.art-footer p{
	font-size: 12px;
	font-family: Arial, 'Arial Unicode MS', Helvetica, Sans-Serif;
}

Save as file tersebut kedalam folder "websiteku" yang telah dibuat di directory D:\ dengan nama style.css

3. Buka kembali notepad, kemudian ketikan srcipt HTML di bawah ini.

index.html - belajar membuat website sendiri

<!DOCTYPE html>
<html dir="ltr" lang="en-US">
<head>
    <title>Website Pribadiku | Belajar Membuat Website Sendiri</title>	
    <link rel="stylesheet" href="style.css" media="screen">
</head>
<body>
	<div id="art-main">
		<nav class="art-nav">
			<div class="topmenu">
				<p>
				<span><a href="http://www.rajaputramedia.com">Home</a></span>
				<span><a href="#">Contact</a></span>
				<span><a href="#">Login</a></span>
				</p>
			</div>
		</nav>
		<div class="art-header">
			<h1>Website Pribadiku</h1>
		</div>
		<div class="menumid">
			<ul>
				<li><a href="#">MAIN</a></li><li><a href="#">PRODUCT</a></li><li><a href="#">SERVCIE</a></li><li><a href="#">PLANT</a></li><li><a href="#">ABOUT US</a></li><li><a href="http://www.rajaputramedia.com">CONTACT US</a></li>
			</ul>
		</div>
		<div class="art-sheet">
			<h2><i>Jasa Pembuatan Website - Aplikasi - Only Script Module</i></h2>
			<p style="text-align: justify;">Produk Unggulan Kami adalah Website - Belajar membuat website sendiri - belajar pemrograman website. Personal web, company profile, website toko-online, dan aplikasi berbasis web. Termasuk belajar membuat website sendiri, belajar membuat website, belajar pemrograman website, dan membuat website localhost. Kami bekerja menggunakan teknologi terkini, dengan bahasa pemrograman versi terbaru, sehingga produk yang dihasilkan dapat berjalan hampir di semua platform. Kami sadari sepenuhnya bahwa kami adalah pengembang baru, pendatang baru di dunia Teknologi Informasi, akan tetapi tetap berusaha untuk memberikan kualitas terbaik. Jika pengembang senior menggunakan teknologi HTML5, PHP5, CSS3, JavaScript, dan MySQL Database untuk mengembangkan sebuah website, kami pun ikut serta menggunakan teknologi ini. read more...

<p style="text-align: justify;"><a href="#">view product</a></p> <hr style="border: none; background-color: #B1B8C3; color: #B1B8C3; height: 1px; margin-bottom: 25px;"> <h2>Teknologi dan Bahasa</h2> <p style="text-align: justify;">Belajar membuat website sendiri - belajar pemrograman website - Teknologi & Bahasa yang kami gunakan merupakan teknologi terkini yang sedang berkembang dalam dunia Teknologi Informasi, diantaranya adalah PHP-5, HTML-5, CSS3, SQL Server, MySQL Database, Access Database, Java, JavaScript, dan Visual Basic.</p> </div> <footer class="art-footer"> <a href="#">Home</a> | <a href="#">Localhost</a> | <a href="#">Support</a> | <a href="#">TOS</a> <p style="text-align: center;"><span style="font-size:10px;"><a href="http://www.rajaputramedia.com/" target="_blank" style="font-size:10px;">Web Development</a>by rajaputramedia.com - belajar membuat website sendiri</span></p> </footer> </div> </body> </html>

Save as file tersebut kedalam folder "websiteku" yang telah dibuat di directory D:\ dengan nama index.html

Free Download Tutorial Belajar Membuat Website

Download and View Script Belajar Membuat Website Sendiri

Kemudian buka folder "websiteku" di dalam directory D:\ dan pastikan di dalam folder tersebut terdapat 2 (dua) file, yaitu index.html dan style.css , seperti tampilan gambar dibawah ini:

belajar membuat website

belajar membuat website sendiri

4. Double klik file dengan nama index.html dan lihat apa yang akan tampil didalam web-browser Anda.

Sekian penjelasan dari kami tentang belajar membuat website sendiri di localhost PC Anda. Source code tutorial ini dapat di download melalui link di atas. Jika masih kurang memahami tutorial ini, Anda dapat mengajukan pertanyaan melalui form komentar. Semoga dapat membantu.

Baca juga :


Belajar Membuat Website Sendiri

Tags: belajar membuat website, belajar program website, membuat website localhost, localhost, belajar sendiri, web localhost, belajar membuat website sendiri


Reliable

belajar membuat website

Advertise

softwareoriginal

Payment & Donation

belajar membuat website

Rekening BCA : 343 1156 006

a/n : Andi Hatmoko

Rekening MANDIRI : 13300 11921 079

a/n : Andi Hatmoko

belajar membuat website

Account :

andihatmoko@gmail.com

Live Chat

Lukman2020-09-22, 11:53 am
Mau Tanya Harga Program Aplikasi Inventory Barang Gudang brapa_ ?
Agustina Ndj2020-09-18, 09:51 am
download aplikasi sarpras sekolah
Aloisius Rab2020-09-17, 22:15 pm
Aplikasi Pengajuan Kredit dan Analisa 5C
CARLITO DA S2020-09-16, 12:52 pm
Halo, Saya Carlito da Silva Berapa harga dari aplikasi stok barang berbasis web?
data2020-09-13, 10:50 am
tolong bisa bantu program aplikasi barang
sutan arif p2020-09-09, 10:13 am
berapa harga source code program pengarsipan?
kumbaray2020-09-09, 02:46 am
untuk aplikasi spj_ sppd nya berapa kisarannya gan
Yance Rawar2020-09-01, 17:10 pm
Boleh saya bertanya ya?_ berapa biaya aplikasi LPJ Dana Desa_ Mohon tanggapannya ya?
ZAI2020-08-30, 06:18 am
brp harga aplikasi input data karyawan
ADE IRHAM2020-08-29, 18:53 pm
Raja SARPRAS V4_ 0 _ Demo Aplikasi harganya berapa?
Juned2020-08-23, 11:30 am
Gimana kalo make delete di mysqli nya??
putri2020-08-21, 08:51 am
Saya tertarik dengan aplikasi arsipnya_ HArganya berapa ya gan? Terima kasih
Mukhlis2020-08-18, 10:42 am
Aplikasi Indekx Kepuasan Masyarakat nya ada bg?
Tedi2020-08-15, 20:41 pm
Selamat malam para pakar
arif2020-08-13, 14:36 pm
Program Aplikasi Rental Online Untuk Halaman Member Depannya tidak ada hanya Halaman Login Untuk admin dan Super admin
secret2020-08-10, 14:59 pm
ada free source code yang bgagus gak ?
Angela2020-08-06, 18:50 pm
Hallo, saya angela ingin bertanya apakah aplikasi surat berbasis web ini bisa disesuaikan dengan keadaan di kita_ _ _ hrg?
aan2020-08-05, 14:20 pm
kl mau mendapatkan sourcecode aplikasi SPPD gimana ya?? bisa minta wa nya
SHODIKIN2020-07-26, 06:16 am
Berapa Donasi Program Aplikasi Penjualan Berbasis Web? Tq
MICHAEL ELSO2020-07-23, 18:34 pm
Apakah pembelian aplikasi ktp sudah termasuk datanya smua? Atau hanya aplikasinya saja? Misalnya mau untuk cek data bs?
April2020-07-21, 13:54 pm
saya ingin membuat aplikasi arsip digital untuk internal perusahaan yg dengan mudah dapat di akses bagi seluruh karyawan
Salwa2020-07-20, 13:07 pm
Berapa lama kira2 pesan aplikasi untuk perpustakaan sekolah?
udin2020-07-19, 21:44 pm
berapa harga aplikasi untuk pondok pesantren
Royke Lantup2020-07-17, 20:07 pm
Setelah di download langkah_ langkahnya seperti apa?
Feria2020-07-10, 16:50 pm
Untuk aplikasi penyimpanan berkas pengajuan administrasi capil, KK dan KTP berapa biaya nya ??
nugraha2020-07-10, 09:46 am
gan, cara dapat aplikasi simpeg7 gimana?
kasmono2020-07-08, 15:09 pm
mas, minta link donlot untuk script kode otomatisnya_ trims
Asep Gunawan2020-07-08, 09:50 am
Mau tanya versi Full Aplikasi stok barang
Iwan2020-07-08, 09:40 am
Berapa harga Program Aplikasi Manajemen Anggota
ferry 2020-06-24, 13:51 pm
apakah saya bisa mendapatkan aplikasi SPPD exel sederhana
Shany2020-06-19, 20:43 pm
Untuk aplikasi persediaan ini apakah masih bisa di customize dengan warna dan ukuran?
Triyanto2020-06-17, 15:02 pm
Halo admin,,,saya tertarik dengan aplikasi cutinya,,harganya berapa
fadhil2020-06-17, 09:53 am
bisakan anda mengirimkan penawaran ke email saya tentang program aplikasi e_ arsip dan data pegawai
aa2020-06-08, 11:11 am
brp harga untuk aplikasi Program Aplikasi Inventory Barang Gudang
Budhi Dwipa2020-06-08, 10:48 am
halo admin saya tertarik dengan aplikasi simpeg 7 apakah ada nomor wa yg bisa dihubungi ?
abu hafidz2020-06-04, 14:23 pm
kalau untuk menampilkan hanya data yang ada di table lain gimana ya ? mohon bantuannya
Muhlis2020-06-04, 12:09 pm
saya berminat software pengajuan judul skripsi, saya ingin membahas harganya jida chat ini di respon ke Email
nic2020-06-04, 07:49 am
brp harga e_ arsip
NUR CAHYANIG2020-06-03, 15:20 pm
Berapa harga untuk software koperasi?
Arif Mahmudi2020-06-03, 11:00 am
Assalamualaikum
mugiarto2020-05-09, 08:33 am
bgmana cara beli program iin, apakah termasuk souce code nya ??
willbertus2020-04-28, 16:49 pm
Admin mohon info utk Aplikasi Dokumen Kantor gimana cara dapatnya secara komplit_ Minat_ thks
Galih2020-04-27, 23:18 pm
Min, bagaimana cara mendapatkan source code aplikasi cuti?
ariel2020-04-18, 11:02 am
kami berminat dgn aplikasi SPPD berapa harga gan?
Aris2020-04-12, 08:45 am
plikasi Arsip Surat Berbasis Web SIPAS harganya brp?dpt source code y
Wida Widiyaw2020-04-11, 12:01 pm
Ingin Mengubah Tanggal Lahir Akun Google
Zulfikri2020-04-10, 10:33 am
Mau tanya biayanya berapa kalau bikin aplikasi SPPD lengkap
irfan2020-03-14, 10:18 am
selamat pagi pak,apa program sewa mobil ini bisa castem sesuai dengan kebutuhan kami
Aji2020-03-10, 11:39 am
Ini tidak bisa di download min?di info saat download ada notif untuk hubungi admin untuk download aplikasi hrd web
Hamdan2020-03-09, 16:05 pm
Berapa harga membuat aplikasi rental atau penyewaan kamera berbasis web?
rizki firman2020-02-25, 12:05 pm
mau tanya untuk spk metode fuzzy berapa ya? tentang pemilihan tempat wisata
Rendhi roman2020-02-13, 22:38 pm
Untuk Sistem Rekrutment BIsa_
windra2020-02-13, 14:43 pm
untuk harga program data karyawan brp
FERY DIANTA 2020-02-08, 09:51 am
gan mau nanya harga simpeg versi 7 nya_
rudy2020-02-07, 15:58 pm
berapa harga sw management anggota pak_
Manyu2020-02-07, 14:44 pm
berapa harga aplikasi sppd nya_ pls respon cepat melalui email ya, saya berminat mau beli
yadi2020-02-01, 19:34 pm
harga Aplikasi Simpan Pinjam Berapa
hendi 2020-01-25, 18:59 pm
untuk afk sofware developer property penjualan di harga berapa _
Suwarto plaz2020-01-21, 15:45 pm
berapa harga aplikasi cuti online?
Heri Nurjono2020-01-20, 09:45 am
Berapa harga Aplikasi data anggota?

Post your chat:


Name



Email



Chat



Confirm you are NOT a spammer

 
belajar membuat website