Archive for 2015

Belajar membuat Drop Down dengam HTML dan CSS

By : Unknown

CSS (Cascading Style Sheet)

Adalah standard pembuatan dan pemakaian style untuk dokumen terstruktur, CSS digunakan untuk mempersingkat penulisan tag HTML seperti font, color, text, dan table menjadi lebih ringkas sehingga tidak terjadi pengulangan tulisan.

Dibawah adalah contoh gambar hasil dari html dan css :

<html>

<head>

<title>Dicoba</title>

</head>

<body>

<ul>

<li><a href="#">Tutorial</a>

<ul>

<li><a href="#">JavaScript</a></li>

<li><a href="#">Bootstrap</a></li>

</ul>

</li>

<li><a href="#">About Us</a></li>

<li><a href="#">Contact Us</a></li>

</ul>

</div>

</body>

</html>

Dan membuat file menu.css dengan mengisikan dibawah ini :

menu.css

#wrapper {

width:600px;

margin:auto;

}

#menu ul {

font-family: Arial, Verdana;

font-size: 14px;

margin: 0;

padding: 0;

list-style: none;

}

#menu ul li {

display: block;

position: relative;

float: left;

}

#menu li ul {

display: none;

}

#menu ul li a {

display: block;

text-decoration: none;

color: #ffffff;

padding: 5px 15px 5px 15px;

background: #000;

white-space: nowrap;

}

#menu ul li a:hover {

background: #666;

}

#menu li:hover ul {

display: block;

position: absolute;

}

#menu li:hover li {

float: none;

font-size: 11px;

}

#menu li:hover a { background: #3b3b3b; }

#menu li:hover li a:hover

background: #666;

]

0 Comments

Tag : Belajar,

Fitur-fitur Terbaru pada HTML versi 5

By : Unknown

Halo gaes jumpa lagi dengan saya yang akan update kali ini tentang HTML 5. Saya akan menjelaskan tentang fitur-fitur script baru pada HTML. Ada banyak pembaharuan pada HTML namun saya tidak membahas semua yang baru tersebut karena akan banyak sekali pastinya. Saya akan membahas fitur terbaru yang menurut saya bagus, penting dan simple. Saya akan memberi contohnya :

Video dan Audio : Tidak perlu menempelkan flash, quickplayer, atau realplayer untuk memutar audio dan video.
Canvas : Media corat-coret langsung tanpa flash dan applet java.

Bentuk kontrol form seperti kalender, tanggal, waktu, email, url, dan search.
Semantic : Mempermudah designer dengan tag khusus layout, seperti: artikel, footer, header, navigasi, dansection.
Dukungan yang lebih baik untuk penyimpanan secara offline.

Nah itu lah fitur barunya, namun saya tidak bisa jelaskan dan contohkan karena pasti akan panjang dan lama. Jadi kalau ingin lebih tau kalian bisa mencarinya digoogle.

Dan juga tidak semua browser bisa memenuhi semua fitur-fitur baru tersebut. Dan contoh-contoh browser yang bisa sebagian memenuhi fitur baru HTML tersebut yaitu :

Chrome terbaru
Safari Apple v.4+
Opera
Maxthon
Firefox 4,5,6 dan seterusnya
Internet Explorer 9

Nah kalian bisa menguji browser kalian masing-masing dan sampai berapa point kah kelebihan browser kalian. Kalian tinggal menuliskan di addres www.html5test.comcom

Nah ini contoh screenshot dari browser chrome digadget saya. Maklum belum punya laptop.

Dan sekian ilmu yang bisa saya bagi kali ini, saya akan update materi lagi setiap hari jum'at tentang HTML dan postingan yang tidak mengandung unsur HTML bisa kapan saja. Oke see yaa..

Penulis : Nuzli Setiyawan Amin

Dosen pengajar : Barka Satya, M.Kom

0 Comments

Tag : Belajar,

Cara Membuat Form Input Data pada Web (HTML 5)

By : Unknown

