Pengertian Domain

Domain adalah nama unik yang diberikan untuk mengidentifikasi nama server komputer seperti web server atau email server di jaringan komputer ataupun internet.  Change text between marquee tags
Alternate marquee behavior Tyssa Adhana XII Pemasaran 2 <<< Opposite Direction Marquees>>>

Penjelasan ISP

Internet Service Provider (ISP) adalah sebuah perusahaan penyedia layanan pada jasa sambungan internet dengan jasa lainnya yang saling berhubungan. Change text between marquee tags
Alternate marquee behavior Up marquee direction Down marquee direction <<< Opposite Direction Marquees>>>

Change text between marquee tags
Alternate marquee behavior Up marquee direction Down marquee direction <<< Opposite Direction Marquees>>>

Tugas Kontent 19082015

 sharing online pada Google Drive

Apakah yang disebut sharing online pada Google Drive ? Sharing Online Pada Google Drive Berbagi (sharing) dokumen Dokumen yang sudah dibuat di Google Drive dapat di-share, sehingga memungkinkan banyak orang dapat menggunakan secara bersamaan, bekerja pada dokumen yang sama meski tidak berada pada satu tempat,. Pengguna bebas memilih kepada siapa saja dokumen tersebut akan di-share.

Tugas Kontent 19082015

FORUM DAN BERILAH 3 CONTOH DAN BERILAH KETERANGAN SINGKAT MENGENAI FORUM TERSEBUT

Forum adalah suatu gelanggang terbuka, dimana seseorang mendapat kesempatan berbicara tentang masalah apapun. Pembicara dapat datang dari kelompok massa, dan segera setelah selesai pembicaraannya ia harus kembali ke tempat semula. Jadi dalam forum tidak ada anggota tertentu yang duduk terpisah dari pendengar, tetapi ditekankan pada pemberian kesempatan bagi setiap orang untuk mengemukakan pikiran dan perasaan di depan khalayak. Berbagai macam cara pertemuan untuk bertukar pikiran secara bebas, mulai dari simposium, seminar, lokakarya atau yang sering disebut workshop, rapat, diskusi, konferensi, kongres, dan musyawarah kerja. Disini akan dijabarkan tentang masing-masing forum tersebut.

1.    Seminar

Seminar merupakan suatu pembahasan masalah secara ilmiah, walaupun topik yang dibahas adalah masalah sehari-hari. Dalam membahas masalah, tujuannya adalah mencari suatu pemecahan, oleh karena itu suatu seminar selalu diakhiri dengan kesimpulan atau keputusan-keputusan yang merupakan hasil pendapat bersama, yang kadang-kadang diikuti dengan resolusi atau rekomendasi. Pembahasan dalam seminar berpangkal pada makalah atau kertas kerja yang telah disusun sebelumnya oleh beberapa orang pembicara sesuai dengan pokok-pokok bahasan yang diminta oleh sesuatu panitia penyelenggara. Pokok-pokok bahasan yang diminta oleh suatu penitia penyelenggara. Pokok bahasan yang telah ditentukan, akan dibahas secara teoritis dan dibagi menjadi beberapa subpokok bahasan bila masalahnya sangat luas. Pada awal seminar, dapat dibuka dengan suatu pandangan umum oleh orang berwenang (yang ditunjuk panitia) sehingga tujuan seminar terarah. Kemudian hadirin (massa) dibagi menjadi beberapa kelompok untuk membahas permasalahan lebih lanjut. Tiap kelompok dapat diserahi tugas membahas suatu sub pokok bahasan untuk dibahas dalam kelompok yang biasanya juga disebut seksi/komisi, di bawah pimpinan seorang ketua komisi (kelompok). Dari hasil-hasil kelompok, disusun suatu perumusan yang merupakan suatu kesimpulan yang dirumuskan oleh suatu tim perumus yang ditunjuk. Pembahasan dalam seminar memakan waktu yang lebih lama karena sifatnya yang ilmiah. Apabila para pembicara tidak dapat mengendalikan diri biasanya waktu banyak dipergunakan untuk pembahasan yang kurang penting. Oleh karena itu dibutuhkan pimpinan kelompok yang menguasai persoalan sehingga penyimpangan dari pokok persoalan dapat dicegah. Penyimpangan ini dapat diatasi bila setiap kali ketua sidang menyimpulkan hasil pembicaraan sehingga apa yang akan dibicarakan selanjutnya sudah terarah.

2.    Lokakarya atau workshop

Lokakarya atau dalam bahasa Inggris workshop adalah suatu acara pertemuan antara para ahli (pakar) untuk membahas masalah praktis di mana beberapa orang berkumpul untuk memecahkan masalah tertentu dan mencari solusinya. Sebuah lokakarya adalah pertemuan ilmiah yang kecil.

3.    Rapat

Rapat merupakan suatu bentuk media komunikasi kelompok resmi yang bersifat tatap muka, yang sering diselenggarakan oleh banyak organisasi, baik swasta maupun pemerintah. Rapat merupakan alat untuk mendapatkan mufakat, melalui musyawarah kelompok. Rapat merupakan media yang dapat dipakai unttuk pengambilan keputusan secara musyawarah untuk mufakat. Rapat merupakan pertemuan antara para anggota di lingkungan kantor/ perusahaan/ organisasi sendiri untuk membicarakan, merundingkan suatu masalah yang menyangkut kepentingan bersama. Rapat merupakan alat/media komunikasi kelompok yang bersifat tatap muka dan sangat penting, diselenggarakan oleh banyak organisasi, baik swasta maupun pemerintah untuk mendapatkan mufakat melalui musyawarah untuk pengambilan keputusan.

4.    Diskusi

Kata diskusi berasal dari bahas Latin discutio atau discusum yang berarti bertukar pikiran. Dalam bahasa Inggris digunakan kata discussion yang berarti perundingan atau pembicaraan.  Dari segi istilah, diskusi berarti perundingan/bertukar pikiran tentang suatu masalah: untuk memahami, menemukan sebab terjadinya masalah, dan mencari jalan keluarnya. Diskusi ini dapat dilakukan oleh dua-tiga orang, puluhan, dan bahkan ratusan orang. Diskusi adalah sebuah proses tukar menukar informasi, pendapat, dan unsur unsur pengalaman secara teratur dengan maksud untuk mendapatkan pengertian bersama yang lebih jelas, lebih teliti tentang sesuatu atau untuk mempersiapkan dan merampungkan kesimpulan/pernyataan/keputusan. Di dalam diskusi selalu muncul perdebatan. Debat ialah adu argumentasi, adu paham dan kemampuan persuasi untuk memenangkan pemikiran/paham seseorang.

5.    Konferensi

Konferensi adalah rapat atau pertemuan untuk berunding  atau bertukar pendapat mengenai suatu masalah yang dihadapi bersama. Konferensi bisnis, pertemuan untuk membahas masalah bisnis. Konferensi pers, suatu pengumuman untuk pers (cetak, radio, televisi) dengan diikuti oleh sesi tanya jawab tentang hal yang diumumkan.

6.    Kongres

Kongres merupakan pertemuan besar para wakil organisasi (politik, sosial, profesi) untuk mendiskusikan dan mengambil keputusan mengenai berbagai masalah. Kongres lebih kepada tujuan politik. Kongres biasanya digunakan untuk mengawasi dan mencocokkan kegiatan pemerintahan.

7.    Musyawarah kerja

Musyawarah kerja atau rapat kerja (raker) merupakan suatu pertemuan yang hanya dihadiri oleh sekelompok massa tertentu yang bergerak dalam bidang kerja sejenis. Dengan massa yang lebih terbatas, raker dilaksanakan untuk saling bertukar pengalaman atau pengetahuan dalam bidang kerja masing-masing, untuk mengevaluasi program-program kerja yang telah dilaksanakan atau untuk mengadakan pembaharuan dalam bidang kerja tersebut.Permasalahan yang akan dibahas, dipersiapkan jauh sebelumnya dengan menginventarisasi masalah dari lapangan kemudian diklasifikasikan ke dalam aspek-aspek tertentu yang akan dibahas dalam pertemuan tersebut. Bila perlu pada permulaan raker didahului dengan ceramah sebagai pengarahan dari seorang nara sumber, di samping ada beberapa nara sumber lain yang sewaktu-waktu dapat memberikan bantuan bila mengalami kesulitan. Peserta dibagi atas beberapa kelompok, yang masing-masing dipimpin oleh seorang ketua kelompok. Hasil akhir sidang kelompok disampaikan pada sidang pleno (lengkap) untuk mendapatkan tinjauan umum secara menyeluruh, untuk pada akhimya diambil satu keputusan. Biasanya raker dilaksanakan selama beberapa hari (lima hari sampai seminggu), oleh karena itu di tengah-tengah raker dapat disisipi acara karyawisata, pameran, demonstrasi, diskusi panel, dan sebagainya.

