Makalah INTERAKSI
MANUSIA DAN KOMPUTER
Layanan
Informasi Jadwal Kereta Api Jabodetabek Berbasis Web
Disusun
oleh :
Nama : Muhamad
Alan Ardandy
NPM : 24111633
Kelas : 2kb02
Jurusan : Sistem
Komputer
Fakultas : Ilmu
Komputer Dan Teknologi Informasi
Universitas
Gunadarma
2013
Layanan
Informasi Jadwal Kereta Api Jabodetabek Berbasis Web
Overall
saya membuat nya menggunakan bahasa pemrograman HTML, dan CSS yang dibantu oleh
compiler WebPageMaker dengan Template. Web ini berisi tentang informasi layanan
penjadwalan KRL Jabodetabek. Seperti yang kita ketahui, banyak pengguna KRL
yang kesulitan karena belum ada nya sumber yang menyediakan informasi mengenai
jadwal keberangkatan KRL pada tiap-tiap stasiun. Di tambah nya pengguna KRL
yang memiliki mobilitas tinggi, dan tidak memiliki kesempatan untuk mencatat
atau menghafal jadwal kedatangan KRL. Disini dengan berbasis Web, juga ditujukan
untuk menjawab kemajuan zaman mengenai kebutuhan Teknologi dan Informasi,
informasi dapat diakases siapa saja, dan dimana saja. Hanya dengan mengetikkan
URL http://JadwalKRLjabodetabek.com/
lalu enter pada searchbar. Tampilan home
Gambar 1.1 Tampilan
Home
Bagi Anda pengguna
layanan Pengkereta Apian jabodetabek khusus nya, anda bisa mendownload jadwal
KRL nya secara langsung disini, atau anda yang hanya sekedar ingin membuka nya
secara streaming, disini bisa.
Gambar
1.2 Anda bisa Mendownload jadwal KRL dengan format PDF
Gambar
1.3 Anda bisa streaming untuk mengetahui jadwal KRL
Selain itu, disni juga
saya input beberapa informasi lain yang berhubungan tentang dunia Pengkereta
apian, serta reservasi tiket online.
Gambar
1.4 Beberapa informasi yang berkaitan dengan KRL dan Reservasi Tiket
Isi dari SourceCode HTML, dan CSS nya
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled</title>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<style type="text/css">
/*----------Text Styles----------*/
.ws6 {font-size: 8px;}
.ws7 {font-size: 9.3px;}
.ws8 {font-size: 11px;}
.ws9 {font-size: 12px;}
.ws10 {font-size: 13px;}
.ws11 {font-size: 15px;}
.ws12 {font-size: 16px;}
.ws14 {font-size: 19px;}
.ws16 {font-size: 21px;}
.ws18 {font-size: 24px;}
.ws20 {font-size: 27px;}
.ws22 {font-size: 29px;}
.ws24 {font-size: 32px;}
.ws26 {font-size: 35px;}
.ws28 {font-size: 37px;}
.ws36 {font-size: 48px;}
.ws48 {font-size: 64px;}
.ws72 {font-size: 96px;}
.wpmd {font-size: 13px;font-family: 'Arial';font-style: normal;font-weight: normal;}
/*----------Para Styles----------*/
DIV,UL,OL /* Left */
{
margin-top: 0px;
margin-bottom: 0px;
}
</style>
</head>
<body bgColor="#FF9900">
<div id="image1" style="position:absolute; overflow:hidden; left:4px; top:0px; width:715px; height:128px; z-index:0"><img src="images/bar_1.gif" alt="" title="" border=0 width=715 height=128></div>
<div id="image2" style="position:absolute; overflow:hidden; left:709px; top:0px; width:70px; height:128px; z-index:1"><img src="images/bar_2.gif" alt="" title="" border=0 width=70 height=128></div>
<div id="image3" style="position:absolute; overflow:hidden; left:14px; top:132px; width:187px; height:30px; z-index:2"><img src="images/bar_nav.gif" alt="" title="" border=0 width=187 height=30></div>
<div id="shape1" style="position:absolute; overflow:hidden; left:26px; top:166px; width:170px; height:127px; z-index:3"><img border=0 width="100%" height="100%" alt="" src="images/rect44165907.gif"></div>
<div id="image4" style="position:absolute; overflow:hidden; left:16px; top:300px; width:187px; height:30px; z-index:4"><img src="images/bar_nav.gif" alt="" title="" border=0 width=187 height=30></div>
<div id="shape2" style="position:absolute; overflow:hidden; left:24px; top:334px; width:170px; height:84px; z-index:5"><img border=0 width="100%" height="100%" alt="" src="images/rect44194077.gif"></div>
<div id="image5" style="position:absolute; overflow:hidden; left:15px; top:436px; width:187px; height:30px; z-index:6"><img src="images/bar_nav.gif" alt="" title="" border=0 width=187 height=30></div>
<div id="shape3" style="position:absolute; overflow:hidden; left:26px; top:479px; width:170px; height:87px; z-index:7"><img border=0 width="100%" height="100%" alt="" src="images/rect44200867.gif"></div>
<div id="text1" style="position:absolute; overflow:hidden; left:15px; top:41px; width:216px; height:65px; z-index:8">
<div class="wpmd">
<div><font color="#969696"><B> </B></font><font color="#FF0000" face="Batang" class="ws14"><B>PT KERETA API INDONESIA</B></font></div>
<div><font color="#FF00FF"><B> </B></font><font color="#FF00FF"><B><I>Your fast, You save, We Served</I></B></font></div>
</div></div>
<div id="text2" style="position:absolute; overflow:hidden; left:21px; top:142px; width:150px; height:152px; z-index:9">
<div class="wpmd">
<div align=center><font face="Verdana"><B> </B></font><font color="#008000" face="Verdana"><B> MENU</B></font></div>
<div><font color="#FF0000"><BR></font></div>
<UL>
<li><font color="#FF0000">PROFILE PTKAI</font></li>
<li><font color="#FF0000">JADWAL KRL</font></li>
<li><font color="#FF0000">DOWNLOAD</font></li>
<li><font color="#FF0000">GALERY</font></li>
</UL>
<div><font color="#FFFF00"><BR></font></div>
<div><BR></div>
</div></div>
<div id="text3" style="position:absolute; overflow:hidden; left:7px; top:307px; width:189px; height:116px; z-index:10">
<div class="wpmd">
<div align=center><font face="Verdana"><B> </B></font><font color="#008000" face="Verdana"><B> INFORMASI</B></font></div>
<div align=center><font color="#008000" face="Verdana"><B><BR></B></font></div>
<div><font face="Verdana" class="ws6"><B><BR></B></font></div>
<UL>
<li><font color="#FF0000">INFORMASI STASIUN</font></li>
<li><font color="#FF0000">KONTAK</font></li>
</UL>
<div><BR></div>
<div><BR></div>
<div><BR></div>
<div><BR></div>
</div></div>
<div id="text4" style="position:absolute; overflow:hidden; left:15px; top:443px; width:170px; height:184px; z-index:11">
<div class="wpmd">
<div align=center><font face="Verdana"><B> </B></font><font color="#008000" face="Verdana"><B>RESERVASI TIKET</B></font></div>
<div align=center><font color="#008000" face="Verdana"><B><BR></B></font></div>
<div><font face="Verdana" class="ws6"><B><BR></B></font></div>
<UL>
<li><font color="#FF0000">ONLINE</font></li>
<li><font color="#FF0000">PHONE</font></li>
<li><font color="#FF0000">E-BANKING</font></li>
</UL>
<div><BR></div>
<div><BR></div>
<div><BR></div>
</div></div>
<div id="image6" style="position:absolute; overflow:hidden; left:1px; top:619px; width:249px; height:69px; z-index:12"><img src="images/bar_4.gif" alt="" title="" border=0 width=249 height=69></div>
<div id="image7" style="position:absolute; overflow:hidden; left:247px; top:619px; width:531px; height:69px; z-index:13"><img src="images/bar_3.gif" alt="" title="" border=0 width=531 height=69></div>
<div id="image8" style="position:absolute; overflow:hidden; left:245px; top:41px; width:474px; height:66px; z-index:14"><img src="images/bar_title.gif" alt="" title="" border=0 width=470 height=62 style="border:#EAEAEA 2px solid"></div>
<div id="text5" style="position:absolute; overflow:hidden; left:239px; top:157px; width:494px; height:149px; z-index:15">
<div class="wpmd">
<div><font color="#000000" face="Shruti">PT KERETA API INDONESIA (PTKAI) adalah Perusahaan Persero negara yang menjadi teman bagi Rakyat Indonesia dalam menempuh perjalanan jauh, maupun dekat</font></div>
</div></div>
<div id="image9" style="position:absolute; overflow:hidden; left:657px; top:620px; width:55px; height:55px; z-index:16"><img src="images/talk.gif" alt="" title="" border=0 width=55 height=55></div>
<div id="image10" style="position:absolute; overflow:hidden; left:577px; top:314px; width:133px; height:161px; z-index:17"><img src="images/BFH18622.jpg" alt="" title="" border=0 width=133 height=161></div>
<div id="text6" style="position:absolute; overflow:hidden; left:253px; top:641px; width:366px; height:41px; z-index:18">
<div class="wpmd">
<div><font face="Tahoma" class="ws9">PT KERETA API INDONESIA</font></div>
</div></div>
<div id="text7" style="position:absolute; overflow:hidden; left:238px; top:309px; width:284px; height:195px; z-index:19">
<div class="wpmd">
<div><font color="#808080" face="Tahoma">Sebagai negara yang wilayahnya kecil, pasar domestiknya sangat terbatas dan sumber daya alamnya langka, Singapura sangat menggantungkan perekonomiannya pada perdagangan luar negeri. Oleh karena itu pula Singapura sangat berkepentingan terhadap sistem perdagangan internasional yang terbuka dan bebas di bawah naungan WTO. Guna mengamankan kepentingannya, Singapura tidak hanya mengandalkan pada proses negosiasi multilateral, sejak 1999 Singapura telah mulai menjajagi bentuk-bentuk pengaturan perdagangan bilateral. Belakangan dengan tersendatnya proses negosiasi di WTO, Singapura semakin gencar menempuh langkah-langkah bilateral dan regional yang diyakini dapat mengakselerasi proses liberalisasi perdagangan dan memperkuat sistem perdagangan multilateral.</font></div>
</div></div>
<div id="text8" style="position:absolute; overflow:hidden; left:215px; top:515px; width:494px; height:149px; z-index:20">
<div class="wpmd">
<div><font color="#808080" face="Tahoma">Pada dasarnya kedua negara memiliki tingkat komplementaritas ekonomi yang tinggi. Di satu sisi, Singapura mempunyai keunggulan di sektor knowledge, networking, financial resources dan technological advance. Sementara Indonesia memiliki sumber daya alam dan mineral yang melimpah serta tersedianya tenaga kerja yang kompetitif.</font></div>
</div></div>
</body>
</html>
Tidak ada komentar:
Posting Komentar