CD Interaktif

CD interaktif merupakan salah satu media pembelajaran dengan menggunakan teknologi komputer yang di representasikan secara audio visual dengan beberapa keterangan yang ditampilkan secara interaktif dan menarik. CD Interaktif dapat dikemas kedalam sebuah CD (Compact Disk) dengan tujuan aplikasi interaktif di dalamnya.

Pada umumnya, CD Interaktif di bangun dengan memadukan Gambar, Video, Animasi, Text,  pengolahan/editing, serta pemberian navigasi  untuk mempelajari bagian-bagian tertentu. Dengan demikian, pembelajaran dengan metode seperti ini memudahkan pengguna untuk berinteraksi langsung dengan materi yang akan di pelajari. Beberapa kegunaan CD interaktif antara lain : Company profile, Gambaran sebuah proyek, CD materi pembelajaran, dan sebagainya.

Untuk membuat suatu CD Interaktif, ada beberapa langkah/metode yang harus dipersiapkan, diantaranya :

  1. Menentukan Tema
  2. Membuat Story Board
  3. Menyiapkan Aset (gambar, audio, video dan animasi)
  4. Merancang Design utama
  5. Membuat Tombol
  6. Membuat Halaman Materi
  7. Menyisipkan Aset ke dalam materi
  8. Membuat Transisi
  9. Mengaktifkan Tombol
  10. Publishing
  11. Membuat Autorun kedalam CD

Demikian penjelasan singkat mengenai CD interaktif. untuk selanjutnya, kita akan belajar bagaimana cara membuat CD Interaktif sederhana dengan menggunakan Action Script 3 pada Adobe Flash CS 5. Tunggu artikel berikutnya, Selamat Belajar.

Dasar HTML

Sebelum kita masuk ke bab ini, pastikan terlebih dahulu sudah memiliki text-editor seperti sublime text, notepad++, atau yang lainnya (silakan pilih salah satu). jika tidak, saya sarankan cek artikel sebelumnya untuk mengenal editor dan bagaimana cara menyimpan file html.

Elemen/Tag

Pada bab sebelumnya, kita sudah mengetahui bahwa html terdiri dari sekumpulan tag yang mewakili suatu konten. jadi, untuk membuat suatu konten kita harus mengetahui terlebih tag yang digunakan. suatu HTML biasanya terdiri dari tag pembuka, dan tag penutup dengan konten/isinya berada di kedua tag tersebut.

Bentuk baku :
<tagname>isi dari tag yang kita buat</tagname>

Attribute

Pada Umumnya semua elemen/tag HTML memiliki attribute. Attribut berisi informasi tambahan mengenai tag yang akan kita buat. contohnya kita akan membuat suatu judul dengan membuat H6. H6 ini ingin rata tengah maka kita bisa menambahkan align=”center”. Attribute pada html disimpan di tag pembuka dan biasanya bentuk umum dari suatu attribute adalah name=”value”.

Headings

Headings digunakan untuk membuat judul pada artikel atau paragraf yang akan kita buat. Heading terdiri dari h1, h2,h3, sampai dengan h6

Paragraf

Untuk membuat paragraf, kita cukup menggunakan tag p, jika kita menggunakan sublime text 3, kita cukup mengetikkan huruf p di keyboard kemudian pencet tab maka secara otomatis akan memunculkan tag pembuka dan tag penutup. untuk mendapatkan tulisan dengan dummy text lorem ipsum, kita cukup mengetikkan lorem kemudian pencet tab

Formatting text

Seperti halnya belajar software pengolah text, kadang kala kita membutuhkan tulisan berbentuk tebal, miring, dll. HTML menyediakan tag untuk formatting text, berikut adalah tag-tag yang dipakai untuk membuat format text

Tag Description
<b> Untuk membuat text menjadi tebal
<em> Untuk membuat text menjadi miring
<i> Untuk membuat text menjadi miring
<small> Untuk membuat text menjadi lebih kecil
<strong> Untuk membuat text menjadi tebal
<sub> Untuk membuat tulisan seperti H2O
<sup> Untuk membuat tulisan seperti M2
<ins> Untuk membuat garis dibawha tulisan
<del> Untuk membuat tulisan yang dicoret
<mark> Untuk menandai tulisan (defaultnya warna kuning)