Tugas Kontent 19082015

Google map

Google map atau google earth adalah sebuah fasilitas dari google untuk para pengguna internet, layanan dari google ini sendiri gratis alias tanpa ada pungutan biaya satu rupiah pun. Kecuali, biaya akses internet. Nah dengan adanya google map ini, kita bisa melihat seakan dunia itu sempit. Mungkin ada di antara anda yang sering bertualang ketempat-tempat yang belum pernah dikunjungi sebelumnya, lalu anda tersesat karena tidak mengetahui rute jalan yang akan ditempuha, maka anda dapat menggunakan akses interanet anda untuk melihat rute jalan melaalui aplikasi Google Map. Saktinya, dan dapat mengetahui rute jalan ditempat yang akan anda tuju, walaupun anda belum pernah secara langsung ketempat yang anda tuju.

Meskipun google map belum update tempat di beberapa wilayah Indonesia (masih banyak wilayah yang belum di update perubahannya untuk Indonesia) namun kontruksi jalan masih relatif sama dengn yang sekarang ada, jadi anda tidak akan bingung menggunakan aplikasi google map ini.

Google map atau anda juga bisa menyebutnya google earth adalah layanan gratis yang hanya menunjukan nama jalan, tidak bisa untuk nama gunung, nama sungai atau yang lainnya, namun google map ini lebih lengkap dari yang lainnya. Dengan aplikasi zooming maka anda dapat melihat lebih jelas wilayah yang belum anda kunjungi, yakni hanya menggunakan layanan google map maka dunia seakan menjadi sempit.

Fasilitas yang disediakan google dalam layanan google map nya ini dapat dibilang hampir sempurna, bagaimana tidak anda disuguhkan layanan cetak peta dalam aplikasi google earth. Kalo begitu silahkan kunjungi maps.google.co.id atau maps.google.com

Tugas Kontent 19082015

Google Docs 

Google docs adalah salah satu fasilitas google.co.id yang sengaja disediakan untuk menyimpan dokumen-dokumen yang Anda miliki. Artinya, Anda bisa memanfaat google.docs sebagai tempat penyimpan data cadangan Anda. Andaikata laptop atau komputer Anda terkena virus, Anda tak perlu kebingungan jika sudah menyimpan data-data Anda di google.docs. File yang Anda simpan masih ada dan tak akan hilang sedikitpun.

Cara Mengupload File

Lantas, bagaimana cara memiliki google.docs? jika Anda sudah memiliki sudah memiliki account gmail, maka Anda sangat mudah menyimpan data di google.docs. Berikut ini ada sembilan langkah yang dapay Anda lakukan.

1. Anda buka terlebih dahulu situs google.co.id atau google.com

2. Kemudian Anda cari di menu layanan atas tulisan “selengkapnya” dan klik.

3. Anda akan bertemu beberapa opsi pilihan, maka klik tulisan “documents”

4. Akan terbukalah perintah untuk mengisi account Anda. Isilah email dan pasword Anda.

5. Lalu akan terbuka jendela untuk meng-upload file. Anda klik “upload” dan pilih opsi “Files”.

6. Klik tombol “browse” untuk mencari file yang akan disimpan.

7. Di jendela “look in” Anda cari di mana filenya Anda simpan, lalu klik tombol “open”.

8. Maka akan muncul keterangan data yang diupload. Lalu akan keluar jendela yang bertuliskan “star upload”. Maka Anda klik, maka file akan diupload

9. Setelah berhasil, Anda akan melihat nama filenya di jendela upload file. Jika ingin melihat hasilnya, Anda tinggal klik judul tulisan yang Anda upload.

Kini, Anda bisa merasa nyaman bahwa file-file penting Anda bisa disimpang di google.docs. Anda pun bisa menyembunyikan file-file rahasia Anda, selama anda tidak memberi tahu orang lain account dan password gmail Anda. Inilah keuntungan lebih yang anda dapat dengan menggunakan layanan google.

Tugas Kontent 19082015

Google Drive

• Pengertian 

Nah, sebelumnya kalian sudah pernah dengar belum istilah dari Google Drive? Pengertian dari Google Drive itu adalah layanan penyimpanan yang dimiliki oleh google. Google Drive ini sebenarnya sudah lama dilunjurkan yaitu sejak 24 April 2012 yang lalu. Google Drive merupakan perubahan dari Google Docs, jika sobat membuka google docs maka akan diredirect ke google drive. Pengguna google drive akan mendapatkan layanan penyimpanan gratis sebesar 5 GB,dan dapat ditambahkan dengan pembayaran tertentu.Dengan fitur unggulan yang sama seperti Dropbox, yaitu sinkronisasi data melalui folder khusus di dalam desktop atau lebih dikenal dengan Desktop Sync Clients. GDrive memberikan kapasitas gratis sebesar 5 GB dan tentunya fitur-fitur yang terintegrasi dengan layanan Google lainnya seperti: Gmail, G+ dan Google Search. Fitur yang bisa digaris bawahi dari GDrive adalah API’s untuk para Developer. Hingga kini GDrive telah terhubung dengan puluhan aplikasi pihak ketiga. Bekerja dengan lebih banyak lagi jenis file bila sobat memasang aplikasi Google Drive dari Toko Web Chrome.Google Drive berfungsi pada sejumlah aplikasi yang terus bertambah yang dapat sobat pasang dari Toko Web Chrome. Dengan aplikasi tersebut, sobat dapat mengedit gambar dan video, mengirim faks dan menandatangani dokumen, mengelola proyek, membuat bagan alur, dan banyak lagi. Berapa pun banyaknya aplikasi Google Drive yang telah sobat pasang, sobat juga dapat mengakses seluruh file Anda dalam satu tempat: Google Drive di web.

• Fungsi dan Keuntungan Google Drive

Setelah mengetahui apa itu Google Drive,selanjutnya Saya akan sedikit menjelaskan mengenai fungsi dan keutungan dari Google Drive yaitu memiliki fungsi layaknya Dropbox yaitu sinkronisasi data dari PC anda, jadi sobat bisa membuat dan berbagi data dan dokumen di google drive tersebut. Selain itu sobat juga bisa mengakses data file dari mana saja di rumah ataupun di kantor dengan terhubung dengan internet pastinya.

Keuntungan lainnya yaitu Google Drive telah terintegrasi dengan layanan google liannya diantaranya gmail, Gplus, google searchdan lainnya. Jika sobat ingin mencoba google drive ini silahkan langsung menuju drive.google.com lalu loginlah menggunakan Email sobat agar sobat bisa menggunakan Google Drive. Nanti akan tampil seperti gambar dibawah jika google drive sobat sudah diaktifkan, namun jika belum silahkan tunggu pemberitahuan dari google ke email sobat,

Kalau sudah berhasil login dan Google Drive sudah aktif sobat bisa langsung Upload File / folder seperti gambar di bawah ini,

Jika ingin menambah kapasitas penyimpanan di Google Drive sobat diharuskan membayar beberapa dollar, sesuai dengan harga yang diberikan oleh google seperti keterangan lengkap (gambar) dibawah ini,

Google Drive berfungsi pada sejumlah aplikasi yang terus bertambah yang dapat Anda pasang dari Toko Web Chrome. Dengan aplikasi tersebut, Anda dapat mengedit gambar dan video, mengirim faks dan menandatangani dokumen, mengelola proyek, membuat bagan alur, dan banyak lagi. Berapa pun banyaknya aplikasi Google Drive yang telah Anda pasang, Anda dapat mengakses seluruh file Anda dalam satu tempat: Google Drive di web.