Lama tak jumpa dengan posting blog saya, karna amat banyak tugas dari dosen saya lupa dengan rutinitas memposting materi tiap minggunya tentang HTML. Nah kali jni saya akan membahas bagaimana membuat Form dengan HTML dengan mudah. Saya akan mencotohkan dari yang simple - simple saja seperti contohnya pada gambar dibawah ini

Nah, saya akan jelaskan satu persatunya dibawah :

<input type="text"> berfungsi sebagai menginputkan data berupa text.
<input type="password"> berfungsu sebagai inputan password yang tidak bisa diperlohatkan
<input type="radio"> untuk memilih salah satu pilihan seperti jenis kelamin
<input type="checkbox">untuk memilih data lebih dari satu
<input type="button"> yang biasanya digunakan untuk JavaScript, VBScript dan script yang lain untuk memunculkan aksi.
<input type="submit"> untuk memunculkan tombol untuk meengirimkan semua data yang telah di inputkan.

Nah untuk mencoba nya copas saja data dibawah ini untuk melihat hasilnya bagaimana dan mempelajarinya dengan cermat. Kalian bisa mencobanya di aplikasi DreamWeaver atau Notepad yang.

<body>

<tr>

<td width="134"><label for="nama">NAMA LENGKAP:</label></td>

</tr>

<tr>

<td><label for="pass">PASSWORD:</label></td>

</tr>

<tr>

<td><label for="jk">JENIS KELAMIN:</label></td>

<td><input type="radio" name="jk" id="jk" value="L" />LAKI-LAKI<br /><input type="radio" name="jk" id="jk" value="P" />PEREMPUAN</td>

</tr>

<tr>

<td><label for="almt">ALAMAT</label></td>

</tr>

<tr>

<td><label for="byr">SUDAH BAYAR</label></td>

<td><input type="checkbox" name="byr" id="byr" />SUDAH</td>

</tr>

</table>

</body>

Nah sekian ilmu yang bisa saya bagi untuk kali ini, tunggu updatean yang lain tiap minggunya tentang dasar-dasar HTML. Let's have fun yak Visitor, see ya...

Dosen pengajar : Barka Satya, M.Kom

0 Comments

Tag : Belajar,

Mobil Terbang Teknologi Masa Depan

By : Unknown

Teknologi mobil yang dapat terbang mulai dikembangkan oleh sebuah perusahaan rintisan asal Slovakia. Mereka mengatakan kendaraan ini dapat berjalan di jalan raya, setelah mencapai ruang terbuka seluas dua kali lapangan bola, kendaraan itu bisa membentangkan sayap dan lepas landas.

Mobil terbang ini dikembangkan oleh perusahaan bernama AeroMobil yang didirikan oleh Juraj Vaculik dan Stefan Klein.

Purwarupa mobil tersebut dipamerkan dalam acara Pioneers Festival, di Wina, Austria, pekan lalu. Kendaraan ini dibekali dengan dua kursi dan memanfaatkan bahan bakar minyak.

Mobil terbang ini disebut tidak membutuhkan sebuah bandara untuk lepas landas. Vaculik mengatakan, landasan yang dibutuhkan adalah seluas dua kali lapangan sepak bola dengan kecepatan laju kendaraan 130 kilo meter per jam. Jarak terbang yang dicapai diklaim mencapai 700 kilo meter.

"Beberapa orang mungkin berpikir bahwa ini adalah mainan anak laki-laki," kata Vaculik seperti dikutip dari Bloomberg. "Tapi kami benar-benar percaya bahwa ini akan mengubah transportasi pribadi."

AeroMobil membuat desain mobil terbang yang terkesan modern. Vaculik menegaskan pentingnya sebuah desain guna menarik daya beli konsumen untuk sebuah mobil super mewah sekaligus pesawat kecil.

Dalam ruang eksibisi, Vaculik memperlihatkan bagaimana sayap mobil ini keluar secara otomatis. Aksi ini disambut tepuk tangan meriah dari pengunjung. AeroMobil pasang target mobil terbang buatannya siap dijual pada 2016.

