Webmaster

Peluang bisnis pemrograman web saat ini sedang berkembang pesat. Apalagi dengan adanya software-software yang membuat pemrograman web menjadi lebih mudah seperti Microsoft Office FrontPage dan Adobe Dreamweaver. Selain itu, dengan banyaknya jenis dan macam CMS (Content Management System) yang disediakan untuk memudahkan orang awam membuat web dengan lebih mudah. Seperti contohnya untuk pembuatan web konfensional ada yang namanya Joomla, Drupal, Wordpress, dan AuraCMS dan masih banyak lagi. Untuk bagian marketing ada ZenCart dan Virtuemart. Kemudian untuk membuat web forum ada Simple Machine Forum (SMF), FluxBB, dan PHPBB. Bahkan, ada juga yan namanya CloudOS yang bisa digunakan sebagai sistem operasi berbasis web seperti EyeOS, jolieCloud, iCloud dan lain-lain. Dengan banyaknya kemudahan yang diberikan, maka semakin dipermudah pula orang-orang untuk berusaha membuat web yang baik dan menjualnya. Kita hanya perlu membuat web dan mempromosikan web tersebut kepada perusahaan-perusahaan ataupun personal yang tertarik dengan web kita. Kemudian, jika ada yang melakukan penawaran, kita melakukan bidding dengan penawar tersebut untuk mencapai harga yang disepakati bersama.

Pemrograman web tidak hanya digunakan untuk membuat web saja. Terkadang pemrograman web digunakan untuk membuat template web maupun blog yang bisa digunakan untuk menunjang popularitas programmer web tersebut. Hasilnya, tak jarang programmer menjual pula template-template tersebut dengan harga yang bisa dibilang tidak murah seperti yang ada di http://www.templatemonster.com/. Di sini, harga standar rata-rata template untuk web maupun blog adalah $US100 tanpa biaya instalasi template. Namun, jika ditambah biaya instalasi bisa berada di antara $US150 rata-rata. Berbeda lagi dengan unique price yang bisa berharga di atas $US1000 untuk 1 template.

Itulah sebabnya pemrograman web bisa menjadi peluang bisnis yang menggiurkan. Namun, dibutuhkan beberapa keahlian mendasar yang wajib untuk dimiliki oleh programmer web. Keahlian itu antara lain, penguasaan bahasa pemrograman, terutama bahasa pemrograman yang biasa digunakan untk pemrograman web seperti PHP, HTML, XML, AJAX, CSS serta bahasa pemrograman lainnya serta penguasaan algoritma yang baik. Keahlian lain yang bisa menunjang adalah keahlian desain grafis. Kemudian keahlian untuk berbahasa Inggris, sebab bahasa Inggris adalah bahasa internasional, di mana para konsumen mempergunakannya untuk membeli produk kita. Selain itu, keahlian yang paling penting adalah meyakinkan pelanggan untuk mau menggunakan jasa kita dan membayar sesuai dengan apa yang kita kerjakan. 

Inilah beberapa syarat untuk menjadi seorang Webmaster

1.Pelajari dan kuasai program-program web designer.

Menguasai program-program web designer merupakan kunci utama untuk menjadi web designer. Makin banyak anda menguasai, makin beragam jenis karya yang bisa anda hasilkan.

2.Masukan program-program pendukung bisnis ini ke komputer.

Misalkan dreamweaver, frontpage, NVU, photoshop, flash player, image ready, dsb. Anda tidak perlu bisa menguasai semua program secara mendetil, tapi setidaknya anda bisa memilih program yang paling cocok dengan selera.

3. Pelajari masalah script dan kode HTML.

Memahami kode HTML merupakan salah satu ilmu yang wajib dikuasai seorang web designer, karena sebagian besar kegiatan peluang bisnis ini pada akhirnya akan melibatkan keahlian tersebut.

4. Bakat seni.

Merupakan sesuatu yang tidak dimiliki oleh setiap web designer, bersyukurlah anda jika mempunyai kelebihan ini.

5. Lengkapi keahlian dengan ilmu-ilmu pendukung, misalnya SEO, dll.

Membuat website yang search engine frendly merupakan salah satu syarat yang diminati para marketer.

6. Pelajari Pemrograman Database

Website tidak akan bisa berjalan tanpa adanya database. Oleh karena itu, seorang webmaster harus menguasai database agar website bisa berjalan dengan baik dan tidak terjadi banyak crash ataupun bug dan juga untuk melindungi dari serangan hacker.

