SISTEM INFORMASI MAHASISWA

BAB I

WEB DESAIN

Ada yang tahu HTML 5 ?

HTML5 merupakan sebuah bahasa markah untuk menstrukturkan dan menampilkan isi dari World Wide Web, sebuah teknologi
inti dari Internet. HTML5 adalah revisi kelima dari HTML dan hingga bulan Juni 2011 masih dalam pengembangan. Dimana tujuan
utama pengembangan HTML5 adalah untuk memperbaiki teknologi HTML agar mendukung teknologi multimedia terbaru, mudah
dibaca oleh manusia dan juga mudah dimengerti oleh mesin.
HTML5 merupakan hasil proyek dari W3C (World Wide Web Consortium dan WHATWG ( Web Hypertext Application Technology
Working Group ). Dimana WHATWG bekerja dengan bentuk web dan aplikasi dan W3C merupakan pengembang dari XHTML 2.0
pada tahun 2006, kemudian mereka memutuskan untuk bekerja sama dan membentuk versi baru dari HTML.

dan opera. Beberapa browser sudah mendukung HTML5 seperti safari. header. email. chrome. . footer. Pembuatan HTML5 juga di karenakan Standard HTML4 yang dijumpai banyak memiliki kelemahan untuk mendukung aplikasi web yang interaktif. waktu. Akibat hal ini banyak orang menambahkan fitur baru baik disisi aplikasi web ataupun disisi browser. Kabarnya IE9 ( Internet Explorer ) akan mendukung beberapa fitur dari HTML5. Solusi ini dikenal dengan plugin dan salah satunya adalah Flash dan Silverlight. tanggal. search. DOM. firefox. SISTEM INFORMASI MAHASISWA Berikut tujuan dibuatnya HTML5 :  Fitur baru harus didasarkan pada HTML. dan JavaScript  Mengurangi kebutuhan untuk plugin eksternal ( Seperti Flash )  Penanagan kesalahan yang lebih baik  Lebih markup untuk menggantikan scripting  HTML5 merupakan perangkat mandiri  Proses pembangunan dapat terlihat untuk umum Fitur baru dalam HTML5 :  Unsur kanvas untuk menggambar  Video dan elemen audio untuk media pemutaran  Dukungan yang lebih baik untuk penyimpanan secara offline  Elemen konten yang lebih spesifik. nav. CSS. seperti artikel. url. section  Bentuk kontrol form seperti kalender.

secara otomatis mengurangi bandwidth inbound/outbound situs. 4. Perkiraan ke depan. SISTEM INFORMASI MAHASISWA Jodohnya HTML 5 adalah CSS3 CSS3 tidak sama dengan CS(S-nya 3 kali) atau CSSSS (Cascading Style Sheets Sheets Sheets). . Beberapa kelebihan yang ada pada CSS3 : 1. kolom pada teks. CSS3 merupakan bahasa pemrograman olah digital gambar/citra tingkat tinggi. tidak ada lagi web yang menggunakan jQuery karena sizenya lebih besar dibanding CSS3. Fungsi jQuery sepenuhnya akan tergantikan oleh CSS3. saat ini penggunaan flash juga mulai terakusisi dengan semakin berkembangnya CSS3. dan fitur gradien pada background. yang sebelumnya tidak bisa dilakukan oleh CSS2/CSS2. CSS3 kaya akan fitur untuk animasi dan efek untuk text atau objek. Jadi pada dasarnya. pengertian CSS3 sama saja dengan pengertian CSS generasi paling awal. fitur transparansi. dan bisa menggantikan peran gambar. Hanya saja. warn a pada teks yang diseleksi. 3. CSS3 memiliki fasilitas untuk shadow dari suatu div layout. CSS3 merpukan generasi ke-3 dari perkembangan CSS sebelumnya. gradien warna pada border. Contohnya di dalam objek ‘blockquote’ bisa membuat (quote) di awal dan akhirnya menggunakan font lebih besar dari konten blockquote itu sendiri. 2.1. CSS3 bisa lebih detail untuk mendeklarasikan objek yang akan diberikan style. Bisa mengurangi ukuran file yang di-load dan lebih ringan.0 atau situs interaktif dan efisien berdasar dari penggunaan CSS. beberapa standar baru untuk CSS3 menggantikan CSS2 dan mungkin akan membuat kiat dapat bereksplorasi lebih dalam lagi untuk membuat tampilan situs lebih menarik dan mulai meninggalkan situs yang membuat menunggu dengan loading yang lama. Standar web 2. fitur skala memperkecil atau memperbesar layout. Bukan cuma jQuery. Dengan CSS3 situs akan bisa lebih berkembang dan bisa lebih interaktif lagi dengan pengunjung.

Untuk apa itu bootstrap ? Bootstrap merupakan framework untuk membangun desain web secara responsif. Persiapan: 1. SISTEM INFORMASI MAHASISWA Apa itu Bootstrap ? Bootstrap adalah front-end framework yang solek. tampilan web yang dibuat oleh bootstrap akan menyesuaikan ukuran layar dari browser yang kita gunakan baik di desktop. Dengan bootstrap kita juga bisa membangun web dinamis ataupun statis. kemudian extract menggunakan program . Sehingga. terlebih dahulu Anda harus mendownload resource file atau file distribusi yang disediakan oleh bootstrap di situs resminya getbootstrap.) guna mempercepat dan mempermudah pengembangan website. tablet ataupun mobile device. Bagaimana belajar Bootstrap untuk pemula ? Untuk memulai belajar Bootstrap. kita bisa membuat web untuk tampilan desktop saja dan apabila dirender oleh mobile browser maka tampilan dari web yang kita buat tidak bisa beradaptasi sesuai layar.com. CSS dan Javascript siap pakai dan mudah untuk dikembangkan. Baiklah langsung saja. Anda harus mempersiapkan bahan dan tools pendukung untuk melengkapi kegiatan belajar tersebut. smartphone dll. Fitur ini bisa diaktifkan ataupun dinon-aktifkan sesuai dengan keinginan kita sendiri. Artinya. Anda Harus memiliki file distribusi Bootstrap Untuk menggunakan bootstrap. bagus dan luar biasa yang mengedapankan tampilan untuk mobile device (Handphone. Setelah didownload. Bootstrap menyediakan HTML.

Anda juga bisa menggunakan Code Editor dari kami yang dibuat untuk tes atau uji coba kode. Hal ini dilakukan agar kita bisa bekerja dan menggunakannya secara offline (tanpa koneksi internet). . Download jQuery Library Untuk Bekerja Offline Untuk bisa mengaplikasikan bootstrap component seperti modal dialog. 3. Ada banyak sekali code editor yang tersebar di internet yang dapat kita gunakan baik yang gratis maupun yang berbayar. Anda juga bisa membuka file tersebut dengan aplikasi bawaan windows dengan cara membuka file tersebut. Sebetulnya. Anda harus memiliki code editor. SISTEM INFORMASI MAHASISWA seperti 7zip (Gratis) atau winRAR (shareware). CSS dan Javascript sebagaimana file tersebut terdapat pada bootstrap. kemudian copy seluruh file dan paste-kan ke folder lain. navigation bar dan lainnya yang membutuhkan boostrap JS. kita harus mendownloadnya secara terpisah. Code editor penting sekali untuk memanipulasi file yang akan kita kembangkan khususnya file HTML. Bootstrap tidak menyertakan jQuery di dalam file download-nya untuk itu. Jangan pernah menggunakan Word processor (Microsoft Word. 2. Bootstrap JS juga membutuhkan jQuery library agar bisa berjalan normal. Karena aplikasi tersebut tidak cocok dan terdapat banyak kekurangan yang akan membingungkan kita sendiri nantinya. dll) ataupun notepad untuk memanipulasi file-file tersebut.

SISTEM INFORMASI MAHASISWA A. User Interface User Interface yang akan kita gunakan dalam pembuatan aplikasi ini adalah Bootstrap template SBAdmin v2. Halaman Login . 1.

Halaman Login Validasi . SISTEM INFORMASI MAHASISWA 2.

SISTEM INFORMASI MAHASISWA 3. Halaman Login Error .

Halaman Beranda Utama . SISTEM INFORMASI MAHASISWA 4.

Halaman Beranda & Menu Navigasi . SISTEM INFORMASI MAHASISWA 5.

SISTEM INFORMASI MAHASISWA 6. Halaman Beranda Utama & Menu Sesi User .

Halaman Tabel Data . SISTEM INFORMASI MAHASISWA 7.

SISTEM INFORMASI MAHASISWA 8. Halaman Tambah Data .

Halaman Ubah Data . SISTEM INFORMASI MAHASISWA 9.

SISTEM INFORMASI MAHASISWA REFERENSI http://www.asp https://jquery.com/ .w3schools.com/html/default.asp http://www.w3schools.com/bootstrap/default.w3schools.com/jquery/ http://startbootstrap.com/ http://www.

Master your semester with Scribd & The New York Times

Special offer for students: Only $4.99/month.

Master your semester with Scribd & The New York Times

Cancel anytime.