Ia menyayangkan pemerintah Slovakia yang belu memberi izin uji coba terbang pada kendaraan ini, yang seharusnya dilaksanakan pekan lalu. Vaculik tak kehabisan akan, ia berencana melakukan uji terbang di negara yang memiliki aturan lebih ketat soal lalu lintas, seperti Australia, Brasil atau negara Timur Tengah.

Ide menggabungkan fungsi mobil dan pesawat sebenarnya sudah dilakukan sejak 1917, ketika Curtiss Autoplane memulai debutnya di New York, AS.

Vaculik sebelumnya bekerja di perusahaan periklanan. Ia bertemu dengan Klein, seorang insinyur teknis, yang mengembangkan mobil dengan sayap sejak 25 tahun lalu di garasi rumanhnya. Klein bekerja sebagai kepala departemen Akademi Seni Rupa dan Desain

Slovakia dan perusahaan mobil golf di Polandia.

Source : CNNIndonesia.com

0 Comments

Tag : News,

Memberikan Link Download dan Layout pada Web (Belajar Dasar HTML 4)

By : Unknown

Yak dipertemuan ke-4 saya akan menjelaskan bagaimana caranya memasukan Link Download dan Membuat Tabel pada Web. Pertama kita akan belajar tentang Link Download, sama seperti pertemuan ke-3 kemarin, menggunakan <a href="balablalbal"> </a>. Nah sebagai contohya seperti dibawah :

<a href="browse file yang akan di jadikan link download">Download Disini</a>

Nah kalian bisa memasukan file seperti video, lagu, atau pun berkas data seperti Word dll.

Sekarang kita akan mempelajari tentang membuat Tabel/Layout pada Web. Sebagai contohnya dibawah :

<tr>...</tr> = Tag Baris

<td>...</td> = Tag Kolom

width = Menentukan Lebar

height = Menentukan Tinggi

border = Memberi ketebalan garis

colspan = Menggabungkan Kolom

rowspan = Menggabungkan Baris

Contoh Scrip dan Gambar Tabelnya :

<body>

<tr>

</tr>

<tr>

</tr>

<tr>

</tr>

</tbody>

</table>

Contoh Gambar :

Nah sekian penjelasan yang saja bisa beri kepada kalian yang ingin Belajar HTML, semoga bermanfaat buat kalian teman. Semoga sukses Visitor, see ya..

Penulis : Nuzli Setiyawan Amin

Dosen Pengarah : Barka Satya, M.Kom

0 Comments

Tag : Belajar,

Memberi Foto & URL pada Web (Belajar Dasar HTML 3)

By : Unknown

Pertemuan ke-3 saya baru saja diajarkan tentang bagaimana cara memasukan/menambahkan image dan URL ke dalam web. Tapi kalian bisa memodifikasi atau menambahkan hal lain agar lebih unik dan asik untuk dilihat haha.
Saya akan memberi contoh dasar-dasarnya saja, check this out :

Memasukan Image pada Web

<img src="lalu klik browse cari dimana foto kalian inginkan">

Nah ini contoh memberi foto pada web kalian, bisa kalian modifikasi seperti fotonya berjalan/bergerak. Contohnya :

Dan kalian bisa membuat gambar berjalan lalu berhenti begitu saja, contohnya :

Dan bisa kalian modifikasi sendiri sesuka kalian, kalian bisa searching contoh-contohnya yang banyak di google.

Nah sekarang bagaimana Memasukan URL pada Web

Nah kalian bisa memodifikasi seperti diposisikan di tengah-tengah Web. Contohnya :

<center><a href="http://w3schools.com">Belajar HTML</a></center>

Dan lebih banyak lagi seperti memberi warna pada tulisan dan sebagainya. Kalian bisa searching di google yang lebih banyak kalian bisa belajar mendalam. Dan sekian saya berbagi ilmu kepada kalian Visitors. See ya..

Penulis : Nuzli Setiyawan Amin

Dosen Pengajar : Barka Satya, M.Kom

0 Comments

Tag : Belajar,

Review Spesifikasi ASUS Zenfone 2

By : Unknown