Kekurangan menjadi Webmaster 

1. Sebagian besar waktu webmaster akan disibukkan dengan melakukan coding, editing, dan desain sepanjang hari karena seorang webmaster adalah juga seorang web design, web development, dan web animator, serta seorang database administrator.
2. Seorang webmaster jarang sekali mempunyai pekerjaan tetap atau menjadi seorang freelancer. Jadi, penghasilan yang didapatkan pun juga tidak stabil seperti pekerja-pekerja kantoran lain.
3. Mau tidak mau, seorang webmaster harus mempelajari banyak sekali bahasa pemrograman baik web maupun database agar bisa memenuhi keinginan pelanggan akan website.

Kelebihan menjadi Webmaster

1. Webmaster yang sudah terkenal akan keahliannya bisa dianggap mempunyai pekerjaan tetap. Sebab dia akan menerima banyak order dengan biaya yang tidak murah.
2. Webmaster tidak disibukkan oleh rutinitas yang biasanya membuat orang cepat bosan. Jadi, seorang webmaster hanya menerima pekerjaan menurut orderan.
3. Menjadi seorang webmaster tidak membutuhkan banyak “peralatan”. Minimal seorang webmaster mempunyai laptop/PC yang terhubung ke internet dan software yang mendukung untuk melakukan tugasnya sebagai seorang webmaster.

Artikel ini sebenarnya adalah tugas makalah, namun karena menurut teman saya artikel ini cocok untuk artikel blog, makanya saya posting saja.. hehe.. Semoga bisa membantu...

Mengganti Favicon Blogger

Anda tahu favicon? Yap, Favicon adalah icon gambar yang ada di bagian address bar. Jika Anda bosan dengan tampilan favicon dari blogger, Anda bisa mengganti favicon sesuai dengan keinginan Anda. Namun, kali ini saya hanya memberikan tutorial khusus untuk pengguna blogger.

Begini langkah-langkahnya:

1. Buat gambar sesuai dengan keinginan Anda dengan ukuran 16x16 pixel atau 32x32 pixel atau download di internet.
2. Kemudian jika sudah membuat, upload gambar Anda ke tempat penyimpanan gambar online seperti imageshack, atau picasa web album.
3. Langkah berikutnya Login ke Blogspot Anda, pilih Design/Rancangan, lalu klik Edit HTML dan jangan lupa beri tanda centang pada kotak Expand Widget Template.
4. Kemudian cari code ini : <b:include data='blog' name='all-head-content'/>
5. Setelah itu masukkan code ini di bawah code tadi

<link href='urlgambar.ico' rel='shortcut icon'/>

    untuk yang berwarna merah bisa Anda ganti dengan url tempat Anda menyimpan icon Anda.

Setelah itu, lihat hasilnya.. Selamat mencoba..^^

Membuat Menu Bar horizontal di Blogger

Kali ini saya akan memberikan sedikit tutorial untuk membuat menu bar yang ada di blogger. Caranya lumayan susah juga menurut saya, karena harus mengganti warna-warna agar sesuai dengan blog ini. Mengapa saya membuat tutorial ini? Sebab, ada sebagian template blogger yang tidak menyertakan menu bar seperti yang saya gunakan ini. Jadi, menurut saya tidak ada salahnya untuk membuat menu bar sendiri untuk memudahkan peng-index-an.

Kira-kira screenshotnya seperti ini:








Berikut ini langkah-langkah membuatnya:

1. Masuk ke menu design dan pilih edit HTML, dan jangan lupa centang Expand Widget Template

2. Cari code berikut :  ]]></b:skin>

3. Setelah itu, copy kan code berikut ini di atas code : ]]></b:skin>

Ini untuk versi yang menggunakan search bar