List

List terbagi menjadi 2, yaitu ordered list dan unordered list

Ordered List

  1. ordered list digunakan untuk list dengan penomoran berurut
  2. tag ol digunakan untuk membuka ordered list
  3. tag li digunakan untuk isi list
  4. tag ol memiliki attribute type “a”, “A”, “I”, “i”, “1”

Unordered List

  • unordered list digunakan untuk list dengan tidak memandang urutan
  • tag ul digunakan untuk membuka ordered list
  • tag li digunakan untuk isi list
  • tag ol memiliki attribute type “square”, “circle”, “disc”, “none”

untuk memahami Ol dan Ul silakan anda buat file dibawah ini kemudian save lalu buka di browser kesayangan anda.

Contoh List didalam List

Hyperlink digunakan untuk membuat link dari satu halaman ke halaman lain atau ke url diluar website kita. misalnya kita punya file index.html lalu dengan mengklik tombol tertentu maka akan menuju ke halaman about.html atau ketika kita klik lari ke halaman facebook kita. untuk melakukan semua itu diperlukan suatu hyperlink.
Contoh penulisan hyperlink adalah sebagai berikut :

secara default, semua link html akan muncul seperti ini di smua browser :

  • Link yang belum dikunjungi akan terlihat berwarna biru dan bergaris bawah
  • Link yang sudah dikunjungi akan terlihat berwarna purple namun tetap bergaris bawah
  • Link memiliki attribute target (“_blank”,”_self”,”_top”,”_parent”)

Menyisipkan Gambar

Tag yang digunakan untuk menyisipkan image dalam HTML adalah img. selain src img memiliki attribut width dan height untuk mengatur lebar dan tinggi gambar, serta alt untuk memberikan keterangan pada gambar

Demikian penjelasan singkat untuk dasar HTML, mudah-mudahan bermanfaat. Keep Learning ^_^
Semangat.

 

Perbedaan antara inline dan inline-block

Hallo guys, ketemu kita dalam pembelajaran CSS. materi kali ini adalah materi dasar mengenai perbedaan property display : inline-block, dengan display:inline. langsung saja, simak penjelasan dibawah ini :

  1. inline elemen tidak memiliki pengaturan properti width (lebar) dan height (tinggi). dia akan selalu otomatis mengikuti content yang kita isi didalamnya. sehingga meskipun kita set width dan heightnya pada elemen ini. itu tidak akan berpengaruh, sedangkan inline-block bisa kita set sesuka hati.
  2. inline elemen tidak memiliki pengaturan untuk properti margin dan padding (hanya atas dan bawah saja), sehingga jika kita memberikan margin-top atau margin-bottom pada elemen tersebut, itu tidak akan berpengaruh sama sekali. sedangkan inline-block bisa.
  3. baik inline maupun inline block, tidak membuat garis baru dan menjadikan elemen ini bersebelahan dengan elemen sebelumnya.

untuk memahami lebih detail mengenai perbedaan inline dan inline-block, mari kita lihat contoh dibawah ini.

silakan rubah property display pada kedua CSS diatas dengan inline dan inline-block, lalu simpulkan sendiri jawabannya yah. kalo ada pertanyaan silakan tulis di kolom komentar ^_^

Thanks

Block dan Inline Elemen pada HTML

Tag HMTL pada dasarnya, sebelum kita melakukan modifiksi pada CSS memiliki pengaturan secara default (pengaturan bawaan) tergantung dari jenis tag yang kita gunakan. diantaranya ada yang bertipe block dan ada yang bertipe inline. untuk memahami perbedaan dari kedua tipe tersebut, simak penjelasan dibawah ini.

1. Block Element

Block element selalu di mulai dengan baris baru/alinea baru, dan mengambil space melebar  secara keseluruhan mengikuti space yang kita berikan pada tag induknya. sehingga, jika kita membuat beberapa elemen yang bertipe ini, elemen akan saling bertumpuk (tidak bersebelahan). ini merupakan karakter dari block elemen.

Contoh dari block element:

  • <div>
  • <h1> – <h6>
  • <p>
  • <form>
  • <table>
  • <tr>
  • <p>
  • <header>
  • <article>
  • dll