Untuk bersaing ditahun 2015, Asus memang menyiapkan beberapa smartphone terbaru dan salah satunya adalah Asus Zenfone 2 yang mereka rilis bertepatan pada ajang CES 2015. Spesifikasi yang dibawa penerus Asus Zenfone tersebut sangat luar biasa, karena menjadi smartphone pertama yang menggunakan Ram 4GB sebagai dapur pacunya.

Hadirnya Ram berukuran 4GB pada Asus Zenfone 2 diklaim memiliki kecepatan 2 kali lipat dibandingkan ponsel pada umumnya yang menggunakan Ram berukuran 2 GB karena ram tersebut berjalan pada kanal ganda 128 bit. Zenfone 2 sudah jelas mampu mengungguli smartphone flagship ditahun 2015 yang rata-rata menggunakan Ram berukuran 3GB.

Tidak hanya menggunakan teknologi pemorsesan terbaru, ponsel ini juga menawarkan layar beresolusi Full HD dengan sentuhan Asus ZenUI di dalamnya. Walaupun dilengkapi spesifikasi yang sangat canggih dan teknologi terkini, harga Asus Zenfone 2 tetap dibanderol murah dengan menyasar kalangan menengah kebawah yang memiliki harga jual tak sampai 3 Juta Rupiah.

Ponsel ini diprediksi akan sangat sukes dipasaran, mengikuti kesuksesan seri Asus Zenfone sebelumnya. Bagi anda yang ingin tahu bagaimana spesifikais lengkap yang dimiliki ponsel ini, dan berapa kira-kira Harga Asus Zenfone 2 di Indonesia, mari bersama-sama kita simak review redaksi hariangadget.com berikut ini.

Spesifikasi Asus Zenfone 2

Jaringan	Dual SIM
Dimensi	152.5 x 77.2 x 10.9 mm
Berat	170 g
Layar	IPS display 1080p x 1920 pixels, 5.5 inches (~401 ppi pixel density) Corning Gorilla Glass 3, oleophobic coating
Memory	16/32/64 GB, microSD, up to 64 GB
Ram	2 GB /4 GB
OS	Android OS, v5.0 (Lollipop)
Processor	Intel Atom Z3580 Quad-core 2.3 GHz / Intel Atom Z3560 Quad-core 1.8 GHz
GPU	PowerVR G6430
Konektivitas	LTE, HSPA+, Bluetooth V4.0, Wifi, NFC, A-GPS, GLONASS
Kamera Belakang	13 MP, 4128 x 3096 pixels, autofocus, dual-LED (dual tone) flash, Video 1080p
Kamera Depan	5 MP
Kapasitas Baterai	Non-removable Li-Po 3000 mAh

Source : http://hariangadget.com/harga-asus-zenfone-2/

0 Comments

Tag : Review,

Smartphone terbaik MWC 2015

By : Unknown

Tak hanya memamerkan gadget baru semata, pameran teknologi Mobile World Congress (MWC) 2015 yang berlangsung di Barcelona, Spanyol, juga menjadi ajang pembuktian bagi para vendor smartphone untuk meraih penghargaan sebagai ponsel terbaik (Global Mobile Awards) tahun ini.

Setelah melalui proses penjurian, akhirnya awards diberikan kepada dua ponsel papan atas yakni iPhone 6 dan LG G3. Seperti dikutip KompasTekno dari BGR, menurut juri, iPhone 6 berhak menyandang gelar smartphone terbaik karena dinilai unggul di segala hal.

Apple dianggap mampu menggabungkan antara hardware dan software dengan sempurna, sehingga menjadikan iPhone 6 jauh lebih baik dari seri sebelumnya. Selain itu, ukuran layarnya lebih lebar, namun dimensinya tipis dan memiliki kinerja handal serta irit konsumsi daya.

Gelar yang sama juga diraih oleh ponsel Android LG G3. Ponsel ini dianggap berhasil mewujudkan keinginan para fans-nya dan dinilai inovatif. Sebab dilengkapi berbagai fitur menarik seperti smart keyboard, gesture for selfie, flash for selfie dan sistem keamanan canggih knock code. Sedangkan untuk tablet terbaik diraih oleh Microsoft Surface Pro 3.