• Hal-hal yang dapat Anda lakukan dengan aplikasi Google Drive

1. Membuat file baru di Google Drive dari jenis file aplikasi tersebut
2. Mengakses dan membuka file di Google Drive
3. Mengakses file Google Drive dari aplikasi di luar Google Drive
4. Menyimpan file ke Google Drive dari aplikasi di luar Google Drive
5. Berbagi jenis file apa pun, termasuk file yang dibuat dengan aplikasi Google Drive

Membuat file dengan aplikasi Google Drive

Dengan Google Drive, sobat dapat membuat lebih banyak lagi file daripada dengan Google Documents karena beberapa aplikasi memungkinkan Anda membuat jenis file lain di Google Drive. Setelah memasang salah satu aplikasi tersebut, Anda akan melihat jenis file dari aplikasi tersebut tercantum di menu Buat dalam Google Drive di web.

1. Buka drive.google.com.
2. Klik tombol Buat yang berwarna merah di kiri atas.
3. Arahkan mouse ke Lainnya.
4. Pilih aplikasi dari submenu Lainnya.
5. Aplikasi akan terbuka dan Anda dapat mengerjakan file yang telah Anda buat dan simpan. Anda dapat mengaksesnya kapan saja, di mana saja di Drive Saya (Google Drive di web).

Sobat juga dapat menyinkronkan file yang telah Anda buat menggunakan aplikasi Google Drive ke folder Google Drive di komputer Anda. Pilih file yang ingin disinkronkan ke komputer.
Membuka file dengan aplikasi Google Drive
Setelah sobat memasang aplikasi Google Drive, aplikasi akan tampil dalam menu Buka dengan pada Google Drive di web untuk jenis file yang kompatibel dengan aplikasi tersebut. Misalnya, jika aplikasi pengeditan gambar terdaftar untuk membuka file JPEG, Anda dapat membuka file JPEG apa pun di Google Drive dengan aplikasi tersebut.

1. Buka drive.google.com
2. Klik kanan file dalam Google Drive di web
3. Arahkan mouse ke Buka dengan.
4. Pilih nama aplikasi dari submenu Buka dengan.
5. File Anda akan terbuka di aplikasi Google Drive yang Anda pilih.

Membuka atau menyimpan file Google Drive dari aplikasi
Sobat dapat membuka file yang tersimpan dalam Google Drive di web dari dalam aplikasi itu sendiri (tanpa membuka Google Drive di web). Misalnya, Anda membuka sebuah aplikasi dan ingin mengerjakan file yang Anda simpan di Google Drive. Anda dapat membuka file Google Drive tersebut langsung dalam aplikasi tersebut.
Anda juga dapat menyimpan file ke Google Drive yang telah Anda buat atau temukan dalam aplikasi di luar Google Drive itu sendiri. Ada beberapa cara untuk menyimpan file ke Google Drive:

• Saat Anda bekerja di aplikasi Google Drive, file akan disimpan ke Google Drive ketika Anda menyimpan perubahan yang Anda buat pada file tersebut.
• Dalam aplikasi, Anda mungkin melihat opsi “Ekspor ke Google Drive”, “Simpan salinan”, atau “Kirim ke Drive”. Bila Anda memilih opsi tersebut, file akan tersimpan secara otomatis ke Google Drive sobat..

Selain itu, Google akan memberikan kapasitas penyimpanan data gratis 5GB juga benar adanya. Kabar itu memang datang dari orang dalam Google yang membocorkan informasi kepada situs teknologi The Next Web.
Saat ini Google Drive tersedia untuk perangkat komputer bersistem operasi Windows dan Mac, lalu smartphone dan tablet Android. Dari keterangan di situs resmi Google Drive, perusahaan mesin pencari ini akan membuat Google Drive untuk perangkat berbasis iOS, yakni iPhone, iPad dan iPod Touch.
Google Drive bisa dibuat untuk menyimpan data semua format. Dokumen, foto, video, aplikasi, dan segalanya yang dikehendaki.
Bagi Anda pengguna layanan Google Docs, mungkin langsung nyaman menggunakan Google Drive karena data-data Anda otomatis tersimpan di Google Drive.
Begitupun dengan pengguna Android, Anda bisa mengintegrasikan data-data di smartphone atau tablet ke Google Drive. Google Drive menawarkan beberapa pilihan untuk menambah kapasitas ruang penyimpanan data. Diantaranya, 2,49 dollar AS per bulan untuk 25GB dan 4,99 dollar AS per bulan untuk 100 GB.
Jika Anda memutuskan menggunakan Google Drive berbayar, maka kapasitas simpan akun GMail Anda akan ditambah menjadi 25GB.
Pilihan penambahan kapasitas Google Drive tersedia hingga 16TB.
Untuk mulai menggunakan Google Drive. Namun, menurut Google, belum semua pengguna dapat menikmati cloud storageGoogle ini.
Saat dicoba oleh Kompas Tekno dengan menggunakan beberapa akun Google berbeda, tak ada satu pun yang bisa mencoba Google Drive.
Sepertinya, pengguna di Indonesia masih harus bersabar menikmati hard disk online besutan Google ini.

• Fasilitas Google Drive

1. Google Drive memberikan ruang (space) gratis sebanyak 5 GB. Kalau kurang Anda dapat meng-upgrade menjadi 25 GB dengan membayar $2.49 per bulan atau $30 (sekitar Rp280 ribu) per tahun.
2. Membuat dokumen baru, spreadsheet, dan presentasi secara instan. Dapat mengedit suatu dokumen dengan kolega bersama-sama pada waktu yang sama. Ini salah satu kelebihan Google Drive jika dibandingkan dengan situs berbagi pakai.
3. Gmail attachment (sisipan) tidak perlu lagi. Link dari Google Drive dapat dikirim ke Gmail untuk dijadikan attachment secara otomatis.
4. Video dan Foto yang tersimpan di Google Drive akan otomatis tersedia di Google Plus.
5. Mesin pencari khusus tersedia di Google Drive untuk mencari berkas yang ada. Dilengkapi dengan opsi pencarian berbasis ekstensi (jenis) file, bukan hanya nama berkasnya saja.
6. Dapat membuka semua format file, termasuk Adobe HD Video, Photoshop, dll walaupun Anda belum menginstal software tersebut di komputer.
7. Dapat berbagai file (berkas) dengan menggunakan berbagai aplikasi. Jadi, fitur ini fungsinya sama dengan situs berbagi pakain lain.
8. Simpan otomatis. Begitu Anda membuat perubahan di salah satu file di Google Drive, ia akan tersimpan secara otomatis.

• Ketersediaan Google Drive

Google Drive dapat digunakan dalam beberapa piranti (device) berikut:

1. Komputer berbasis Windows
2. Komputer berbasis Mac
3. Tablet berbasis i0S (iPad)
4. Tablet berbasis Android
5. Smartphones iPhone
6. Smartphones berbasis Android

Tapi bagi Anda yang menggunakan sistem Linux jangan berkecil hati. Walaupun Google Drive belum mendukung Sistem Operasi Linux, namun berkat tim ppa ubuntu, google drive kini bisa diakses melalui Nautilus pada Dekstop Gnome Anda. Jika tidak mau repot, Anda juga bisa mencoba cloud storage lain yang mendukung Linux, seperti Dropbox.

• Cara Menggunakan Google Drive

Nah bagi pemula terkadang mengalami kebingungan bagaimana cara menggunakan Google Drive itu sendiri,mari kita belajar bersama. Untuk memulai Google Drive, pergi ke drive.google.com kemudian aktifkan layanan. Setelah Anda memiliki akses ke Drive, Anda siap untuk mulai menggunakan layanan ini. Anda akan melihat bahwa Google Drive Anda sekilas terlihat dan bekerja sangat mirip Google Docs. Anda dapat membuat file, membuat koleksi folder, menggunakan bar bagian atas untuk mencari, dan meng-upload file dengan menyeret dan menjatuhkan ke dalam jendela browser.
Namun, tidak seperti Docs, kini Anda dapat mengelola seluruh drive dari desktop Anda dengan menginstal aplikasi Google Drive. Caranya mudah, setelah Anda masuk drive.google.com, lihatlah sidebar bagian kiri dan pilih Download Google Drive. Setelah Anda mendownloadnya, perangkat Anda akan memiliki folder Google Drive, sehingga setiap perubahan yang Anda buat akan tercermin dalam antarmuka Web, dan sebaliknya.
Selama Anda terkoneksi dengan Internet, ketika Anda menambahkan file ke folder Google Drive , file Anda akan langsung otomastis ter-upload ke drive Web Anda. Mudah bukan?
Selain itu ada beberapa fitur Google Drive yang harus Anda ketahui, fitur-fitur itu antara lain:

1. Dokumen bebas
   Google memang memberikan Anda ruang penyimpanan 5 GB gratis, tetapi hebatnya setiap dokumen yang Anda buat dalam Drive terhitung gratis.
2. Upload hingga 30 jenis file
   Google Drive mendukung penyimpanan dan tampilan 30 jenis file populer. Jadi, Anda dapat meng-upload sebuah film ke Drive dan memainkannya kembali dalam browser Anda, di mana pun Anda berada.
3. Berbagi file, folder, atau seluruh drive
   Fitur ini adalah fitur berbagi sederhana yang dimiliki Google. Hanya dengan klik kanan pada sebuah file, pilih “share…” dan tentukan opsi dari share itu. Untuk memberikan akses ke seseorang untuk seluruh drive Anda, klik tombol dengan orang dan tanda plus di bagian atas.
4. Memanfaatkan Google Goggles
   Dengan teknologi Goggle yang dibangun dalam Drive, Anda dapat mencari foto menggunakan bar pencarian. Demikian juga, Anda dapat mencari teks dalam dokumen yang dipindai. Setelah beberapa pengujian, fitur ini tidak benar-benar dapat diandalkan, tapi layak dicoba jika Anda memerlukan bantuan menemukan file atau foto.
5. Berkolaborasi pada video, foto, dan banyak lagi
   Fitur kolaborasi dari Google Docs sekarang tersedia untuk semua jenis file. Misalnya, jika Anda meng-upload video ke Drive dan berbagi dengan orang lain, Anda akan dapat membahas video dengan alat komentar.
6. Instal aplikasi pihak ketiga
   Pengembang pihak ketiga telah membuat aplikasi yang bekerja secara lancar dengan Google Drive. Pixlr salah satunya yang memungkinkan Anda mengedit foto yang diunggah, HelloFax memungkinkan Anda mengirim faks bebas, dan DocuSign memungkinkan Anda menandatangani dokumen resmi, semua bisa diinstal dalam Google Drive. Untuk mendapatkan aplikasi ini dan lebih banyak lagi, pergi ke Google Drive>Setting> Manage apps> Get more Apps.

• Memasang aplikasi Google Drive

Aplikasi Google Drive tersedia di·Toko Web Chrome dan sobat dapat memasangnya untuk digunakan dalam Google Drive di web. Aplikasi kompatibel dengan semua browser yang didukung.

1. Buka·Toko Web Chrome.
2. Telusuri “Aplikasi Drive”.
3. Klik tombol + Tambahkan ke Drive yang berwarna biru.
4. Berikan otorisasi pada aplikasi untuk mengakses file di Google Drive Anda. (Pelajari lebih lanjut tentang keamanan aplikasi Google Drive.)
5. Klik Pasang.

Tugas kontent 19082015

Pengertian upload dan download

Upload adalah juga proses transmisi sebuah file dari sebuah sistem komputer ke sistem komputer yang lainnya dengan arah yang berkebalikan dengan download. Dari internet, user yang melakukan proses upload adalah proses dimana user mengirimkan file ke komputer lain yang memintanya. User yang men-share gambar,foto dengan yang user yang lainnya di bulletin board sytem (BBS), mengupload file ke BBS. File Transfer Protocol (FTP) adalah contoh Internet protokol untuk downloading and uploading files.

Arti istilah Upload dianggap berkaitan erat dengan pengertian berikut :
Mengirim file dari komputer Anda ke komputer lain. Kegiatan pengiriman data (berupa file) dari komputer lokal ke komputer lainnya yang terhubung dalam sebuah network.

Secara umum upload dapat diartikan proses transmisi data dari komputer client/pemakai ke internet.

Download adalah proses transmisi sebuah file dari sebuah sistem computer ke sistem komputer yang lainnya. Dari internet, user yang melakukan proses download adalah proses dimana seorang user meminta / request sebuah file dari sebuah komputer lain (web site, server atau yang lainnya) dan menerimanya. Dengan kata lain, download adalah transmisi data dari internet ke komputer client/pemakai.

Arti istilah Download dianggap berkaitan erat dengan pengertian berikut :
Menerima file dari komputer lain ke komputer Anda. Kegiatan penerimaan data (berupa file) dari komputer lainnya ke komputer lokal yang terhubung dalam sebuah network.

Secara umum dapat diartikan bahwa download adalah untuk menerima file dan upload adalah untuk mengirimkan file.

Tugas kontent 19082015

Cara Membuat Email Gmail atau Google

Saat ini email sudah banyak digunakan karena untuk membuka email tidak harus melalui komputer, dimana anda sudah dapat membuka email dengan menggunakan smartphone. Baiklah tanpa perlu panjang lebar lagi berikut ini saya berikan tutorial cara membuat email gmail dengan mudah dan cepat.

1. Klik tautan ini : https://accounts.google.com/SignUp?service=mail

2. Isi data seperti gambar dibawah ini. Silahkan baca keterangan dibawah gambar. Jika semua sudah benar lalu klik "Next Step".

KETERANGAN :

• Name : Isi dengan nama depan dan nama belakang anda.
• Choose your username : Isi dengan alamat email yang anda inginkan, pada contoh diatas saya mengisi dengan "irsatrifai33".
• Create a password : Isi dengan kata kunci/password yang ingin anda gunakan untuk login email nantinya.
• Confirm your password : Masukan lagi password yang anda tulis tadi pada bagian ini.
• Birthday : Isi dengan tanggal lahir. Isi dengan Bulan, Tanggal, dan Tahun lahir.
• Gender : Pilih "Male" jika anda laki-laki dan pilih "Female" jika anda perempuan.
• Mobile phone : Isi dengan nomor hp anda yang aktif.
• Your current email address : Pada bagian ini tidak perlu di isi.
• Prove you're not a robot : Isi dengan tulisan/nomor yang terlihat pada kotak. Pada contoh diatas saya mengisikan angka 843.

3. Pada langkah ini klik "No Thanks".

4. Pada langkah ini klik "Continue to Gmail".

5. Selamat,, email anda sudah jadi. Dibawah ini merupakan gambar yang menunjukan anda sudah login/masuk akun email. Untuk membuat/mengirim email baru klik "COMPOSE".

 

Pengertian dan perintah-perintah template

Template merupakan sebuah tampilan awal dalam sebuah situs web / blog sedangkan template tersebut untuk mempercantik tampilan blog anda sehinga bisa menarik pengunjung apa lagi jika template itu sangat ringan, template banyak macamnya tergantung anda ingin menginginkan apa dan carilah template yang cocok untuk niche atau karakter situs yang anda kelola. 

Pengertian dan perintah-perintah javascript

JavaScript adalah sekumpulan perintah khusus yang digunakan untuk membuat sebuah halaman web yang lebih responsif dan interaktif. JavaScript merupakan bahasa script yang dicantumkan pada sebuah halaman web dan dijalankan pada penjelajah web (web browser). JavaScript terutama terkenal karena penggunaannya di halaman web yang memberikan kemampuan tambahan pada HTML dengan mengizinkan pengeksekusian perintah di sisi user (penjelajah web), bukan di sisi server web.

Perintah-perintah javascript :

1. Anti Klik Kanan

Kode javascript ini buat menonaktifkan klik kanan di blog kalian gan, jadi pengunjung gak bisa klik kanan dan melihat source kode blog loe. Cari kode <body> di template blog kalian lalu ganti dengan kode dibawah ini gan.

<body oncontextmenu=”return false;”>

2. Kotak Pesan Peringatan ( Alert Box )

Pesan Pembuka

