CSS 3 User Interface

Antarmuka pemakai (User Interface) merupakan mekanisme komunikasi antara pengguna (user) dengan sistem. Antarmuka pemakai (User Interface) dapat menerima informasi dari pengguna (user) dan memberikan informasi kepada pengguna (user) untuk membantu mengarahkan alur penelusuran masalah sampai ditemukan suatu solusi.

Contoh konsep luas user interface mencakup aspek interaktif sistem operasi komputer, perkakas tangan, operator kontrol mesin berat. dan proses kontrol. Pertimbangan desain yang berlaku saat membuat user interface berkaitan dengan ergonomik dan psikologi. User interface yang ada untuk berbagai sistem, dan menyediakan cara :

• Input, memungkinkan pengguna untuk memanipulasi sistem. 
• Output, memungkinkan sistem untuk menunjukkan efek manipulasi pengguna.

User Interface ada dua jenis, yaitu :

1. Graphical User Interface (GUI) : Menggunakan unsur-unsur multimedia (seperti gambar, suara, video) untuk berinteraksi dengan pengguna. 
2. Text-Based : Menggunakan syntax/rumus yang sudah ditentukan untuk memberikan perintah.

Kali ini kita akan membahas user interface pada CSS 3. Dalam CSS3, ada beberapa fitur tampilan user interface terbaru, yaitu :

• Resize 
• Box-sizing 
• Outline-offset

Pada browser pendukung dapat dijelaskan :

• Resize didukung dalam Firefox, Chrome, dan Safari. 
• Box-sizing didukung di Internet Explorer, Chrome, Safari, dan Opera. Pada Firefox memerlukan kode awal “moz”. 
• Outline-offset didukung di semua browser utama, kecuali Internet Explorer.

CSS 3 Resize

Dalam CSS3, sifat resize menentukan apakah atau tidak elemen harus diubah ukurannya oleh pengguna. Elemen ini hanya dapat diubah ukurannya oleh pengguna Firefo, Chrome dan Safari. Kode CSS nya sebagai berikut :

CSS 3 Box-Sizing

Box-sizing memungkinkan anda untuk menentukan unsur-unsur tertentu sesuai area dengan cara tertentu. Kode CSS nya sebagai berikut : 

CSS 3 Outline Offset

Outline-offset mengimbangi garis, dan dibuat melebihi batas sisi-sisinya. Dalam membuat batas garis ada dua cara: 

• Garis tidak boleh banyak mengambil ruang lainnya 
• Garis tidak membentuk persegi panjang

Kode CSS nya sebagai berikut :

CSS 3 User Interface Properties

Properties	Description
Appearance	Allows you to make an element look like a standard user interface element
Box-sizing	Allows you to define certain elements to fit an area in a certain way
Icon	Provides the author the ability to style an element with an iconic equivalent
Nav-down	Specifies where to navigate when using the arrow-down navigation key
Nav-index	Specifies the tabbing order for an element
Nav-left	Specifies where to navigate when using the arrow-left navigation key
Nav-right	Specifies where to navigate when using the arrow-right navigation key
Nav-up	Specifies where to navigate when using the arrow-up navigation key
Outline-offset	Offsets an outline, and draws it beyond the border edge
Resize	Specifies whether or not an element is resizable by the user

Untuk pembahasan materi pengenalan CSS3 yang lainnya bisa dilihat di

( http://livemakefun.blogspot.com/.../pengenalan-css-3_13.html)

Referensi :

http://www.w3schools.com/css3/css3_user_interface.asp

http://abdulghanni.blogspot.com/2012/10/tentang-user-interface-penghubung.html

http://senalastiansah.blogspot.com/2012/10/pengertian-user-interface-user.html

http://google.com