Selain kategori smartphone dan tablet terbaik, penghargaan juga diberikan kepada Motorola Moto E sebagai smartphone murah terbaik. Ponsel ini rencananya akan mulai dijual dalam waktu dekat ini di Amerika Serikat, namun untuk versi 3G yang dilepas sekitar 120 dollar AS atau hanya Rp 1,5 juta-an.

Dengan dibekali layar 4.5-inch qHD display, chipsetSnapdragon 200 kecepatan 1.2 GHz buatan Qualcomm dan kamera 5MP serta memori internal 8 GB.

Untuk kategori wearable gadget juga disabet Motorola, lewat jam tangan pintar anyarnya Moto 360 yang layak dinobatkan sebagai smartwatch terbaik.

Penulis : Amir R

Source : http://portal.himax.co.id/detail-news/1818/2015/03/Smartphone-Terbaik-di-MWC-2015

0 Comments

Tag : News,

Himax Polymer Octa Core vs HTC One M8

By : Unknown

Smartphone premium tak selalu dijual dengan harga tinggi. Faktanya, saat ini banyak vendor ponsel yang mengusung spesifikasi kelas premium, namun dijual dengan harga yang terjangkau. Salah satunya Himax, ponsel lokal yang sukses meluncurkan Polymer Octa-Core.

Smartphone berotak 8 inti itu laris dalam penjualannya lantaran memiliki kinerja yang handal. Bahkan jika dibandingkan, tak kalah dengan ponsel premium lain seperti HTC One M8. Berikut ini ulasan perbandingan keduanya.

Prosesor

Untuk mendongkrak kinerjanya, kedua ponsel ini dibekali dapur pacu yang handal. Polymer Octa-Core menggunakan prosesor true octa-core 1,7 GHz MT6592 dan dibantu RAM 2GB. Sedangkan HTC One M8 memakai chipsetquad-core Sanpdragon 801 buatan qualcomm dengan kecepatan clock yang lebih tinggi 2,5 GHz dan RAM 2 GB.

Kamera

Di sektor kameranya Polymer Octa-core dibekali sensor dengan besaran resolusi di atasnya, 13 MP kamera belakang dan 5MP kamera selfie. Namun kamera HTC One M8 bisa dibilang lebih inovatif dimana terdapat dua kamera belakang masing-masing 4 MP. Di dekat lensanya tertulis ultra-piksel, tapi seperti yang diketahui ultra-piksel bukanlah satuan hitung dalam kamera. Hal itu hanya bertujuan untuk keperluan promosi semata.

Desain dan layar

Polymer Octa-Core memiliki desain yangstylish dengan layar diagonal 5 inch HD 1280 x 720 pixel (294 ppi) dan dilindungi anti-gores Corning Gorilla Glass 2. Sama dengan Polymer Octa-Core, HTC One M8 memakai layar 5 inci 1080 x 1920 pixels (~441 ppi pixel density).

Begitu pun desainnya, ponsel asal Taiwan ini cukup berkelas menggunakan material metal bertekstur matte yang mirip dengan MacBook buatan Apple. Layarnya dilindungi anti-gores terkuat di kelasnya, Corning Gorilla Glass 4.

Harga

Meski dari spesifikasinya tergolong tangguh, Polymer Octa-Core di banderol dengan harga yang ramah di kantong Rp 1.999.000, sementara HTC One M8 dilepas lebih mahal sekitar Rp 7,5 juta-an.

Kesimpulan

Dua ponsel ini memiliki performa yang sama-sama tangguh dengan hasil jepretan kamera yang berkualitas. Namun, Polymer Octa-Core lebih cocok bagi yang membutuhkan smartphone berkinerja cepat dan handal tanpa harus menguras kocek terlalu dalam.

Spesifikasi Himax Polymer Octa-Core dan HTC One M8M8

