Tugas CSS Aplikasi Rich Internet

CSS (Cascading Style Sheet) merupakan salah satu fasilitas yang disediakan untuk pemrograman HTML agar dalam hal memformat teks sampai memformat layout para designer dapat mengatur dan mendesain dengan sendirinya. Dengan menggunakan CSS para designer akan dapat mempermudah untuk mengatur style elemen yang berada pada halaman web nya.

h1 {color:blue;}

keterangan:    pada “h1” itu disebut selector

pada “{color:blue;}” itu disebut declaration

pada “color” itu disebut property

pada “blue” itu disebut value

• Selector digunakan untuk menentukan pada elemen apa style tersebut diterapkan. Selector dapat berupa nama id elemen atau nama class. 
• Declaration itu menerangkan style yang akan dibuat. Declaration terdiri dari property dan value. Property dapat diisi dengan jenis warna, ukuran, perataan margin dan lainnya sedangkan Value diisi dengan nilai dari property nya itu sendiri, misalnya red untuk warna dan lainnya. 

Jenis-Jenis CSS antara lain adalah sebagai berikut:

• Internal --> property dari CSS diatur di antara tag STYLE yang diletakkan di antara tag HEAD.
• Eksternal --> pendefinisian style dilakukan pada file tersendiri. Untuk mengakses style eksternal, digunakan tag LINK.
• Inline --> digunakan langsung pada tag yang berada di dalam BODY dengan menggunakan atribut STYLE, untuk melakukan pengaturan dengan property pada CSS. 