2. Inline Elemen

Inline Elemen kebalikan dari Block Elemen, elemen ini tidak dimulai dengan baris baru dan hanya mengambil space sesuai dengan isi konten yang kita tulis. contohnya jika kita menulis “nama saya budi”, maka lebar yang diambil oleh elemen ini berkisar selebar 14 huruf tersebut. sehingga, jika kita membuat beberapa elemen dengan tipe inline, maka elemen tersebut akang saling bersebelahan.
“ini contoh penggunaan inline elemen dengan formatting text”

Beberapa contoh Inline Elemen :

  • <span>
  • <a>
  • <img>
  • <u>, <i> , <b>, <strong>, <em>
  • dll

Berikut penjelasan singkat mengenai kedua blok diatas, mudah-mudahan sedikit banyak memberikan gambaran mengenai Block dan Inline Elemen. Ok, Bagaimana kawan-kawan sudah nambah pemahamannya?
Dulu, waktu saya pertama kali mengetahui hal ini, langsung saya coba untuk melakukan perubahan di property display pada CSS. namun ternyata pilihan untuk display tidak hanya inline dan block saja, melainkan banyak sekali. anda bisa membacanya lebih lengkap disini.
yang akan saya jelaskan disini adalah perbedaan antara inline dan inline-block dan kapan kita menggunakannya. silakan kunjungi artikel ini :

Perbedaan antara inline dan inline-block

Perkembangan HTML

Seiring berkembangnya Teknologi IT, HTML pun berkembang dari tahun ketahun. Berikut beberapa versi HTML :

Versi Tahun
HTML 1991
HTML 2.0 1995
HTML 3.2 1997
HTML 4.01 1999
XHTML 2000
HTML5 2014
Tim Berners Lee

Pada tahun 1980 seorang ahli fisika, Tim Berners-Lee, dan juga seorang kontraktor di CERN (Organisasi Eropa untuk Riset Nuklir) mengusulkan dan membuat prototipe ENQUIRE, sebuah sistem untuk digunakan para ilmuan dalam berbagi dokumen dan hasil riset. Pada tahun 1989, Tim Berners Lee menulis sebuah memo untuk mengajukan sistem hypertext yang berbasis internet. sehingga pada akhir tahun 1990, Berners-Lee menspesifikasikan suatu HTML dan membuat browser beserta software server di akhir tahun 1990. di tahun yang sama, Berners-Lee dan Robert Cailliau (CERN data system engineer) berkolaborasi dalam sebuah permintaan untuk pendanaan, namun tidak diterima secara resmi oleh CERN. Di catatan pribadinya sejak 1990 kemudian dia mendata beberapa orang yang menggunakan hypertext lalu mengumpulkannya kedalam sebuah ensiklopedia untuk pertama kalinya.

Pada mulanya HTML adalah sebuah dokumen yang disebut “HTML Tag”, pertama kali disebutkan di Internet oleh Tim Berners-Lee pada akhir 1991. Ini menggambarkan 18 elemen yang terdiri dari, desain relatif sederhana awal HTML. Kecuali untuk tag hyperlink, ini sangat dipengaruhi oleh SGMLguid , pada Standard Generalized Markup Language (SGML) berbasis format dokumen di CERN. Sebelas elemen ini masih ada di HTML 4.

HTML adalah bahasa markup yang web browser gunakan  untuk menafsirkan dan menulis teks, gambar, dan bahan lainnya ke dalam sebuah web baik secara visual atau suara. Karakteristik default untuk setiap item dari markup HTML didefinisikan dalam browser, dan karakteristik ini dapat diubah atau ditingkatkan dengan menggunakan tambahan halaman web desainer dengan menggunakan CSS . Dalam perkembangannya, HTML secara progresif telah pindah ke arah yang lebih maju dengan bantuan CSS.

source lengkap : https://en.wikipedia.org/wiki/HTML

 

Pengertian HTML

HTML adalah singkatan dari Hypertext Markup Language merupakan bahasa markup standar untuk pembuatan website. Sebelum membahas lebih lanjut mengenai HTML, ada beberapa istilah penting yang perlu anda ketahui terlebih dahulu.

