<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	>

<channel>
	<title>Majalah Web</title>
	<atom:link href="http://majalahweb.com/feed/" rel="self" type="application/rss+xml" />
	<link>http://majalahweb.com</link>
	<description>Majalah tentang web dan desain versi web</description>
	<pubDate>Sun, 04 Jan 2009 03:25:58 +0000</pubDate>
	<generator>http://wordpress.org/?v=2.6</generator>
	<language>en</language>
			<item>
		<title>CSS Syntax</title>
		<link>http://majalahweb.com/css-syntax/</link>
		<comments>http://majalahweb.com/css-syntax/#comments</comments>
		<pubDate>Fri, 12 Dec 2008 05:17:12 +0000</pubDate>
		<dc:creator>Permana</dc:creator>
		
		<category><![CDATA[Web design]]></category>

		<category><![CDATA[CSS]]></category>

		<category><![CDATA[Syntax]]></category>

		<guid isPermaLink="false">http://majalahweb.com/?p=39</guid>
		<description><![CDATA[Syntax bisa diartikan sebagai bentuk kode. Jadi Syntax CSS bisa berarti bentuk kode CSS. Kode CSS berbeda dengan kode HTML. Kode CSS tidaklah sulit.
Kode CSS hanya dibagi menjadi 3 bagian, yaitu selector, property, dan value.
selector {
    property : value;
}
Selector adalah elemen HTML yang akan diberikan style. Property adalah atribut dari suatu elemen [...]]]></description>
			<content:encoded><![CDATA[<p>Syntax bisa diartikan sebagai bentuk kode. Jadi Syntax CSS bisa berarti bentuk kode CSS. Kode CSS berbeda dengan kode HTML. Kode CSS tidaklah sulit.</p>
<div class="wp-caption alignnone" style="width: 403px"><img title="Contoh Syntax CSS" src="http://i115.photobucket.com/albums/n296/engtechwp/screenshots/css_syntax_example.png" alt="Contoh syntax CSS. Image from photobucket" width="393" height="286" /><p class="wp-caption-text">Contoh syntax CSS. Image from photobucket</p></div>
<p>Kode CSS hanya dibagi menjadi 3 bagian, yaitu selector, property, dan value.</p>
<pre>selector {
    property : value;
}</pre>
<p><strong>Selector</strong> adalah elemen HTML yang akan diberikan style. <strong>Property</strong> adalah atribut dari suatu elemen HTML yang ingin anda tentukan stylenya, sedangkan <strong>Value</strong> adalah nilai dari atribut tersebut. Untuk memberikan gambaran yang lebih jelas, berikut contoh kodenya:</p>
<pre>body {
    background-color:#cccccc;
    font-family: "Calibri", Verdana, Tahoma;
}</pre>
<p>Kode CSS diatas bisa berarti elemen body (tag <code>&lt;body&gt;</code>) akan ditampilkan dengan warna background abu-abu (#cccccc adalah kode warna untuk abu-abu), dan pada perintah berikutnya kita menentukan agar elemen body menggunakan font Calibri. Jika font Calibri tidak ada pada komputer user, maka gunakan font Verdana, begitu seterusnya. Penulisan font Calibri menggunakan petik dua adalah karena font Calibri bukan merupakan font standart dalam CSS. Font yang tidak standart dalam CSS sebaiknya diberi tanda petik dua.</p>
<p><span id="more-39"></span></p>
<h4>Inheritance/Pewarisan</h4>
<p>Maksud dari <em>Interitance</em> pada CSS adalah begitu kita memberikan style pada elemen body, maka elemen yang didalamnya akan mengikuti style dari elemen body kecuali elemen tersebut diberi style tertentu.</p>
<p>Misalnya saja ada file html seperti berikut :</p>
<pre>&lt;html&gt;
&lt;head&gt;
&lt;title&gt;Latihan syntax CSS&lt;/title&gt;
&lt;style type="text/css"&gt;
    body {
        background-color:#cccccc;
        font-family: "Calibri", Verdana, Tahoma;
    }
&lt;/style&gt;&lt;head&gt;
&lt;body&gt;
    &lt;h1&gt;Halo apa kabar&lt;/h1&gt;
    &lt;p&gt;paragraf halo apa kabar&lt;/p&gt;
&lt;/body&gt;
&lt;/html&gt;</pre>
<p>Dari contoh kode diatas, kita memberikan style pada elemen body (tag <code>&lt;body&gt;</code>). Dengan begini, maka tag-tag HTML yang ada diantara <code>&lt;body&gt;</code> dan <code>&lt;/body&gt;</code> (tag <code>&lt;h1&gt;</code> dan tag <code>&lt;p&gt;</code>) akan mengikuti style <code>&lt;body&gt;</code>, yaitu memiliki warna latar abu-abu dan menggunakan font Calibri. Agar heading (tag h1) memiliki style yang berbeda, misalnya saja heading menggunakan font Times New Roman, maka harus dibuatkan style lagi khusus untuk heading. Berikut contoh kodenya:</p>
<pre>&lt;html&gt;
&lt;head&gt;
&lt;title&gt;Latihan syntax CSS&lt;/title&gt;
&lt;style type="text/css"&gt;
    body {
        background-color:#cccccc;
        font-family: "Calibri", Verdana, Tahoma;
    }
    h1 {
        font-family: "Times New Roman";
    }
&lt;/style&gt;&lt;head&gt;
&lt;body&gt;
    &lt;h1&gt;Halo apa kabar&lt;/h1&gt;
    &lt;p&gt;paragraf halo apa kabar&lt;/p&gt;
&lt;/body&gt;
&lt;/html&gt;</pre>
<p>Pada contoh diatas, ditambahkan style baru untuk elemen heading 1. Dengan begini, heading akan memiliki font Times New Roman, tidak lagi mengikuti style dari elemen induxnya (body).</p>
<p>Walaupun begitu, ada beberapa property pada CSS yang tidak akan di-warisi oleh elemen didalamnya, misalnya saja property margin seperti pada kode dibawah:</p>
<pre>body {margin:20px}</pre>
<p>Misalnya kita menambahkan property margin pada style body, maka heading 1 dan paragraf tidak akan memiliki margin sebanyak 20px, hanya elemen body saja.</p>
<h4>Kombinasi Selector</h4>
<p>Untuk menghindari pengetikan ulang style CSS, elemen HTML yang memiliki style yang sama bisa menggunakan selector yang sama dengan cara menambahkan nama elemen dan dipisahkan dengan tanda koma, contohnya :</p>
<pre>h1, h2, h3, h4, h5, h6 {
     color: #009900;
     font-family: Georgia, sans-serif;
}</pre>
<p>Pada contoh diatas, heading 1, heading 2, sampai heading 6 diset menggunakan style yang sama.</p>
<h4>Memberikan Komentar pada CSS</h4>
<p>Untuk memberikan komentar pada kode CSS, dimulai dengan tanda <strong>/*</strong> dan diakhiri dengan tanda <strong>*/</strong>. Contohnya saja:</p>
<pre>/* Ini adalah komentar */</pre>
<p>Komentar pada CSS tidak akan diproses oleh browser. Komentar berguna untuk mengetikkan sesuatu pada file CSS tapi Anda tidak ingin teks tersebut diproses.</p>
<p>Seperti halnya mempelajari HTML, mempelajari CSS juga bukan merupakan hal yang sulit. HTML dan CSS bukan bahasa pemrograman karena tidak terdapat percabangan (if &#8230; else &#8230; then) ataupun perulangan ( for, while, do), jadi CSS bukan sesuatu yang sulit untuk dipelajari, hanya perlu banyak latihan. Jika Anda belum terlalu jelas apa itu CS, silahkan lihat <a title="Pengenalan CSS" href="http://majalahweb.com/pengenalan-css/" target="_self">Pengenalan CSS</a>.</p>
<p>sumber: <a title="CSS Basic Syntax" rel="nofollow" href="http://www.cssbasics.com/chapter_2_css_syntax.html" target="_blank">CSS Basic</a>, <a title="W3Schools CSS Syntax" rel="nofollow" href="http://w3schools.com/css/css_syntax.asp" target="_blank">W3Schools</a></p>
]]></content:encoded>
			<wfw:commentRss>http://majalahweb.com/css-syntax/feed/</wfw:commentRss>
		</item>
		<item>
		<title>Pengenalan CSS</title>
		<link>http://majalahweb.com/pengenalan-css/</link>
		<comments>http://majalahweb.com/pengenalan-css/#comments</comments>
		<pubDate>Tue, 09 Dec 2008 03:37:25 +0000</pubDate>
		<dc:creator>Permana</dc:creator>
		
		<category><![CDATA[Web design]]></category>

		<category><![CDATA[CSS]]></category>

		<category><![CDATA[Pengenalan]]></category>

		<guid isPermaLink="false">http://majalahweb.com/?p=36</guid>
		<description><![CDATA[CSS Merupakan singkatan dari Cascading Style Sheet. Dengan CSS, Anda bisa memisahkan antara desain tampilan website dengan konten/isi website.
HTML/xHTML sebenernya digunakan untuk memberi tahu browser bagaimana sebuah tag HTML ditampilkan di browser. Misalnya saja tag HTML &#60;i&#62;Teks miring&#60;/i&#62;, tag tersebut sama artinya dengan &#8220;Halo web browser, teks ini tolong dicetak miring&#8221;. Dengan begitu, web browser [...]]]></description>
			<content:encoded><![CDATA[<p><abbr title="Cascading Style Sheet">CSS</abbr> Merupakan singkatan dari <em>Cascading Style Sheet</em>. Dengan CSS, Anda bisa memisahkan antara desain tampilan website dengan konten/isi website.</p>
<div class="wp-caption alignnone" style="width: 410px"><img title="CSS" src="http://i264.photobucket.com/albums/ii162/mypermana/blog/main.png" alt="Cascading StyleSheet" width="400" height="255" /><p class="wp-caption-text">Cascading StyleSheet. Image from Adobe Design Center</p></div>
<p>HTML/xHTML sebenernya digunakan untuk memberi tahu browser bagaimana sebuah tag HTML ditampilkan di browser. Misalnya saja tag HTML <code>&lt;i&gt;Teks miring&lt;/i&gt;</code>, tag tersebut sama artinya dengan &#8220;Halo web browser, teks ini tolong dicetak miring&#8221;. Dengan begitu, web browser yang Anda gunakan akan menampilkan teks secara miring(italic). Contoh lainnya, tag HTML <code>&lt;b&gt;halo semua&lt;/b&gt;</code>, sama artinya dengan &#8220;Browser, tolong teks halo,semua ditampilkan dengan cetak tebal&#8221; yang selanjutnya web browser akan menampilkannya dengan cetak tebal.</p>
<p>Tapi bagaimana jika Anda ingin menampilkan teks tersebut agar tampil dengan teks yang miring dan bercetak tebal? Jika menggunakan HTML, solusinya adalah menuliskan tag HTML sebagai berikut :</p>
<pre>&lt;i&gt;&lt;b&gt;teks ini blod dan italic&lt;/b&gt;&lt;/i&gt;</pre>
<p>Yup, masalah selesai dengan tag tersebut. Tapi bagaimana jika Anda memiliki banyak teks yang harus dicetak tebal sekaligus miring? Apakah dengan menuliskan tag HTML seperti contoh diatas? Bisa saja tapi sangat tidak direkomandasikan dan tidak ada orang yang melakukan hal seperti itu. Selain karena harus mengetikkan berulang-ulang, juga akan memperbesar ukuran file HTML. Solusi untuk permasalahan diatas adalah dengan menggunakan CSS.</p>
<p><span id="more-36"></span></p>
<p>CSS sebenarnya berguna untuk memberikan perintah tambahan terhadap web browser agar suatu teks/elemen HTML bisa ditampilkan dengan tampilan tertentu sesuai yang dideskripsikan pada perintah stylesheet. Intinya, CSS berfungsi untuk memberikan <strong>style</strong> pada suatu tag/elemen HTML.</p>
<p>Ada 3 cara dimana kita bisa meletakkan kode CSS, yaitu:</p>
<h4>Internal StyleSheet</h4>
<p>Internal StyleSheet adalah sebutan kalau kita meletakkan kode CSS di bagian head sebuah file HTML. Atau dengan kata lain, kita meletakkan kode CSS diantara tag <code>&lt;head&gt;</code> dan tag <code>&lt;/head&gt;</code>. Formatnya bisa seperti contoh dibawah:</p>
<pre>&lt;head
&lt;style type="text/css"&gt;
.. letak kode css ..
&lt;/style&gt;
&lt;/head&gt;
&lt;body&gt;</pre>
<p>Dengan meletakkan kode CSS pada bagian head, berarti halaman HTML yang Anda buat akan mengandung kode CSS. Cara ini bagus jika Anda hanya perlu untuk memberikan style pada halaman HTML itu saja. Jika Anda ingin agar tiap halaman HTML memiliki style yang berbeda-beda, Anda bisa menggunakan cara ini.</p>
<h4>Inline Style</h4>
<p>Inline Style berbeda dengan Inline StyleSheet. Jika Internal StyleSheet berarti Anda meletakkan kode CSS <strong>pada file HTML</strong> (bagian head), maka Inline Style berarti Anda meletakkan kode CSS <strong>pada elemen HTML</strong>. Untuk lebih memberikan gambaran seperti apa Inline Style, berikut adalah contoh kodenya:</p>
<pre>&lt;p style="color:#ff0000;"&gt;teks warna merah &lt;/p&gt;</pre>
<p>Hasil dari kode diatas adalah:</p>
<p style="color: #ff0000">teks warna merah</p>
<p>Seperti yang bisa Anda lihat, disini kode CSS diletakkan langsung pada elemen paragraf (tag <code>&lt;p&gt;</code>), dengan menambahkan atribut style dan mengetikkan kode CSS. Cara ini bagus jika Anda ingin suatu elemen memiliki tampilan yang berbeda. Misalnya saja Anda ingin ada teks yang berwarna merah dan ada teks yang berwarna biru.</p>
<h4>External StyleSheet</h4>
<p>External StyleSheet adalah peletakkan kode CSS pada file yang berbeda. Dimana nantinya Anda akan membuat sebuah file khusus yang berekstensi .css dimana nantinya kode-kode CSS akan diletakkan pada file tersebut. Setelah kode CSS diketikkan pada file tersebut, Anda bisa menghubungkan file CSS dengan file HTML yang Anda buat dengan mengetikkan perintah:</p>
<pre>&lt;link rel="stylesheet" type="text/css" href="letak file .css" /&gt;</pre>
<p>Perintah diatas diketikkan pada bagian head. Atau dengan cara kedua seperti berikut ini:</p>
<pre>&lt;style type="text/css"&gt;
@import url(letak file .css)
&lt;/style&gt;</pre>
<p>Dengan menggunakan Eksternal StyleSheet, maka file HTML akan terhubung dengan file CSS. Jika Anda perlu untuk mengubah suatu style, cukup dengna mengubah kode CSS pada file .css. Ada beberapa alasan mengapa cara ini dianjurkan:</p>
<ul>
<li>Maintenance kode CSS lebih mudah</li>
<li>Mengurangi ukuran file HTML, karena kode CSS diletakkan pada file yang berbeda</li>
<li>Dapat menghemat bandwidth</li>
</ul>
<h3>Yang mana yang lebih baik ?</h3>
<p>Dengan banyaknya cara untuk meletakkan kode CSS Anda mungkin bertanya cara yang mana yang sebaiknya dipilih? Jawabannya adalah tergantung kebutuhan. Tapi saya sendiri lebih menyukai menggunakan External StyleSheet karena beberapa alasan yang sudah disebutkan tadi.</p>
<h4>Bagaimana jika ketiga cara diatas digabungkan?</h4>
<p>Jika ketiga cara diatas digabungkan atau jika Anda menggunakan 2 cara, maka web browser akan membuat style baru hasil dari penggabungan style tersebut dengan prioritas pertama ada pada Inline Style, kedua adalah Inline StyleSheet dan terakhir adalah External StyleSheet.</p>
<p>Maksud dari prioritas disini adalah jika pada External StyleSheet anda mengetikkan kode CSS untuk menampilkan teks warna merah, sedangkan di Internal StyleSheet Anda mengetikkan kode CSS untuk menampilkan teks warna biru, maka hasil yang tampil adalah teks warna biru akan prioritas Internal StyleSheet lebih diutamakan daripada External StyleSheet.</p>
<h4>Tampilan berbeda di tiap web browser</h4>
<p>Semakin Anda mendalami CSS maka Anda akan semakin sadar bahwa setiap browser mempunyai cara berbeda dalam menterjemahkan kode CSS. Inilah yang membuat sedikit kerja keras bagi para web designer untuk membuat tampilan sebuah halaman bisa tampil sama pada browser yang berbeda.</p>
<p>Pada artikel berikutnya saya akan membahas tentang Syntax CSS. Syntax CSS adalah bentuk kode CSS. Untuk mendapatkan update terbaru, jangan lupa untuk berlangganan via <a title="Majalah Web RSS Feed" href="http://majalahweb.com/feed/" target="_blank">feed</a>. Jika ada pertanyaan silahkan ditanyakan via komentar.</p>
]]></content:encoded>
			<wfw:commentRss>http://majalahweb.com/pengenalan-css/feed/</wfw:commentRss>
		</item>
		<item>
		<title>Software untuk pembuatan web dengan PHP</title>
		<link>http://majalahweb.com/software-untuk-pembuatan-web-dengan-php/</link>
		<comments>http://majalahweb.com/software-untuk-pembuatan-web-dengan-php/#comments</comments>
		<pubDate>Sun, 07 Dec 2008 00:39:51 +0000</pubDate>
		<dc:creator>Permana</dc:creator>
		
		<category><![CDATA[Software]]></category>

		<category><![CDATA[IDE]]></category>

		<category><![CDATA[PHP]]></category>

		<guid isPermaLink="false">http://majalahweb.com/?p=34</guid>
		<description><![CDATA[Ada banyak software yang tersedia untuk men-develop aplikasi web. Baik yang berbayar ataupun yang gratis. Berikut beberapa software yang cukup terkenal karena kemampuannya, dan tentu saja banyak penggunanya :
Dreamweaver

Rasanya semua orang pasti sudah kenal dengan yang namanya Adobe Dreamweaver. Pada versi terbarunya yaitu CS4, Dreamweaver memiliki tampilan yang lebih menarik. Dan beberapa fitur tambahan seperti [...]]]></description>
			<content:encoded><![CDATA[<p>Ada banyak software yang tersedia untuk men-<em>develop</em> aplikasi web. Baik yang berbayar ataupun yang gratis. Berikut beberapa software yang cukup terkenal karena kemampuannya, dan tentu saja banyak penggunanya :</p>
<h4>Dreamweaver</h4>
<p><a title="Adobe Dreamweaver" rel="nofollow" href="http://www.adobe.com/products/dreamweaver/" target="_blank"><img src="http://i264.photobucket.com/albums/ii162/mypermana/blog/dreamweaver-splash.jpg" alt="Dreamweaver CS4 Splash" /></a></p>
<p>Rasanya semua orang pasti sudah kenal dengan yang namanya <a title="Adobe Dreamweaver" rel="nofollow" href="http://www.adobe.com/products/dreamweaver/" target="_blank">Adobe Dreamweaver</a>. Pada versi terbarunya yaitu CS4, Dreamweaver memiliki tampilan yang lebih menarik. Dan beberapa fitur tambahan seperti Subversion, untuk keperluan versioning control system. Dan yang paling membedakan Dreamweaver CS4 dengan versi sebelumnya adalah fitur yang lebih men-support Javascript/AJAX. Tidak hanya Spry seperti pada versi CS3.</p>
<p>Informasi lain tentang Dreamweaver:</p>
<ul>
<li><a title="Membuat web dengan Dreamweaver" rel="nofollow" href="http://slametriyanto.net/2007/05/25/membuat-web-dengan-dreamweaver/" target="_blank">Membuat web dengan Dreamweaver</a></li>
<li><a title="Tutorial Macromedia Dreamweaver" rel="nofollow" href="http://www.klik-kanan.com/desainweb/dream/index.shtml" target="_blank">Tutorial Macromedia Dreamweaver</a></li>
<li><a title="Tutorial membuat aplikasi CRUD berbasis PHP dan MySQL dengan Dreamweaver" rel="nofollow" href="http://okecoy.com/2008/09/12/tutorial-membuat-aplikasi-crud-berbasis-php-dan-mysql-dengan-adobe-dreamweaver-cs/" target="_blank">Tutorial membuat aplikasi CRUD berbasis PHP dan MySQL dengan Dreamweaver</a></li>
</ul>
<p><span id="more-34"></span></p>
<h4>Netbeans PHP IDE</h4>
<p><a title="Netbeans PHP IDE" rel="nofollow" href="http://php.netbeans.org/" target="_blank"><img src="http://i264.photobucket.com/albums/ii162/mypermana/blog/netbeansphp-splash.jpg" alt="Netbeans PHP IDE Splash" /></a></p>
<p>Netbeans PHP IDE bisa didownload secara gratis dengan ukuran hanya 21 mb di situs <a title="Netbeans IDE for PHP" rel="nofollow" href="http://php.netbeans.org/" target="_blank">Netbeans PHP</a>. Dukungan terhadap PHP bisa dibilang sangat bagus. Selain mendukung PHP, Netbeans PHP IDE juga ter-integrasi dengan teknologi web seperti HTML, CSS, Javascript, dan MySQL. Memiliki fitur Debugging dan versioning system (CVS, Mercurial, Subversion), Project management, dan masih banyak fitur lainnya. Dan yang lebih bagus lagi adalah Netbeans PHP IDE ini bersifat gratis, dan juga open source. Informasi lain tentang Netbeans PHP:</p>
<ul>
<li><a title="Debuggin PHP script dengan Netbeans" rel="nofollow" href="http://ifnu.artivisi.com/?p=19" target="_blank">Debugging PHP script dengan Netbeans</a></li>
</ul>
<h4>PHP Designer</h4>
<p><a title="PHP Designer" rel="nofollow" href="www.mpsoftware.dk/phpdesigner.php" target="_blank"><img src="http://i264.photobucket.com/albums/ii162/mypermana/blog/PHPDesigner2008Professionalv6_3.jpg" alt="PHP Designer 2008" width="400" height="196" /></a></p>
<p>Dilihat dari nama softwarenya sudah bisa dipastikan bahwa <a title="PHP Designer 2008" rel="nofollow" href="http://www.mpsoftware.dk/phpdesigner.php" target="_blank">PHP Designer 2008</a> sangat bagus untuk keperluan edit web PHP. Memiliki semua fitur untuk keperluan editing PHP. Tampilan interface pun bisa diubah dengan theme yang telah disediakan. Dan yang paling bagus dari PHP Designer 2008 adalah software ini sangat ringan, jadi tidak akan memberatkan memori CPU Anda.</p>
<h4>EclipsePDT</h4>
<p><a title="EclipsePDT" rel="nofollow" href="http://www.eclipse.org/pdt/" target="_blank">EclipsePDT</a> adalah singkatan dari Eclipse PHP Development Toolkit. Modul PHP untuk IDE Eclipse. Eclipse sendiri adalah IDE untuk membuat aplikasi Java. Tapi bisa dikembangkan lebih jauh dengan menginstall modul-modul tertentu.</p>
<p>Artikel lain tentang Eclipse PDT:</p>
<ul>
<li><a title="PHP debugger dengan Eclipse + XDebug" rel="nofollow" href="http://zulki.blogdetik.com/2008/10/04/php-debugger-dengan-eclipse-xdebug/" target="_blank">PHP debugger dengan Eclipse + XDebug</a></li>
</ul>
<p><img src="http://i264.photobucket.com/albums/ii162/mypermana/blog/eclipse_logo_30-1.gif" alt="Eclipse Splash Screen" /></p>
<h4>PHPEclipse</h4>
<p>Plugins lain PHP untuk IDE Eclipse. Tetapi Eclipse PDT masih lebih baik dibandingkan PHPEclipse. Jika Anda ingin mencoba plugin yang satu ini, silahkan <a title="download PHP Eclipse" rel="nofollow" href="http://www.phpeclipse.de/" target="_blank">download PHP Eclipse</a>.</p>
<h4>Zend Studio</h4>
<p>Aplikasi buatan Zend Technologies ini sangat pas untuk keperluan membuat aplikasi web dengan PHP. Memiliki semua fitur yang dibutuhkan. Adanya fitur WYSIWYG seperti di Dreamweaver membuat Zend Studio serasa Dreamweaver dengan dukungan penuh terhadap PHP. Jika ingin mencoba Zend Studio, Anda bisa mendownload di halaman download <a title="Zend Studio Download page" rel="nofollow" href="http://www.zend.com/en/downloads/" target="_blank">Zend Studio</a>.</p>
<h4>PHP for Visual Studio</h4>
<p>Jika Anda sudah terlanjur terbiasa dengan <abbr title="Integrated Development Environment">IDE</abbr> Visual Studio dan ingin mencoba PHP tanpa berubah IDE, maka <a title="PHP for Visual Studio" rel="nofollow" href="www.jcxsoftware.com/vs.php" target="_blank">PHP for Visual Studio</a> ini adalah solusinya. Software dari jxc.software ini bisa di-install berupa aplikasi <em>stand-alone </em>ataupun sebagai plugins dari Visual Studio.</p>
<h4>Rapid PHP</h4>
<p><a title="Rapid PHP" rel="nofollow" href="http://www.blumentals.net/rapidphp/" target="_blank">Rapid PHP</a> bisa dibilang mirip dengan PHP Designer. Pada website resminya, Rapid PHP mengatakan bahwa aplikasi ini sangat ringan dan cepat. Dan memang setelah dicoba aplikasi termasuk ringan. Memiliki fitur yang juga mirip dengan PHP Designer.</p>
<h4>Notepad++</h4>
<p><a title="Notepad++" rel="nofollow" href="http://notepad-plus.sourceforge.net/uk/site.htm" target="_blank"><img src="http://i264.photobucket.com/albums/ii162/mypermana/blog/notepadplusplus.jpg" alt="Notepad++ Editor" /></a></p>
<p>Notepad++ adalah salah satu program text editor yang sangat bagus. Notepad++ mendukung banyak format file, termasuk PHP dan juga SQL. Tentu saja masih banyak lagi bahasa lain yang didukung oleh Notepad++.</p>
<p>Aplikasi Notepad++ sangat cocok jika Anda hanya ingin melakukan pengeditan kecil terhadap sebuah file .php tanpa perlu loading aplikasi berat seperti Netbeans PHP IDE.</p>
<p>Sumber lain tetang Notepad++ :</p>
<ul>
<li><a title="Notepad++, pengganti Notepad" rel="nofollow" href="http://gawibowo.com/notepad-pengganti-notepad.htm" target="_blank">Notepad++, pengganti Notepad</a></li>
<li><a title="Notepad++, pengganti Notepad" rel="nofollow" href="http://agusw.penamedia.com/2006/08/13/notepad-pengganti-notepad/" target="_blank">Notepad++, pengganti Notepad</a></li>
<li><a title="Notepad++" rel="nofollow" href="http://www.download.web.id/developer/notepad-p21.htm" target="_blank">Notepad++</a></li>
</ul>
<h4>Komodo Edit</h4>
<p><a rel="nofollow" href="http://www.activestate.com/Products/komodo_ide/komodo_edit.mhtml" target="_blank"><img title="Komodo Edit" src="http://i264.photobucket.com/albums/ii162/mypermana/blog/Komodo_JS.jpg" alt="Komodo Edit" width="400" height="300" /></a></p>
<p>Komodo Edit adalah software <em>editor-based</em> yang bisa didapatkan secara gratis dari Active State. Software ini bersifat gratis, sedangkan versi berbayarnya adalah Komodo IDE. Tentunya Komodo IDE memiliki tambahan fitur yang lebih daripada Komodo Edit. Silahkan lihat <a title="perbandingan Komodo Edit dengan Komodo IDE" rel="nofollow" href="http://www.activestate.com/Products/komodo_ide/edit_comparison.mhtml" target="_blank">perbandingan Komodo Edit dengan Komodo IDE</a>.</p>
<p>Terima kasih buat <a href="http://majalahweb.com/software-untuk-pembuatan-web-dengan-php/#comment-10">hb2</a> atas informasinya. Artikel lain tentang Komodo Edit:</p>
<ul>
<li><a title="Komodo Edit 5.0, Performa Editor Lebih Cepat" rel="nofollow" href="http://www.abetobing.com/post/read/2008/11/14/15/komodo-edit-50-performa-editor-lebih-cepat" target="_blank">Komodo Edit 5.0, Performa Editor Lebih Cepat</a></li>
<li><a title="Komodo Edit" rel="nofollow" href="http://ngadimin.org/2008/08/20/komodo-edit/" target="_blank">Komodo Edit</a></li>
</ul>
<p>Akhir kata, jika ada software yang biasa Anda pakai dan tidak tercantum disini, Anda bisa memberi tahu melalui komentar.</p>
]]></content:encoded>
			<wfw:commentRss>http://majalahweb.com/software-untuk-pembuatan-web-dengan-php/feed/</wfw:commentRss>
		</item>
		<item>
		<title>Berlangganan feed dengan Google Reader</title>
		<link>http://majalahweb.com/berlangganan-feed-dengan-google-reader/</link>
		<comments>http://majalahweb.com/berlangganan-feed-dengan-google-reader/#comments</comments>
		<pubDate>Fri, 10 Oct 2008 16:07:27 +0000</pubDate>
		<dc:creator>Permana</dc:creator>
		
		<category><![CDATA[Webtool]]></category>

		<category><![CDATA[Feed]]></category>

		<category><![CDATA[Google]]></category>

		<category><![CDATA[Reader]]></category>

		<guid isPermaLink="false">http://majalahweb.com/?p=24</guid>
		<description><![CDATA[Google Reader adalah aplikasi berbasiskan web dari Google untuk membantu Anda mengelola feed langganan Anda. Sebenarnya banyak aplikasi untuk berlangganan feed, dan Google Reader adalah salah satunya. Saya sendiri menggunakan aplikasi desktop Mozilla Thunderbird. Pada panduan berikut ini saya menggunakan browser Firefox.]]></description>
			<content:encoded><![CDATA[<p><a title="Google Reader : Aplikasi subscribe feed berbasiskan web" rel="nofollow" href="http://www.google.com/reader" target="_blank">Google Reader</a> adalah aplikasi berbasiskan web dari Google untuk membantu Anda mengelola feed langganan Anda. Sebenarnya banyak aplikasi untuk berlangganan feed, dan Google Reader adalah salah satunya. Saya sendiri menggunakan aplikasi desktop Mozilla Thunderbird. Pada panduan berikut ini saya menggunakan browser Firefox.</p>
<p><a title="Google Reader : Aplikasi subscribe feed berbasiskan web" rel="nofollow" href="http://www.google.com/reader" target="_blank"><img src="http://i264.photobucket.com/albums/ii162/mypermana/blog/google-reader-signin.png" alt="Google Reader" /></a></p>
<p><span id="more-24"></span></p>
<p>Buka <a title="Google Reader : Aplikasi subscribe feed berbasiskan web" rel="nofollow" href="http://www.google.com/reader" target="_blank">Google Reader</a>. Kemudian login menggunakan username dan password dari akun Google Anda. Jika belum memiliki akun Google, segera daftar. Setelah sukses login, maka akan terlihat tampilan Google Reader.</p>
<p>Buka sebuah website yang mempunyai sebuah feed. Sebagai contoh saya buka situs <a title="Detik" rel="nofollow" href="http://www.detik.com" target="_blank">detik.com</a>. Kemudian cari dan klik link feednya.</p>
<p><img src="http://i264.photobucket.com/albums/ii162/mypermana/blog/rss-detik-dot-com.png" alt="Link feed detik.com" /></p>
<p>Atau jika Anda bingung menemukan link feed sebuah website, cukup dengan melihat bagian kanan <em>address bar</em> browser yang anda gunakan (saya menggunakan Mozilla Firefox). Umumnya link feed sebuah website menggunakan icon berwarna oranye seperti ini.</p>
<p><img src="http://i264.photobucket.com/albums/ii162/mypermana/blog/klik-icon-oranye.png" alt="Icon feed pada address bar" /></p>
<p>Secara default, Firefox akan mengkonfirmasi aplikasi apa yang ingin anda pakai. Karena kita mencoba Google Reader, jadi pilihlah Google dari menu pilihan. Setelah itu klik <strong>Subscribe Now</strong>.</p>
<p><img src="http://i264.photobucket.com/albums/ii162/mypermana/blog/subscribe-di-firefox.png" alt="Pilihan Feed Reader pada Firefox" /></p>
<p>Setelah itu Anda akan ditanyakan kembali apakah update ingin ditampilkan di Google Homepage atau Google Reader. Sekali lagi, karena kita menggunakan Google Reader, pilih <strong>Add to Google Reader</strong>. Hasilnya seperti gambar dibawah.</p>
<p><img src="http://i264.photobucket.com/albums/ii162/mypermana/blog/add-to-google.png" alt="Antara Google Homepage dan Google Reader" /></p>
<p><img src="http://i264.photobucket.com/albums/ii162/mypermana/blog/hasil-subscribe.png" alt="Hasil subscribe dengan Google Reader" /></p>
<p>Kemudian, jika Anda ingin menambahkan langganan feed dari sebuah website, selain dengan mengulang langkah diatas, Anda juga bisa dengan mengeklik tombol <strong>Add subscription</strong> pada Google Reader. Kemudian masukkan alamat websitenya.</p>
<p><img src="http://i264.photobucket.com/albums/ii162/mypermana/blog/add-to-subscription.png" alt="Fitur Add subscription pada Google Reader" /></p>
]]></content:encoded>
			<wfw:commentRss>http://majalahweb.com/berlangganan-feed-dengan-google-reader/feed/</wfw:commentRss>
		</item>
		<item>
		<title>Apa itu feed</title>
		<link>http://majalahweb.com/apa-itu-feed/</link>
		<comments>http://majalahweb.com/apa-itu-feed/#comments</comments>
		<pubDate>Fri, 10 Oct 2008 15:24:12 +0000</pubDate>
		<dc:creator>Permana</dc:creator>
		
		<category><![CDATA[Blogging]]></category>

		<category><![CDATA[Feed]]></category>

		<category><![CDATA[Reader]]></category>

		<category><![CDATA[Software]]></category>

		<guid isPermaLink="false">http://majalahweb.com/?p=19</guid>
		<description><![CDATA[Apakah Anda sering mendengar istilah feed, RSS, atau Atom ? Sebenarnya RSS dan Atom itu termasuk dalam feed. Lalu apa itu feed ? beberapa pengguna Internet mungkin sudah ada yang tahu apa itu feed, bahkan mungkin sudah ada yang memanfaatkannya. Bagi yang belum tahu apa itu feed, berikut saya berikan penjelasan tentang apa itu feed [...]]]></description>
			<content:encoded><![CDATA[<p>Apakah Anda sering mendengar istilah feed, RSS, atau Atom ? Sebenarnya RSS dan Atom itu termasuk dalam feed. Lalu apa itu feed ? beberapa pengguna Internet mungkin sudah ada yang tahu apa itu feed, bahkan mungkin sudah ada yang memanfaatkannya. Bagi yang belum tahu apa itu feed, berikut saya berikan penjelasan tentang apa itu feed dan bagaimana cara memanfaatkannya.</p>
<p>Feed adalah sebuah format data bertipe XML yang digunakan untuk memberi tahu pengunjung tentang update terbaru dari sebuah website secara berkala.</p>
<h3>Cara lama</h3>
<p><img src="http://i264.photobucket.com/albums/ii162/mypermana/blog/user-to-information.png" alt="diagram feed" /></p>
<p><span id="more-19"></span></p>
<p>Pada gambar diatas, A adalah komputer Anda, B adalah sebuah blog dan C adalah website lainnya (misal: website berita). Dulu, untuk mendapat Informasi terbaru dari sebuah website, pengguna Internet harus membuka website tersebut di browsernya. Tapi apabila tidak ada update terbaru dari website tersebut, maka pengguna akan rugi waktu untuk mengecek dan juga rugi bandwidth (untuk yang pembayaran Internetnya berdasarkan volume ).</p>
<p>Arah panah menunjukkan bahwa pengguna yang harus aktif mengunjungi blog (B) dan website (C). Bandingkan dengan cara yang terbaru.</p>
<h3>Cara baru</h3>
<p><img src="http://i264.photobucket.com/albums/ii162/mypermana/blog/information-to-user.png" alt="diagram feed" /></p>
<p>Pada gambar diatas, pengguna Internet mendapatkan informasi update terbaru dari blog (B) dan website (C) tanpa harus mengunjungi website tersebut. Bagaimana bisa ? hal ini bisa dilakukan karena blog (B) dan website (C) mempunyai fitur feed. Dimana pengguna Internet harus terlebih dahulu melakukan <em>subscribe</em> feed dari website tersebut. Subscribe ke feed sebuah website bisa dilakukan dengan menggunakan aplikasi (biasanya disebut dengan <em>feed reader</em>). Baik aplikasi berbasiskan web ataupun berbasiskan desktop.</p>
<p>Jadi, cukup dengan membuka aplikasi feed reader tersebut dan Anda pun akan mendapatkan update terbaru dari website/blog langganan Anda.</p>
<p>Dan bagusnya, feed tidak hanya bisa dibaca dari komputer. Melainkan juga bisa dibaca melalui media lain, seperti handphone, PDA, smartphone, dan lain-lain. Selama dalam perangkat tersebut terdapat aplikasi feed reader dan terkoneksi dengan Internet, maka mendapatkan update langsung melalui feed akan bisa dilakukan.</p>
<p><img src="http://i264.photobucket.com/albums/ii162/mypermana/blog/rss-to-anymedia.png" alt="jaringan feed" /></p>
<h3>Penjelasan dari sumber lain</h3>
<p>Masih banyak website ataupun blog yang menjelaskan tentang apa itu feed. Berikut adalah daftar artikel tersebut:</p>
<ul>
<li><a title="Pengertian RSS feed dan cara berlangganan" rel="nofollow" href="http://www.o-om.com/2008/03/rss-feed-adalah.html" target="_blank">Pengertian RSS feed dan cara berlangganan</a></li>
<li><a title="Sedikit tentang RSS feed" rel="nofollow" href="http://www.ekonurhuda.com/2008/09/sedikit-tentang-rss-feed.html" target="_blank">Sedikit tentang RSS feed</a></li>
<li><a title="Memanfaatkan feed reader dalam berblog" rel="nofollow" href="http://www.jalankenangan.net/celoteh/?p=136" target="_blank">Memanfaatkan <em>feed reader</em> dalam berblog</a></li>
<li><a title="Tutorial Akregator (KDE RSS feed reader)" rel="nofollow" href="http://ipen.opensuse-id.org/2008/05/17/tutorial-akregator-kde-rss-feed-reader/" target="_blank">Tutorial Akregator (KDE RSS feed reader)</a></li>
<li><a title="Google Reader" rel="nofollow" href="http://kolom-tutorial.blogspot.com/2007/10/google-reader.html" target="_blank">Google Reader</a></li>
<li><a title="Apa itu RSS dan kegunaannya" rel="nofollow" href="http://www.mariocahyadi.com/2008/08/apa-itu-rss-dan-kegunaannya/" target="_blank">Apa itu RSS dan kegunaannya</a></li>
<li><a title="RSS: Pedang Bermata Dua" rel="nofollow" href="http://www.andaka.com/rss-pedang-bermata-dua.php" target="_blank">RSS: Pedang Bermata Dua</a></li>
<li><a title="Mengenal Mahluk RSS Feed" rel="nofollow" href="http://syarifudin.web.id/2008/08/mengenal-mahluk-rss-feed/" target="_blank">Mengenal Mahluk RSS Feed</a></li>
</ul>
]]></content:encoded>
			<wfw:commentRss>http://majalahweb.com/apa-itu-feed/feed/</wfw:commentRss>
		</item>
		<item>
		<title>Webtool inspirasi warna</title>
		<link>http://majalahweb.com/webtool-inspirasi-warna/</link>
		<comments>http://majalahweb.com/webtool-inspirasi-warna/#comments</comments>
		<pubDate>Tue, 26 Aug 2008 02:01:23 +0000</pubDate>
		<dc:creator>Permana</dc:creator>
		
		<category><![CDATA[Webtool]]></category>

		<category><![CDATA[Inspirasi]]></category>

		<category><![CDATA[Koleksi]]></category>

		<category><![CDATA[Warna]]></category>

		<guid isPermaLink="false">http://majalahweb.com/?p=10</guid>
		<description><![CDATA[Warna adalah elemen terpenting dari sebuah desain. Dalam mendesain halaman web. pemilihan warna harus dilakukan hati-hati agar bisa menghasilkan desain akhir yang menarik. Inspirasi warna bisa didapat dari manapun. Salah satunya dengan menggunakan tools yang ada di internet. Ada yang berbasiskan aplikasi desktop dan ada juga yang berbasiskan website. Untuk lebih mempermudah dalam mencari inspirasi [...]]]></description>
			<content:encoded><![CDATA[<p>Warna adalah elemen terpenting dari sebuah desain. Dalam mendesain halaman web. pemilihan warna harus dilakukan hati-hati agar bisa menghasilkan desain akhir yang menarik. Inspirasi warna bisa didapat dari manapun. Salah satunya dengan menggunakan tools yang ada di internet. Ada yang berbasiskan aplikasi desktop dan ada juga yang berbasiskan website. Untuk lebih mempermudah dalam mencari inspirasi warna, kami persembahkan daftar website penghasil warna dimana inspirasi warna bisa didapat.</p>
<p><a title="Well styled color scheme" rel="nofollow" href="http://www.wellstyled.com/tools/colorscheme2/index-en.html" target="_blank">Well styled color scheme</a><br />
Menghasilkan skema dan palet warna dari satu warna dasar. Tersedia banyak mode skema warna.</p>
<p><img src="http://i264.photobucket.com/albums/ii162/mypermana/blog/ws-color-scheme.png" alt="Well styled color scheme" /></p>
<p><span id="more-10"></span></p>
<p><a title="Color schemer online" rel="nofollow" href="http://www.colorschemer.com/online.html" target="_blank">Color schemer online v2</a><br />
Membantu menghasilkan skema warna dari sebuah warna dasar. Pilih satu warna dasar kemudian Color schemer online v2 akan menghasilkan warna-warna lain yang cocok untuk dipadukan.</p>
<p><img src="http://i264.photobucket.com/albums/ii162/mypermana/blog/color-schemer-gallery.png" alt="Color schemer online v2" /></p>
<p><a title="Color Blender" rel="nofollow" href="http://meyerweb.com/eric/tools/color-blend/" target="_blank">Color blender</a><br />
Menghasilkan skema warna dari campuran 2 warna dasar.</p>
<p><img src="http://i264.photobucket.com/albums/ii162/mypermana/blog/meyerweb_com_eric_tools_color-blend.png" alt="Color blender" /></p>
<p><a title="Color combo" rel="nofollow" href="http://www.colorcombos.com/combotester.html" target="_blank">Color combo</a><br />
Memilih secara manual warna-warna dan menampilkannya di palet. Warna hasil kombinasi bisa dibagi-pakai dengan sebuah link.</p>
<p><img src="http://i264.photobucket.com/albums/ii162/mypermana/blog/www_colorcombos_com_combotester_htm.png" alt="Color combo" /></p>
<p><a title="Color from images" rel="nofollow" href="http://www.colr.org/" target="_blank">Color from images</a><br />
Website ini bisa menampilkan warna yang dipakai sebuah gambar dan menghasilkan skema warna dari gambar tersebut.</p>
<p><img src="http://i264.photobucket.com/albums/ii162/mypermana/blog/color-from-images.png" alt="Color from images" /></p>
<p><a title="Pic2Color" rel="nofollow" href="http://www.pic2color.com/" target="_blank">Pic2Color</a><br />
Webtool yang juga menghasilkan skema warna dari sebuah gambar. Bahkan webtool yang satu ini mampu untuk mengaplikasikan skema warna suatu gambar ke gambar yang lain.</p>
<p><img title="Pic2Color" src="http://i264.photobucket.com/albums/ii162/mypermana/blog/pic2color.jpg" alt="Pic2Color" width="291" height="403" /></p>
<p><a title="4096 color wheel" rel="nofollow" href="http://ficml.org/jemimap/style/color/wheel.html" target="_blank">4096 color wheel</a><br />
Setelah memilih warna, maka 4096 color wheel akan memberi warna versi web-safe, web-smart, dan unsafe.</p>
<p><img src="http://i264.photobucket.com/albums/ii162/mypermana/blog/4096-color-wheel.jpg" alt="4096 color wheel" /></p>
<p><a title="Kuler" rel="nofollow" href="http://kuler.adobe.com" target="_blank">Kuler</a><br />
Webtool penghasil warna dari Adobe ini menggunakan teknologi flash. Selain bisa dicoba langsung di websitenya, kuler juga bisa digunakan di desktop. Tentunya komputer anda harus terinstal Adobe AIR terlebih dahulu.</p>
<p><img src="http://i264.photobucket.com/albums/ii162/mypermana/blog/kuler.png" alt="Kuler from Adobe" width="394" height="254" /></p>
<h3>Beberapa webtool lainnya</h3>
<p>Jika kurang, masih ada beberapa website sumber inspirasi warna yang lain :</p>
<p><a title="ColorPicker 3.1" rel="nofollow" href="http://www.pagetutor.com/colorpicker/index.html" target="_blank">PageTutor color picker 3.1</a><br />
Menampilkan warna-warna standar berikut dengan preview-nya.</p>
<p><a title="Unsafe color match" rel="nofollow" href="http://www.neteffect.dk/colormatch/" target="_blank">Unsafe color match</a><br />
Memilih warna dengan langsung melihat preview jika warna tersebut digunakan di halaman web.</p>
]]></content:encoded>
			<wfw:commentRss>http://majalahweb.com/webtool-inspirasi-warna/feed/</wfw:commentRss>
		</item>
		<item>
		<title>Telah terbit majalah web dalam format web</title>
		<link>http://majalahweb.com/telah-terbit-majalah-web-dalam-format-web/</link>
		<comments>http://majalahweb.com/telah-terbit-majalah-web-dalam-format-web/#comments</comments>
		<pubDate>Wed, 20 Aug 2008 07:45:14 +0000</pubDate>
		<dc:creator>Permana</dc:creator>
		
		<category><![CDATA[Pengumuman]]></category>

		<category><![CDATA[Informasi]]></category>

		<guid isPermaLink="false">http://majalahweb.com/?p=3</guid>
		<description><![CDATA[Telah terbit majalah yang mengulas berbagai hal seputar web dalam format weblog. Untuk sementara, belum ada tulisan yang bisa dibaca karena masih tahap setting blog.
Nantinya, blog ini akan berisi tulisan-tulisan yang membahas segala hal yang berhubungan dengan web. Mulai dari desain, kode, hingga hal-hal yang berbau server.
]]></description>
			<content:encoded><![CDATA[<p>Telah terbit majalah yang mengulas berbagai hal seputar web dalam format weblog. Untuk sementara, belum ada tulisan yang bisa dibaca karena masih tahap setting blog.</p>
<p>Nantinya, blog ini akan berisi tulisan-tulisan yang membahas segala hal yang berhubungan dengan web. Mulai dari desain, kode, hingga hal-hal yang berbau server.</p>
]]></content:encoded>
			<wfw:commentRss>http://majalahweb.com/telah-terbit-majalah-web-dalam-format-web/feed/</wfw:commentRss>
		</item>
	</channel>
</rss>