1. Properti font-size untuk mengatur besarnya huruf. Contohnya font-size: large;
2.  Properti font-family untuk berguna untuk menentukan nama font. Contohnya font-family: verdana;
3. Properti font-style untuk mengatur teks untuk dimiringkan atau tidak. Contohnya font-style: italic;
4. Properti text-indent untuk melakukan indentasi, yaitu menjorokkan baris pertama agak ke kanan. Contohnya text-indent: 40%;
5. Properti line-height untuk menentukan jarak vertical antara satu baris dengan baris di atas atau di bawahnya. Contonya line-height: 800%;
6. Properti text-decoration untuk mengatur teks agar digarisbawahi atau dicoret ataupun dibuat berkedip. Contohnya text-decoration: none; atau text-decoration: underline; atau text-decoration: line-through; atau text-decoration: blink;
7. Properti font-weight untuk menebalkan atau menipiskan teks. Contohnya font-weight: bold;
8. Properti text-transform untuk melakukan konversi terhadap teks. Contohnya text-transform: none; atau text-transform: capitalize; atau text-transform: uppercase; atau text-transform: lowercase;
9. Properti text-align untuk mengatur peletakkan teks pada arah horizontal. Contohnya text-align: left; atau text-align: right; atau text-align: justify; atau text-align: center;
10. Properti color untuk memberikan warna, dapat menggunakan value color red (nama warna) dan #f00 (code hex) untuk menghasilkan warna merah. Contohnya p.red {color: red;} atau p {color: #f00;}
11. Properti letter-spacing untuk mengatur jarak huruf antara huruf satu dengan huruf lainnya. Contohnya p {letter-spacing: 2px;} atau p {letter-spacing: normal;}
12. Properti text-shadow untuk menambahkan efek bayangan pada teks namun tidak semua browser dapat mendukung properti ini. Contohnya p {color: #a01; text-shadow: 1px 1px 1px #000;}
13. Properti white-space untuk mengatur ruang putih pada elemen, dapat menggunakan value nowrap ataupun value normal. Contohnya pre {white-space: nowrap;} atau pre {white-space: normal;}
14. Properti word-spacing untuk menambah atau mengurangi spasi antara kata satu dengan kata lainnya, dapat menggunakan value length maupun value normal. Contohnya p {word-spacing: 5px;} atau p {word-spacing: normal;}
15. Properti background-color untuk memberi sebuah warna yang diinginkan pada background halaman web. Contohnya memberi warna background hijau background-color: green;
16. Properti background-image untuk memberikan sebuah gambar pada background. Contohnya body {background-image: url(img.jpg); }
17. Properti background-position untuk mendeklarasikan posisi gambar background. Contohnya div {background-position: 10px 5px;} atau div {background-position: bottom right;}
18. Properti background-attachment untuk mendeklarasikan lampiran dari gambar background (untuk menggulir dengan isi halaman atau berada dalam posisi tetap). Contohnya div {background-attachment: fixed;} atau div {background-attachment: scroll;}
19. Properti background-repeat untuk mendeklarasikan bagaimana jika sebuah gambar dari background itu diulang. Contohnya div {background-repeat: repeat-x;} atau div {background-repeat: no-repeat;}
20. Properti margin untuk menyatakan semua properti margin yang dijadikan satu yang terdiri dari top, right, bottom, left. Contohnya div {margin: 5px 12px 4px 7px;}
21. Properti table-layout untuk mendeklarasikan tipe dari layout table. Contohnya table {table-layout: auto;} atau table {table-layout: fixed;}
22. Properti outline sebagai properti singkat untuk mengatur semua properti background sekaligus terdiri dari color, style, width. Contohnya div {outline: green solid 2px;} atau div {outline: #00FF00 double thick;}

Prinsip UID dalam website

Alamat website: http://www.vivanews.com/

Prinsip-prinsip yang diterapkan dalam website ini antara lain:

1.      Accessibility :

Halaman website ini tidak begitu membuat user susah dalam mencari informasi-informasi dan tidak mengijinkan user untuk memodifikasi web tersebut walaupun user tersebut belum menggunakan web tersebut.

2.      Aesthetically Pleasing :

Penampilan dari website ini seluruhnya sangat menarik, menggunakan kategori untuk konten berita nya secara spesifik dan website ini pun tidak menggunakan warna yang mencolok.

3.      Availability :

Dalam website ini sudah dapat memberikan banyak Informasi yang diberikan oleh secara nyata (real) dan aktual.

4.      Clarity :

Tampilan website ini sudah sangat jelas, dan informasi yang disajikan nya pun mudah dipahami secara visual maupun konseptualnya.

5.      Compatibility :

Dalam website ini memberikan informasi sesuai dengan temanya yaitu news, yang berisikan konten berita-berita.

6.      Consistency :

Prinsip Consistency dalam website ini sudah sangat terlihat dengan jelas melalui tab yang terdapat dalam halaman website nya.

7.      Directness :

Sistem yang diterapkan pada website ini dapat langsung memberikan efek pada saat user memberikan sebuah perintah.

8.      Efisiensi :

Sistem ini sangat jelas sehingga apapun yang dilakukan user sistem akan meresponnya dengan memberikan data yang tersedia.

9.      Familiarity :

Website ini sudah dapat menggunakan bahasa yang mudah atau tidak asing bagi user ketika sedang mengakses nya.

10.  Flexibility :

Website ini sudah menggunakan sistem yang dapat peka dengan kebutuhan yang berbeda dari setiap user.

11.  Immersion :

Website ini telah menggunakan pencelupan yang cukup jelas.

12.  Obviousness :

Sudah sangat jelas website ini menunjukkan sistem yang mudah dipahami oleh user dan sudah dapat diakses oleh banyak user.

13.  Perceptibility :

Sudah dapat menerapkan sistem yang tidak memandang kemampuan sensorik seseorang.

14.  Responsiveness :

Pada saat user memberikan perintah, maka sistem yang terdapat dalam website ini dapat langsung memberikan responnya.

15.  Visibility :

Dalam halaman awal website ini menyajikan informasi secara umum dan informasi secara spesifiknya sudah disediakan pada tab konten berita tersebut.

16.  Recovery :

Website ini sudah menyediakan form dapat berkomentar.

Prinsip-prinsip yang diabaikan dalam website ini antara lain:

1.      Configurability :

Dalam website ini tidak memberikan hak akses user dalam mengubah tampilan website ini.

2.      Control :

Website ini tidak membataskan usia untuk user dalam penetapan aturan agar user dapat mengakses website tersebut.

3.      Forgiveness :

Dalam website ini tidak menyediakan kotak pesan ketika user melakukan kesalahan saat mengakses website ini.

4.      Operability :

Website ini sangat tergantung dengan kemampuan fisik user.

5.      Safety :

Pada website ini tidak disediakan notif saat melakukan kesalahan.

6.      Simplicity :

Website ini masih menapilkan elemen yang tidak perlu atau tidak penting.

7.      Transparency :

Karena ijin user dalam website ini tidak terfokus pada tugas atau pekerjaan.

8.      Trade-offs :

Karena website ini tidak mendahulukan persyaratan rakyat.

1.      Kelebihan:

-       Konten berita sangat mudah untuk dibaca dan mudah dipahami oleh user.

-       Desain antar muka sudah sangat menarik karena tidak terlalu membuat user bingung atau sulit untuk memahaminya.

-       Konten berita selalu up-to-date sehingga dapat menarik rasa ingin tahu user.

-       Komunikasi antar user sangat bagus dan menarik.

-       Dapat menyesuaikan dengan situasi dan kondisi yang sedang terjadi atau booming.

2.      Kekurangan:

-       Website Vivanews.com ini belum dapat berinteraksi untuk user yang mengalami kekurangan fisik seperti tunanetra.

-       Website terlalu banyak menampilkan iklan yang menjadi sponsor dalam web tersebut.

-       Tampilan home pada website ini tidak teratur dikarenakan sudah terdapat kategori dari konten berita tersebut sehingga tidak perlu lagi konten berita ditampilkan terlalu banyak di home.

Masukkan :

Tampilan dalam website ini harus dapat lebih rapih, tersusun dan menarik lagi.

How Do We Connected to Internet?

     Pertama kali sebelum kita terhubung ke internet dan mengakses WWW (World Wide Web), terlebih dahulu kita harus mempunyai peralatan yang dibutuhkan untuk dapat terhubung kedalam jaringan internet termasuk dengan penyedia layanan internet (Internet Service Provider) tersebut. Peralatan tersebut antara lain:

1.  Komputer (Personal Computer),

2. Modem dan akses saluran telepon atau jaringan local (LAN) yang  akan terhubung ke internet.

3.  Software yang akan dapat membantu kita untuk membuat account dan dapat mengakses internet.

     Dalam hal mengoperasikan web browser saat ini, kita harus mempunyai komputer (PC) yang setara, RAM yang besar dan ruang disk yang mencukupi. Kita juga dapat terhubung ke internet melalui LAN (Local Area Network). Namun jika kita mengakses internet di luar LAN maka kita membutuhkan yang namanya modem, dan modem tersebut lah yang akan menghubungkan kita dengan komputer lain sehingga data dapat dikirim secara bolak balik.

     

    Dan untuk mendapatkan hasil yang terbaik, pastikan bahwa sistem operasi pada komputer kita up-to-date. Agar koneksi pada komputer kita selesai maka kita membutuhkan software yang dapat menjalakan koneksi komputer kita kepada penyedia akses internet, membuat account, dan bekerja dengan data secara langsung. Ada beberapa penyedia akses internet untuk membuat interface (antarmuka) protocol line (Slip) atau point-to-point protocol (PPP) koneksi. Koneksi SLIP atau PPP dapat memungkinkan untuk menjalankan paket perangkat lunak independen seperti Web Browser.

     Ada beberapa browser menggunakan protocol khusus untuk menawarkan fitur tambahan diluar kemampuan standar HyperText Markup Language (HTML) yaitu browser Netscape Navigator dan Microsoft Internet Explorer. Browser Netscape Navigator dan Microsoft Internet Explorer dapat memungkinkan untuk penggunaan plug-in (aplikasi software tambahan yang seolah-olah merupakan bagian integral dari browser tersebut).

   Pada saat ini terdapat dua metode untuk mengakses internet adalah melalui koneksi jaringan yang memungkinkan pengguna memakai LAN (Local Area Network) untuk online dan koneksi dial-up melalui jalur modem dan telepon.

     Kabel Internet-Sistem ini memungkinkan komputer kita untuk menghubungkan ke Internet melalui kabel yang sama yang membawa sinyal TV kita. Biaya layanan bulanan biasanya tidak lebih dari biaya koneksi modem standar, tetapi kita harus menyewa atau membeli "modem kabel." Selain itu, komputer kita akan memerlukan sebuah kartu Ethernet (papan sirkuit khusus yang memungkinkan untuk koneksi jaringan). 

Integrated Services Digital Network (ISDN)-Sebuah saluran ISDN adalah jenis saluran telepon digital yang dapat mengirimkan data banyak kali lebih cepat dari modem dan saluran telepon konvensional. 

Wireless koneksi-Pager, telepon selular dan personal digital assistant (PDA) sekarang memungkinkan berbagai tingkat akses Internet, dari pemberitahuan e-mail ke koneksi Web yang terbatas.

Pengertian Netbeans

Netbeans merupakan sebuah aplikasi Integrated Development Environment (IDE) yang berbasiskan Java dari Sun Microsystems yang berjalan di atas swing. Swing merupakan sebuah teknologi Java untuk pengembangan aplikasi desktop yang dapat berjalan pada berbagai macam platform seperti windows, linux, Mac OS X dan Solaris. Sebuah IDE merupakan lingkup pemrograman yang di integrasikan ke dalam suatu aplikasi perangkat lunak yang menyediakan Graphic User Interface (GUI), suatu kode editor atau text, suatu compiler dan suatu debugger.

Netbeans juga digunakan oleh sang programmer untuk menulis, meng-compile, mencari kesalahan dan menyebarkan program netbeans yang ditulis dalam bahasa pemrograman java namun selain itu dapat juga mendukung bahasa pemrograman lainnya dan program ini pun bebas untuk digunakan dan untuk membuat professional desktop, enterprise, web, and mobile applications dengan Java language, C/C++, dan bahkan dynamic languages seperti PHP, JavaScript, Groovy, dan Ruby.

NetBeans merupakan sebuah proyek kode terbuka yang sukses dengan pengguna yang sangat luas, komunitas yang terus tumbuh, dan memiliki hampir 100 mitra (dan terus bertambah!). Sun Microsystems mendirikan proyek kode terbuka NetBeans pada bulan Juni 2000 dan terus menjadi sponsor utama. Dan saat ini pun netbeans memiliki 2 produk yaitu Platform Netbeans dan Netbeans IDE. Platform Netbeans merupakan framework yang dapat digunakan kembali (reusable) untuk menyederhanakan pengembangan aplikasi deskto dan Platform NetBeans juga menawarkan layanan-layanan yang umum bagi aplikasi desktop, mengijinkan pengembang untuk fokus ke logika yang spesifik terhadap aplikasi.

Fitur-fitur dari Platform Netbeans antara lain:

* Manajemen antarmuka (misal: menu & toolbar)
* Manajemen pengaturan pengguna
* Manajemen penyimpanan (menyimpan dan membuka berbagai macam data)
* Manajemen jendela
* Wizard framework (mendukung dialog langkah demi langkah)

Netbeans IDE merupakan sebuah IDE open source yang ditulis sepenuhnya dengan bahasa pemrograman java menggunakan platform netbeans. NetBeans IDE mendukung pengembangan semua tipe aplikasi Java (J2SE, web, EJB, dan aplikasi mobile). Fitur lainnya adalah sistem proyek berbasis Ant, kontrol versi, dan refactoring.

Versi terbaru saat ini adalah NetBeans IDE 5.5.1 yang dirilis Mei 2007 mengembangkan fitur-fitur Java EE yang sudah ada (termasuk Java Persistence support, EJB-3 dan JAX-WS). Sementara paket tambahannya, NetBeans Enterprise Pack mendukung pengembangan aplikasi perusahaan Java EE 5, meliputi alat desain visual SOA, skema XML, web service dan pemodelan UML. NetBeans C/C++ Pack mendukung proyek C/C++.

Modularitas: Semua fungsi IDE disediakan oleh modul-modul. Tiap modul menyediakan fungsi yang didefinisikan dengan baik, seperti dukungan untuk bahasa pemrograman Java, editing, atau dukungan bagi CVS. NetBeans memuat semua modul yang diperlukan dalam pengembangan Java dalam sekali download, memungkinkan pengguna untuk mulai bekerja sesegera mungkin. Modul-modul juga mengijinkan NetBeans untuk bisa dikembangkan. Fitur-fitur baru, seperti dukungan untuk bahasa pemrograman lain, dapat ditambahkan dengan menginstal modul tambahan. Sebagai contoh, Sun Studio, Sun Java Studio Enterprise, dan Sun Java Studio Creator dari Sun Microsystem semuanya berbasis NetBeans IDE.

Fitur fitur yang terdapat dalam netbeans antara lain:

1.    Smart Code Completion: untuk mengusulkan nama variabel dari suatu tipe, melengkapi keyword dan mengusulkan tipe parameter dari sebuah method.

2.    Bookmarking: fitur yang digunakan untuk menandai baris yang suatu saat hendak kita modifikasi.

3.    Go to commands: fitur yang digunakan untuk jump ke deklarasi variabel, source code atau file yang ada pada project yang sama.

4.    Code generator: jika kita menggunakan fitur ini kita dapat meng-generate constructor, setter and getter method dan yang lainnya.

5.    Error stripe: fitur yang akan menandai baris yang eror dengan memberi highlight merah.

Paket-Paket Tambahan NetBeans IDE
NetBeans Mobility Pack

NetBeans Mobility Pack adalah alat untuk mengembangkan aplikasi yang berjalan pada perangkat bergerak (mobile), umumnya telepon seluler, tetapi juga mencakup PDA, dan lain-lain.

NetBeans Mobility Pack dapat digunakan untuk menulis, menguji, dan debugging aplikasi untuk perangkat bergerak yang menggunakan teknologi berplatform Java Micro Edition (platform Java ME). Paket ini mengintegrasikan dukungan terhadap Mobile Information Device Profile (MIDP) 2.0, Connected Limited Device Configuration (CLDC) 1.1, dan Connected Device Configuration (CDC). Emulator dari pihak ketiga dapat diintegrasikan dengan mudah untuk lingkungan pengujian yang lebih kokoh. NetBeans Mobility Pack saat ini tersedia dalam dua klaster yang berbeda, yang satu memuat CDC dan yang lainnya CLDC.

NetBeans Profiler

NetBeans Profiler adalah alat untuk mengoptimalkan aplikasi Java, membantu menemukan kebocoran memori dan mengoptimalkan kecepatan.

Profiler ini berdasarkan sebuah proyek riset Sun Laboratories yang dahulu bernama Jfluid. Riset tersebut mengungkap teknik tertentu yang dapat digunakan untuk menurunkan overhead proses profiling aplikasi Java. Salah satu dari teknik tersebut adalah instrumentas i kode byte dinamis, yang berguna untuk profiling aplikasi Java yang besar. Dengan menggunakan instrumentasi kode byte dinamis dan algoritma-algoritma tambahan, Netbeans Profiler mampu mendapatkan informasi runtime aplikasi yang terlalu besar atau kompleks bagi profiler lain. NetBeans IDE 6.0 akan mendukung Profiling Point yang memungkinkan kita memprofilkan titik yang tepat dari eksekusi dan mengukur waktu eksekusi.

NetBeans C/C++ Pack

NetBeans C/C++ Pack menambahkan dukungan terhadap pengembang C/C++ ke NetBeans IDE 5.5. Paket ini memperbolehkan pengembang menggunakan sekumpulan kompiler dan alat sendiri bersama dengan NetBeans IDE untuk membangun aplikasi native untuk MS Windows, Linux, dan Solaris. Paket ini membuat editor mengenali bahasa C/C++ dan menyediakan project template, browser kelas yang dinamis, dukungan pembuatan file dan fungsionalitas debugger. Para pengembang juga dapat mengembangkan paket tersebut dengan fungsionalitas tambahan mereka sendiri.

NetBeans Enterprise Pack

NetBeans Enterprise Pack memperluas dukungan terhadap pengembangan aplikasi perusahaan dan web service di NetBeans IDE 5.5.

Enterprise Pack ini mengembangkan kemampuan untuk menulis, menguji, dan debug aplikasi dengan arsitektur berorientasi layanan (Service-Oriented Architecture) menggunakan XML, BPEL, dan Java web service. Paket ini menambahkan alat desain visual untuk pemodelan UML, skema XML, dan web service orchestration, juga dukungan untuk web service dengan menggunakan identitas yang aman. Paket ini juga menginstal dan mengkonfigurasi runtime yang diperlukan, termasuk mesin BPEL dan server manajemen identitas yang terintegrasi dengan Sun Java System Application Server.

NetBeans Ruby Pack

Versi NetBeans 6.0 mendatang akan mengijinkan pengembangan IDE menggunakan Ruby dan Jruby, sebagaimana Rails untuk dua implementasi Ruby yang lain. Preview NetBeans Ruby Pack tersedia sejak rilis Milestone 7 NetBeans 6.

Ruby Pack memasukkan fungsionalitas editor seperti:

* pengeditan dasar
* pewarnaan sintaks untuk Ruby
* pelengkapan kode
* occurence highlighting
* pop-up dokumentasi yang terintegrasi untuk pemanggilan Ruby API
* analisis semantik dengan highlighting parameter dan variabel lokal yang tidak terpakai

NetBeans JavaScript Editor

NetBeans JavaScript Editor menyediakan perluasan dukungan terhadap JavaScript dan CSS. Fitur-fiturnya antara lain:

1. Editor JavaScript
* syntax highlighting
* pelengkapan kode untuk objek dan fungsi native
* semua fitur dalam editor NetBeans
* pembuatan kerangka kelas JavaScript secara otomatis
* pembuatan pemanggilan AJAX dari template
2. Ekstensi editor CSS
* pelengkapan kode untuk nama-nama style
* navigasi cepat melalui panel navigator
* penampilan deklarasi aturan CSS di List View
* penampilan struktur file di Tree View
* mengurutkan outline view berdasarkan nama, tipe, atau urutan deklarasi (List & Tree)
* pembuatan deklarasi aturan (hanya Tree)
* pemfaktoran kembali sebagian nama rule (hanya Tree)

Database yang didukung oleh Netbeans antara lain:

1.    
JDBC merupakan spesifikasi standar dari JavaSoft API (Aplication Programming Interface) yang memungkinkan program Java untuk mengakses sistem database manajemen. JDBC API terdiri dari satu set interface dan kelas yang ditulis dalam bahasa pemrograman Java. JDBC API Menggunakan interface standar dan kelas, programmer dapat menulis aplikasi yang terhubung ke database, mengirimkan pertanyaan ditulis SQL (Structured Query Language), dan memproses hasilnya.

2. ORACLE merupakan sebuah aplikasi basisdata yang didukung oleh NetBeans, Oracle secara umum hampir sama dengan MySQL namun yang membedakan adalah oracle dapat digunakan dan dihubungkan dengan netbeans dan harus menggunakan drivers untuk menyimpan data-data yang telah dibuat. Oracle merupakan salah satu dari beberapa aplikasi basisdata yang sering digunakan untuk koneksi ke basisdata pada NetBeans karena relatif mudah dan cepat.

3. MySQL merupakan sebuah aplikasi basisdata yang didukung oleh NetBeans, MySQL memilki Fitur Yang ada sudah lumayan lengkap, dari input, update, delete serta Search. Sebuah antarmuka ODBC memanggil MyODBC yang memungkinkan setiap bahasa pemrograman yang mendukung ODBC untuk berkomunikasi dengan basis data MySQL. Kebanyakan kode sumber MySQL dalam ANSI C.

Berikut sekilas mengenai beberapa syntaks SQL yang digunakan pada NetBeans:

1. Interface :
a. java.sql.Statement Interface yang digunakan untuk mengirim laporan statis SQL ke server database dan memperoleh hasilnya.

b. javax.sql.ConnectionEventListener Menerima event atau kejadian bahwa obyek PooledConnection digeneralisasi.


2. Classes :
a. java.sql.Date Subclass dari java.util.Date digunakan untuk tipe data SQL DATE.

b. java.lang.DriverManager Class yang digunakan untuk mengelola satu set JDBC drivers.

3. Exception Classes:
a. java.sql.SQLException Eksepsi yang menyediakan informasi tentang Database error

b. java.sql.SQLWarning Eksepsi yang menyediakan informasi tentang peringatan Database.


4. DataBase Access (Microsoft Access) merupakan sebuah aplikasi basis data yang didukung oleh NetBeans, data dapat disimpan di dalam format Microsoft Access, Microsoft Jet Database Engine, Microsoft SQL Server, Oracle Database, atau semua kontainer basis data yang mendukung standar ODBC. Access juga mendukung teknik-teknik pemrograman berorientasi objek.