Website : Suatu halaman web yang saling berhubunga, umumnya berada pada suatu situs dan berisi sekumpulan informasi yang disediakan oleh perorangan, kelompok atau perusahaan (sumber : wikipedia).
Sedangkan menurut pendapat saya, website adalah adalah suatau halaman digital yang berisikan informasi baik itu perorangan, kelompok atau perusahaan yang bisa diakses oleh semua orang yang terhubung kedalam suatu jaringan.

Browser : Suatu Aplikasi pada komputer yang digunakan untuk membuka halaman website. jadi, tanpa browser kita tidak bisa membuka suatu halaman website.

Text Editor : Suatu Aplikasi pengolah text yang digunakan untuk mengolah text baik itu menulis, mengedit dan menyimpan file text. Ada beberapa text editor yang khusus digunakan untuk mengolah HTML, untuk materi ini akan saya bahas di materi selanjutnya.

Menurut W3Schools, ada beberapa point penting mengenai HTML

  • HTML merupakan singkatan dari Hypertext Markup Language
  • HTML mendeskripsikan struktur web dengan menggunakan Markup
  • Elemen HTML merupakan serangkaian blok-blok/tag-tag yang disusun untuk membangun halaman web.
  • Elemen HTML dibuat dengan menggunakan tag HTML
  • tag HTML merupakan mark atau singkatan yang mewakili label dari suatu konten. misalnya “heading” dengan tag <h1> .. <h6>, “paragraph” dengan <p>, “table” dengan <table> dan lain lain.
  • Browser tidak menampilkan tag html secara langsung, namun merender mereka untuk menjadi suatu halaman web. untuk melihat tag html dari suatu webiste anda bisa menggunakan tombol ctrl+u atau view page source pada halaman browser anda

Contoh penulisan sintaks HTML

Penjelasan Singkat

  • The <!DOCTYPE html> mendeklarasikan document HTML5
  • The <html> elemen ini adalah root atau dasar dari semua elemen html
  • The <head> elemen ini mengandung semua meta informasi tentang halaman yang kita buat
  • The <title> elemen ini berisi judul halaman
  • The <body> semua tag dan sintaks yang anda tulis disini akan muncul pada halaman browser
  • The <h1> elemen ini mendefinisikan judul paragraf/artikel dengan ukurang paling besar
  • The <p> elemen inimendefinisikan paragraf
  • The <header>,<nav>,<section>,<article>,<footer> elemen ini mendefinisikan area/daerah dari suatu blok html ke dalam tag yang lebih spesifik. namun tidak ada pengaturan khusus untuk tag-tag ini. tag-tag ini diperkenalkan pada HTML5, nanti akan kita bahas lebih lanjut di artikel selanjutnya.

Demikian pengenalan singkat mengenai HTML. Selamat Belajar

Rumus jadi orang kaya

Dikisahkan seorang satpam yg bernama Afrizal. Afrizal sudah 10 tahun jadi satpam, tahun 2007 tiba-tiba dia kena PHK dengan uang pesangon sekitar 3 juta rupiah. tidak terima dengan uang pesangon yg dia terima, akhirnya dia mengajukan protes dan banding sana sini. Sungguh naas memang nasib rakyat kecil suara yg dilayangkan jangankan didengar, sampai meja pengadilan pun tidak.
Hari itu, dia mengira itulah kiamat dalam hidupnya, dia tidak punya Skill atau kemampuan lain karena selama ini dia jadi satpam dan tidak tau kalau akhirnya di PHK. Uang bulanan yg selama ini jadi penantian, kini hilang seketika.

Continue reading “Rumus jadi orang kaya”

Mengapa kita harus belajar Sintaks Dasar Linux?

Setelah googling untuk mendapatkan jawaban yang relevan, ditambah pengalaman dan pengetahuan saya selama menggunakan salah satu sistem operasi ini, akhirnya saya tulis kembali dengan sedikit kesimpulan menjadi beberapa poin.

