Jumat, 28 Januari 2011

Mengenal Lebih Dalam Modem USB dan Modem Router

modem router dan modem usbBagi pengguna internet tentunya sudah tidak asing lagi dengan MODEM benda mungil yang selalu terpasang pada komputer yang berfungsi untuk mengkoneksikan jaringan internet pada PC maupun Laptop. Pada postingan lama saya pernah membahas beberapa jenis modem /router berdasarkan merek dan jenisnya. Dan kali ini saya coba memberikan perbandingan antara Modem USB dan Modem Router ADSL.

Pada prinsipnya ada dua (2) jenis modem / router ADSL yang banyak digunakan orang, yaitu, modem USB dan router ADSL.
  1. Modem USB memperoleh satu daya & tersambung ke komputer melalui USB, seluruh konfigurasi dilakukan melalui komputer. lebih murah daripada modem router. Akan tetapi kalau komputer terkena virus akan bermasalah dan kemungkinan perlu me-reset modem ADSL tersebut. Fungsi proxy, firewall dll harus dilakukan oleh komputer.

  2. Modem Router, sebetulnya merupakan komputer sendiri yang biasanya bersatu dengan beberapa sambungan LAN, mempunyai kemampuan proxy , firewall dll sendiri.
    Lebih memudahkan operator / pengguna kantor kecil / small office home office untuk bekerja menggunakan ADSL. Harga lebih mahal sedikit daripada modem USB.
Untuk ke andalan dan ke praktisan, akan jauh lebih baik menggunakan modem router. Sebaiknya tidak menggunakan USB modem ADSL.

NB : ADSL adalah kependekan dari Asymmetric Digital Subscriber Line, sebuah teknologi yang memungkinan data kecepatan tinggi dikirim melalui kabel telepon.
Source : http://opensource.telkomspeedy.com/wiki/index.php/Modem_USB_vs._Modem_Router

Minggu, 23 Januari 2011

Membuat Bintang Dengan CSS3 "Starbursts CSS3"

Selamat sore blogger semua kayanya udah lama chugygogog tidak buat postingan. Okelah langsung saja di tengah sedikit kesibukan saya coba membuat sebuah tutorial blogger yang mudah-mudahan bisa bermanfaat. Tutorial kali ini saya akan membahas seputar CSS3 yaitu membuat Starburst atau bentuk seperti bintang dengan sudut berbentuk segitiga seperti gambar di bawah ini.
efek bintang css3 starbursts css3
Atau untuk lebih jelasnya bisa lihat demonya pada link dibawah ini.

Lihat Demo

Tehnik css3 ini saya temukan diblognya www.matthewjamestaylor.com yang merupakan blogger penganut css3 silahkan dicek saja. Oke langsung pada kodingnya saja ya.

ul.starbursts {
list-style:none;
margin:20px 0;
padding:0;
overflow:hidden;
}
ul.starbursts li {
float:left;
width:10em;
height:10em;
position:relative;
}
ul.starbursts * {
margin:0;
padding:0;
line-height:1.2em;
}
.starburst {
display:block;
width:6em;
height:6em;
background:#fe0;
-webkit-transform:rotate(-45deg);
-moz-transform:rotate(-45deg);
rotation:-45deg;
position:relative;
top:2em;
left:2em;
text-align:center;
text-decoration:none;
color:#000;
font-weight:bold;
font-family:Arial, sans-serif;
}
.starburst span {
display:block;
width:6em;
height:6em;
background:#fe0;
-webkit-transform:rotate(22.5deg);
-moz-transform:rotate(22.5deg);
rotation:22.5deg;
}

Untuk mengeksekusinya gunakan kode dibawah ini.

<a href="#" class="starburst">
<span><span><span>
<br />NEW<br />CSS3<br />Starbursts!
</span></span></span>
</a>

Tehnik ini sama dengan kita membuat tombol atau button dengan menambahkan "class" pada link yang ingin di pasang. Silahkan ganti teks yang ada didalam starburst tersebut, Selamat mencoba

Senin, 17 Januari 2011

Sofwer Gratis Untuk Membuat Desain Berbasis Vektor

Bagi pecinta desain vektor tentunya memiliki program favorit untuk membuat desain berbasis vektor. Banyak sofwer yang biasanya digunakan untuk membuat desain vektor diantaranya Corel Draw, Freehand, Ilustrator dan banyak lagi yang lainnya.

Untuk kali ini saya akan memberikan pilihan program atau sofwer pengolah gambar berbasis vektor yang cukup lumayan bagus dengan size yang tidak terlalu besar dibandingkan dengan sofwer pengolah vektor lainnya dan yang lebih asik lagi sofwer ini gratis.

Nama programnya yaitu Inkscape, sofwer ini merupakan Sofwer Open source yang bisa disownload dan digunakan secara gratis. walaupun program gratisan namun fitur yang ditawarkan tidak kalah dengan sofwer berbasis vektor lainnya.

Jika Anda tertarik untuk mencoba menggunakan sofwer untuk mengolah desain vektor ini silahkan kunjungi situsnya untuk mendownload di alamat ini http://inkscape.org.

Kamis, 06 Januari 2011

Peranan Warna Dalam Desain Komunikasi Visual

Pemilihan warna dalam karya desain sangat besar peranannya, terutama dalam menghadirkan kesan secara keseluruhan dari karya desain tersebut. Warna merupakan elemen paling utama yang angsung dapat ditangkap oleh indra penglihatan sebelum elemen lainnya disadari.

SIFAT DAN KARAKTER WARNA

peranan warna dalam desain komunikasi visualWarna memiliki dimensi khusus yang membedakan warna satu dengan warna yang lainnya, walaupun secara umum warna dapat dikelompokkan menjadi 3 warna dasar (Primer) yaitu merah (Red), Kuning (yellow), dan Biru (Blue) atau lebih dikenal RGB.