#NavbarMenu{background:#005094;border-top: 1px solid #3373a9;border-bottom: 1px solid #3373a9;width:968px;height:32px;color:#FFF;font:bold 8px Arial, Tahoma, Verdana;clear:both;margin:0 auto;padding:0}
#NavbarMenuleft{width:758px;float:left;margin:0;padding:0}#search{width:210px;font-size:11px;float:right;margin:0;padding:0}
#nav li{list-style:none;float:left;background:#005094;border-left:1px solid #3373a9;border-right:1px solid #003867;margin:0;padding:0}
#nav li a,#nav li a:link,#nav li a:visited{color:#fff;display:block;text-transform:capitalize;font:normal 12px Georgia, Times New Roman;margin:0;padding:10px 9px 6px}
#nav li a:hover,#nav li a:active{background:#1a4c76;color:#red;text-decoration:none;margin:0;}
#nav li li a,#nav li li a:link,#nav li li a:visited{background:#005094;width:200px;color:#fff;text-transform:capitalize;float:none;border-bottom:1px solid #3373a9;border-top:1px solid #003867;font:normal 11px Georgia, Times New Roman;margin:0;padding:7px 10px}
#nav li li a:hover,#nav li li a:active{background:#1a4c76;color:#fff;padding:7px 10px}
#nav li a.enclose,#nav li a.enclose:visited{border-bottom: 1px solid #000;}#nav li ul{z-index:9999;position:absolute;left:-999em;height:auto;width:170px;margin:0;padding:0}
#nav li ul a{width:140px}
#nav li ul ul{margin:-75px 0 0 171px}
#nav li:hover ul ul,#nav li:hover ul ul ul,#nav li.sfhover ul ul,#nav li.sfhover ul ul ul{left:-999em}
#nav li:hover ul,#nav li li:hover ul,#nav li li li:hover ul,#nav li.sfhover ul,#nav li li.sfhover ul,#nav li li li.sfhover ul{left:auto}
#nav li:hover,#nav li.sfhover{position:static}#searchform{overflow:hidden;display:inline;margin:0;padding:0}
#searchbox{background:#ddd;margin:0;padding:0}#search input{background:transparent;color:#fff;float:left;font-size:12px;width:158px;border:1px solid #fff;font:normal 10px arial, verdana, Times New Roman;margin:7px 0 0 10px;padding:3px 7px}#search .btn{width:auto;border:0;margin:7px 0 0;padding:0}
#subnavbar{background:#004313;width:962px;height:24px;color:#FFF;margin:0;padding:0}
#subnav li a,#subnav li a:link,#subnav li a:visited{color:#f9fc01;display:block;font-size:11px;text-transform:capitalize;margin:0 5px 0 0;padding:3px 13px}
#subnav li a:hover,#subnav li a:active{color:#DCD900;display:block;text-decoration:none;margin:0 5px 0 0;padding:3px 13px}
#nav ul,#subnav ul,#subnav li{float:left;list-style:none;margin:0;padding:0}*,#nav,#subnav{margin:0;padding:0}

Ini untuk versi tanpa search bar

#NavbarMenu{background:#9A9A9A;border-top: 1px solid #AEAEAE;border-bottom: 1px solid #AEAEAE;width:968px;height:32px;color:#FFF;font:bold 8px Arial, Tahoma, Verdana;clear:both;margin:0 auto;padding:0}
#nav li{list-style:none;float:left;background:#9A9A9A;border-left:1px solid #AEAEAE;border-right:1px solid #707070;margin:0;padding:0}
#nav li a,#nav li a:link,#nav li a:visited{color:#fff;display:block;text-transform:capitalize;font:normal 12px Georgia, Times New Roman;margin:0;padding:10px 9px 6px}
#nav li a:hover,#nav li a:active{background:#dfdfdf;color:#red;text-decoration:none;margin:0;}
#nav li li a,#nav li li a:link,#nav li li a:visited{background:#9A9A9A;width:200px;color:#fff;text-transform:capitalize;float:none;border-bottom:1px solid #AEAEAE;border-top:1px solid #707070;font:normal 11px Georgia, Times New Roman;margin:0;padding:7px 10px}
#nav li li a:hover,#nav li li a:active{background:#1a4c76;color:#fff;padding:7px 10px}
#nav li a.enclose,#nav li a.enclose:visited{border-bottom: 1px solid #000;}#nav li ul{z-index:9999;position:absolute;left:-999em;height:auto;width:170px;margin:0;padding:0}
#nav li ul a{width:140px}
#nav li ul ul{margin:-75px 0 0 171px}
#nav li:hover ul ul,#nav li:hover ul ul ul,#nav li.sfhover ul ul,#nav li.sfhover ul ul ul{left:-999em}
#nav li:hover ul,#nav li li:hover ul,#nav li li li:hover ul,#nav li.sfhover ul,#nav li li.sfhover ul,#nav li li li.sfhover ul{left:auto}
#nav li:hover,#nav li.sfhover{position:static}#searchform{overflow:hidden;display:inline;margin:0;padding:0}
#subnavbar{background:#84847D;width:962px;height:24px;color:#FFF;margin:0;padding:0}
#subnav li a,#subnav li a:link,#subnav li a:visited{color:#f9fc01;display:block;font-size:11px;text-transform:capitalize;margin:0 5px 0 0;padding:3px 13px}
#subnav li a:hover,#subnav li a:active{color:#DCD900;display:block;text-decoration:none;margin:0 5px 0 0;padding:3px 13px}
#nav ul,#subnav ul,#subnav li{float:left;list-style:none;margin:0;padding:0}*,#nav,#subnav{margin:0;padding:0}