Perangkat	Polymer Octa Core	HTC One M8
Screen	5-inch	5.0- inch
Protection	Corning Gorilla Glass 2	Corning Gorilla Glass 4
Resolution	1280 x 720 pixels (294 ppi)	1080 x 1920 pixels (~441 ppi pixel density)
Processor	MediaTex MT6592, Octa-core 1.7 GHz Cortex-A7	Qualcomm MSM8974AB Snapdragon 801, Quad-core 2.3 GHz (US/EMEA)/ 2.5 GHz (Asia, China) Krait 400
RAM	2 GB	2 GB
Internal Memory	8 GB	16/32 GB
Front Camera	5 mega-pixel	5 mega-pixel
Rear camera	13 mega-pixel	Dual 4 MP, 2688?1520 pixels, autofocus, dual-LED (dual tone) flash
Battery	Li-Ion 2500 mAh	2600 mAh
Dual sim	Yes	Yes
Connectivity	Wifi, Bluetooth v4.0, Micro USB v2.0	Wi-Fi 802.11 a/b/g/n/ac, dual-band, Wi-Fi Direct, DLNA, hotspot, Bluetooth v4.0, A2DP, apt-X, with A-GPS, GLONASS, microUSB v2.0 (MHL TV-out), USB Host
Dimensions	141 x 71.5 x 9.3 mm	146.4 x 70.6 x 9.4 mm (5.76 x 2.78 x 0.37 in)
Weight	151 g	160 g (5.64 oz)
Price	Rp 1.999.000	Rp 7,5 jutaan

Penulis : Wike Delvina

Editor : Amir R

Source : http://portal.himax.co.id/detail-news/1815/2015/03/Perbandingan-Polymer-Octa-Core-dan-HTC-One-M8

0 Comments

Tag : Review,

Belajar Dasar HTML 2

By : Unknown

Nah tadi saya habis mempelajari kelanjutan dasar-dasar HTML pertemuan ke-2 diperkuliahan di STMIK AMIKOM Yogyakarta haha. Nah ini contoh-contohnya:

1. Untuk membiat text tebal menggunakan <strong>

<strong>This text is strong.</strong>

2. Untuk membuat texk "Berkedip" menggunakan <blink>

<blink>Berkedip loh....</blink>

3. Untuk membuat text berjalan menggunakan <marquee>

<marquee>Jalan-jalan Men..</marquee>

4. Untuk membuat text berjalan dari kiri ke kanan

<marquee direction="right">Jalan ke Kanan Men..</marquee>

5. Untuk membuat text berjalan dari kanan kekiri

<marquee direction="left">Jalan ke Kiri Men..</marquee>

6. Untuk membuat text miring menggunakan <em>

<em>Ini Miring lho..</em>

7. Untuk membuat text menjadi Italics menggunakan <cite>

<cite>ini italics tulisannya..</cite>

8. Untuk membuat daftar atau list angka menggunakan <ol>

<ol>

<li>satu

<li>dua

<li>tiga

</ol>

9. Untuk membuat daftar atau list dengan titik menggunakan <ul>

<ul>

<li>satu

<li>dua

<li>tiga

</ul>

10. Dan membuat daftar atau list dengan romawi atau huruf

<li>satu

<li>dua

<li>tiga

</ol>

NB: yang didalam tanda "petik" bisa diganti dengan huruf A,a,i,I,1

Nah yang bisa saya bagi hari ini baru ini saja. Tunggu ilmu-ilmj yang lebih banyak lagi besok diwaktu tertentu ya viewers haha. See ya...

Penulis : Nuzli Setiyawan Amin

Sumber kode HTML : www.w3schools.com

0 Comments

Tag : Belajar,

NUZ

HI VISITOR

Popular Post

Archive for 2015

Belajar membuat Drop Down dengam HTML dan CSS

Fitur-fitur Terbaru pada HTML versi 5

Cara Membuat Form Input Data pada Web (HTML 5)

Mobil Terbang Teknologi Masa Depan

Memberikan Link Download dan Layout pada Web (Belajar Dasar HTML 4)

Memberi Foto & URL pada Web (Belajar Dasar HTML 3)

Review Spesifikasi ASUS Zenfone 2

Smartphone terbaik MWC 2015

Himax Polymer Octa Core vs HTC One M8

Belajar Dasar HTML 2

Visit Here

Visitors

Members

Blog Archive

Blogroll

Labels

About