Kode ini buat nampilin pesan saat pengunjung pertama kali membuka atau mengunjungi blog kalian gan. Cari kode </head> di template blog, lalu copy paste kode di bawah ini tepat di bawahnya gan. Tinggal di edit aja kalimat yang di highlight sesuai keinginan kalian gan.

<script type=”text/javascript”>
alert(“SELAMAT DATANG DI BLOG GAK JELAS INI”);
</script>

Pesan Penutup

Kode ini muncul kalau pengunjung mau meninggalkan atau menutup tab blog kalian gan. Cara pasangnya sama dengan pesan pembuka, cari kode </head> lalu copy paste kode berikut di bawahnya gan. Tinggal di edit aja kalimat yang di highlight sesuai keinginan kalian gan.

<script type=”text/javascript”>
window.onbeforeunload=function(){
return confirm(“Yakin Ingin Meninggalkan Blog Ini?? Masih Banyak Yang Menarik Loh Untuk Di Baca!!”);
}
</script>

3.Onmouseover Sound

Kode ini buat memberikan backsound musik kalau pengunjung mengarahkan atau mengklik mousenya ke text atau gambar gan. Caranya tinggal copy paste kode di bawah ini ke mode HTML edit post blog kalian.

<script language=”javascript” type=”text/javascript”>
function playSound(soundfile) {
document.getElementById(“SCsound”).innerHTML=
“<embed src=\””+soundfile+”\” hidden=\”true\” autostart=\”true\” loop=\”false\” />”;
}
</script>

<span id=”SCsound”></span>

Lalu copy dan paste kode di bawah ini buat ngemunculin musik/soundnya gan.

<a href=”#” onmouseover=”playSound(‘URL-FILE-MUSIK/SOUND’);”>
Mouseover DISINI Buat Dengerin Musik</a>

Atau

<a href=”#” onclick=”playSound(‘URL-FILE-MUSIK/SOUND’);”>Klik DISINI Buat Dengerin Musik</a>

Tinggal dipilih aja mau yang onmouseover atau onclick gan. Lalu ganti URL-FILE-MUSIK/SOUND dengan Url file musik/sound kalian. Silahkan di edit sendiri kalimatnya atau bisa juga diganti sama gambar gan. Contoh kayak di bawah ini, silahkan di coba dan mungkin loadnya agak lama karena gw pake file mp3 gan.

Mouseover DISINI Buat Dengerin Musik

Klik DISINI Buat Dengerin Musik

4.Show Hide Konten / Spoiler

Kode untuk menampilkan atau menyembunyikan konten, mirip tombol spoiler yang ada  di forum-forum gan. Cara pasangnya gampang, loe cari kode </head> lalu copy paste kode javascript di bawah ini di atasnya gan.

<script language=’javascript’ type=’text/javascript’>
function showHide() {     var ele = document.getElementById(“showHideDiv”);
if(ele.style.display == “block”) {             ele.style.display = “none”;       }
else {         ele.style.display = “block”;     } }
</script>

Sekarang tinggal nambahin kode di konten yang pengen di isi tombol buka tutupnya gan. Copy paste kode di bawah ini dan letakan kontenya di tempat yang udah gw kasi tanda gan.

<form action=”” method=”post”>
<input onclick=”return showHide();” type=”button” value=”Show-Hide” />
</form>
<div id=”showHideDiv” style=”display: none;”>

———> Konten Disini Gan <———

</div>

Konten bisa apa aja bisa gambar, teks atau apapun. Buat edit tulisan di tombolnya ganti aja Show-Hide sesuai keinginan loe. Contoh seperti di bawah ini di klik aja gan.

5. Teks Berjalan / Marquee

Kode ini bisa kalian gunakan untuk menampilkan teks berjalan gan. Kodenya sangat sederhana bisa juga untuk gambar atau link gan. Tinggal copy kode di bawah ini dan pastekan di manapun kalian suka.

<marquee onmouseover=”this.stop()” onmouseout=”this.start()” behavior=”scroll” direction=”left” bgcolor=”#FF0000″>Teks, Link Atau Gambar Kalian Disini</marquee>

Buat ngerubah arahnya tinggal di ganti aja “left” sesuai keinginan kemana arah yang loe mau gan. Buat behavior bisa juga diganti pake alternate atau slide, untuk bgcolor silahkan ganti warnanya sesuka hati gan.

Contoh :

“scrool” direction=”left”

Contoh marquee atau teks berjalan

“alternate”

Contoh marquee atau teks berjalan

“scrool” direction=”left” dengan gambar

6. Downloading Progress Bar

Dengan kode ini kita bisa dengan mudah membuat bar proses download yang sederhana gan. Yang ini pake javascript kalau di klik progress barnya bergerak atau berubah otomatis gan. Tinggal copy dan paste kode di bawah ini dimana pun loe mau gan.

<script type=”text/javascript”>
//current progress
var currProgress = 0;
//is the task complete
var done = false;
//total progress amount
var total = 100;

//function to update progress
function startProgress() {
//get the progress element
var prBar = document.getElementById(“prog”);
//get the start button
var startButt = document.getElementById(“startBtn”);
//get the textual element
var val = document.getElementById(“numValue”);
//disable the button while the task is unfolding
startButt.disabled=true;
//update the progress level
prBar.value = currProgress;
//update the textual indicator
val.innerHTML = Math.round((currProgress/total)*100)+”%”;
//increment the progress level each time this function executes
currProgress++;
//check whether we are done yet
if(currProgress>100) done=true;
//if not done, call this function again after a timeout
if(!done)
setTimeout(“startProgress()”, 100);
//task done, enable the button and reset variables
else
{
document.getElementById(“startBtn”).disabled = false;
done = false;
currProgress = 0;
}
}
</script>
<progress id=”prog” value=”0″ max=”100″></progress>
<br />
<input id=”startBtn” onclick=”startProgress()” type=”button” value=”start” />
<div id=”numValue”>
0%</div>

Standarnya progress bar ini kodenya cuma <progress value=”0″ max=”100″></progress> gan. Contoh seperti yang dibawah ini, silahkan di coba gan.
Sumber : http://www.developerdrive.com/2012/07/displaying-the-progress-of-tasks-with-html5/

Progress Bar 

0%

7. Textarea

Fungsi textarea ini bisa buat naruh kode di postingan gan sebagai pengganti blockquote. Cara pasangnya gampang gan tinggal copy paste kode di bawah ini dan ada tiga pilihan gan.

Biasa

<textarea rows=”4″ cols=”50″>
Teks atau Kode Disini Gan
</textarea>

Seleksi Otomatis

<textarea rows=”4″ cols=”50″ onclick=”this.focus();this.select()” readonly=”readonly”>
Teks atau Kode Disini Gan
</textarea>

Seleksi Dengan Tombol

<form name=”selectall”>
<textarea name=”messageBody” rows=”4″ cols=”50″>Teks atau Kode Disini Gan</textarea>
<br />
<input type=”button” value=”Select Text” onClick=”javascript:this.form.messageBody.focus();this.form.messageBody.select();”>
</form>

Tinggal di edit aja gan rows buat tinggi dan cols buat lebar. Untuk yang pake tombol kalian bisa ganti tulisan Select Text sesuai keinginan gan. Contoh ada dibawah ini gan silahkan dicoba.

Biasa

Seleksi Otomatis

Seleksi Dengan Tombol

8.Link Dengan Pop Up

Yang terakhir gan, ini kode buat link kalau di klik bakal muncul pop up sesuai dengan target Urlnya. Misal digunakan untuk iklan atau link download gan. Copy paste kode javascript di bawah ini di atas kode </head> atau bisa juga paste langsung di postingan dengan linknya gan.

<script language=”javascript” type=”text/javascript”>
function scpopup(url) {
newwindow=window.open(url,’name’,’height=200,width=150′);
if (window.focus) {newwindow.focus()}
return false;
}
</script>

Pengertian dan perintah-perintah CSS

CSS adalah bahasa yang kita gunakan untuk berbicara kepada komputer mengenai perintah – perintah untuk mengatur tampilan, gaya atau style dari suatu website sehingga dengan kita menggunakan css kita bisa mempersingkat pembuatan dan penulisan kode dibandingkan kita mengatur style web menggunakan format yang ada di html.