Perpaduan dari dua warna primer akan menghasilkan warna Sekunder, dan perpaduan warna diantaranya membentuk warna Tertier.

Color + Black = Shade
Color + White = Tint or Pastel
Color + gray = Tone

Dari ketiga warna primer tersebut menghasilkan berbagai nada warna (Hue), apabila nada warna tersebut diberi intensitas warna monokromatik / Tin, Tone, Shade, maka akan menghasilkan intensitas gelap terang warna tertentu (Value).

Warna Monokromatik adalah nada warna diantara hitam dan putih.
  • Apabila nada warna dicampur dengan warna putih maka disebut warna Tint atau Pastel.
  • Apabila nada warna dicampur dengan warna grey atau cenderung abu-abu maka disebut Tone.
  • Dan Nada warna yang dicampur dengan warna hitam disebut Shade.

PENGARUH WARNA TERHADAP PSIKOLOGIS

Warna dapat dikelompokkan kedalam warna panas dan warna dingin. Warna panas atau warna hangat adalah kelompok nada warna yang mengarah ke warna merah, sedangkan warna dingin atau sejuk adalah kelompok nada warna yang mengarah ke warna biru.

Warna terang akan memberikan kesan ringan dan luas, sedangkan warna gelap akan memberikan kesan berat dan sempit atau terbatas.

Author : Domi D.S.,SSn
Link : www.domieducation.com

Senin, 03 Januari 2011

Hover Box Image Thumbnail Dengan CSS



Untuk postingan kali ini saya akan membuat galery imege dengan hover thumbnail hanya menggunakan CSS, Hover box image thumbnail ini sangat cocok buat blogger yang blognya mengkoleksi banyak gambar atau image.

Lihat Demo

Untuk kodenya bisa lihat di bawah ini :

CSS Code
.hoverbox{ cursor: default;list-style: none;}
.hoverbox a{ cursor: default;}
.hoverbox a .preview{ display: none;}
.hoverbox a:hover .preview{ display: block;position: absolute;top: -33px;left: -45px;z-index: 1;}
.hoverbox img{ background: #fff; border:1px solid #ccc; color: inherit; padding: 2px;vertical-align: top;width: 100px;height: 75px;}
.hoverbox li{ background: #eee; border:1px solid #ddd; color: inherit; display: inline;float: left;margin: 3px;padding: 5px;position: relative;}
.hoverbox .preview{ border-color: #000;width: 200px;height: 150px;}

HTML Code

<ul class="hoverbox">

<li><a href="LinkAnda"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhkGVvbP9KJwq3XL563iwu_dYRPTDN1w1KkggCRXuY-LYH1wX7HjOyXryAZ1Tmwo-P-SlVPiJ8YZglsExDctK759_Ww1bTqU4pqsFr4BleSljRi3F8O4ntCUXyS1pZTD3LH0FJPLOi_igr5/s1600/ironman3d.jpg" alt="description" /><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhkGVvbP9KJwq3XL563iwu_dYRPTDN1w1KkggCRXuY-LYH1wX7HjOyXryAZ1Tmwo-P-SlVPiJ8YZglsExDctK759_Ww1bTqU4pqsFr4BleSljRi3F8O4ntCUXyS1pZTD3LH0FJPLOi_igr5/s1600/ironman3d.jpg" alt="description" class="preview" /></a></li>
.............................
.............................
.............................
</ul>

NB : Warna merah untuk url gambar kecil (Small), warna Biru Untuk URL gambar hover Besar. Sedangkan warna hijau merupakan link yang ingin anda pasang.

Silahkan code css-y di custom sesuai selera blogger selamat mencoba.

Sabtu, 01 Januari 2011

Membuat Frame Content Pada Template Blogger

Sebelumnya saya mengucapkan SELAMAT TAHUN BARU 2011 buat blogger semua, semoga di awal tehun ini kita bisa menjadi lebih baik dari tahun kemarin. Mengawali posting di awal tahun ini saya akan membahas cara pembuatan frame Content pada area template blogger.

Frame Content ini bisa diterapkan pada bagian atas (top), bawah (Bottom) atau sidebar kiri dan kanan template bloger, dan untuk kali ini saya akan membuat frame content pada bagian atas template blogger.

Lihat Demo

Langsung pada cara pembuatan frame content :
Pertama masukan kode dibawah ini diatas kode ]]></b:skin>
#framecontent{
position: absolute;
top: 0; left: 0; width: 100%;
height: 90px;
overflow: hidden;
background: #6db3f2; }

#maincontent{
position: fixed;
top: 92px;
left: 0; right: 0; bottom: 0;
overflow: auto; background: #fff; }

.innertube{ margin: 15px; }

* html body{ /*IE6 hack*/
padding: 90px 0 0 0; /*Set value to (HeightOfFrameDiv 0 0 0)*/}

* html #maincontent{ /*IE6 hack*/
height: 100%; width: 100%;}

Lalu masukan juga kode dibawah ini dibawah kode <body>

<div id='framecontent'>
<div class='innertube'>
<h1>Frame Conten</h1>

<div id='maincontent'>
<div class='innertube'>

<div id='outer-wrapper'>
......................
......................
......................

Tambahkan tag penutup </div> di atas kode </body>

Silahkan pratinjau terlebih dahulu, kalau sudah cocok silahkan di simpan.
Selamat mencoba.

NB : Teks warna merah bisa anda ganti dengan logo blog ataupun dengan navigasi silahkan di custom saja sesuai dengan selera blogger.

◄ New Post Old Post ►
 

Copyright 2012 ILMU DESAIN GRAFIS: Januari 2011 Template by Bamz | Publish on Bamz Templates