untuk yang berwarna merah, bisa anda ganti sesuai dengan warna tema blog Anda supaya serasi.

4. Nah, kalau sudah, sekarang cari code yang kira-kira seperti di bawah ini:

<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:section class='headerright' id='headerright' preferred='no'>
<b:widget id='HTML3' locked='false' title='' type='HTML'/>
</b:section>
</div>

biar agak mudah mencarinya, search aja elemen yang ada di atas seperti  <div id='header-wrapper'> atau div id='header-wrapper saja..

Setelah itu masukkan code ini dibawah code tadi

<div id='NavbarMenu'>
<div id='NavbarMenuleft'>
<ul id='nav'>
<li><a expr:href='data:blog.homepageUrl' title='This Blog Address'>Home</a></li>
<li><a href='#'>menu</a>
 <ul>
  <li><a href='#'>menu</a></li>
  <li><a href='#'>menu</a></li>
  <li><a href='#'>menu</a></li>
 </ul></li>
<li><a href='#' title='menu'>menu</a>
 <ul>
  <li><a href='#'>menu</a></li>
  <li><a href='#'>menu</a></li>
 </ul></li>
<li><a href='#' title='menu'>menu</a></li>
<li><a href='#'>menu</a></li>
</ul></div>
</div> 

Nah, kemudian edit saja teks yang berwarna merah dan hijau sesuai dengan keinginan An

Selamat mencoba... ^^v

Tag Cloud Widget: Blogumulus

Hohohooho... Blogumulus, nama yang bagus sebagus bentuknya. blogumulus adalah sebuah tag widget yang mempunyai keunikan karena bisa berputar-putar jika Anda menempelkan kursor pada salah satu tulisan di dalamnya. Blogumulus ini merupakan salah satu widget yang sedang hot-hotnya dipakai oleh para blogger. Contohnya bisa Anda lihat di Label Blog saya ini. Ingin tahu bagaimana cara pasangnya di blogspot? Langsung kita praktekkan saja...

1. Masuk ke bagian Layout atau tata letak

2. Kemudian pilih Edit HTML

3. Jangan lupa back up dulu template Anda untuk menghindari sesuatu yang tidak diinginkan.

4. Kemudian pada Edit HTML, centang di bagian kanan atas tulisan Expand Template Widget.

5. Kemudian cari kode di bawah ini.

<b:section class='sidebar' id='sidebar' preferred='yes'>

6. Kemudian masukkan kode di bawah ini tepat di Bawah kode di atas.

<b:widget id='Label99' locked='false' title='Labels' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<script src='http://halotemplates.s3.amazonaws.com/wp-cumulus-example/swfobject.js' type='text/javascript'/>
<div id='flashcontent'>Blogumulus by <a href='http://www.roytanck.com/'>Roy Tanck</a> and <a href='http://www.bloggerbuster.com'>Amanda Fazani</a></div>
<script type='text/javascript'>
var so = new SWFObject(&quot;http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf&quot;, &quot;tagcloud&quot;, &quot;240&quot;, &quot;300&quot;, &quot;7&quot;, &quot;#ffffff&quot;);
// uncomment next line to enable transparency
//so.addParam(&quot;wmode&quot;, &quot;transparent&quot;);
so.addVariable(&quot;tcolor&quot;, &quot;0x333333&quot;);
so.addVariable(&quot;mode&quot;, &quot;tags&quot;);
so.addVariable(&quot;distr&quot;, &quot;true&quot;);
so.addVariable(&quot;tspeed&quot;, &quot;100&quot;);
so.addVariable(&quot;tagcloud&quot;, &quot;<tags><b:loop values='data:labels' var='label'><a expr:href='data:label.url' style='12'><data:label.name/></a></b:loop></tags>&quot;);
so.addParam(&quot;allowScriptAccess&quot;, &quot;always&quot;);
so.write(&quot;flashcontent&quot;);
</script>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>

7. Simpan Template Anda dan lihat hasilnya...

Namun, yang harus diingat adalah browser Anda harus sudah dilengkapi dengan flash player. Sebab, blogumulus ini menggunakan kombinasi java script dan animasi flash.