Cara Kerja
Cara kerja CSS sangatlah mudah, karena CSS hanya membutuhkan style sebagai penentu dari font, warna, dan format-format lain untuk memformat atribut sebuah halaman web yang kita buat. Tiap style memiliki dua buah elemen dasar yaitu “selector” dan “declaration”.
Sebuah selector biasanya adalah tag HTML, sementara declaration adalah satu atau beberapa perintah / nilai dari CSS yang menunjukkan type bentuk yang diaplikasikan pada selector. Declaration ini biasanya di tandai dengan tanda kurung kurawal “{ }” , dan perintah atau nilai CSS yang berbeda dipisahkan satu dengan yang lain dengan menggunakan titik-koma “;” seperti terlihat pada contoh berikut :

< style type="text/css">
.teks {font-family:verdana; color:blue;}
< /style>

Disini terlihat bahwa .teks adalah selector, dan {font-family:verdana; color:blue;} adalah declaration.
Selector-selector dan style dalam CSS akan dimasukkan dalam sebuah tempat yang sama dalam isi dokumen HTML atau dibuat diluar dokumen HTML yang nantinya akan dipanggil untuk menentukan isi tampilan dokumen HTML. Anda hanya menunjuk pada selector-selector dimana akan mengaktifkan sebuah style yang anda inginkan.
Hal yang paling umum dalam memasukkan kode Style CSS dengan menggunakan tag < style type=”text/css”>. Tag < style type=”text/css”> ini selalu tampil dalam bagian < head> dan sebelum < /head> dari dokumen anda seperti terlihat pada contoh berikut :
< html>
< head>
< style type="text/css">
... aturan-aturan css ...
< /style>
< /head>
< body>
... Dokumen html yang akan diberikan aturan CSS ...
< /body>
< /html>

Untuk menentukan font dan warna-warna tiap kali anda memulai sebuah cell table, anda dapat menentukan sebuah style dan kemudian anda tinggal menunjuk ke style dalam cell table anda. Bandingkan contoh dari sebuah table berikut yang dibuat menggunakan HTML sederhana :

< html>
< head>belajar css
< /head>
< body>
< table>
< tr>< td bgcolor="red" align="center">
< font face="verdana" color="blue">belajar css1
< /font>< /td>< /tr>
< /table>
< /body>
< /html>

Bandingkan jika dokumen tersebut dibuat dengan menggunakan CSS (dengan menganggap bahwa sebuah selector yang dipanggil “teks” telah ditetapkan yang akan mengatur format teks dokumen html tersebut).

< html>
< head>< title>belajar css< /title>
< style type="text/css">
.teks { background-color:red; color:blue; font-family:verdana;}
< /style>
< /head>
< body>
< table>
< tr>< td class="teks">belajar css1< /td>< /tr>
< /table>
< /body>
< /html>

Penempatan CSS
Menempatkan style CSS dalam dokumen web yang kita buat dalam bahasa html dapat dilakukan dengan beberapa cara dan tingkatan yang berbeda sesuai dengan keinginan kita. Cara penempatan dalam HTML adalah dengan menggunakan beberapa cara, diantaranya adalah menggunakan Inline Style, Internal Style, External style, dan juga teknik Importing dengan Internal Style.

Inline Style
Adalah CSS yang dibuat dalam sebuah tag HTML yang hanya berlaku untuk dokumen yang diapitnya saja. Biasanya teknik ini digunakan pada pemformatan khusus pada sebuah elemen HTML dan tidak digunakan untuk memformat seluruh elemen dalam dokumen web. Contohnya adalah sebagai berikut :

< html>
< head>
< title>belajar css< /title>
< /head>
< body>
< font style="arial; font-family:Arial; font-size: 20px; background-color:yellow">Penerapan Inline Style < /font>
< /body>
< /html>

Dalam script di atas dapat diketahui bahwa style tersebut memiliki nama style arial yang memiliki nilai atau value untuk style tersebut. Adapun nilai style adalah jenis font arial dengan ukuran 20 pixel dan memiliki warna latar kuning.

Internal Style
Pada teknik ini, style CSS diletakkan pada tengah tag antara tagdan. Aturan-aturan dalam style ini diatur sedemikian rupa untuk digunakan pada suatu tempat maupun untuk keseluruhan situs. Contoh dari teknik ini terlihat pada contoh berikut :

< html>
< head>
< title>Belajar CSS< /title>
< style type="text/css">
< !-- .teks {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 24px; color: white; background-color: blue;} -->
< /style>
< /head>
< body>
< div class=teks>Penerapan Internal Style

< /body>
< /html>

Maksud dari < !– aturan css –> diatas adalah berguna agar browser yang tidak mendukung CSS tidak menampilkan perintah-perintah CSS, jadi perintah CSS didalam < !– –> akan dianggap sebagai komentar HTML biasa dan tidak akan ditampilkan dalam browser walaupun browser tersebut mendukung CSS.

Import Style
Dengan teknik ini sebuah Style tidak disimpan pada halaman tersebut, namun untuk menghubungkannya dengan halaman web yang kita buat digunakan perintah import yang terdapat pada style CSS. Seperti terlihat pada contoh berikut :

