Cara menggunakan situs web html

Domain adalah nama website kita. Seperti google. com, detik. com, wikipedia. com. Idealnya domain diakhiri dengan dot com, net, org, info, dll

Karena kita akan menggunakan hosting dan domain gratis, maka ekstensi domain gratis yang kita gunakan adalah 000webhostapp. com

Jadi domain situs web HTML Anda akan menjadi

xxxx. 000webhostapp. com

xxxxx = nama domain Anda

Dalam contoh ini domain saya adalah websitehtmlkerensaya. 000webhostapp. com

3. 1. 1 Pada bagian project, buat nama domain sesuai keinginan, password, dan klik kirim

Website merupakan salah satu media yang paling populer saat ini, terutama website berjenis blog dan website penjualan. Lalu, bagaimana cara membuat website?

Apa itu situs web?

Website adalah sebuah situs di internet yang dapat diakses secara luas dan berisi beberapa halaman yang menghubungkan orang-orang di wilayah atau wilayah yang berbeda. Website juga sering digunakan sebagai tempat untuk mempromosikan barang atau jasa yang tidak perlu langsung membawa orang ke suatu wilayah atau daerah. Selain itu, website juga memiliki beberapa jenis yang memiliki fungsi berbeda

1. Situs web atau blog pribadi,
2. Situs web toko online,
3. Situs web perusahaan, dll

Jenis website sangat beragam, tergantung dari fungsi website yang kita buat digunakan untuk apa. Namun dari sekian banyak jenis website yang sering kita jumpai adalah ketiga jenis yang sudah disebutkan di atas. Ternyata ada beberapa cara untuk membuat website yaitu dengan menggunakan coding dan ada juga yang menggunakan cara instan tanpa menggunakan coding. Nah, saat ini cara yang sering dilakukan adalah membuat website secara instan tanpa menggunakan coding, namun yang akan kita pelajari sekarang adalah cara membuat website dengan menggunakan HTML dan CSS. Bagaimana Anda melakukannya?

Baca Juga. Apa Situs Web Pertama di Dunia?

Membuat kerangka wireframe/website

Langkah pertama adalah membuat wireframe. Apa gunanya? . Membuat wireframe tidak harus bagus, asal bisa mencakup semua konten website Anda nantinya dan tentunya bisa dijadikan patokan nantinya saat membuat

Instal editor teks

Langkah kedua ini yang paling penting. Anda harus install terlebih dahulu aplikasi coding yang ingin anda gunakan, jika anda tidak memiliki aplikasinya, bagaimana cara membuat website?

Buat folder baru

Pembuatan folder ini dapat memudahkan kita untuk menyimpan hasil coding kita nanti agar tidak tercampur dengan file lain. Di dalam folder ini anda menyimpan semua hasil coding yang telah dibuat dan juga file gambar yang akan digunakan untuk membuat website tersebut

Buat file indeks

Buat file dengan nama index. html pada editor teks yang Anda sukai atau yang telah terpasang

Judul. isi judul untuk nama file

Tajuk. untuk membuat header atau judul awal website

Nav. untuk membuat navbar/bilah navigasi di situs web

Artikel. membuat konten dari website yang akan dibuat

Catatan kaki. buat footer di bagian bawah website

Buat file gaya

Setelah membuat file indeks. html maka anda bisa membuat file dengan nama style. css di editor teks yang sama dan tentunya juga di folder yang sama. Dalam file gaya. Css ini kita isi dengan deskripsi dari file index. html yang berisi spesifikasi dari header, navbar, content, dan juga footer

body {

font-family: bold italic;

background: #A3CC7A;

padding: 0;

margin:0;

}

.container {

width: 100%;

height: auto;

background: white;

margin:auto;

margin-top: 15px;

padding-bottom: 5px;

}

.logo {

font-size: 350px;

padding: 30px 0 30px 10px;

}

nav ul {

list-style-type: none;

margin: 0;

padding: 0;

overflow: hidden;

background-color: #8DBC5D;

border: 1px solid gainsboro;

}

nav li {

float: left;

}

nav li a {

display: inline-block;

color:#ffffff;

text-align: center;

padding: 14px 15px;

text-decoration: none;

}

nav li a:hover {

opacity:0.9;

background-color: #3385ff;

}

article {

width: 98.8%;

height: auto;

border-radius: 3px;

margin: 5px 5px 5px 5px;

border: 1px solid gainsboro;

clear: both;

}

article p {

padding: 5px 6px 5px 5px;

line-height: 1.5;

}

article

.konten {

width: 23.5%;

height: auto;

margin: 5px 5px 5px 5px;

border-radius: 3px;

border: 1px solid gainsboro;

float: left;

}

article .isi {

width: 98.5%;

height: auto;

margin: 5px 5px 5px 5px;

border-radius: 3px;

border: 1px solid gainsboro;

float: left;

}

article .isi .judul {

font-size: 300px;

margin-bottom: 10px;

margin-left: 10px;

margin-top: 10px;

}

article .isi p {

margin-top: 0;

}

article .isi img {

float: left;

margin: 5px 5px 5px 5px;

}

article .konten img {

width: 95.8%;

height: 150px;

margin: 5px 5px 5px 5px;

}

article .konten:hover {

opacity:0.9;

}

article .konten .judul a {

margin-left: 5px;

text-decoration: none;

font-size: 250px;

color:#020101;

}

article .konten a:hover {

opacity:0.9;

}

footer {

clear: both;

width: 98.8%;

height: auto;

text-align: center;

margin: 5px 5px 5px 5px;

border-radius: 3px;

border-bottom: 1px solid gainsboro;

padding-top: 15px;

padding-bottom: 15px;

}

Pengkodean di atas hanya untuk referensi Anda dalam membuat file gaya. Css selebihnya bisa Anda buat sendiri dan sesuaikan tampilan website yang Anda inginkan

6. Hubungkan file css dengan file html

Langkah terakhir ini juga tidak kalah pentingnya dengan langkah-langkah sebelumnya. Karena jika kedua file tersebut belum terhubung, maka program di dalam file css tidak akan berjalan jika file html dijalankan. Untuk menghubungkan kedua file tersebut, caranya cukup sederhana

Anda tinggal menambahkan kode seperti itu di bagian head file index, kemudian kedua file tersebut akan terhubung. Untuk membuat file lain untuk konten, Anda tinggal mengikuti langkah-langkah seperti membuat file indeks. html di atas. Sekian tutorial yang dapat saya sampaikan, mohon maaf atas kekurangan dan kelebihannya. Terima kasih, semoga membantu

Bagaimana cara menggunakan HTML?

Bisakah HTML membuat situs web?

HTML situs web apa?

Langkah demi langkah membuat website dengan HTML dan CSS?