Linux sebagian besar digunakan sebagai POSIX compliant OS. artinya, OS ini mendukung pengembangan program untuk semua sistem operasi yang berbasis UNIX. POSIX sendiri merupakan singkatan dari (Portable Operating System Interface for Unix). jadi, menurut sumber yang saya baca (linknya dibawah) pertanyaan ini bisa di generalkan menjadi “Mengapa kita harus belajar UNIX?”. jawabannya adalah dikarena banyak sekali sistem operasi yang dibangun dan dioperasikan dengan basis UNIX. Mac OSX berbasis BSD, sedangkan BSD berbasis UNIX sehingga banyak sekali perintah-perintah pada console Mac yang sama dan bisa anda temui pada linux. begitu pula Android, Android menggunakan Linux sebagai kernelnya. jika kita ingin melakukan flashing, atau meroot android, maka kita harus menjalankan beberapa shell Unix dan mengetikkan perintah-perintah khusus pada console. Selain itu, banyak sekali device-device lainnya mulai dari sistem pesawat terbang, sistem dan perangkat jaringan yang menggunakan Linux atau BSD sebagai Sistem Operasinya.

Linux sendiri sebetulnya tidak menyediakan dekstop, atau aplikasi-aplikasi software pendukung, dsb. akan tetapi banyak distro-distro linux seperti Debian, CentOs, atau turunan Debian seperti Ubuntu, yang menyediakan semua itu. Sebagai informasi tambahan, meskipun Red Hat termasuk salah satu distro linux, namun memiliki aplikasi yang sangat berbeda dibandingkan dengan distro linux lainnya. dan BSD merupakan turunan dari UNIX dan bukan berbasis Linux.

Salah satu kelebihan linux tidak menyediakan desktop adalah kita bisa menggantinya sesuai keinginan kita. misalnya saja, saya mau menggantinya menjadi Unity, Mate, Cinnamon, KDE, LXDE, dsb.

Selain itu, semua distro linux bisa kita modifikasi sekehendak kita. semua kode-kode yang ditulis tersedia dan bisa dirubah sekehendak hati, sehingga kita bisa membuat, membetulkan atau bahkan menghapus bagian-bagian yang tidak kita butuhkan selama itu tidak merubah Core Linux yang bisa menyebabkan error.

Artikel ini hampir keseluruhan mengutip jawaban dari :

Richard Bross, CTO and Founder at SilverSpore

https://www.quora.com/Why-should-I-learn-Linux

Memulai pembelajaran di hari pertama

Cara mengajar seorang guru di sekolah kejuruan harus sedikit berbeda dengan guru di sekolah umum (baca : SMA). kita sebagai pengajar dituntut untuk menyiapkan SDM (Sumber Daya Manusia) yang siap bekerja baik secara skill maupun mental. oleh karena itu, tidak sedikit pengajaran yang saya berikan berisi motivasi-motivasi dan ajakan untuk mencari minat dan bakat sesuai passion yang siswa miliki.

Sebelum saya berangkat lebih jauh membicarakan apa dan bagaimana saya memulai pembelajaran dengan metode saya sendiri, mari kita tinjau pendidikan yang terjadi di sekitar kita.

Meskipun pendidikan tingkat SMK dan Perguruan Tinggi sudah dikelompokkan berdasarkan subjek dan bidang tertentu, tidak sedikit bahkan banyak pelajar yang saya jumpai masih kehilangan arah. Layaknya seorang petualang di tengah hutan yang berlari kesana-sini tanpa mengetahui tujuan yang dia cari, atau layaknya kapten kapal yang mengarungi lautan tanpa mengetahui tempat berlabuh. beginilah kondisi pelajar kita pada umumnya. 

Dibeberapa kasus, banyak pula pelajar yang menyimpang dari tujuan pendidikan yang semestinya. Pendidikan seharusnya digunakan sebagai sarana untuk mencari ilmu, menambah pengetahuan atau sekedar menjawab rasa keingintahuan. Sering kita temui, ada beberapa dari siswa dan mahasiswa yang saya ajar hanya mencari nilai atau selembar kertas sertifikat/ijazah. Mereka mengira dengan nilai yang tinggi atau dengan menempuh pendidikan yang tinggi, mereka bisa mendapatkan pekerjaan yang bagus* dan penghidupan yang layak. Kita tidak tau darimana semua ini berakar, bisa jadi ada yang salah dengan sistem pendidikan kita, dan  ini merupakan tanggngung jwab kita semua (orang tua dan para pengajar).