< html>
< head>
< title>Belajar CSS< /title>
< style type="text/css">
< !-- @import url (http://www.nama_situs.com/style.css); -->
< /style>
< /head>
< body>
< div class=teks>Penerapan Import Style< /div>
< /body>
< /html>

Pada teknik diatas, dokumen HTML akan mengambil atau import style CSS untuk dipergunakan dalam dokumen tersebut. Dimana pada contoh diatas dokumen akan mengimport file style dengan nama style yang berekstensi CSS pada alamat url http://www.nama_situs.com dengan menggunakan perintah :
@import url (http://www.nama_situs.com/style.css);

External Style
Dengan menggunakan teknik ini kita dapat memanggil style CSS pada file CSS yang kita inginkan dengan menggunakan perintah “Link rel” yang berfungsi untuk menghubungkan kedalam sebuah style CSS eksternal dengan nama yang telah kita tentukan seperti terlihat pada contoh :

< link rel="stylesheet" type="text/css" href="style.css

Dalam contoh diatas kita menghubungkan sebuah dokumen html dengan sebuah style eksternal dengan nama style.css yang telah kita buat sedemikian rupa sehingga style tersebut dihubungkan untuk memformat tampilan dalam dokumen html tersebut.
Dalam mengimport file CSS, kita dapat langsung mengimport beberapa file CSS sekaligus dalam sebuah dokumen agar memperkaya tampilan dokumen kita seperti terlihat pada contoh berikut :

< link rel="stylesheet" type="text/css" href="style1.css">
< link rel="stylesheet" type="text/css" href="style2.css">
< link rel="stylesheet" type="text/css" href="style3.css">

Atau kita dapat menggunakan perintah :

< style>
< !-- @import url(style1.css); @import url(style2.css); @import url(style3.css); -->
< /style>

Perbedaan dalam teknik terakhir adalah perintah import tersebut akan mengambil style CSS dengan cara import style dari alamat url yang kita tentukan. Cara ini lebih efisien dikarenakan dokumen yang kita beri perintah import tersebut hanya akan mengimport file css yang pada akhirnya, style CSS tersebut hanya perlu di download sekali saja dalam dokumen style sheet eksternal yang terpisah dengan dokumen HTML asli. Ketika surfing ke dalam situs anda maka CSS akan disembunyikan dalam komputer user sehingga akan memperkecil ukuran file sebuah situs yang kita buat. Jadi jika anda menggunakan cara terakhir ini, maka sebelumnya anda harus membuat sebuah dokumen style CSS eksternal tersebut dengan ekstensi .css dimana dokumen style tersebut berisi aturan yang akan mengatur tampilan dokumen web yang dibuat

STRUKTUR CSS
Dalam pembuatan dokumen web menggunakan style CSS di kenal adanya aturan atau struktur penulisan baku agar style CSS yang kita buat tersebut dapat ditampilkan dengan baik dalam dokumen web yang dibuat. Contoh :

< html>
< head>
< title>HTML Selector< /title>
< style type=”text/CSS”>
< !– p {font-family: verdana;} –>
< /style>
< /head>
< body>
< p> penggunaan HTML Selector dalam CSS < /p>
< /body>
< /html>

Pada contoh diatas dipergunakan tag HTML < p> sebagai selector dan setiap huruf yang berada diantara tag < p>
dan < /p> akan memiliki jenis font verdana sesuai dengan value atau nilai yang diberikan dalam property style tersebut.

Selector
Jika dalam HTML kita mengenal adanya tag-tag yang menyusun sebuah dokumen HTML, maka dalam CSS kita juga mengenalnya dengan sebutan selector. Selector adalah nama-nama yang diberikan untuk style-style yang berbeda baik itu style internal maupun eksternal. Dalam style tujuan, anda harus menentukan bagaimana tiap selector seharusnya bekerja yang dinamakan properties di dalam tanda { } (curly bracket) yang dapat memiliki nilai berupa font, warna dll, kemudian dalam body di halaman web anda, anda arahkan ke selector-selector ini untuk mengaktifkan style tersebut.
Karena CSS memiliki aturan tersendiri dalam penulisan sintaknya dalam CSS, dan penulisan sintak tersebut terbagi ke dalam tiga bagian yaitu : Selector, Property, dan Value. Sebagai penjelas coba perhatikan contoh berikut :
Selector {property: value;}

Selector dalam CSS adalah elemen yang akan didefinisikan dalam style CSS, sedangkan elemen ini dapat berupa tag HTML maupun Class. Sedangkan Property dalam CSS adalah atribut yang berfungsi untuk mendefinisikan Selector, sedangkan Value adalah nilai atau harga dari sebuah Property. Sebagai contoh :

< html>
< head>
< style type="text/css">
B.besar {
color:red; font-size:15px; font-family:arial;
}
< /style>
< /head>
< body>
< b>ini adalah huruf besar dengan html

< b class="besar">ini adalah huruf besar dengan CSS
< /body>
< /html>

Class Selector
Digunakan untuk menentukan style yang dapat digunakan tanpa menentukan lagi tag HTML sederhana. Penulisan class adalah dengan menggunakan tanda titik atau dot. Selain aturan penulisan diatas, CSS juga mengenal Class Selector dimana dalam elemen yang sama kita dapat menerapkan lebih dari satu style. Adapun contohnya adalah sebagai berikut

< html>
< head>
< title>Class Selector< /title>
< style type="text/CSS">
< !-- f.times {font-family: times;} f.verdana {font-family: verdana;} .courier {font-family: "courier";} -->
/style>
< /head>
< body>
< f class="times"> Ini adalah Contoh penggunaan class sebagai selector, setiap huruf memiliki huruf times new roman

Ini adalah Contoh penggunaan class sebagai selector, setiap huruf memiliki huruf verdana< /f>< br />
< f class="courier"> Ini adalah Contoh penggunaan class sebagai selector, setiap huruf memiliki huruf courier< /f>
< /body>
< /html>

Pada contoh diatas, tag f memiliki 2 class yang berbeda untuk memformat paragraf yaitu .times dan .verdana dikarenakan tag class .times dan .verdana adalah class yang dimiliki oleh tag f maka ia hanya dapat dikenakan pada elemen f saja. Lain halnya dengan class .courier, ia dapat dipergunakan oleh semua elemen tanpa harus menggunakan tag f di awal dan akhir elemen yang akan di format.
Nama untuk tiap class dapat berbeda-beda, Anda dibebaskan menentukan nama class sendiri, namun ada baiknya memilih nama dari tiap class yang mengacu kepada fungsi dari class tersebut. Hal ini ditujukan agar anda tidak bingung mempergunakan class pada saat menggabungkannya ke dalam tag HTML. Contoh :
< p class="blog"> Ini teks untuk paragraph pada blog < /p>
< p class="menukiri"> Ini teks untuk paragraph pada menu kiri < /p>

Id Selector
ID selector digunakan untuk menentukan style yang berhubungan dengan objek-objek dengan sebuah ID yang unik. Berbeda dengan Class Selector yang dapat kita pergunakan pada berbagai tag, ID Selector ini memiliki sifat-sifat yang berbeda. ID selector hanya dapat dipergunakan pada satu elemen saja pada setiap halaman web yang kita buat. ID Selector menggunakan tag # (kres) sebelum menggunakan nama Selector. Adapun contohnya adalah sebagai berikut :
#helvetica {font-family: Helvetica;}

Dalam penerapannya pada tag HTML, Anda dapat menggunakan aribut < span> ataupun < div>, seperti terlihat pada contoh berikut :
< span id="helvetica">Ini adalah huruf helvetica< /span>
< div id=”helvetica”>Ini adalah huruf helvetica< /div>

Adapun penulisan dalam dokumen dapat dituliskan seperti pada contoh berikut :
< html>
< head>
< title>ID Selector< /title>
< style type="text/CSS">
< !-- #times {font-family: times;} #verdana {font-family: verdana;} #courier {font-family: "courier";} -->
< /style>
< /head>
< body>
< div id="times"> Ini adalah Contoh penggunaan id sebagai selector, setiap huruf memiliki huruf times new roman< /div>< br>
< div id="verdana"> Ini adalah Contoh penggunaan id sebagai selector, setiap huruf memiliki huruf verdana< /div>< br>
< div id="courier"> Ini adalah Contoh penggunaan id sebagai selector, setiap huruf memiliki huruf courier< /div>
< /body>
< /html>

Selain yang dijelaskan diatas, dalam CSS kita juga mengenal adanya Pewarisan (inheritance), Pseudo Classes, Pseudo-Element, dan Selectors-Kontekstual (Contextual Selector).

Pewarisan / Inheritance
Yang dimaksud pewarisan atau inheritance disini adalah satu kondisi dimana bagian-bagian HTML dalam dokumen kita yang kekurangan dalam spesifikasi aturan CSS dapat mengikuti atau dibuat menurut aturan CSS yang menutupinya. Setiap aturan yang tidak ada dalam format huruf yang dibuat dengan HTML atau ingin menggantikannya dengan aturan CSS, tetap akan mempengaruhi huruf yang ada didalam kurungan CSS.

< html>
< head>< title>inheritance< /title>
< style type="text/css">
B {background-color : green; color : white;}
< /style>
< /head>
< body>
< B>belajar membuat web dengan < fontsize="+1">< em>CSS< /em>< /font> sangatlah mudah. < br>
hanya dengan program notepad pun jadi.< /B>
< /body>
< /html>

Jika dilihat dari contoh diatas dapat dilihat bahwa tag < B> dalam aturan CSS akan mendefinisikan warna font dan warna latar dari font sedangkan tag < B> dalam HTML bisa diartikan sebagai bold atau format untuk menebalkan huruf. Sedangkan tag < font> yang berada dalam lingkup CSS dapat menerapkan aturan HTML dasar akan tetapi tetap terpengaruh dengan kondisi warna dan tebalnya huruf dari aturan CSS yang melingkupinya. Cara ini dapat anda gunakan untuk dikombinasikan lebih lanjut dengan tag-tag lain agar sesuai dengan keperluan dalam dokumen anda.

Pseudo Classess
Pseudo classes dalam CSS dibuat tebal dalam selector-selector untuk menentukan sebuah statemen atau relasi selector, dan penulisannya hanya dipisahkan dengan sebuah tanda titik dua : diantara selector dan pseudo class. Adapun contoh format penulisannya adalah :
selector:pseudo class { property: value; }

Banyak format CSS yang tidak didukung oleh kebanyakan browser, namun terdapat empat pseudo classes yang dapat digunakan secara aman ketika diaplikasikan kedalam hyperlink atau link, yaitu :

• link : untuk tampilan sebuah link yang belum dikunjungi.
• visited : untuk tampilan sebuah link ke halaman yang telah dikunjungi.
• active : untuk tampilan sebuah link yang sedang aktif (ketika di klik).
• hover : untuk tampilan sebuah link yang hover (ketika cursor melintas diatasnya).

Contoh penggunaan :
a.budi:link {color:blue;}
a.budi:visited {color:purple;}
a.budi:active {color:red;}
a.budi:hover {text-decoration:none; color:blue; background-color:yellow;}

Anda dapat menggunakan hover pseudo class dengan elemen-elemen lain selain link.

Pseudo Element
Pseudo element dalam CSS ditempatkan dalam sebuah selector sama seperti pada pseudo classes, penulisannya akan seperti contoh berikut :
selector:pseudoelement {property: nilai;}

Contoh setting huruf dan baris pertama :
Pseudo element pada huruf pertama di aplikasikan elemen dari huruf pertama dan baris pertama pada atas baris sebuah elemen. Anda dapat membuat huruf besar dan huruf tebal baris pertama pada paragraf dengan menggunakan perintah berikut :
p:first-letter {font-size:5px; float:left;}
p:first-line {font-weight:bold;}

Before dan Ater
Pseudo element before dan after digunakan dengan property content untuk menempatkan isi dari sebuah elemen tanpa menyentuh kode HTML. Nilai dari property content ini dapat berupa open-quote, close-quote, no-open-quote, no-close-quote, berbagai string yang disertakan dalam tanda kutip atau berbagai image gambar menggunakan url(nama image) seperti contoh berikut :
blockquote:before {content: open-quote;}
blockquote:after {content: close-quote;}
li:before {content: "POW: "}
p:before {content: url(images/gambar.jpg)}

Selector Kontekstual
Selektor Kontekstual dalam CSS hampir sama dengan pernyataan-pernyataan kondisional dimana deklarasi dalam Style-Sheet CSS yang ada akan berpengaruh jika menemui kondisi atau keadaan tertentu. Contoh dari selector kontekstual adalah :

< html>
< head>
< title>selector kontekstual < /title>
< style type="text/css">
b em {font-family: verdana; background: blue; color: white; }
< /style>
< /head>
< body>
< b>
belajar membuat web dengan < em>CSS< /em>sangatlah mudah < br>
< /b>
< em>hanya dengan program notepad pun jadi< /em>
< /body>
< /html>

Dalam contoh diatas dapat dilihat bahwa dokumen web tersebut akan menerapkan style CSS tersebut pada dokumen yang berada dalam tag < em> (font verdana, warna latar biru dan font berwarna putih) dimana tag < em> tersebut berada di dalam tag < b> dan (bold/tebal), sedangkan tag < em> yang berada di luar tag < b> dan tag < /b> tidak akan terpengaruh dengan setting style tersebut atau hanya memiliki nilai < em> biasa atau huruf miring.

Shorthand CSS
Spesifikasi dalam CSS, dimana anda harus mengetikkkan aturan-aturan CSS ke dalam style kadang membuat kita merasa jemu jika harus menuliskan seluruh aturan-aturan yang panjang tersebut. Teknik seperti ini biasa disebut dengan Longhand Notation dimana seluruh aturan harus diketikkan tanpa adanya penyingkatan kata seperti ketika kita menulis sms ke teman kita.
Namun jika anda menggunakan teknik shorthand CSS dimana dengan menggunakan teknik ini memungkinkan anda untuk membuat berbagai style menggunakan sintaks yang lebih singkat yang dikenal dengan shorthand CSS atau Shorthand Notation. Shorthand CSS memungkinkan anda untuk menentukan nilai dari beberapa property sekaligus dengan menggunakan sebuah property tag, contoh adalah pada penggunaan property font yang memungkinkan anda untuk menentukan property font-style, font-variant, font-weight, font-size, line-height, dan font-family dalam sebuah baris sintak. Contoh :
< html>
< title>menggunakan shorthand CSS< /title>
< head>
< style>
H1 {
font-weight: bold;
font-size: 16pt;
line-height: 18pt;
font-family: Arial;
font-variant: normal;
font-style: normal;
font-stretch: normal;
font-size-adjust: none
}
< /style>
< /head>
< body>
< h1>huruf ini akan tebal dengan jenis huruf arial sebesar 16 point < /h1>
< /body>
< /html>

Jika ditulis dalam shorthand CSS, tag diatas akan terlihat sama seperti :
H1 {font: bold 16pt/18pt Arial}

Sebagai perbandingan adalah pada tag H1 dibawah ini yang menggunakan sintak longhand CSS (Catatan bahwa property font-variant, font-stretch, font-size-adjust, dan font-style telah dibuat kedalam nilai default).

Dengan menggunakan shorthand CSS ini memungkinkan anda untuk menempatkan hanya beberapa nilai saja dari property yang kita inginkan dalam sebuah style. Penempatan property tersebut dalam dokumen web diwakili oleh nilai yang dipisahkan dengan spasi.
Sebagai contoh dalam menyingkat penulisan pembuatan layout seperti margin, padding dan border-width dengan Shorthand CSS kita dapat menjadikan satu ke dalam margin-top-width, margin-right-width, margin-bottom-width dan lain sebagainya dalam susunan property seperti top, right, bottom dan left. Seperti dalam contoh berikut :
p {border-top-width: 1px; border-right-width: 5px; border-bottom-width: 10px; border-left-width: 20px; }

Dapat dibuat menjadi lebih singkat dengan mengunakan shorthand notation sehingga akan menjadi :
p {border-width: 1px 5px 10px 20px; color: red; }

Kemudian untuk property border-width, border-color dan border-style dapat juga dijadikan satu menjadi :
p {border: 1px red solid;}

Cara ini dapat juga di aplikasikan untuk border-top, border-right dan sebagainya dengan hanya menetapkan dua nilai (seperti margin: 1em 10em;), dimana nilai pertama akan menjadi nilai untuk posisi atas dan posisi bawah, kemudian nilai kedua akan menjadi nilai dari posisi kiri dan kanan. Property yang berhubungan dengan font juga dapat dijadikan satu dengan mengunakan property font seperti dalam contoh berikut ini dimana nilai ‘/1.5′ adalah mengacu pada nilai untuk line-height :
p {font: italic bold 1em/1.5 courier;}

Jika diterapkan dalam dokumen HTML maka akan menjadi :
< html>
< title>menggunakan shorthand CSS< /title>
< head>
< style>
body {border: 1px red solid;}
p {font: italic bold 1em/1.5 courier;}
H1 {font: bold 16pt/18pt Arial}
< /style>
< /head>
< body>
< p>huruf ini akan tebal dan miring dengan line height 1,5< /p>
< h1>huruf ini akan tebal dengan jenis huruf arial sebesar 16 point < /h1>
< /body>
< /html>

Ketika ditulis menggunakan shorthand notation, nilai lain akan diabaikan secara otomatis dan menetapkan nilai default untuk nilai yang diabaikan tersebut. Jika anda memiliki style-style yang ditentukan dalam lebih dari satu lokasi sebagai contoh adalah style CSS yang diikutkan dalam halaman HTML dan style yang diimport dari external style sheet menggunakan sintaks CSS shorthand dan longhand. Sebaiknya anda berhati-hati jika anda mengabaikan property tersebut karena jika terdapat aturan CSS yang berlawanan maka akan dapat mengakibatkan adanya property yang bertumbuk sehingga akan merusak tampilan yang dibuat.

Terkait dengan Mengenal Sistem Kerja Cascading Style Sheet (CSS)

• Mengubah Teks Website dengan Google Font

  Tampilan website biasanya memiliki jenis huruf/font yang standar karena halaman web yang ditampilkan dalam seluruh browser memiliki tampilan dengan huruf/font yang berbeda tergantung font yang ...

• Membuat Efek Transisi Pada Tombol dengan CSS

  Seperti yang telah kita ketahui bersama bahwa sebuah tombol/hyperlink memiliki tampilan standar (biasanya berwarna biru dengan garis biru dibawahnya/underscore). Dan ketika mouse anda melintas diatas ...

• Mengganti Logo di Halaman Login Admin dari Functions

  Dalam tutorial sebelumnya tentang Mengganti Logo di Halaman Login Admin WordPress 3.5.1 telah dijelaskan tentang cara mengganti tampilan logo pada halaman login admin. Namun dikarenakan ...

• PHP Database Framework Terbaik

  Dahulu kala sebelum ditemukannya database framework, pekerjaan membuat sebuah database dengan menggunakan PHP untuk sebuah website merupakan sebuah pekerjaan yang cukup melelahkan dan menyita banyak ...