Tim Penyusun :
Sholah Faridudin (19221467)
Abdallah Nasir Al hamud (19221447)
Irgi Hikmah Romadan (19221153)
Muhammad Adam Malik (19221468)
Wulan Anggraeni (19220386)
Winda (19220197)
Dengan menyebut nama Allah SWT yang Maha Pengasih lagi Maha
Penyayang, kami panjatkan puja dan syukur atas kehadirat-Nya, yang telah
melimpahkan rahmat, hidayah, dan inayah-Nya kepada kami, sehingga kami dapat
menyelesaikan makalah tugas project ini sampai dengan selesai. Makalah ini di
susun untuk memenuhi tugas akhir mata kuliah web programming 1.
Makalah ini telah kami susun dengan semaksimal mungkin dan mendapat
bantuan dari berbagai pihak sehingga dapat memperlancar pembuatan makalah ini.
Untuk itu kami mengucapkan banyak terimakasih kepada semua pihak yang telah
berkontribusi dalam pembuatan makalah ini.
Terlepas dari semua itu, kami menyadari sepenuhnya bahwa masih banyak
kekurangan baik dari segi susunan kalimat maupun tata bahasa penulisan. Oleh
karena itu dengan tangan terbuka kami menerima segala saran dan kritik dari
pembaca yang kemudian akan kami jadikan sebagai bahan evaluasi.
Akhir kata, kami berharap semoga makalah ini dapat memberikan manfaat
maupun inspirasi terhadap pembaca dan diterima sebagai ide/gagasan yang
menambah kekayaan intelektual bangsa.
Penulis
DAFTAR ISI
KATA PENGANTAR……………………………………………………………..................…………... I
DAFTAR ISI………………………………………………………………….……...……………….. II
BAB I PENDAHULUAN
1.1 Latar Belakang…………………………………………………………………………………… 1
1.2 Rumusan Masalah……………………………………………………………………………….. 1
1.3 Tujuan……………………………………………………............................................................. 1
1.4 Manfaat……………………………………………………………………………………………1
BAB II PEMBAHASAN
2.1 Tema Website……………………………………………………………………………………...3
2.2 Pengertian Dan fungsi HTML………………………………………………..................................4
2.3 Program lapak buku………………………………………………………...……………………...5
BAB III PENUTUP
3.1 Kesimpulan………………………..……………………………………..………………………15
BAB 1
PENDAHULUAN
Buku yang ditawarkan oleh sebuah lapak buku mempunyai nilai jual yang kompetitif
tetapi karena terhambat oleh promosi yang hanya mencakup daerah lokal mejadikan
buku-buku ini kurang dikenal dan akibatnya kurang laku dipasaran. Oleh karena itu
dibutuhkan sebauh lapak buku online untuk membantu memasarkan buku yang ditawrkan
oleh lapak tersebut.
BAB II
PEMBAHASAN
3. Deskripsi Buku
Ketika pengguna mengklik tombol “klik untuk membaca” Maka akan muncul beberapa
buku yang dapat di baca , juga ada penjelasan tentang buku buku tersebut.
B. Untuk script HTML pada tiap tampilannya
-HTML
1.Profil Tim Pembuat Website
Pada bagian ini terdapat beberapa info tentang profil sosial media yang ditampilkan seperti
poto poto pembuat website.
<html>
<head>
<title>LETERASI</title>
<link rel="stylesheet" href="style.css" />
</head>
<body>
<div class="container">
<!-- navigation bar -->
<div class="container-navbar">
<ul class="ul-navbar">
<li class="li-navbar">
<a href="index.html" class="a-navbar" >HOME</a>
</li>
<li class="li-navbar">
<a href="abaout.html" class="a-navbar" >BUKU</a>
</li>
<li class="li-navbar">
<a href="content.html" class="a-navbar" >TIM PEMBUAT
WEBSITE</a>
</li>
</ul>
</div>
<!-- navigation selesai -->
</div>
<!-- content 1 end -->
</div>
<!-- footer end -->
</div>
</body>
</html>
2.Beranda (index.html)
<html>
<head>
<title>LETERASI</title>
<link rel="stylesheet" href="style.css" />
</head>
<body>
<div class="container">
<!-- navigation bar -->
<div class="container-navbar">
<ul class="ul-navbar">
<li class="li-navbar">
<a href="index.html" class="a-navbar" >HOME</a>
</li>
<li class="li-navbar">
<a href="abaout.html" class="a-navbar" >BUKU</a>
</li>
<li class="li-navbar">
<a href="content.html" class="a-navbar" >TIM PEMBUAT
WEBSITE</a>
</li>
</ul>
</div>
<!-- navigation selesai -->
<!-- content 1 -->
<div class="container-content">
<a href="https://youtu.be/de86MG0bKmI "
class="a-content">
<img
src="https://pbs.twimg.com/media/DpNiWO7UcAUQKEq.png:large"
class="a-content" />
<p>KLIK DI SINI UNTUK MELIHAT </p>
</a>
</div>
<!-- content 1 end -->
</div>
<!-- footer end -->
</div>
</body>
</html>
4. Daftar buku(kategori.html)
<html>
<head>
<title>LETERASI</title>
<link rel="stylesheet" href="style.css" />
</head>
<body>
<div class="container">
<!-- navigation bar -->
<div class="container-navbar">
<ul class="ul-navbar">
<li class="li-navbar">
<a href="index.html" class="a-navbar" >HOME</a>
</li>
<li class="li-navbar">
<a href="abaout.html" class="a-navbar" >BUKU</a>
</li>
<li class="li-navbar">
<a href="content.html" class="a-navbar" >TIM PEMBUAT
WEBSITE</a>
</li>
</ul>
</div>
<!-- navigation selesai -->
</div>
<!-- content 1 end -->
</div>
<!-- footer end -->
</div>
</body>
</html>
-CSS
1. Style.css (menyangkup untuk index.html,kategori.html,kontak.html)
*,
html {
margin:0;
padding: 0;
}
.container {
}
.container-navbar {
background-color:rgb(20, 137, 220);
width: 100%;
height: 20vh;
.ul-navbar {
display: flex;
height: 100px;
justify-content: center;
align-items: center;
}
.li-navbar {
list-style-type: none;
padding: 20px;
margin: 10px;
color:cyan;
font-size: 30px;
}
.li-navbar:hover {
background-color:aliceblue;
transition:.5s ease-in-out;
transition-delay: .3s;
border-radius: 8px;
}
.a-navbar {
color:black;
text-decoration: none;
font-weight: 800
}
.container-content {
background-color:cyan;
display: flex;
justify-content: content;
align-items: center;
height: 50vh;
}
.a-content {
background-color:palegreen;
color :aliceblue;
text-decoration :none;
font-size :15px;
width :400px;
height :300Px;
display :flex;
flex-direction :column;
justify-content :space-evenly;
align-items :center;
border-radius :40px;
box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
-webkit-box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
}
.img-content {
width: 80%;
height: 70%;
}
.container-footer {
height: 100px;
background-color:rgb(20, 137, 220);
display: flex;
justify-content: center;
align-items:center;
}
.h1-footer {
font-size: 20px;
color:rgb(255, 255, 255);
justify-content: center ;
BAB III
PENUTUP
3.1 Kesimpulan
Kesimpulan Berdasarkan pembahasan pada bab bab sebelumnya, mala penyusun
menarik kesimpulan pada sistem baru yang telah dibuat antara lain sebagai berikut :
1) Pengolahan data berbasis web dapat mengurangi penggunaan kertas sebagai
penyimpan data dan lebih sitematis.
2) Pencarian data sudah dapat dilakukan dengan cepat.
3) Perubahan data sudah dapat dilakukan dengan mudah dan cepat.
4) Adanya sistem informasi yang terkomputerisasi, penyimpanan data lebih efisien dan
informasi yang disajikan juga akan lebih akurat,tepat waktu,dan relevan.