Berangkat dari semua itu, ada beberapa hal yang saya coba demi mendapatkan cara yang tepat dan benar untuk menjadi seorang pengajar yang baik. Hal pertama yang saya lakukan ketika mengisi hari pertama di kelas adalah:

Menanyakan harapan mereka ketika berada disekolah
Pertanyaan diatas terlihat sepele dan bisa dijawab dengan enteng misalnya untuk belajar pak, biar pintar atau sekadar untuk mendapatkan ilmu dan pengetahuan. Jawaban tersebut tidaklah salah, namun jauh dari jawaban tersebut coba kita renungkan kembali pintar itu masih luas, pintar dalam bidang apa? bagaimana cara membuktikan kepintaran seseorang? kalo nilai dijadikan tolak ukur untuk menilai kepintaran seseorang maka jangan heran kalo banyak pelajar yang mengejar nilai semata.

Menanyakan cita-cita mereka
Pertanyaan ini lebih lucu lagi. mungkin sebagian orang sering menayakan hal ini ketika kita kecil. waktu kecil, cita-cita dan harapan itu sebetulnya masih buram. kenapa buram? anak hanya tau hal-hal tersebut berdasarkan dogma-dogma orangtua atau masyarakat sekitar yang terkadang tidak memberikan pilihan bagi seorang anak untuk berpikir. jawaban yang kita jumpai ketika bertanya hal ini adalah

saya ingin menjadi dokter,
saya ingin menjadi polisi,
saya ingin menjadi guru, dll

Cita-cita atau profesi yang disebtukan rata-rata pekerjaan mulia dan baik. namun, perlu di kaji kembali apakah pekerjaan atau profesi yang baik hanya sebatas itu? banyak profesi yang bisa disesuaikan dengan passion yang lebih subjektif atau khusus. contohnya Programmer, Designer, Atlit Sepakbola, Penulis, dan banyak hal lainnya. Selain itu, jarang sekali saya mendengar cita-cita seorang anak ingin menjadi pengusaha dan menciptakan lapangan kerja.

Memberikan gambaran tentang hidup dan kehidupan

Semua orang yang bernyawa pasti merasakan kehidupan. tidak terkeculi siswa-siswi kita, namun kehidupan disini adalah kehidupan yang nyata, dimana kita harus berjuang untuk mendapatkan kehidupan yang layak. Saat ini, mereka masih hidup didampingi oleh orangtua atau wali mereka.

kehidupan menurut KBBI adalah cara (keadaan, hal) hidup sedangkan “gaya hidup” menurut KBBI adalah: pola tingkah laku sehari-hari segolongan manusia di dalam masyarakat. untuk mendapatkan semua itu, maka siswa diarahkan untuk mulai berpikir bagaimana mereka mencari penghidupan/pencaharian di masa yang akan datang.

Banyak kita jumpai pekerjaan-pekerjaan yang dipandang sebelah mata, contohnya tukang parkir, tukang ojeg, pemulung, dll. pernahkah kita bertanya, Apakah mereka berharap untuk mendapatkan pekerjaan itu? Apakah mereka diberikan kesempatan untuk mendapatkan pekerjaan yang lebih layak?

mungkin sebagian orang menganggap itu semua adalah takdir. takdir itu tidak bisa dirubah, dan pasrah dengan takdir yang diberikan. perlu diketahui bahwa takdir itu sesuatu hal yang ghaib. kita semua tidak ada yang tau mengenai takdir, jadi berusahalah untuk menjemput takdir yang baik. saya tidak akan berbicara panjang lebar mengenai takdir, berikut ini adalah penjabaran menganai takdir (Qodar)

Hukum Membicarakan Permasalahan Qadar

setelah memberikan gambaran mengenai kehidupan, mudah-mudahan siswa/i kita sedikit banyaknya bersiap diri untuk menyongsong kehidupan di masa yang akan datang. Mereka harus menyiapkan skill/kemampuan untuk bersaing di era globalisasi ini.

Saya yakin, sebetulnya sudah banyak guru yang memulai atau bahkan memiliki method yang lebih baik dari apa yang saya lakukan. demikian coretan-coretan yang saya tulis untuk berbagi pengalaman dan berharap mendapat masukan dari pembaca sekalian untuk menemukan method yang lebih baik dan cocok di lingkungan yang kita ajar.