tag:blogger.com,1999:blog-41559378081427565072024-03-05T17:15:02.018-08:00teknik komputerAnak Bangsawanhttp://www.blogger.com/profile/09063631266573210417noreply@blogger.comBlogger158125tag:blogger.com,1999:blog-4155937808142756507.post-81825372668287053452012-04-04T07:49:00.003-07:002012-04-04T07:49:37.222-07:00Update cara menginstal phpMyAdmin versi 3.4.10.1<span class="Apple-style-span" style="background-color: #fafcfc; color: #333333; font-family: verdana, geneva, arial, helvetica, sans-serif; font-size: 12px; line-height: 16px;"></span><br />
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Download phpMyAdmin dari link yang ada di <a href="http://htmlcssguides.com/cara-menginstal-phpmyadmin" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;" title="Cara Menginstal phpMyAdmin">Cara Menginstal phpMyAdmin</a>. Sebelum menginstal pastikan versi PHP yang terinstal adalah <a href="http://localhost/cara-menginstal-php" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;" title="Cara Mengistal PHP">PHP 5.2</a> atau diatasnya dan MySQL minimum <a href="http://localhost/cara-menginstal-mysql" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;" title="Cara Menginstal MySQL">MySQL 5.0</a>.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Setelah selesai di download ekstrak file tersebut ke root server sehingga semua filenya akan berada di folder "D:\My Websites\phpMyAdmin\".</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Selanjutnya buka Notepad kemudian salin kode berikut.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<strong style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">File Pengaturan phpMyAdmin</strong></div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;"><?php /* vim: set expandtab sw=4 ts=4 sts=4: */ /** * phpMyAdmin sample configuration, you can use it as base for * manual configuration. For easier setup you can use setup/ * * All directives are explained in Documentation.html and on phpMyAdmin * wiki <http://wiki.phpmyadmin.net>. * * @package phpMyAdmin */ /* * This is needed for cookie based authentication to encrypt password in * cookie */ $cfg['blowfish_secret'] = ''; /* YOU MUST FILL IN THIS FOR COOKIE AUTH! */ /* * Servers configuration */ $i = 0; /* * First server */ $i++; /* Authentication type */ $cfg['Servers'][$i]['user'] = 'root'; $cfg['Servers'][$i]['password'] = 'xxx'; //isikan dengan MySql Password $cfg['Servers'][$i]['auth_type'] = 'config'; /* Server parameters */ $cfg['Servers'][$i]['host'] = 'localhost'; $cfg['Servers'][$i]['connect_type'] = 'tcp'; $cfg['Servers'][$i]['compress'] = false; /* Select mysql if your server does not have mysqli */ $cfg['Servers'][$i]['extension'] = 'mysqli'; $cfg['Servers'][$i]['AllowNoPassword'] = false; /* * phpMyAdmin configuration storage settings. */ /* User used to manipulate with storage */ $cfg['Servers'][$i]['controluser'] = 'root'; $cfg['Servers'][$i]['controlpass'] = 'xxx'; //isikan dengan MySql Password /* Storage database and tables */ $cfg['Servers'][$i]['pmadb'] = 'phpmyadmin'; $cfg['Servers'][$i]['bookmarktable'] = 'pma_bookmark'; $cfg['Servers'][$i]['relation'] = 'pma_relation'; $cfg['Servers'][$i]['table_info'] = 'pma_table_info'; $cfg['Servers'][$i]['table_coords'] = 'pma_table_coords'; $cfg['Servers'][$i]['pdf_pages'] = 'pma_pdf_pages'; $cfg['Servers'][$i]['column_info'] = 'pma_column_info'; $cfg['Servers'][$i]['history'] = 'pma_history'; $cfg['Servers'][$i]['tracking'] = 'pma_tracking'; $cfg['Servers'][$i]['designer_coords'] = 'pma_designer_coords'; $cfg['Servers'][$i]['userconfig'] = 'pma_userconfig'; /* Contrib / Swekey authentication */ $cfg['Servers'][$i]['auth_swekey_config'] = '/etc/swekey-pma.conf'; /* * End of servers configuration */ /* * Directories for saving/loading files from server */ $cfg['UploadDir'] = ''; $cfg['SaveDir'] = ''; /** * Defines whether a user should be displayed a "show all (records)" * button in browse mode or not. * default = false */ //$cfg['ShowAll'] = true; /** * Number of rows displayed when browsing a result set. If the result * set contains more rows, "Previous" and "Next". * default = 30 */ //$cfg['MaxRows'] = 50; /** * Use graphically less intense menu tabs * default = false */ //$cfg['LightTabs'] = true; /** * disallow editing of binary fields * valid values are: * false allow editing * 'blob' allow editing except for BLOB fields * 'all' disallow editing * default = blob */ //$cfg['ProtectBinary'] = 'false'; /** * Default language to use, if not browser-defined or user-defined * (you find all languages in the locale folder) * uncomment the desired line: * default = 'en' */ //$cfg['DefaultLang'] = 'en'; //$cfg['DefaultLang'] = 'de'; /** * default display direction (horizontal|vertical|horizontalflipped) */ //$cfg['DefaultDisplay'] = 'vertical'; /** * How many columns should be used for table display of a database? * (a value larger than 1 results in some information being hidden) * default = 1 */ //$cfg['PropertiesNumColumns'] = 2; /** * Set to true if you want DB-based query history.If false, this utilizes * JS-routines to display query history (lost by window close) * * This requires configuration storage enabled, see above. * default = false */ //$cfg['QueryHistoryDB'] = true; /** * When using DB-based query history, how many entries should be kept? * * default = 25 */ //$cfg['QueryHistoryMax'] = 100; /* * You can find more configuration options in Documentation.html * or here: http://wiki.phpmyadmin.net/pma/Config */ ?></code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Kode diatas adalah dari file "config.sample.inc.php" yang ada dalam folder phpMyAdmin jadi anda bisa membandingkan apa-apa saja yang di ubah didalamnya.</div>
<a name='more'></a><br />
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Setelah mengisikan MySQL password simpan file tersebut ke "D:\My Websites\phpMyAdmin\" dengan nama "config.inc.php"</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<strong style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Testing phpMyAdmin</strong></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Buka browser kemudian di address bar ketikkan "http://localhost/phpmyadmin" atau "localhost/phpmyadmin". Maka jika tidak ada problem akan tampil seperti berikut.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="phpMyAdmin-instal.png" class="center" height="400" src="http://htmlcssguides.com/images/phpmyadmin-instal.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="500" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Pada bagian bawah mungkin akan ada pemberitahuan atau peringatan bahwa beberapa fungsi telah dinonaktifkan karena pengaturan yang kurang sempurna.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="phpMyAdmin warning" class="center" height="48" src="http://htmlcssguides.com/images/phpmyadmin-warning.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="500" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Ini terjadi karena belum adanya database untuk penyimpanan data dan informasi. Untuk membuat database ini kita akan mengimpornya dari "D:\My Websites\phpMyAdmin\scripts\create_tables.sql" dengan menggunakan phpMyAdmin.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<strong style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Membuat phpMyAdmin database</strong></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Di dalam jendela phpMyAdmin dari menu paling atas pilih atau klik Import.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="Import SQL" class="center" height="168" src="http://htmlcssguides.com/images/import-sql.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="500" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Dari File to import klik browse tujukan ke "D:\My Websites\phpMyAdmin\scripts\create_tables.sql"</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="phpMyAdmin SQL" class="center" height="150" src="http://htmlcssguides.com/images/phpmyadmin-sql.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="500" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Kemudian klik "Go". Tunggu beberapa saat hingga prosesnya selesai.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Jika berhasil dengan baik maka akan ada database baru dengan nama phpmyadmin dan pemberitahuan yang menyatakan bahwa pengimporan telah berhasil.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="phpMyAdmin Sukses" class="center" height="236" src="http://htmlcssguides.com/images/phpmyadmin-sukses.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="500" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Refresh browser untuk melihat hasilnya.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<strong style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Mengaktifkan phpMyAdmin Log In/Log Out</strong></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Jika ingin memasukkan user dan password setiap saat masuk ke phpmyadmin maka kita harus mengisi blowfish_secret pada file pengaturan phpMyAdmin (config.inc.php):</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;">$cfg['blowfish_secret'] = ''; /* isikan dengan sembarang */</code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Hapus dua baris berikut ini:</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;">$cfg['Servers'][$i]['user'] = 'root'; $cfg['Servers'][$i]['password'] = 'xxx'; //isikan dengan MySql Password</code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Kemudian untuk Authentication type diubah dari config menjadi cookie.</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;">$cfg['Servers'][$i]['auth_type'] = 'cookie';</code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Selamat bereksperimen.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
@HTMLSCCGuides.com</div>Anak Bangsawanhttp://www.blogger.com/profile/09063631266573210417noreply@blogger.com0tag:blogger.com,1999:blog-4155937808142756507.post-70276557753242811962012-04-04T07:48:00.000-07:002012-04-04T07:48:20.817-07:00Cara menginstal phpMyAdmin<span class="Apple-style-span" style="background-color: #fafcfc; color: #333333; font-family: verdana, geneva, arial, helvetica, sans-serif; font-size: 12px; line-height: 16px;"></span><br />
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Klik link berikut untuk mendownload phpMyAdmin <a href="http://www.phpmyadmin.net/" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">http://www.phpMyAdmin.net</a></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="phpmyadmin download" class="center" height="209" src="http://htmlcssguides.com/images/phpmyadmin_download.jpg" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="513" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Klik download, kemudian pilih tipe file, dalam hal ini kita akan memilih “all-language-zip” agar bisa menggunakan Bahasa Ibu kita.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="choose download" class="center" height="308" src="http://htmlcssguides.com/images/phpmyadmin_choose_download.jpg" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="512" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Setelah filenya selesai kita download, dengan menggunakan Winzip atau Winnar ekstrak file tersebut ke dalam folder “documentroot” atau “D:\My Websites” yang telah kita buat sebelumnya, sehingga nanti file-file tersebut akan berada di folder “D:\My Websites\phpMyAdmin-2.11.5.2-all-languages”</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Seperti kita lihat nama folder tersebut terlalu panjang dan rumit, jadi agar lebih simpel dan gampang diingat ganti nama folder tersebut menjadi phpMyAdmin, sehingga akan menjadi “D:\My Websites\phpMyAdmin.”</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Update untuk <a href="http://localhost/update-cara-menginstal-phpmyadmin-versi-3-4-10-1" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;" title="Update cara menginstal phpMyAdmin versi 3.4.10.1">phpMyAdmin versi 3.4.10.1</a></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Buka Notepad salin code berikut:</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;"><?php /* vim: set expandtab sw=4 ts=4 sts=4: */ /** * phpMyAdmin sample configuration, you can use it as base for * manual configuration. For easier setup you can use scripts/setup.php * * All directives are explained in Documentation.html and on phpMyAdmin * wiki <http://wiki.cihar.com>. * * @version $Id: config.sample.inc.php 10142 2007-03-20 10:32:13Z cybot_tm $ */ /* * This is needed for cookie based authentication to encrypt password in * cookie */ $cfg['blowfish_secret'] = ''; /* YOU MUST FILL IN THIS FOR COOKIE AUTH! */ /* * Servers configuration */ $i = 0; /* * First server */ $i++; $cfg['Servers'][$i]['user'] = 'root'; $cfg['Servers'][$i]['password'] = 'xxx'; // Ganti xxx dengan MySQL Password /* Authentication type */ $cfg['Servers'][$i]['auth_type'] = 'config'; /* Server parameters */ $cfg['Servers'][$i]['host'] = 'localhost'; $cfg['Servers'][$i]['connect_type'] = 'tcp'; $cfg['Servers'][$i]['compress'] = false; /* Select mysqli if your server has it */ $cfg['Servers'][$i]['extension'] = 'mysql'; /* User for advanced features */ $cfg['Servers'][$i]['controluser'] = 'root'; $cfg['Servers'][$i]['controlpass'] = 'xxx'; // Ganti xxx dengan MySQL Password /* Advanced phpMyAdmin features */ $cfg['Servers'][$i]['pmadb'] = 'phpmyadmin'; $cfg['Servers'][$i]['bookmarktable'] = 'pma_bookmark'; $cfg['Servers'][$i]['relation'] = 'pma_relation'; $cfg['Servers'][$i]['table_info'] = 'pma_table_info'; $cfg['Servers'][$i]['table_coords'] = 'pma_table_coords'; $cfg['Servers'][$i]['pdf_pages'] = 'pma_pdf_pages'; $cfg['Servers'][$i]['column_info'] = 'pma_column_info'; $cfg['Servers'][$i]['history'] = 'pma_history'; $cfg['Servers'][$i]['designer_coords'] = 'pma_designer_coords'; /* * End of servers configuration */ /* * Directories for saving/loading files from server */ $cfg['UploadDir'] = ''; $cfg['SaveDir'] = ''; ?></code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Setelah mengisikan password MySQL, simpan file tersebut ke folder “phpMyAdmin” atau ke “D:\My Websites\phpMyAdmin” dengan nama “config.inc.php”</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Selanjutnya buka file pengaturan php.ini (C:\Apache\php\php.ini),</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Di bawah Dynamic Extensions cari kedua extension berikut ini:</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;">;extension=php_mbstring.dll ;extension=php_mcrypt.dll</code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Hilangkan titik koma “;” yang berada di depannya untuk mengaktifkan:</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;">extension=php_mbstring.dll extension=php_mcrypt.dll</code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Simpan file tersebut kemudian restart server.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Sekarang buka browser ketik “http://localhost/phpMyAdmin” di address bar, dan Enter.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="Instal phpMyAdmin berhasil" class="center" height="350" src="http://htmlcssguides.com/images/instal-phpmyadmin-berhasil.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="500" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<br /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
@ HTMLSCCGuides.com</div>Anak Bangsawanhttp://www.blogger.com/profile/09063631266573210417noreply@blogger.com0tag:blogger.com,1999:blog-4155937808142756507.post-78696036712241729952012-04-04T07:45:00.001-07:002012-04-04T07:45:45.396-07:00Tabel (table) HTML<span class="Apple-style-span" style="background-color: #fafcfc; color: #333333; font-family: verdana, geneva, arial, helvetica, sans-serif; font-size: 12px; line-height: 16px;"></span><br />
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<strong style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Sekilas tentang tabel.</strong></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Tabel (table) sangat diperlukan ketika kita ingin menampilkan data yang berbentuk kolom-kolom. Dulu sebelum adanya CSS, table digunakan untuk membuat layout website namun saat ini sudah jarang dipakai sebagai layout karena faktor file yang cenderung lebih besar sehingga mempengaruhi waktu akses yang lebih lama, dalam pengelolaan dan pengeditan pun jauh lebih rumit karena banyaknya tag-tag yang dihasilkan.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<strong style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Cara membuat tabel.</strong></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Untuk membuat table yang sederhana ada 3 elemen utama yaitu <strong style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">table</strong>, <strong style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">tr</strong> dan <strong style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">td</strong>. Tag <table> adalah untuk membuat tabel kemudian di ikuti dengan tag <tr> (table rows) adalah untuk membuat baris pada tabel kemudian tag <td> (table data) adalah untuk membuat kolom pada tabel, kolom-kolom hasil dari tr dan td ini disebut dengan <strong style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">table cell</strong> yaitu sebagai lokasi dimana kita memasukkan data-data yang akan di tampilkan.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Berikut adalah contoh tabel yang terdiri dari 3 baris dan 2 kolom.</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;"><table border="1"> <tr> <td>Cell 1 - Baris 1 Kolom 1</td> <td>Cell 2 - Baris 1 Kolom 2</td> </tr> <tr> <td>Cell 3 - Baris 2 Kolom 1</td> <td>Cell 4 - Baris 2 Kolom 2</td> </tr> <tr> <td>Cell 5 - Baris 3 Kolom 1</td> <td>Cell 6 - Baris 3 Kolom 2</td> </tr> </table></code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Hasil:</div>
<table border="1" style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;"><tbody style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<tr style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;"><td style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Cell 1 – Baris 1 Kolom 1</td><td style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Cell 2 – Baris 1 Kolom 2</td></tr>
<tr style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;"><td style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Cell 3 – Baris 2 Kolom 1</td><td style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Cell 4 – Baris 2 Kolom 2</td></tr>
<tr style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;"><td style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Cell 5 – Baris 3 Kolom 1</td><td style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Cell 6 – Baris 3 Kolom 2</td></tr>
</tbody></table>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
</div>
<a name='more'></a>Dalam contoh sengaja ditambah dengan atribut border agar kita dapat melihat posisi dari tabel tersebut, karena secara default nilai dari border ini adalah 0 jika tidak disertakan dengan tag <table>.<br />
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<strong style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Mengatur lebar dan tinggi tabel.</strong></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Untuk mengatur lebar table digunakan atribut width atau bisa juga dengan style CSS dengan properti width. Untuk lebar dan tinggi dari td kita gunakan atribut style dengan properti width dan height.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Berikut adalah contoh tabel dengan lebar 75% dari lebar dokumen dan lebar kolom masing 50% dengan tinggi pada baris pertama adalah 40px.</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;"><table border="1" width="75%"> <tr> <td style="width:50%;height:40px;">Baris 1 Kolom 1</td> <td>Baris 1 Kolom 1</td> </tr> <tr> <td>Baris 2 Kolom 1</td> <td>Baris 2 Kolom 2</td> </tr> <tr> <td>Baris 3 Kolom 1</td> <td>Baris 3 Kolom 2</td> </tr> </table></code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Hasil:</div>
<table border="1" style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;"><tbody style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<tr style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;"><td style="height: 40px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; width: 198px;">Baris 1 Kolom 1</td><td style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Baris 1 Kolom 1</td></tr>
<tr style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;"><td style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Baris 2 Kolom 1</td><td style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Baris 2 Kolom 2</td></tr>
<tr style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;"><td style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Baris 3 Kolom 1</td><td style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Baris 3 Kolom 2</td></tr>
</tbody></table>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Untuk satuan ukuran widht dan height dari atribut maupun style tersebut kita dapat menggunakan px atau %. Untuk pengaturan lebar dan tinggi pada td kita cukup memasukkan pada kolom pertama secara otomatis kolom-kolom berikutnya akan mengikuti pengaturan tersebut.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<strong style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Menggabungkan kolom pada tabel</strong></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Table Cell atau baris dan kolom dari tabel tersebut dapat kita gabungkan sesuai kebutuhan bentuk tabel yang diinginkan.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Untuk menggabungkan kolom dalam tabel digunakan atribut <strong style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">colspan</strong>.</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;"><table border="1" width="75%"> <tr> <td colspan="2">Gabungan Kolom 1&amp;2 pada Baris 1</td> </tr> <tr> <td style="width:50%">Baris 2 Kolom 1</td> <td>Baris 2 Kolom 2</td> </tr> <tr> <td>Baris 3 Kolom 1</td> <td>Baris 3 Kolom 2</td> </tr> </table></code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Hasil:</div>
<table border="1" style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;"><tbody style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<tr style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;"><td colspan="2" style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Gabungan Kolom 1&2 pada Baris 1</td></tr>
<tr style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;"><td style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Baris 2 Kolom 1</td><td style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Baris 2 Kolom 2</td></tr>
<tr style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;"><td style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Baris 3 Kolom 1</td><td style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Baris 3 Kolom 2</td></tr>
</tbody></table>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Sedangkan untuk menggabungkan baris dalam tabel digunakan atribut <strong style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">rowspan</strong>.</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;"><table border="1" width="75%"> <tr> <td style="width:50%" rowspan="2">Gabungan Baris 1&amp;2 pada Kolom 1</td> <td>Baris 1 Kolom 2</td> </tr> <tr> <td>Baris 2 Kolom 2</td> </tr> <tr> <td>Baris 3 Kolom 1</td> <td>Baris 3 Kolom 2</td> </tr> </table></code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Hasil:</div>
<table border="1" style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;"><tbody style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<tr style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;"><td rowspan="2" style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; width: 198px;">Gabungan Baris 1&2 pada Kolom 1</td><td style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Baris 1 Kolom 2</td></tr>
<tr style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;"><td style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Baris 2 Kolom 2</td></tr>
<tr style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;"><td style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Baris 3 Kolom 1</td><td style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Baris 3 Kolom 2</td></tr>
</tbody></table>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<strong style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Mengatur jarak kolom pada tabel</strong></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Untuk mengatur posisi cell dalam tabel digunakan atribut cellpadding dan cellspacing.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<strong style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Cellpadding</strong> adalah untuk pengaturan sisi dari bagian dalam cell.</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;"><table border="1" width="75%" cellpadding="8"> <tr> <td style="width:50%;">Baris 1 Kolom 1</td> <td>Baris 1 Kolom 2</td> </tr> <tr> <td>Baris 2 Kolom 1</td> <td>Baris 2 Kolom 2</td> </tr> </table></code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Hasil:</div>
<table border="1" style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;"><tbody style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<tr style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;"><td style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 4px; padding-left: 4px; padding-right: 4px; padding-top: 4px; width: 190px;">Baris 1 Kolom 1</td><td style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 4px; padding-left: 4px; padding-right: 4px; padding-top: 4px;">Baris 1 Kolom 2</td></tr>
<tr style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;"><td style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 4px; padding-left: 4px; padding-right: 4px; padding-top: 4px;">Baris 2 Kolom 1</td><td style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 4px; padding-left: 4px; padding-right: 4px; padding-top: 4px;">Baris 2 Kolom 2</td></tr>
</tbody></table>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Sedangkan <strong style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Cellspacing</strong> adalah pengaturan sisi dari bagian luar cell.</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;"><table border="1" width="75%" cellspacing="8"> <tr> <td style="width:50%">Baris 1 Kolom 1</td> <td>Baris 1 Kolom 2</td> </tr> <tr> <td>Baris 2 Kolom 1</td> <td>Baris 2 Kolom 2</td> </tr> </table></code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Hasil:</div>
<table border="1" cellspacing="8" style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;"><tbody style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<tr style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;"><td style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; width: 189px;">Baris 1 Kolom 1</td><td style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Baris 1 Kolom 2</td></tr>
<tr style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;"><td style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Baris 2 Kolom 1</td><td style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Baris 2 Kolom 2</td></tr>
</tbody></table>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<strong style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Membuat titel pada tabel.</strong></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Untuk tabel yang lengkap dengan titel, kita bisa menambahkan tag <strong style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;"><caption></strong> tepat setelah tag <table> dan kita juga bisa mengganti td dengan <strong style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">th (table heading)</strong>sebagai titel dari baris maupun kolom.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Caption dan th akan secara otomatis berada pada posisi tengah dan th akan menghasilkan tulisan tebal.</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;"><table border="1" width="75%"> <caption>Disini adalah titel tabel ini</caption> <tr> <th style="width:50%;">Header Kolom 1</th> <th>Header Kolom 2</th> </tr> <tr> <td>Baris 1 Kolom 1</td> <td>Baris 1 Kolom 2</td> </tr> <tr> <td>Baris 2 Kolom 1</td> <td>Baris 2 Kolom 2</td> </tr> </table></code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Hasil:</div>
<table border="1" style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;"><caption style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Disini adalah titel tabel ini</caption><tbody style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<tr style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;"><th style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-align: center; width: 198px;">Header Kolom 1</th><th style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-align: center;">Header Kolom 2</th></tr>
<tr style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;"><td style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Baris 1 Kolom 1</td><td style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Baris 1 Kolom 2</td></tr>
<tr style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;"><td style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Baris 2 Kolom 1</td><td style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Baris 2 Kolom 2</td></tr>
</tbody></table>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<strong style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Membuat background pada tabel</strong></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Untuk membuat background pada tabel kita gunakan atribut style dengan properti background.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Berikut adalah contoh table dengan background warna kuning muda dengan heading warna merah.</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;"><table style="background:#ffc" width="75%" border="1"> <tr> <th style="background:red;width:50%;">Header Kolom 1</th> <th style="background:red;">Header Kolom 2</th> </tr> <tr> <td>Baris 1 Kolom 1</td> <td>Baris 1 Kolom 2</td> </tr> <tr> <td>Baris 2 Kolom 1</td> <td>Baris 2 Kolom 2</td> </tr> </table></code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Hasil:</div>
<table border="1" style="background-attachment: initial; background-clip: initial; background-color: #ffffcc; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;"><tbody style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<tr style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;"><th style="background-attachment: initial; background-clip: initial; background-color: red; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-align: center; width: 198px;">Header Kolom 1</th><th style="background-attachment: initial; background-clip: initial; background-color: red; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-align: center;">Header Kolom 2</th></tr>
<tr style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;"><td style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Baris 1 Kolom 1</td><td style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Baris 1 Kolom 2</td></tr>
<tr style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;"><td style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Baris 2 Kolom 1</td><td style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Baris 2 Kolom 2</td></tr>
</tbody></table>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Seperti kita lihat bahwa border dari cell tersebut terlihat terlalu tebal padahal kita membuat nilai dari atribut border adalah 1px.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Ini terjadi karena secara default atribut cellpadding dan cellspacing pada elemen table memiliki nilai masing-masing 1px.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Jadi untuk menghilangkannya kita harus memasukkan kedua atribut tersebut dengan nilai 0.</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;"><table cellpadding="0" cellspacing="0" style="background:#ffc" width="75%" border="1"> ... </table></code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Atau kita juga bisa menggunakan style CSS yaitu dengan properti border-collapse:collapse.</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;"><table style="border-collapse:collapse;background:#ffc" width="75%" border="1"> <tr> <th style="background:red;width:50%;">Header Kolom 1</th> <th style="background:red;">Header Kolom 2</th> </tr> <tr> <td>Baris 1 Kolom 1</td> <td>Baris 1 Kolom 2</td> </tr> <tr> <td>Baris 2 Kolom 1</td> <td>Baris 2 Kolom 2</td> </tr> </table></code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Hasil:</div>
<table border="1" style="background-attachment: initial; background-clip: initial; background-color: #ffffcc; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-collapse: collapse; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;"><tbody style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<tr style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;"><th style="background-attachment: initial; background-clip: initial; background-color: red; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-align: center; width: 203px;">Header Kolom 1</th><th style="background-attachment: initial; background-clip: initial; background-color: red; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-align: center;">Header Kolom 2</th></tr>
<tr style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;"><td style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Baris 1 Kolom 1</td><td style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Baris 1 Kolom 2</td></tr>
<tr style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;"><td style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Baris 2 Kolom 1</td><td style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Baris 2 Kolom 2</td></tr>
</tbody></table>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Pada link berikut ini kita akan membuat <a href="http://htmlcssguides.com/samples/contoh-table-dengan-css.php" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;" title="Contoh tabel dengan CSS">contoh tabel dengan CSS</a> baik itu dengan atribut style (inline) maupun internal dan eksternal CSS.</div>
<div>
@ HTMLSCCGuides.com</div>Anak Bangsawanhttp://www.blogger.com/profile/09063631266573210417noreply@blogger.com0tag:blogger.com,1999:blog-4155937808142756507.post-30692453624407184092012-04-04T07:43:00.000-07:002012-04-04T07:43:03.609-07:00Cara menginstal PHP 5.3.6<span class="Apple-style-span" style="background-color: #fafcfc; color: #333333; font-family: verdana, geneva, arial, helvetica, sans-serif; font-size: 12px; line-height: 16px;"></span><br />
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Untuk menginstal PHP sebelumnya anda harus sudah menginstal <a href="http://htmlcssguides.com/cara-menginstal-apache-server" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">Apache Server</a> dan pastikan sudah berjalan dengan baik.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Klik link berikut untuk mendownload php: <a href="http://windows.php.net/download/" rel="nofollow" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">http://windows.php.net/download</a> untuk php versi yang lama dapat di download di php <a href="http://windows.php.net/downloads/releases/archives/" rel="nofollow" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">archives</a> atau <a href="http://museum.php.net/php5/" rel="nofollow" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">museumnya</a> php.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
PHP ada 2 kompilasi yang dikeluarkan yaitu VC6 (Visual C++ 6.0) dan VC9 (Visual Studio C++ 2008).</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Untuk Apache.org binary, dianjurkan untuk menggunakan yang VC6 sedangkan VC9 adalah untuk IIS server.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Ketika mendownload pilih yang versi Zip dengan Thread Safe.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Jika ingin menggunakan PHP yang VC9 maka Apachenya harus di update terlebih dahulu. Ikuti link berikut untuk mengetahui bagaimana <a href="http://htmlcssguides.com/upgrade-apache-2-2-19-untuk-php-vc9" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;" title="Upgrade Apache 2.2.19 untuk PHP VC9">cara upgrade Apache untuk PHP yang VC9.</a></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Setelah mendapatkan versi php yang anda inginkan, buat sebuah folder di “C:\Apache” dengan nama “php” sehingga menjadi C:\Apache\php, kemudian dengan menggunakan winzip atau winnar ekstrak file yang telah kita download ke dalam folder tersebut.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Kemudian di dalam folder php cari file “php.ini-dist” untuk PHP versi 5.3.+ gunakan “php.ini-production” karena pengaturan tersebut merupakan pengaturan standar, baik untuk kecepatan maupun keamanan.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Ganti namanya menjadi “php.ini” double klik untuk membuka file tersebut dan cari baris seperti berikut:</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;">doc_root =</code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
supaya lebih cepat, di menu notepad klik “edit” kemudian “find” masukkan “doc_root” klik find. Kemudian masukkan folder website yang telah kita buat sebelumnya sehingga menjadi:</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;">doc_root ="D:\My Websites"</code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Kemudian cari baris berikutnya:</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;">; extension_dir = "ext"</code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Isikan sehingga menjadi:</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;">extension_dir = "C:\Apache\php\ext"</code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Agar PHP terhubung dengan server maka kita harus mengedit file configurasi Apache Server yang berada di “C:\Apache\conf\httpd.conf” buka file tersebut kemudian cari baris seperti dibawah ini:</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;"><IfModule dir_module> DirectoryIndex index.html </IfModule></code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Tambahkan index.php dengan dibatasi oleh sebuah spasi sehingga menjadi:</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;"><IfModule dir_module> DirectoryIndex index.html index.php </IfModule></code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="PHP Directory" class="center" height="164" src="http://htmlcssguides.com/images/php-directory.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="500" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Kemudian tambahkan yang berikut ini diantara <IfModule mime_module> dan </IfModule>, sehingga menjadi seperti pada gambar dibawah:</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;">ScriptAlias /php/ "C:/Apache/php/" AddType application/x-httpd-php .php .php5 Action application/x-httpd-php "/php/php-cgi.exe" SetEnv PHPRC "C:/Apache/php"</code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="PHP Module 01" class="center" height="200" src="http://htmlcssguides.com/images/php-module-01.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="500" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Diakhir dari file httpd.conf tersebut tambahkan yang berikut ini:</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;">PHPIniDir "C:/Apache/php/" LoadModule php5_module "C:/Apache/php/php5apache2_2.dll"</code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="PHP Module 02" class="center" height="147" src="http://htmlcssguides.com/images/php-module-02.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="500" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Simpan file tersebut, kemudian Restart server.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Agar Windows dapat mengetahui lokasi file system dan konfigurasi dari PHP maka kita harus menambahkan lokasi dari directory PHP tersebut.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Sebenarnya kita bisa saja memindahkan file 2x tersebut ke folder Windows atau System32, tapi tentu akan jadi rumit ketika kita ingin meng-upgrade php tersebut yang ujung-ujungnya malah system Windows kita yang rusak.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Jadi jalan terbaiknya adalah dengan memasukkan path atau lokasi php kita ke System Windows. Caranya? ikuti langkah-langkah berikut:</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Buka “System Properties” dengan cara mengklik kanan “My Computer” pilih “Properties”</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="PHP System Path 01" class="center" height="486" src="http://htmlcssguides.com/images/php-system-path-01.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="420" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Kemudian pilih tab “Advanced” kemudian klik “Environment Variables”</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="PHP System Path 021" class="center" height="430" src="http://htmlcssguides.com/images/php-system-path-02.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="384" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Di dalam “System Variables” cari variable yang bernama “Path” klik edit atau double klik untuk mengedit.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="PHP System Path 03" class="center" height="147" src="http://htmlcssguides.com/images/php-system-path-03.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="347" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Setelah Edit System Variable terbuka di dalam “Variable value” tambahkan “C:\Apache\php” dengan dibatasi oleh tanda titik koma “;” klik OK.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Secara standart PHP akan menggunakan System Temp sebagai temporary folder. Saya pernah mengalami script yang tidak bekerja setelah saya mengosongkan Windows Temp folder. Jadi agar hal ini tidak terjadi kita akan membuat temporary folder di dalam folder Apache.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Pertama buat sebuah folder di “C:\Apache” dengan nama “temp” di dalam folder “temp” tersebut buat dua buah folder dengan nama “upload” dan “session” sehingga kita akan memiliki dua buah folder baru:</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
“C:\Apache\temp\upload”<br style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;" />“C:\Apache\temp\session”</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Kemudian buka file pengaturan PHP “C:\Apache\php\php.ini” cari baris seperti yang ada di bawah ini:</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;">;upload_tmp_dir =</code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Isikan sehingga menjadi:</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;">upload_tmp_dir="C:\Apache\temp\upload"</code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Selanjutnya cari kembali:</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;">;session.save_path = "/tmp"</code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Isikan sehingga menjadi:</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;">session.save_path="C:\Apache\temp\session"</code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Agar system dapat membaca semua perubahan ini, Komputer kita harus di “Restart.”</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Setelah komputer direstart sekarang kita akan menguji apakah server dan php telah terhubung dengan baik, buka notepad kemudian masukkan kode berikut ini:</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;"><?php phpinfo(); ?></code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Simpan file tersebut ke D:\My Websites dengan nama “index.php” jangan lupa ketika menyimpannya ganti save as type-nya dengan “all files” karena jika tidak maka filenya nanti akan menjadi “index.php.txt”</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Hapus file “index.html”jika masih ada di dalam folder tersebut.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Kemudian buka browser ketik di address bar “localhost” atau “http//localhost/”</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Jika browser menampilkan seperti gambar berikut ini berarti PHP telah terhubung ke Server dengan baik, again Congratulations…</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="Test PHP Info" class="center" height="400" src="http://htmlcssguides.com/images/test-php-info.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="500" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<em style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Berikutnya kita akan <a href="http://htmlcssguides.com/cara-menginstal-mysql" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">menginstal MySQL</a>.</em></div>Anak Bangsawanhttp://www.blogger.com/profile/09063631266573210417noreply@blogger.com0tag:blogger.com,1999:blog-4155937808142756507.post-54857916415893167932012-04-04T07:41:00.001-07:002012-04-04T07:41:14.903-07:00Cara menginstal Apache Server<span class="Apple-style-span" style="background-color: #fafcfc; color: #333333; font-family: verdana, geneva, arial, helvetica, sans-serif; font-size: 12px; line-height: 16px;"></span><br />
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Di modul ini kita akan mempelajari bagaimana cara untuk menginstal Apache Server, PHP dan MySQL dibawah OS Windows, sebagai referensi saya menggunakan OS Windows XP SP3 32Bit.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Dibawah ini adalah versi dari program 2x yang akan kita gunakan dalam simulasi ini:</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
- Apache Server 2.2.22-win32-x86-openssl-0.9.8t.msi<br style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;" />- PHP 5.3.6-Win32-VC9-x86.zip<br style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;" />- MySQL 5.5.14-win32.msi</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<strong style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Apache Server 2.2.22</strong></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Pertama yang harus kita lakukan adalah mendownload Apache<a href="http://httpd.apache.org/download.cgi" rel="nofollow" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;" title="Apache.org">http://httpd.apache.org/download.cgi</a>. Kemudian pilih seperti yang telah ditandai dengan warna merah dibawah ini:</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="Apache Download" class="center" height="210" src="http://htmlcssguides.com/images/apache-download.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="500" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Setelah selesai di dowmload double klik file tersebut untuk memulai penginstalasian.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="Instal Apache 01" class="center" height="388" src="http://htmlcssguides.com/images/instal-apache-01.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="504" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Tanpa basa-basi klik Next.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="Instal Apache 02" class="center" height="388" src="http://htmlcssguides.com/images/instal-apache-02.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="504" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Tandai "I accept the terms in the lisense agreement," kemudian klik Next.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="Instal Apache 03" class="center" height="388" src="http://htmlcssguides.com/images/instal-apache-03.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="504" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Anda bisa membaca penjelasan dan petunjuk tentang Apache Server, kemudian klik Next</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="Instal Apache 04" class="center" height="388" src="http://htmlcssguides.com/images/instal-apache-04.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="504" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Selanjutnya isikan dengan data seperti berikut ini:</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Network Domain: localhost<br style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;" />Server Name: localhost<br style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;" />Administrator’s Email Address: admin@localhost</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Tandai "for all user, on port 80, as a Service" kemudian klik Next</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="Instal Apache 05" class="center" height="388" src="http://htmlcssguides.com/images/instal-apache-05.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="504" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Pilih "Typikal" untuk tipe penginstalasian.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="Instal Apache 06" class="center" height="388" src="http://htmlcssguides.com/images/instal-apache-06.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="504" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Kemudian klik "Change" untuk mengubah folder tujuan penginstalasian.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Sebagai contoh kita akan menginstal program ini ke "C:\Apache" nanti untuk PHP dan MySQL akan kita instal di folder yang sama juga, sehingga akan kelihatan lebih simpel, mudah diingat, aman dan terkendali. Setuju?</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Jadi buat sebuah folder baru di drive C dengan nama "Apache"</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="Instal Apache 07" class="center" height="388" src="http://htmlcssguides.com/images/instal-apache-07.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="504" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Atau anda juga bisa langsung mengetikkan "C:\Apache\" di dalam Folder name kemudian klik OK.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="Instal Apache 08" class="center" height="388" src="http://htmlcssguides.com/images/instal-apache-08.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="504" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Setelah kita mengubah folder tujuan penginstalasian tersebut maka akan terlihat seperti gambar diatas.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Kalau anda sudah merasa yakin klik Next untuk melanjutkan.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="Instal Apache 09" class="center" height="388" src="http://htmlcssguides.com/images/instal-apache-09.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="504" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Kemudian klik Install untuk menginstal Apache Server.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="Instal Apache 10" class="center" height="388" src="http://htmlcssguides.com/images/instal-apache-10.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="504" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Tunggu beberapa saat, setelah selesai klik "Finish" Apache Server siap digunakan.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Sebuah icon akan tampil di system tray seperti pada gambar dibawah ini. Dengan mengklik kiri icon ini, kita dapat menghentikan (stop), memulai (start) dan memulai kembali (restart) Apache Server.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Perlu diingat bahwa <strong style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">setiap kali kita melakukan perubahan pada file pengaturan (configuration file) selalu lakukan "Restart"</strong> atau dengan mengklik stop kemudian start sehingga perubahan segera di baca oleh Server.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="apache_icon.png" class="center" height="30" src="http://htmlcssguides.com/images/apache-icon.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="400" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Untuk mengetahui bekerja tidaknya Apache Server tersebut buka browser dan ketikkan di address bar "localhost" atau "http://localhost/"</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Jika yang ditampilkan adalah seperti gambar berikut ini berarti Apache Server tersebut telah bekerja dengan baik.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="Apache Test 01" class="center" height="300" src="http://htmlcssguides.com/images/apache-test-01.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="400" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Congratulations…</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Selanjutnya kita akan melakukan sedikit perubahan pada file pengaturan Apache Server ini. File pengaturannya tersebut ada di: "C:\Apache\conf\httpd.conf" atau kita bisa mengaksesnya dari:</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Start Menu > All Programs > Apache HTTP Server 2.2 > Configure Apache Server > Edit the Apache httpd.conf Configuration File.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Ketika kita mengetikkan "http://localhost/" di browser, file yang ditampilkan tersebut berada di "C:\Apache\htdocs" ini yang disebut dengan "Documentroot" jadi file yang bernama index didalam folder ini akan secara otomatis ditampilkan oleh browser.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Karena kita nantinya akan sering mengakses folder ini, maka ada baiknya kita menggantinya ke sebuah folder tersendiri yang lebih ringkas dan mudah mengaksesnya.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Buat sebuah folder di drive D dengan nama My Websites.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Kemudian buka file konfigurasi Apache Server "httpd.conf"</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Cari baris yang seperti dibawah ini:</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;">DocumentRoot "C:/Apache/htdocs"</code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Ubah menjadi:</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;">DocumentRoot "D:/My Websites"</code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Kemudian cari kembali baris seperti berikut:</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;"><Directory "C:/Apache/htdocs"></code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Ubah menjadi</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;"><Directory "D:/My Websites"></code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Buka Notepad salin kode dibawah ini:</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;"><html><body><h1>Berhasil!!!</h1></body></html></code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Kemudian simpan file tersebut ke D:\My Websites dengan nama index.html, jangan lupa ketika menyimpannya ganti save as type-nya dengan "All files" karena jika tidak maka filenya nanti akan menjadi index.html.txt</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Sekarang restart server. Kemudian di browser ketik kembali "http://localhost/" dan Enter.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Jika tidak ada problem maka browser akan menampilkan seperti berikut:</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="Apache Test 02" class="center" height="300" src="http://htmlcssguides.com/images/apache-test-02.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="400" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<em style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Selanjutnya kita akan <a href="http://localhost/cara-menginstal-php" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">menginstal PHP 5.3.6</a></em>, untuk Apache Server ini gunakan PHP yang versi VC6. Bila menggunakan PHP versi VC9 <a href="http://htmlcssguides.com/upgrade-apache-2-2-19-untuk-php-vc9" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;" title="Upgrade Apache Server untuk PHP VC9">Apache Servernya harus di update</a>terlebih dahulu.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
@ <b>HTMLSCCGuides.com</b></div>Anak Bangsawanhttp://www.blogger.com/profile/09063631266573210417noreply@blogger.com0tag:blogger.com,1999:blog-4155937808142756507.post-45690708216258631822012-04-04T07:39:00.001-07:002012-04-04T07:39:22.988-07:00Cara menginstal MySQL<span class="Apple-style-span" style="background-color: #fafcfc; color: #333333; font-family: verdana, geneva, arial, helvetica, sans-serif; font-size: 12px; line-height: 16px;"></span><br />
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
ebelum menginstal MySQL pastikan bahwa <a href="http://htmlcssguides.com/cara-menginstal-apache-server" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">Apache Server</a> dan <a href="http://htmlcssguides.com/cara-menginstal-php" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">PHP</a> sudah terinstal dan berjalan dengan baik.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Klik link berikut ini untuk mendownload MySQL<a href="http://dev.mysql.com/downloads/mysql/" rel="nofollow" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">http://dev.mysql.com/downloads/mysql/</a></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Ketika mendownload pilih yang Windows MSI Installer versi GA (Generally Available) Release.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Setelah download selesai double klik file tersebut untuk memulai penginstalasian.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="Install MySQL-01" class="center" height="392" src="http://htmlcssguides.com/images/install-mysql-01.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="499" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Klik Next untuk melanjutkan penginstalasian.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="Install MySQL-02" class="center" height="392" src="http://htmlcssguides.com/images/install-mysql-02.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="499" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Silahkan dibaca dan disimak surat perjanjian bila anda setuju dengan isi surat perjajian tersebut tanda "I accept the terms in the License Agrement" kemudian klik Next.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="Install MySQL-03" class="center" height="392" src="http://htmlcssguides.com/images/install-mysql-03.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="499" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Pilih "Custom" untuk tipe penginstalasian.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="Install MySQL-04" class="center" height="392" src="http://htmlcssguides.com/images/install-mysql-04.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="499" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Klik "Browse" untuk mengubah folder tujuan penginstalasian.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="Install MySQL-05" class="center" height="392" src="http://htmlcssguides.com/images/install-mysql-05.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="499" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
"Look in" tujukan ke C:\Apache, kemudian buat sebuah folder dengan nama "mysql" atau bisa juga langsung mengetikkan "C:\Apache\mysql\" didalam "Folder name" kemudian klik OK.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="Install MySQL-06" class="center" height="392" src="http://htmlcssguides.com/images/install-mysql-06.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="499" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Setelah kita membuat foldernya maka akan terlihat seperti gambar diatas. Masih ada kesempatan untuh mengubah seandainya masih ada yang kurang tepat, tapi jika semua sudah beres dan anda sudah yakin klik Next.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="Install MySQL-07" class="center" height="392" src="http://htmlcssguides.com/images/install-mysql-07.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="499" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Klik Install untuk mulai menginstal MySQL. Tunggu hingga proses penginstalasian selesai.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Berikutnya akan muncul 2 jendela tentang MySQL Enterprise klik More untuk mengetahui lebih lanjut atau klik Next untuk melanjutkan penginstalasian.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="Install MySQL-08" class="center" height="392" src="http://htmlcssguides.com/images/install-mysql-08.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="499" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Tandai Launch the MySQL Instance Configuration Wizard kemudian klik Finish.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="Install MySQL-09" class="center" height="386" src="http://htmlcssguides.com/images/install-mysql-09.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="504" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Klik Next,</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="Install MySQL-10" class="center" height="386" src="http://htmlcssguides.com/images/install-mysql-10.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="504" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Pilih Detailed Configuration, kemudian Next.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="Install MySQL-11.png" class="center" height="386" src="http://htmlcssguides.com/images/install-mysql-11.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="504" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Pilih Develover Machine, kemudian Next.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="Install MySQL-12" class="center" height="386" src="http://htmlcssguides.com/images/install-mysql-12.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="504" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Tandai Multifunctional Database, kemudian Next.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="Install MySQL-13" class="center" height="386" src="http://htmlcssguides.com/images/install-mysql-13.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="504" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Biarkan saja tanpa perubahan, klik Next.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="Install MySQL-14" class="center" height="386" src="http://htmlcssguides.com/images/install-mysql-14.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="504" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Pilih Decision Support DSS/OLAP untuk membatasi koneksi, klik Next</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="Install MySQL-15" class="center" height="386" src="http://htmlcssguides.com/images/install-mysql-15.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="504" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Tandai Enable TCP/IP Networking dan Enable Strict Mode, kemudian Next.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="Install MySQL-16" class="center" height="386" src="http://htmlcssguides.com/images/install-mysql-16.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="504" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Pilih Best Support For Multilingualism, klik Next.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="Install MySQL-17" class="center" height="386" src="http://htmlcssguides.com/images/install-mysql-17.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="504" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Tandai Install As Windows Service. Untuk Servise Name sesuaikan dengan Versi MySQL anda. Tandai Include Bin Directory In Windows PATH agar kita bisa langsung mengakses MySQL dari Command prompt. Klik Next untuk melanjutkan.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="Install MySQL-18" class="center" height="386" src="http://htmlcssguides.com/images/install-mysql-18.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="504" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Pilih Modify Security Settings, kemudian isikan password. Password ini adalah yang akan kita gunakan nantinya setiap kali mengakses MySQL, jadi jika anda pelupa sebaiknya tulis pasword tersebut di Notepad dan simpan dengan nama "MySQL password" selanjutnya tandai "Enable root access from remote machine", klik Next.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="Install MySQL-19.png" class="center" height="386" src="http://htmlcssguides.com/images/install-mysql-19.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="504" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Klik Execute untuk memproses segala pengaturan yang telah kita buat.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="Install MySQL-20" class="center" height="386" src="http://htmlcssguides.com/images/install-mysql-20.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="504" /></div>
<a name='more'></a><br />
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Setelah semua berjalan dengan baik maka akan tampil seperti gambar diatas, klik Finish untuk keluar dari penginstalasian.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Untuk mengetahui bahwa MySQL ini sudah bekerja dengan baik buka Command prompt. Klik Start > Run – ketik "cmd" kemudian "Enter" ketik:</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;">mysql -u root -p</code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Kemudian "Enter" dan masukkan password yang kita masukkan ketika menginstal MySQL dan "Enter". Maka selanjutnya akan tampil seperti berikut ini, berarti MySQL sudah berjalan dengan baik. Sorry nama saya sengaja di coret karena tidak ingin terkenal.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="Test MySQL dari CMD" class="center" height="260" src="http://htmlcssguides.com/images/test-mysql-cmd.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="500" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Ketik "\q" untuk keluar dari MySQL dan kemudian "exit" untuk keluar dari Command prompt.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Selanjutnya agar MySQL terhubung dengan Server dan PHP maka kita harus mengedit kembali file konfigurasi.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Buka file pengaturan PHP "C:\Apache\php\php.ini" di bawah Dynamic Extensions cari kedua extension di bawah ini:</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;">;extension=php_mysql.dll ;extension=php_mysqli.dll</code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Aktifkan kedua extension tersebut dengan cara menghapus titik koma ";" yang berada di depannya:</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;">extension=php_mysql.dll extension=php_mysqli.dll</code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Simpan file tersebut kemudian Restart Server.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Buka Notepad kemudian salin kode berikut, setelah mengisikan MySQL password anda, simpan file tersebut ke "D:\My Websites" dengan nama "index.php"</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;"><?php $dbServer='localhost'; $dbUser='root'; $dbPass='xxxxx'; //Ganti xxxxx dengan password MySQL anda. $dbName='test'; $link = mysql_connect("$dbServer", "$dbUser", "$dbPass") or die("Koneksi ke server gagal"); print "<h1>Koneksi ke MySQL berhasil!!!</h1>"; mysql_select_db("$dbName") or die("Database tidak ditemukan"); print "<h2>Koneksi ke Database berhasil!!!</h2>"; mysql_close($link); ?></code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Kemudian buka browser, di address bar ketikkan "http://localhost/" kemudian "Enter."</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Jika bekerja dengan baik maka akan tampil seperti berikut:</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="MySQL Script Test.png" class="center" height="300" src="http://htmlcssguides.com/images/mysql-script-test.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="500" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Well Done.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<em style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Selanjutnya kita akan <a href="http://htmlcssguides.com/cara-menginstal-phpmyadmin" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">Menginstal phpMyAdmin</a>.</em></div>Anak Bangsawanhttp://www.blogger.com/profile/09063631266573210417noreply@blogger.com0tag:blogger.com,1999:blog-4155937808142756507.post-59632227174324523312012-04-04T07:34:00.001-07:002012-04-04T07:34:30.198-07:00Hyperlink HTML<span class="Apple-style-span" style="background-color: #fafcfc; color: #333333; font-family: verdana, geneva, arial, helvetica, sans-serif; font-size: 12px; line-height: 16px;"></span><br />
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<strong style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Hyperlink</strong> atau sering di singkat dengan link penjelasan serta contoh-contohnya dapat di lihat di Belajar HTML tentang <a href="http://htmlcssguides.com/belajar-html#hyperlink-html" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;" title="Hyperlink HTML">Hyperlink HTML</a>. Sedikit koreksi dari contoh link dengan gambar yang kita buat disana yaitu:</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;"><a href="http://www.yahoo.com" title="Hai... klik gambar ini maka anda akan dibawa ke Yahoo.com"><img src="contoh.jpg" border="0" width="147" height="31" align="left" alt="yahoo"></a></code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Atribut border dan align merupakan <a href="http://htmlcssguides.com/deprecated-tags" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;" title="Deprecated Tags">deprecated atribut</a> jika di gunakan di dalam tag <img> jadi kita dapat menggantinya dengan atribut style dengan properti border untuk atribut border dan properti float untuk atribut align.</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;"><a href="http://www.yahoo.com" title="Hai... klik gambar ini maka anda akan dibawa ke Yahoo.com"><img src="yahoo.gif" style="border:none;float:left" width="147" height="31" alt="yahoo"/></a></code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Hasil:</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<a href="http://www.yahoo.com/" rel="nofollow" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;" title="Hai... klik gambar ini maka anda akan dibawa ke Yahoo.com"><img alt="yahoo" height="31" src="http://htmlcssguides.com/images/yahoo.gif" style="border-bottom-style: none; border-color: initial; border-color: initial; border-left-style: none; border-right-style: none; border-top-style: none; border-width: initial; border-width: initial; float: left; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: bottom;" width="147" /></a></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Lorem ipsum dolor sit amet, nulla gravida fusce, sem id. Lectus justo condimentum. Arcu fringilla velit. Pretium elit id, scelerisque penatibus fermentum, adipiscing dui. Habitasse ut. Ac in, semper aliquam ligula, quisque class tellus.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Hyperlink yang akan kita pelajari dalam tutorial ini sebagai tambahan dari pelajaran HTML sebelumnya antara lain: <strong style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Thumbnail link</strong>. Thumbnail link digunakan untuk gambar yang berukuran besar. Caranya dengan membuat duplikat dari gambar tersebut dengan ukuran yang jauh lebih kecil yang disebut dengan thumbnail. Jadi gambar ukuran besar tersebut baru ditampilkan setelah kita mengklik gambar tumbnail tersebut.</div>
<a name='more'></a><br />
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;"><a href="lokasi gambar original"><img src="lokasi gambar thumbnail"></a></code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Contoh:</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;"><a href="images/besar-1160X700px.jpg"><img src="images/kecil-150X100px.jpg" style="border:none" width="150" height="100" title="Klik untuk melihat gambar original" alt="contoh tumbnail" /></a></code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Hasil:</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<a href="http://htmlcssguides.com/images/besar-1160X700px.jpg" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;"><img alt="contoh tumbnail" height="100" src="http://htmlcssguides.com/images/kecil-150X100px.jpg" style="border-bottom-style: none; border-color: initial; border-color: initial; border-left-style: none; border-right-style: none; border-top-style: none; border-width: initial; border-width: initial; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: bottom;" title="Klik untuk melihat gambar original" width="150" /></a></div>
<div class="clear" style="clear: both; font-size: 1px; height: 0px; line-height: 0; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<strong style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Membuat link di dalam satu halaman website.</strong></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Pada tulisan ini tepatnya pada bagian atas setelah titel Hyperlink HTML saya menambahkan tag di bawah ini:</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;"><a name="top"></a></code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Dengan tag tersebut kita dapat membuat link ke lokasi tersebut dengan membuat link seperti berikut ini:</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;">Klik link berikut untuk <a href="#top">Kembali ke atas</a></code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Hasil:</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Klik link berikut untuk <a href="http://htmlcssguides.com/hyperlink-html#top" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">Kembali ke atas</a></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Dengan cara diatas kita juga bisa membuat link ke suatu halaman website dan langsung melompat ke topik tertentu di dalam satu halaman.</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;">Link berikut akan membawa anda ke halaman Belajar HTML dengan topik <a href="http://htmlcssguides.com/belajar-html#hyperlink-html">Hyperlink HTML</a>.</code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Hasil:</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Link berikut akan membawa anda ke halaman Belajar HTML dengan topik <a href="http://htmlcssguides.com/belajar-html#hyperlink-html" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">Hyperlink HTML</a>.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Contoh diatas dapat dibuat dengan menambahkan tag berikut sebelum titel Hyperlink HTML di dalam halaman tujuan seperti contoh diatas adalah halaman Belajar HTML:</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;"><a name="hyperlink-html"></a></code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Atau bisa juga dengan menambahkan atribut "id" di dalam tag titel. Seperti contoh diatas, titel Hyperlink HTML tersebut berada di dalam tag <h3> jadi kita bisa menuliskan:</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;"><h3 id="hyperlink-html">Hyperlink HTML</h3></code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Untuk membuat link ke lokasi tersebut kita harus membuat link ke halaman utamanya dulu baru kemudian di ikuti dengan nama atau id dengan format: "#nama-link".</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;"><a href="http://htmlcssguides.com/belajar-html<strong style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">#hyperlink-html</strong>">Hyperlink HTML</a></code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Hasil:</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<a href="http://htmlcssguides.com/belajar-html#hyperlink-html" rel="nofollow" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">Hyperlink HTML</a></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<strong style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Membuat Email Link.</strong></div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;"><a href="mailto:alamat email">link teks</a></code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Contoh:</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;">Jika ada masalah silahkan kirim <a href="mailto:support@nama-domain.com">Email</a> ke bagian pelayanan.</code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Hasil:</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Jika ada masalah silahkan kirim <a href="mailto:support@nama-domain.com" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">Email</a> ke bagian pelayanan.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
@ HTMLSCCGuides.com</div>
<div>
<br /></div>Anak Bangsawanhttp://www.blogger.com/profile/09063631266573210417noreply@blogger.com0tag:blogger.com,1999:blog-4155937808142756507.post-28119992471195999902012-04-04T07:32:00.003-07:002012-04-04T07:32:48.449-07:00Belajar HTML<span class="Apple-style-span" style="background-color: #fafcfc; color: #333333; font-family: verdana, geneva, arial, helvetica, sans-serif; font-size: 12px; line-height: 16px;"></span><br />
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<strong style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Mari belajar HTML.</strong></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Jika anda baru terjun di dunia maya alias pemula (newbie) dan tertarik ingin belajar HTML untuk membuat website sendiri maka anda tidak salah datang ke blog ini, karena disini anda akan mendapatkan tutorial, tips, triks dan artikel-artikel tentang bagaimana cara belajar HTML untuk membuat website.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Di Internet sebenarnya kita bisa saja mendapatkan banyak template baik yang gratis maupun yang berbayar, namun kadang tidak sesuai dengan keinginan (selera) kita. Maka kita harus meng-edit dan melakukan perubahan-perubahan. Di dalam mengedit dan melakukan perubahan inilah kita harus mengerti dan memahami bahasa HTML.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Di blog ini anda akan mendapatkan tutorial belajar HTML yang disertai dengan contoh-contoh mulai dari dasar, sehingga akan mudah dipahami dan sangat cocok bagi anda yang masih pemula. Dan bagi anda yang mengedit atau membuat suatu halaman web bisa melangkah ke halaman-halaman berikutnya sesuai dengan topik yang anda inginkan.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Untuk belajar anda dapat menggunakan program HTML seperti Ms FrontPage, Dreamweaver atau Text Editor (Notepad), sesuai dengan selera anda masing-masing. Namun untuk tutorial ini akan diajarkan dengan menggunakan teks editor yang simpel yaitu Notepad, jika anda ingin teks editor yang lebih interaktif anda bisa menggunakan <a href="http://notepad-plus.sourceforge.net/uk/site.htm" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;">Notepad++</a>.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Dalam belajar sebaiknya anda langsung praktek di program HTML anda, sehingga akan lebih mudah untuk dipahami, anda ketik atau <em style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">copy/paste</em> contoh-contoh HTML-nya di program HTML anda dan <em style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">preview</em> di browser untuk melihat hasilnya.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Saya sangat berterimakasih jika anda bersedia memberikan kritik, saran maupun komentar atas kekurangan, error, broken links dan lainnya, masukan dari anda sangat membantu untuk perbaikan tutorial maupun blog ini.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Akhir kata saya mengucapkan terimakasih banyak atas kunjungan anda dan selamat belajar.<br style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;" /><br style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;" /></div>
<h3 id="pengenalan-html" style="color: #006633; font-size: 1.4em; font-weight: bold; margin-bottom: 10px; margin-left: 0px; margin-right: 0px; margin-top: 10px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Pengenalan HTML</h3>
<div class="line" style="background-attachment: initial; background-clip: initial; background-color: #83bbc3; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; height: 3px; line-height: 0; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 2px; overflow-x: hidden; overflow-y: hidden; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<strong style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Pengertian singkat tentang HTML</strong></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
HTML (Hyper Text Markup Language) merupakan bahasa standar untuk membuat suatu dokumen HTML (halaman web) yang terdiri dari kode-kode singkat tertentu, dimana dengan kode-kode tersebut akan memerintahkan Web browser bagaimana untuk menampilkan halaman Web yang terdiri dari berbagai macam format file seperti teks, grafik, animasi, link maupun audio-video.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Sedangkan Web browser adalah sebuah progam yang dapat menterjemahkan kode perintah dari dokumen HTML tersebut sehingga dapat kita lihat, baca dan dengar. Contoh dari Web Browser adalah Internet Explorer, Netscape Navigator, Mozilla Firefox, Opera, Safari dll.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
HTML mempunyai file perluasan (extention) htm atau html. Dimana kedua perluasan tersebut adalah sama, jadi anda boleh menyimpan file dokumen HTML dengan extention ".htm" atau ".html".</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Untuk mulai belajar HTML kita akan menggunakan Texs Editor, Notepad. Di bawah ini adalah contoh suatu dokumen HTML yang sangat sederhana. Buka Notepad, silahkan mulai dengan mengetikkan (copy/paste) kode di bawah ini:</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;"><html> <head> <title>Titel Websiteku</title> </head> <body> Ini adalah dokumen HTML pertamaku </body> </html></code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<a href="http://htmlcssguides.com/samples/html_sederhana.htm" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;" target="_self" title="html_sederhana.htm">Preview</a></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Simpan file tersebut ke C:\My Documents dengan nama "websiteku.htm." Ketika menyimpan file tersebut dengan Notepad ganti "save as type"-nya dengan "all files". Kemudian buka browser, dari menu File klik Open dan tujukan ke C:\My Documents\websiteku.htm "klik Ok" maka halaman website pertama anda akan ditampilkan.<br style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;" /><em style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">*Lakukan hal yang sama untuk contoh-contoh selanjutnya.</em></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Perintah didalam dokumen HTML terdiri dari berbagai struktur penyusun seperti tag, elemen, atribut dan nilai.<strong style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;"> Tag</strong> terdiri dari lambang-lambang khusus seperti: " <", " >" dan "/", untuk menuliskannya di dalam dokumen HTML dimulai dengan tag pembuka " <…>"dan diakhiri dengan tag penutup " </…>". Kemudian di dalam tag tersebut terdapat teks seperti contoh diatas :html, head, title,body dan yang lainnya ini disebut dengan <strong style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Elemen</strong> HTML.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Elemen HTML kemudian ada yang memiliki <strong style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">atribut</strong> dan <strong style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">nilai</strong> tertentu, seperti contoh untuk membuat warna latar belakang (background): <body bgcolor="0000ff">, body merupakan elemen, bgcolor adalah atribut dan 0000ff merupakan nilai (value).</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Elemen HTML mempunyai tiga hal penting yaitu: tag pembuka, isi, dan tag penutup. Sebagai contoh: Elemen html mempunyai tag pembuka " <html>" dan tag penutup " </html>" dan yang berada diantaranya merupakan isi atau konten dari elemen html tersebut. Untuk menuliskan Elemen HTML bisa menggunakan huruf besar maupun huruf kecil. Contoh: <HTML>, <HtMl>, <HTml>, <html>, semuanya adalah sama.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Baca juga Update dari <a href="http://htmlcssguides.com/pengenalan-html" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;" title="Pengenalan HTML">Pengenalan HTML</a> ini di Tutorial HTML.</div>
<a name='more'></a><br style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;" /><br style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;" /><br style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;" /><br />
<h3 id="tag-dasar-html" style="color: #006633; font-size: 1.4em; font-weight: bold; margin-bottom: 10px; margin-left: 0px; margin-right: 0px; margin-top: 10px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Tag Dasar HTML</h3>
<div class="line" style="background-attachment: initial; background-clip: initial; background-color: #83bbc3; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; height: 3px; line-height: 0; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 2px; overflow-x: hidden; overflow-y: hidden; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Komponen dasar dari suatu dokumen HTML terdiri dari tag elemen HTML, HEAD dan BODY. Berikut ini adalah penjelasan dari Tag Elemen tersebut:</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;"><html> <head> <title>Disini titel websiteku</title> </head> <body> Disini adalah konten yang tampil di browser </body> </html></code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<a href="http://htmlcssguides.com/samples/dasar_tag.htm" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;" target="_self" title="Tag dasar HTML">Preview</a></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Tag pertama pada dokumen HTML diatas adalah: " <html>" tag ini merupakan awal dari suatu dokumen HTML, dan tag " </html>" merupakan akhir dari dokumen HTML. Isi keseluruhan dari suatu dokumen HTML selalu berada diantara tag <html>…</html>.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Kemudian tag " <head>…</head>" (header) adalah informasi dari dokumen HTML. Informasi di dalam header meliputi: title, meta, style, script dll. Selain Title informasi di dalam header ini nantinya tidak akan di tampilkan di web browser.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Tag berikutnya adalah " <title>…</title>" merupakan bagian dari Head, tag ini adalah sebagai Titel dari dokumen HTML, titel ini akan tampil di titel dan tab browser. Sebagai contoh sewaktu anda membuka file contoh diatas perhatikan akan muncul tulisan "Disini titel websiteku".</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<img alt="Titel Websiteku" class="center" height="200" src="http://htmlcssguides.com/images/titel-websiteku.png" style="background-attachment: initial; background-clip: initial; background-color: white; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; border-bottom-color: rgb(221, 221, 221); border-bottom-style: solid; border-bottom-width: 1px; border-color: initial; border-left-color: rgb(221, 221, 221); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(221, 221, 221); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(221, 221, 221); border-top-style: solid; border-top-width: 1px; border-width: initial; display: block; margin-bottom: 6px; margin-left: auto; margin-right: auto; margin-top: 8px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; padding-top: 3px; vertical-align: bottom;" width="500" /></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Tag "<body>…</body>" merupakan isi dari suatu dokumen HTML yang akan ditampilkan di web browser, yang terdiri dari berbagai macam format file berupa teks, grafik, link, animasi maupun audio-video (multimedia).</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Baca juga Update dari <a href="http://htmlcssguides.com/tag-dasar-html" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;" title="Tag Dasar HTML">Tag Dasar HTML</a> ini di Tutorial HTML.<br style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;" /><br style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;" /></div>
<h3 id="format-font-html" style="color: #006633; font-size: 1.4em; font-weight: bold; margin-bottom: 10px; margin-left: 0px; margin-right: 0px; margin-top: 10px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Format Font HTML</h3>
<div class="line" style="background-attachment: initial; background-clip: initial; background-color: #83bbc3; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; height: 3px; line-height: 0; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 2px; overflow-x: hidden; overflow-y: hidden; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Tag HTML untuk font adalah <font>…</font>, dengan tag ini kita bisa menentukan jenis font (face), warna (color), dan ukuran (size), untuk lebih jelasnya mari kita perhatikan contoh berikut ini:</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;"><html> <head></head> <body> Untuk membuat jenis font (face): <h1><font face="Verdana">Judul dengan font Verdana</font></h1> <p><font face="Times">Konten dengan font Times</font></p> Untuk membuat ukuran (size): <h1><font size="5">Judul dengan size 5</font></h1> <p><font size="3">Konten dengan size 3</font></p> Untuk membuat warna font (color): <h1><font color="blue">Judul dengan warna biru</font></h1> <p><font color="red">Konten dengan warna merah</font></p> Contoh komplit untuk membuat jenis font (face),size dan color: <h1><font face="Verdana" size="4" color="green">Judulnya Tentang Font</font></h1> <p><font face="Arial" size="3" color="#660000">Ini adalah contoh tulisan dengan <i>pengaturan font</i> yang menggunakan<br> tag HTML elemen <b>font</b> dengan atribut face, size dan color...</font></p> </body> </html></code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<a href="http://htmlcssguides.com/samples/format_font1.htm" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;" target="_self" title="format font1 html">Preview</a></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Berikut adalah sebagai referensi bagi anda untuk memanipulasi atribut face, color dan size:</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Atribut<br style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;" />face="Jenis font yang digunakan", contoh: face="Tahoma"<br style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;" />size="Ukuran dari font (1-7)", contoh: size="3"<br style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;" />size="Memperbesar ukuran font", contoh: size="+1"<br style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;" />size="Memperkecil ukuran font", contoh: size="-1"<br style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;" />color="Warna dari font", contoh: color="blue"<br style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;" />color="Warna dari font", contoh: color="#FF0000"</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Sesuai dengan recomendasi dari World Web Consortium (W3C), Untuk HTML 4.0 keatas, tag <font> tidak dipergunakan lagi, sebagai gantinya dibuat tag <style> atau disebut dengan Cassading Style Sheets (CSS). Dengan CSS penggunaannya akan lebih kompleks dan lebih luas lagi karena dapat dikombinasikan dengan tag elemen-elemen lainnya di dalam dokumen HTML. Berikut adalah contoh penggunaan tag style sheets:</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;"><html> <head></head> <body> Untuk membuat jenis font (face): <h1 style="font-family:verdana">Judul Menggunakan font verdana</h1> <p style="font-family:tahoma">Konten menggunakan font tahoma</p> Untuk membuat ukuran (size): <h1 style="font-size:150%">Judul dengan ukuran 150%</h1> <p style="font-size:80%">Konten dengan ukuran 80%</p> Untuk membuat warna font (color): <h1 style="color:blue">Judul dengan warna Biru</h1> <p style="color:red">Konten dengan warna merah</p> Contoh komplit untuk membuat jenis font (face),size dan color: <p style="font-family:verdana;font-size:80%;color:green"> Ini adalah contoh tulisan pengaturan font dengan <i>Cassading Style Sheets</i> (CSS) yang<br> menggunakan tag HTML elemen <b>style:</b> font-family, font-size dan color...</p> </body> </html></code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<a href="http://htmlcssguides.com/samples/format_font2.htm" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;" target="_self" title="format font2 html">Preview</a></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Untuk mengetahui lebih lanjut tentang CSS, nanti akan dibuat tutorial khusus untuk membahas hal ini.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Baca juga Update dari <a href="http://htmlcssguides.com/format-font-html" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;" title="Format Font HTML">Format Font HTML</a> ini di Tutorial HTML.<br style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;" /><br style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;" /></div>
<h3 id="format-text-html" style="color: #006633; font-size: 1.4em; font-weight: bold; margin-bottom: 10px; margin-left: 0px; margin-right: 0px; margin-top: 10px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Format text HTML</h3>
<div class="line" style="background-attachment: initial; background-clip: initial; background-color: #83bbc3; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; height: 3px; line-height: 0; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 2px; overflow-x: hidden; overflow-y: hidden; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Untuk menulis biasanya ada paragraf dan baris baru, lantas bagaiman cara menuliskannya di dokumen HTML?. Dari contoh yang sudah kita buat sebelumnya, coba tambahkan dengan tag-tag berikut ini:</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;"><html> <head> <title>Selamat Datang di Websiteku</title> </head> <body> Ini adalah halaman HTML pertamaku. <p>Aku sedang membuat paragraf dan ini contohnya.</p> <p>Ini contoh paragraf yang lainnya.</p> <p>Ini juga paragraf mm...tapi de-<br> ngan baris baru.<br> Ini baris baru yang lain.</p> </body> </html></code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<a href="http://htmlcssguides.com/samples/text_html.htm" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;" target="_self" title="text html">Preview</a></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Untuk membuat suatu paragraf, tag elemennya adalah <p>…</p>, dan untuk baris baru adalah <br>, perlu diketahui bahwa sebagian tag elemen HTML tidak memerlukan tag penutup, sebagai contoh adalah <br> ada juga <hr>, apa itu <hr>?, coba lanjutkan lagi dengan contoh berikut ini:</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;"><html> <head> <title>Selamat Datang di Websiteku</title> </head> <body> <hr> <h1>Ini adalah halaman HTML pertamaku.</h1> Dikerjakan oleh: <!-- Tolong isikan dengan nama anda --> <hr> <p>Aku sedang membuat paragraf dan ini contohnya.</p> <p>Ini contoh paragraf yang lainnya.</p> <p>Ini juga paragraf mm...tapi de-<br> ngan baris baru.<br> Ini baris baru yang lain.</p> </body> </html></code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<a href="http://htmlcssguides.com/samples/text2_html.htm" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;" target="_self" title="text2 html">Preview</a></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Nah..udah tau kan apa itu <hr>. Garis Horizontal <hr> juga tidak menggunakan tag penutup.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Selanjutnya tag <h1>…</h1> disebut dengan Heading, merupakan ukuran teks yang biasa di pakai untuk judul, bab, maupun sub-bab lainnya. Ukurannya ada 6 jenis mulai dari <h1> sampai <h6>, ukuran yang paling besar adalah h1 dan yang terkecil adalah h6.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Selanjutnya tag <!--…--> adalah Comments digunakan untuk memasukkan (menyisipkan) suatu komentar di dalam HTML. Suatu comments akan diabaikan oleh browser. Kamu dapat menggunakan komentar untuk menjelaskan sesuatu hal.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Dibawah ini adalah contoh format teks yang sering digunakan di dalam dokumen HTML :</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;"><html> <head></head> <body> <hr> <h1>Ini adalah halaman HTML pertamaku.</h1> Dikerjakan oleh: <!-- Tolong isikan dengan nama anda --> <hr> <p>Aku sedang mempelajari format-format teks.<br> Contoh-contohnya adalah sebagai berikut:</p> <p>Teks Normal<br> <tt>Teks mesin ketik</tt><br> <b>Teks tebal (bold)</b><br> <strong>Teks tebal dengan perintah Strong</strong><br> <i>Teks dengan italic (miring)</i><br> <em>Teks miring dengan perintah Emphasized</em><br> <u>Teks bergaris bawah (underline)</u><br> <strike>Teks tercoret (strike)</strike><br> <big>Teks lebih besar dari normal</big><br> <small>Teks lebih kecil dari normal</small><br> Teks menggunakan Subscript: Molekul Air adalah H<sub>2</sub>O<br> Teks menggunakan Superscript: Hasil dari 10<sup>2</sup>=100<br></p> </body> </html></code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<a href="http://htmlcssguides.com/samples/format_text1.htm" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;" target="_self" title="format text1 html">Preview</a><br style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;" />Kemudian untuk menampilkan teks sesuai dengan yang tertulis kita gunakan tag <pre>…</pre>, misalnya jika anda menuliskan syair sebuah lagu atau puisi:</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;"> <html> <body> <pre> <b>PUITUIS ASA</b> Hari ini... Aku sedang belajar... Belajar tentang HTML. Sulit 'ntuk dimengerti, Karena banyaknya teks-teks aneh. Tapi biarlah... Akan kucoba... Sampai pingsan. </pre> </body> </html> </code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<a href="http://htmlcssguides.com/samples/format_text2.htm" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;" target="_self" title="format text2 html">Preview</a></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Baca juga Update dari <a href="http://htmlcssguides.com/format-text-html" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;" title="Format text HTML">Format text HTML</a> ini di Tutorial HTML.<br style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;" /><br style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;" /></div>
<h3 id="hyperlink-html" style="color: #006633; font-size: 1.4em; font-weight: bold; margin-bottom: 10px; margin-left: 0px; margin-right: 0px; margin-top: 10px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Hyperlink HTML</h3>
<div class="line" style="background-attachment: initial; background-clip: initial; background-color: #83bbc3; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; height: 3px; line-height: 0; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 2px; overflow-x: hidden; overflow-y: hidden; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<strong style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Hyperlink</strong> digunakan untuk menghubungkan antar dokumen di dalam web. Tag HTML Hyperlink biasa disebut dengan anchor (a) kemudian diikuti dengan href sebagai alamat tujuan dari link tersebut. Berikut kita akan membuat suatu Hyperlink ke suatu alamat url:</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;"><html> <head></head> <body> <p>Aku sekarang sedang membuat hyperlink</p> Jika anda ingin mengunjungi Microsoft <a href="http://www.microsoft.com/">Klik disini</a><br> <a href="http://www.yahoo.com/">Link ini</a> akan membawa anda ke Yahoo.com <p>Untuk membuat hyperlink url agar dibuka pada jendela browser yang baru:<p> <a href="http://www.mp3.com/" target="_blank">Website Musik</a> <p>Agar hyperlink tidak bergaris bawah:<p> <a href="http://www.mp3.com/"target="_blank" style="text-decoration: none">Website Musik</a> <p>Hyperlink ke suatu halaman tertentu dalam web:<p> <!--dengan catatan anda harus tau nama halaman tujuan tersebut--> <a href="http://htmlcssguides.com/belajar-css/">Link ini</a> akan membawa anda ke halaman belajar css. </body> </html></code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<a href="http://htmlcssguides.com/samples/hyperlink1.htm" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;" target="_self" title="hyperlink1.htm">Preview</a></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Untuk membuat hyperlink dengan menggunakan gambar (image). Pastikan gambar tersebut berada pada folder yang sama dengan dokumen html anda dan harus tahu nama dan ektensinya, kemudian ganti ke atribut yang bertuliskan scr, misalkan jika nama gambar tersebut adalah yahoo.gif, maka :</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;"><a href="http://www.yahoo.com"> <img src="yahoo.gif" border="0" width="147" height="31"></a></code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<a href="http://www.yahoo.com/" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;"><img alt="" border="0" height="31" src="http://htmlcssguides.com/images/yahoo.gif" style="border-bottom-style: none; border-bottom-width: 0px; border-color: initial; border-left-style: none; border-left-width: 0px; border-right-style: none; border-right-width: 0px; border-top-style: none; border-top-width: 0px; border-width: initial; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: bottom;" width="147" /></a></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Img merupakan atribut untuk suatu image (gambar), border adalah garis yang mengelilingi sisi image, width dan height merupakan lebar dan tinggi dari image. Kreatiflah untuk menganti nilai yang ada diantar tanda "…"sehingga anda akan lebih mengerti. Untuk memposisikan gambar, tambahkan dengan atribut align="…", left= kiri, center= tengah dan right= kanan.</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;"><a href="http://www.yahoo.com"> <img src="yahoo.gif" border="0" width="147" height="31" align="left"></a></code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<a href="http://www.yahoo.com/" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;" target="_blank" title="Hai... klik gambar ini maka anda akan dibawa ke Yahoo.com"><img alt="" height="31" src="http://htmlcssguides.com/images/yahoo.gif" style="border-bottom-style: none; border-bottom-width: 0px; border-color: initial; border-left-style: none; border-left-width: 0px; border-right-style: none; border-right-width: 0px; border-top-style: none; border-top-width: 0px; border-width: initial; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: bottom;" width="147" /></a>Sekarang coba geser mouse anda ke gambar di atas, jangan di-klik, perhatikan akan ditampilkan suata tulisan singkat mengenai gambar tesebut, ini disebut dengan screen tips, cara membuatnya adalah menambahkan title pada tag anchor (a) sehingga menjadi:</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;"><a href="http://www.yahoo.com" title="Hai... klik gambar ini maka anda akan dibawa ke Yahoo.com"><img src="contoh.jpg" border="0" width="147" height="31" align="left" alt="yahoo"></a></code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Agar cepat mengakses internet kita boleh mengatur browser untuk tidak menampilkan image (gambar). Dan semua gambar akan ditampilkan dengan teks alternatif (alt), jika gambar tesebut tidak memiliki alternatif teks maka hanya akan dilambangkan dengan lambang x.</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;"><a href="http://www.yahoo.com"> <img border="0" src="contoh.jpg" width="120" height="30" align="left" alt="Text Alternatif Yahoo.com"></a></code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Dalam contoh ini src atau source yaitu contoh.jpg sengaja dihapus agar alt-nya ditampilkan, maka hasilnya adalah: <a href="http://www.yahoo.com/" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;" target="_blank"><img alt="Text Alternatif Yahoo.com" height="31" src="http://htmlcssguides.com/yahoo.gif" style="border-bottom-style: none; border-bottom-width: 0px; border-color: initial; border-left-style: none; border-left-width: 0px; border-right-style: none; border-right-width: 0px; border-top-style: none; border-top-width: 0px; border-width: initial; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; vertical-align: bottom;" width="147" /></a></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Baca juga Update dari <a href="http://htmlcssguides.com/hyperlink-html" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;" title="Hyperlink HTML">Hyperlink HTML</a> ini di Tutorial HTML.<br style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;" /><br style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;" /></div>
<h3 id="background-html" style="color: #006633; font-size: 1.4em; font-weight: bold; margin-bottom: 10px; margin-left: 0px; margin-right: 0px; margin-top: 10px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Background HTML</h3>
<div class="line" style="background-attachment: initial; background-clip: initial; background-color: #83bbc3; background-image: initial; background-origin: initial; background-position: initial initial; background-repeat: initial initial; height: 3px; line-height: 0; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 2px; overflow-x: hidden; overflow-y: hidden; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Dengan menggunakan latar belakang (background) maka website kita akan nampak semakin menarik. Untuk memasukkan latar belakang kita bisa menggunakan pilihan warna maupun grafik (gambar).<br style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;" />Sekarang kita mulai dengan menggunakan pilihan warna:</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;"><html> <head></head> <body bgcolor="#FF99FF"> <p>Hai.. Saat ini saya sedang belajar membuat latar belakang dengan warna</p> <p>Kalau anda kurang suka dengan warnanya... ganti aja deh... kode warnanya... </p> </body> </html></code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<a href="http://htmlcssguides.com/samples/background1.htm" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;" target="_self" title="background1.htm">Preview</a><br style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;" />Untuk nilai dari atribut bgcolor diatas anda bisa menggunakan Kode hexadecimal, Nilai RGB atau Nama dari warna tersebut.<br style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;" />Coba anda ganti nilai dari atribut bgcolor dengan contoh dibawah ini:</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;"><body bgcolor="#FFFF00"> <body bgcolor="rgb(250,250,0)"> <body bgcolor="yellow"></code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Hasilnya akan sama. Ikuti link berikut ini untuk mengetahui <a href="http://htmlcssguides.com/web-design-tool/kode_hexadecimal_rgb.php" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;" target="_self" title="kode_hexadecimal_rgb">Kode Hexadecimal dan Nilai RGB</a> dari suatu warna, tapi maaf untuk nama warnanya cari sendiri aja deh…</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Selanjutnya membuat latar belakang dengan grafik atau gambar.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Pertama anda harus punya gambar yang ber-extention .gif, .jpg atau .png yang akan dijadikan background, masukkan (copy) gambar tersebut ke folder tempat file dokumen HTML anda berada, dan harus tahu nama dan perluasan (extention) dari file tersebut, misalkan nama filenya adalah: background.jpg</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;"><html> <head></head> <body background="background.jpg"> <font color="blue"><h1 color="red">Selamat datang di Websiteku</h1></font><hr color="#ff0000" size="2"> <p><font face="Verdana" size="4" color="black">Hai... Saat ini saya sedang belajar membuat latar belakang dengan gambar,<br> Biar bagaimanapun anda diwajibkan harus menyukainya...</font></p> </body> </html></code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<a href="http://htmlcssguides.com/samples/background2.htm" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;" target="_self" title="background2.htm">Preview</a></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Kemudian latar belakang dapat juga menggunakan gambar yang ada di website orang lain, tapi dengan catatan anda harus sedang terhubung ke internet (online) dan harus tahu alamat url dari gambar tersebut di internet. Untuk mengetahui alamat suatu gambar klik kanan gambar tersebut kemudian pilih properties dan lihat image location, copy alamat tersebut dan ganti ke contoh dibawah ini diawali dari http:</div>
<pre class="code" style="background-color: #e2efef; border-bottom-color: rgb(128, 195, 162); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(128, 195, 162); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(128, 195, 162); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(128, 195, 162); border-top-style: solid; border-top-width: 1px; color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; overflow-x: hidden; overflow-y: hidden; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; white-space: pre-line;"><code style="color: #4e4e4e; font: normal normal normal 1em/normal 'courier new', courier, monospace; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; white-space: pre-line;"><html> <head></head> <body background="http://i52.tinypic.com/nmm2cz.jpg"> <p>Hai.. Saat ini saya sedang belajar membuat latarbelakang dengan menggunakan gambar dari website orang lain! hua ha..ha..ha..</p> <p>Mudah-mudahan yang punya website ngamuk sekalian deh...siapa takut!!</p> </body> </html></code></pre>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
<a href="http://htmlcssguides.com/samples/background3.htm" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;" target="_self" title="background3.htm">Preview</a></div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
Baca juga Update dari <a href="http://htmlcssguides.com/background-html" style="color: #ff5555; font-weight: bold; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-decoration: none;" title="Background HTML">Background HTML</a> ini di Tutorial HTML.</div>
<div style="margin-bottom: 12px; margin-top: 6px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">
@ HTMLCSSGuides.com</div>Anak Bangsawanhttp://www.blogger.com/profile/09063631266573210417noreply@blogger.com0tag:blogger.com,1999:blog-4155937808142756507.post-8916439321348026882012-04-04T07:18:00.001-07:002012-04-04T07:18:08.874-07:00Unjuk Gigi Router Rakitan<br />
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Jaringan data dan internet adalah kumpulan dari jutaan komputer dan alat-alat digital lain yang bersambungan. Beberapa komputer akan membentuk jaringan kecil dan berhubungan dengan jaringan kecil lainnya. Sebuah komputer yang terkoneksi ke jaringan dapat berkomunikasi dengan komputer lainnya berkat adanya router yang berfungsi mengatur aliran data dari satu jaringan ke jaringan lainnya.<br /><br />Sebagian orang beranggapan bahwa router yang baik hanyalah router yang bermerek. Padahal, router sebenarnya juga bisa dibuat dengan menggunakan komputer, dan menginstal perangkat lunak yang sesuai. Salah satu perangkat lunak yang bisa difungsikan menjadi sebuah router adalah Mikrotik (http://www.mikrotik.com).<br /><br />Mikrotik mulai dibuat di Latvia pada tahun 1996. Versi-versi awal Mikrotik dibuat untuk digunakan pada sistem pengoperasian DOS. Sejak versi 2, Mikrotik kemudian menggunakan kernel Linux dalam aplikasinya. Tahun 2003 Mikrotik kemudian juga memproduksi perangkat keras berbentuk motherboard mini yang didesain untuk digunakan sebagai perangkat wireless, yang dinamai routerboard.<br /><br />Sebagai perangkat lunak router, cukup banyak fungsi yang bisa dilakukan dengan Mikrotik, mulai dari quality of services (pengaturan bandwidth), firewall, hotspot gateway, web proxy, dns cache, hingga penggunaan virtual private network (VPT). Fasilitas pemantauan seperti watchdog dan netwatch juga tersedia. Salah satu keunggulan lainnya adalah adanya aplikasi pengaturan yang tidak lagi hanya berbasis teks, tetapi juga berbasis grafis. </div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img alt="" height="167" src="http://www.mikrotik.co.id/images/mum2006-prague.jpg" title="" width="435" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<br />Kebolehan sistem operasi Mikrotik ini banyak terlihat pada acara <a href="http://mum.mikrotik.com/?go=prague" style="color: #751208;" target="_blank">Mikrotik User Meeting</a> yang diselenggarakan tanggal 19-20 Januari lalu di Praha, Ceko. Sebanyak 175 peserta dari berbagai belahan dunia ikut hadir.<br /><br /><strong>Routerboard</strong> </div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img alt="" height="156" src="http://www.mikrotik.co.id/images/rb532.jpg" title="" width="435" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Salah satu produk terbaru Mikrotik adalah Routerboard 532 (RB532), motherboard kecil (14 x 14 cm) didesain sebagai motherboard perangkat wireless. Perangkat RB532 menggunakan media penyimpanan onboard 64 MB dan RAM 64 MB, memiliki 2 slot minipci dan 3 port ethernet 10/100 mbps.<br /><br />Untuk menjadikan perangkat ini sebagai perangkat wireless, kita memasangkan kartu antarmuka wireless yang berbentuk minipci (biasanya banyak digunakan juga pada laptop). Fasilitas power over ethernet pun sudah tersedia sehingga kita tidak perlu mengulur kabel listrik jika menggunakan perangkat ini di tempat-tempat yang sulit seperti di menara. Cukup dengan menggunakan kabel ethernet saja.<br /><br />Dalam uji coba yang dilakukan untuk mengukur kemampuan kinerja motherboard RB532 ini, dipasang dua komputer Pentium IV yang dihubungkan satu sama lain melalui port ethernet dari RB532 ini. Tes ini dilakukan lebih dari tiga jam, dan didapatkan kemampuan link yang cukup stabil dan besar, yaitu (akumulatif kirim dan terima) 189 mbps.<br /><br />Selain RB532, saat ini Mikrotik juga dalam tahap akhir memproduksi motherboard Routerboard 112. Motherboard ini didesain lebih kecil dan sederhana daripada RB532 sehingga bisa dipasarkan dengan harga relatif lebih murah.<br /><br /><strong>Wireless 350 mbps</strong> </div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img alt="" height="147" src="http://www.mikrotik.co.id/images/wireless-test.jpg" title="" width="435" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Salah satu fungsi yang didemonstrasikan dan sangat diminati adalah kemampuan wireless dengan dual nstream yang digabungkan dengan sistem multigateway routing. Dual nstream adalah kemampuan sebuah perangkat wireless yang dapat menggunakan dua antarmuka jaringan sekaligus sehingga lebarnya pita yang bisa digunakan juga menjadi dua kali lipat dibandingkan hanya menggunakan satu antarmuka. </div>
<a name='more'></a><br /><br />Kemampuan bisa dilipatgandakan lagi menggunakan teknik multigateway routing, yaitu kemampuan routing untuk membagi trafik yang melaluinya ke beberapa gateway secara acak. Pada demonstrasi di Praha ini digunakan empat perangkat wireless sehingga secara keseluruhan terdapat delapan sambungan wireless. Gabungan keseluruhan teknologi ini secara total mampu menciptakan media wireless dari satu titik ke titik lainnya sebesar 350 mbps.<br /><br />
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img alt="" height="278" src="http://www.mikrotik.co.id/images/wireless-test2.jpg" title="" width="435" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Penggunaan perangkat lunak dan perangkat keras Mikrotik sudah cukup meluas di beberapa belahan dunia. Di Denmark, router Mikrotik digunakan untuk pengaturan RT/RW-net yang sampai saat ini telah memiliki 2.000 pengguna. Di Belanda, jaringan wireless Mikrotik ini digunakan juga secara internal sebagai media jaringan kamera keamanan (video surveillance).<br /><br />Meskipun tidak gratis, perangkat lunak Mikrotik ini bisa didapatkan dengan membayar lisensi seharga 45 dollar AS. Dengan membayar lisensi ini, pengguna juga mendapatkan hak untuk melakukan upgrade versi secara gratis selama satu tahun. Setelah itu, router akan tetap bisa digunakan, tetapi tidak bisa di-upgrade ke versi yang lebih baru, kecuali kalau pengguna memperpanjang lisensinya.<br /><br />Secara umum, Mikrotik memang memiliki cukup banyak fasilitas yang sangat berguna untuk sebuah router. Kemampuannya jika diinstal pada komputer Pentium IV menyamai router bermerek kelas menengah, sedangkan penggunaan routerboard sebagai perangkat wireless juga cukup bisa diandalkan dan disejajarkan dengan perangkat-perangkat wireless kelas satu.<br /><br />Satu hal yang bisa cukup mengganggu untuk pengguna awal adalah kebingungan saat melakukan instalasi awal dikarenakan tersedia cukup banyaknya fitur. Pengguna awal akan bingung di bagian mana harus mulai menginstalasi router-nya. Namun, jika pengguna mau sedikit sabar meneliti panduannya, Mikrotik cukup nyaman dan andal untuk digunakan dalam jaringan.<br /><br />Valens Riyadi </div>
<br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Dimuat di Harian Kompas 23 Januari 2006 </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br class="Apple-interchange-newline" />Anak Bangsawanhttp://www.blogger.com/profile/09063631266573210417noreply@blogger.com0tag:blogger.com,1999:blog-4155937808142756507.post-34688631905887353042012-04-04T07:16:00.003-07:002012-04-04T07:16:49.570-07:00Variasi Pengembangan Komputer Mobil<span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Bayangkan, di mobil Anda terdapat sebuah komputer yang memungkinkan untuk melakukan berbagai pekerjaan, menikmati hiburan sepanjang perjalanan, dan memiliki peta digital saat Anda mulai tersesat di jalan. Teman Anda juga masih bisa menyapa melalui aplikasi chatting seperti Yahoo Messenger. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Berbagai kemudahan tersebut saat ini bisa dilakukan dengan bantuan komputer yang terpasang di mobil. Komputer mobil bukan lagi hal sulit untuk diwujudkan. Anda akan banyak terbantu, karena berbagai fitur tambahan bisa dipasang di komputer mobil, sesuai selera dan kebutuhan Anda. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><img align="right" alt="" height="200" src="http://www.mikrotik.co.id/images/artikel/crv-Sipirok.jpg" style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px; margin-bottom: 0px; margin-left: 5px; margin-right: 0px; margin-top: 0px;" title="" width="137" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Untuk mencari berbagai kemungkinan yang bisa dilakukan dengan komputer mobil, dilakukan uji coba pada mobil Honda CRV tahun 2005. Mobil ini pernah dipinjamkan oleh PT Honda Prospek Motor kepada Yayasan Airputih saat bekerja pada lokasi bencana di Aceh (2005) dan Yogyakarta (2006). </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><strong style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;"><br />Perangkat keras</strong><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;"> </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Perangkat keras utama dalam sistem ini adalah central processing unit (CPU). Untuk mempermudah pemasangan digunakan casing produksi Trivia yang sama dengan standar perangkat audio di mobil (berukuran 1 din, lebar 17,78 cm dan tinggi 5,08 cm), sehingga tidak perlu dilakukan banyak modifikasi interior mobil. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><img alt="" height="141" src="http://www.mikrotik.co.id/images/artikel/crv-depan-belakang.jpg" style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" title="" width="438" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;"> </span><br />
<a name='more'></a><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Motherboard yang digunakan berukuran Mini-ITX (17 cm x 17 cm). Untuk mengurangi panas, dipilih motherboard kecepatan sedang, yaitu VIA EPIA M6000, menggunakan processor VIA Eden 600 MHz, sudah cukup andal menjalankan aplikasi-aplikasi berbasis Windows XP. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Untuk media penyimpanan, digunakan harddisk 40 GB 2,5 inci, yang didesain lebih tahan guncangan dibandingkan harddisk biasa berukuran 3,5 inci. CPU ini juga dilengkapi dengan pemutar DVD. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><img align="left" alt="" height="199" src="http://www.mikrotik.co.id/images/artikel/crv-dalam.jpg" style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px; margin-bottom: 0px; margin-left: 0px; margin-right: 5px; margin-top: 0px;" title="" width="250" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Pada bagian depan komputer terdapat dua buah rongga USB versi 2.0, untuk memasang berbagai perangkat yang sesuai dengan standar USB. Kita bisa menggunakan keyboard USB untuk mengetik. Transfer data bisa dilakukan dari atau ke USB Flash. Koneksi Bluetooth didapatkan dengan menempelkan interface bluetooth pada slot USB. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Koneksi ke internet menggunakan CDMA ataupun GPRS bisa dilakukan dengan menghubungkan handphone ke rongga USB ini. Selagi mobil berjalan, kita dapat terkoneksi ke internet selama masih berada dalam cakupan layanan selular. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><img alt="" height="229" src="http://www.mikrotik.co.id/images/artikel/crv-kabin-view.jpg" style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;" title="" width="438" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;"></span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Monitor yang digunakan juga memiliki ukuran 1 din, sehingga bisa dipasang dengan mudah pada dudukan tape mobil. Saat tidak digunakan, layar terlipat dan masuk ke kotaknya, mirip cara kerja TV mobil yang sudah banyak digunakan. Meskipun komputer bisa dihubungkan dengan monitor TV, sebaiknya digunakan monitor SVGA dengan resolusi hingga 468 x 800 piksel (tipe lebar) berdiameter 7 inci. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Untuk mempermudah melakukan kontrol ke komputer, monitor juga difungsikan sebagai layar sentuh untuk pengganti mouse. Dengan sentuhan satu jari, dapat dilakukan beberapa fungsi sederhana, misalnya untuk mengaktifkan aplikasi pemutar lagu, atau mengatur volume musik yang diputar. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Layar sentuh dapat ditulisi, seperti penggunaan fitur grafiti pada PDA, sebagai pengganti keyboard untuk mengetik. Sistem operasi Windows XP versi Tablet PC menjadi pilihan menarik karena didesain untuk mengoptimalkan komputer yang menggunakan layar sentuh. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><strong style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Sistem listrik</strong><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;"> </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Perbedaan komputer mobil dengan komputer biasa adalah sistem kelistrikannya. Komputer menggunakan power supply unit yang akan mengubah arus listrik AC 220 Volt menjadi arus listrik DC 12 Volt. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Pada mobil terdapat sumber daya DC 12 Volt, namun kualitas listrik mobil yang bergantung pada putaran mesin, menyebabkan arus tidak stabil. Untuk mengatasi permasalahan ini, digunakan power supply unit yang dirancang untuk mobil. Perangkat pasokan listrik M2-ATX produksi mini-box.com mampu bekerja dengan pasokan listrik mulai dari 6-24 Volt. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Power supply unit ini bisa mendeteksi saat mesin mobil mati, dan mengatur komputer memasuki moda hybernate. Beberapa menit kemudian, arus yang masuk ke komputer diputuskan, untuk mencegah permasalahan pada aki mobil jika kita lupa mematikan komputer pada saat mematikan mobil. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><strong style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Perangkat tambahan</strong><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;"> </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Penggunaan komputer mobil sebagai media hiburan dapat dilakukan dengan mudah. Dengan kapasitas harddisk cukup besar, kita bisa menyimpan ribuan lagu dalam format MP3. Kita juga bisa memutar MP3, CD Audio, VCD, ataupun DVD. Dengan TV Tunner yang dihubungkan ke slot USB, kita bisa menikmati siaran televisi. Perlu ditambahkan juga antena TV pada atap mobil. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Komputer ini juga bisa menjadi alat bantu navigasi yang aandal, dengan menambahkan GPS receiver (dengan rongga USB ataupun rongga serial). Jangan lupa memasang aplikasi navigasi seperti Ozi Explorer, dan memasukkan peta yang dibutuhkan. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Untuk daerah tertentu seperti Jakarta yang sudah memiliki peta yang detail, akurasi sistem navigasi ini cukup tinggi. Untuk daerah lainnya, terutama di luar kota, peta provinsi dapat diandalkan untuk memilih jalan antarkota. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><img align="right" alt="" height="250" src="http://www.mikrotik.co.id/images/artikel/crv-wireless-router.jpg" style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;" title="" width="152" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Pada mobil Honda CRV 2005 ini, dipasang perangkat tambahan sistem jaringan Wifi 2,4 GHz, menggunakan Routerboard RB112 produksi Mikrotik, yang dilengkapi dua buah interface wireless. Satu terhubung dengan antena WiFi di atap, dan satu lagi menggunakan antena internal. Perangkat RB112 yang berukuran cukup kecil (14 cm x 8,5 cm) dapat dipasang di kotak penyimpanan dongkrak pada bagian belakang mobil. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Selain sebagai perangkat wireless, RB112 memiliki banyak fitur jaringan, seperti menjadi router, ataupun gateway hotspot. Jika mobil berada di cakupan layanan WiFi, RB112 dapat berfungsi sebagai gateway dan meneruskan akses internet ke komputer mobil, dan laptop lainnya yang berada di dalam mobil. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Bila tidak ada akses WiFi dari luar, komputer bisa menggunakan akses GPRS ataupun CDMA, RB112 bisa mengatur dan mendistribusikan koneksi ke laptop lain dan area sekitar mobil. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Setiap orang mungkin memiliki pilihan yang berbeda untuk pengembangan komputernya. Banyak fitur bisa dipasang pada komputer mobil, seiring dengan banyak perangkat berbagai fungsi yang menggunakan USB, dan pada akhirnya meningkatkan produktivitas kita, karena pada saat berkendaraan sekalipun, ada sebuah unit komputer di sebelah kita yang siap membantu. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Penulis: </span><strong style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Valens Riyadi </strong><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;"></span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Dimuat di </span><a href="http://www.kompas.co.id/kompas-cetak/0703/26/iptek/3410756.htm" style="color: #751208; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" target="_blank">Kompas, 26 Maret 2007 halaman IPTEK</a><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" />Anak Bangsawanhttp://www.blogger.com/profile/09063631266573210417noreply@blogger.com0tag:blogger.com,1999:blog-4155937808142756507.post-77193606364393321432012-04-04T07:15:00.001-07:002012-04-04T07:15:12.838-07:00Load Test Routerboard 153<span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Di tahun 2006 ini, Mikrotik sukses meluncurkan Routerboard 112, board wireless yang dikhususkan sebagai perangkat CPE, atau bisa juga digunakan untuk repeater yang tidak memerlukan bandwidth yang berkapasitas besar. RB112 memang nyaman digunakan untuk CPE, dan harga jualnya murah. Namun, beberapa pihak menyayangkan keterbatasan jumlah interface yang dimiliki oleh board ini. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Menjawab keluhan terbatasnya jumlah interface, Mikrotik meluncurkan board tipe 100 yang dinamai Routerboard 153. Dengan harga yang masih terjangkau, RB153 hadir dengan 5 buah interface ethernet, dan juga 3 buah interface minipci. Jumlah interface yang lebih banyak dari pendahulunya RB112, membuat banyak aplikasi bisa dijalankan dengan board ini, apalagi board ini juga dibundle dengan Mikrotik RouterOS yang dikenal memiliki fitur seabreg itu. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Dengan berukuran 16 cm x 16 cm, board ini mampu menerima power input dengan range yang cukup lebar, yaitu 12 - 48 Volt pada PoE, dan 11 - 50 Volt pada power injectornya. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><img alt="" height="267" src="http://www.mikrotik.co.id/images/artikel/rb153-2.jpg" style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" title="" width="435" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;"></span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Mikrotik Indonesia berkesempatan melakukan uji coba produk tepat setelah produk ini dilaunch pada Mikrotik User Meeting di Singapura bulan September ini. Rilis pertama produk ini di level reseller sendiri baru dilakukan minggu ketiga September 2006. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Seperti pendahulunya RB112, RB153 menggunakan processor MIPS32 4Kc, 175MHz embedded, dengan storage NAND 64MB. RAM yang digunakan lebih besar, yaitu 32 MB. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Uji coba kemampuan board ini dilakukan dengan memasangkan dua buah kartu minipci R52, yang dihubungkan dengan sebuah mesin VIA EPIA dengan RB14 dan dua buah R52. Kedua perangkat diletakkan bersebelahan, dan diset untuk melakukan dual nstream. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Di kedua sisi, kami memasang sebuah PC Router yang juga menjalankan Mikrotik RouterOS, dan menjalankan bandwidth test dengan berbagai setting. Dilakukan pengubahan pada tipe protokol dan juga besarnya paket data yang dikirimkan. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><img alt="" height="195" src="http://www.mikrotik.co.id/images/artikel/rb153-1.jpg" style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" title="" width="435" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;"></span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Dari hasil test ini, ada beberapa catatan penting mengenai performa RB153 ini. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Pada penggunaan protokol TCP, baik menggunakan paket besar maupun kecil, board ini mampu melewatkan 10 mbps up dan 10 mbps down, atau secara akumulatif 20 mbps secara stabil. Jika tidak dilakukan batasan besaran bandwidth, jumlah total data yang bisa dilewatkan adalah 22 hingga 24 mbps, atau secara akumulatif bisa dicapai angka 2400 pps (packer per second). </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Namun, dalam uji coba akumulatif 20 mbps, CPU load tercatat hampir selalu di angka maksimal atau 100%. CPU load tercatat bisa stabil pada range 60 % - 80 % dengan uji coba dengan akumulatif 10 mbps. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><img alt="" height="391" src="http://www.mikrotik.co.id/images/artikel/rb153-3.jpg" style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" title="" width="435" /><br />
<a name='more'></a><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;"></span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Pada penggunaan protokol UDP, performa yang sama bisa dicapai, jika paket data berukuran besar. Namun, jika paket data yang dilewatkan berukuran kecil, jumlah data yang bisa dilewatkan secara akumulatif adalah 2200 pps. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Melihat hasil performa di atas, bisa disimpulkan bahwa performa RB153 tidak jauh berbeda dengan pendahulunya RB112. Kelebihan board ini hanya terletak pada jumlah port ethernet dan minipci yang lebih banyak, dan juga RAM yang 16 MB lebih banyak dari RB112. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Untuk kebutuhan sebagai repeater, atau micro BTS yang lebih dikonsentrasikan menangani trafik TCP, RB153 ini cukup bisa diandalkan. Atau untuk kebutuhan internal SOHO, jumlah ethernet yang banyak cukup menguntungkan, mengingat bisa menggantikan kebutuhan switch bila jumlah PC yang ingin dihubungkan jumlahnya kurang dari 5 (1 port diasumsikan difungsikan sebagai akses internet). </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br />
<span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;"><br /></span><br />
<span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">@ <b>MIKROTIK INDONESIA</b></span>Anak Bangsawanhttp://www.blogger.com/profile/09063631266573210417noreply@blogger.com0tag:blogger.com,1999:blog-4155937808142756507.post-14401228625706391782012-04-04T07:13:00.002-07:002012-04-04T07:13:17.859-07:00Berbagai Level Router OS dan Kemampuannya<span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Mikrotik RouterOS hadir dalam berbagai level. Tiap level memiliki kemampuannya masing-masing, mulai dari level 3, hingga level 6. Secara singkat, level 3 digunakan untuk router berinterface ethernet, level 4 untuk wireless client atau serial interface, level 5 untuk wireless AP, dan level 6 tidak mempunyai limitasi apapun. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Untuk aplikasi hotspot, bisa digunakan level 4 (200 user), level 5 (500 user) dan level 6 (unlimited user). </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Detail perbedaan masing-masing level dapat dilihat pada tabel di bawah ini:</span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;"> </span><br />
<table border="0" cellpadding="3" cellspacing="1" style="font-family: verdana, tahoma, arial;"><tbody>
<tr><td bgcolor="#999999" style="font-size: 11px; line-height: 12pt;"><table border="0" cellpadding="3" cellspacing="1"><tbody>
<tr><td bgcolor="#eeeeee" style="font-size: 11px; line-height: 12pt;">Level number</td><td align="center" bgcolor="#eeeeee" style="font-size: 11px; line-height: 12pt;">1 (DEMO)</td><td align="center" bgcolor="#eeeeee" style="font-size: 11px; line-height: 12pt;">3 (ISP)</td><td align="center" bgcolor="#eeeeee" style="font-size: 11px; line-height: 12pt;">4 (WISP)</td><td align="center" bgcolor="#eeeeee" style="font-size: 11px; line-height: 12pt;">5 (WISPAP)</td><td align="center" bgcolor="#eeeeee" style="font-size: 11px; line-height: 12pt;">6 (Controller)</td></tr>
<tr><td bgcolor="white" style="font-size: 11px; line-height: 12pt;">Wireless Client and Bridge</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">-</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">-</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">yes</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">yes</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">yes</td></tr>
<tr><td bgcolor="white" style="font-size: 11px; line-height: 12pt;">Wireless AP</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">-</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">-</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">-</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">yes</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">yes</td></tr>
<tr><td bgcolor="white" style="font-size: 11px; line-height: 12pt;">Synchronous interfaces</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">-</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">-</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">yes</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">yes</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">yes</td></tr>
<tr><td bgcolor="white" style="font-size: 11px; line-height: 12pt;">EoIP tunnels</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">1</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">unlimited</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">unlimited</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">unlimited</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">unlimited</td></tr>
<tr><td bgcolor="white" style="font-size: 11px; line-height: 12pt;">PPPoE tunnels</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">1</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">200</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">200</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">500</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">unlimited</td></tr>
<tr><td bgcolor="white" style="font-size: 11px; line-height: 12pt;">PPTP tunnels</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">1</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">200</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">200</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">unlimited</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">unlimited</td></tr>
<tr><td bgcolor="white" style="font-size: 11px; line-height: 12pt;">L2TP tunnels</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">1</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">200</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">200</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">unlimited</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">unlimited</td></tr>
<tr><td bgcolor="white" style="font-size: 11px; line-height: 12pt;">VLAN interfaces</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">1</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">unlimited</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">unlimited</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">unlimited</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">unlimited</td></tr>
<tr><td bgcolor="white" style="font-size: 11px; line-height: 12pt;">P2P firewall rules</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">1</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">unlimited</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">unlimited</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">unlimited</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">unlimited</td></tr>
<tr><td bgcolor="white" style="font-size: 11px; line-height: 12pt;">NAT rules</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">1</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">unlimited</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">unlimited</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">unlimited</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">unlimited</td></tr>
<tr><td bgcolor="white" style="font-size: 11px; line-height: 12pt;">HotSpot active users</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">1</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">1</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">200</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">500</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">unlimited</td></tr>
<tr><td bgcolor="white" style="font-size: 11px; line-height: 12pt;">RADIUS client</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">-</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">yes</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">yes</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">yes</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">yes</td></tr>
<tr><td bgcolor="white" style="font-size: 11px; line-height: 12pt;">Queues</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">1</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">unlimited</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">unlimited</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">unlimited</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">unlimited</td></tr>
<tr><td bgcolor="white" style="font-size: 11px; line-height: 12pt;">Web proxy</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">-</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">yes</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">yes</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">yes</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">yes</td></tr>
<tr><td bgcolor="white" style="font-size: 11px; line-height: 12pt;">RIP, OSPF, BGP protocols</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">-</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">yes</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">yes</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">yes</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">yes</td></tr>
<tr><td bgcolor="white" style="font-size: 11px; line-height: 12pt;">Upgrade</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">configuration erased on upgrade</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">yes</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">yes</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">yes</td><td align="center" bgcolor="white" style="font-size: 11px; line-height: 12pt;">yes</td></tr>
</tbody></table>
</td></tr>
</tbody></table>
<br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" />Anak Bangsawanhttp://www.blogger.com/profile/09063631266573210417noreply@blogger.com0tag:blogger.com,1999:blog-4155937808142756507.post-48478500426800316502012-04-04T07:11:00.003-07:002012-04-04T07:11:57.279-07:00Perbandingan Beberapa Wireless MiniPCI<br class="Apple-interchange-newline" /><img align="left" alt="" height="254" src="http://www.mikrotik.co.id/images/artikel/wireless-comparation-04.jpg" style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px; margin-bottom: 0px; margin-left: 0px; margin-right: 10px; margin-top: 0px;" title="" width="250" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Di pasaran mudah kita temui berbagai wireless minipci card. Mulai dari yang berdaya kecil, hingga yang cukup besar. Manakah yang memiliki performa baik jika digunakan dengan Mikrotik? </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Sudah cukup lama kami menggunakan wireless Mikrotik. Mulai dari penggunaan card Atheros dengan chipset 5211, 5212, hingga saat ini card yang biasa dijual oleh Mikrotik adalah CM9 (dengan chipset Atheros 5213) atau R52 (dengan chipset Atheros 5413). Penggunaan card 5211 dan 5212 tidaklah terlalu lama, sampai digantikan dengan card-card baru CM9 dan R52. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Kami kemudian melakukan test dengan beberapa jenis card. Kami memasang sebuah access point dengan menggunanan board RB511 yang dipasangi card SR2 (produksi Ubiquiti Network), yang bekerja di frekuensi 2,4 GHz dan memiliki daya pancar 400 mWatt. Antenna yang digunakan adalah antenna helical indoor 2dbi. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><img alt="" height="299" src="http://www.mikrotik.co.id/images/artikel/wireless-comparation-00.jpg" style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" title="" width="435" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;"></span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Sebagai station, kami kemudian menggunakan 4 buah minipci card yang beda-beda, yaitu: </span><br />
<ul style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<li>SR2 (400mWatt)</li>
<li>CM9 (65mWatt)</li>
<li>OEM Atheros Card (200mWatt)</li>
<li>OEM Atheros Card (100mWatt)</li>
</ul>
<span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Keempat card tersebut dipasang pada sebuah board RB532 yang ditambahi Daughterboard RB564 sehingga secara keseluruhan memiliki 6 buah slot minipci dan 9 buah port ethernet. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><img alt="" height="288" src="http://www.mikrotik.co.id/images/artikel/wireless-comparation-01.jpg" style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" title="" width="435" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;"></span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Keempat card ini kami set untuk menggunakan power sebesar-besarnya, sesuai dengan spesifikasi power masing-masing card. Keempat-empatnya kami hubungkan secara wireless ke access point yang telah diset. Secara keseluruhan, keempat card dapat terkoneksi dengan mudah pada frekuensi 2,4 GHz. <a name='more'></a></span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Besarnya signal level dari masing-masing card bisa dilihat pada screen capture berikut: </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><img alt="" height="168" src="http://www.mikrotik.co.id/images/artikel/wireless-comparation-02.jpg" style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" title="" width="416" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;"> </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Bisa kita lihat bahwa SR2 yang memiliki power terbesar memang memiliki daya signal yang terbaik, lebih baik 15 db dari signal yang didapatkan oleh card CM9. Dari data di atas juga bisa dilihat, bahwa meskipun card Atheros OEM 100 mWatt dan 200 mWatt secara spesifikasi memiliki daya pancar lebih kuat dari CM9, namun signal level CM9 lebih baik ketimbang kedua card ini (selisih 10 dan 18 db). </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Memang, signal level tidak selamanya menjamin bahwa kualitas card tersebut baik. Selanjutnya secara bergantian kami melakukan throughput test bagaimana keempat card tersebut melakukan pengiriman dan penerimaan data. Test dilakukan dengan menggunakan bandwidth test yang terdapat pada Mikrotik RouterOS. Dari access point dilakukan bandwidth test, dengan arah data received, dan menggunakan protokol UDP. Pada client, seting data rates menggunakan setting standart. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Hasil bandwidth testnya adalah : </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><ul style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<li>SR5 : berkisar antara 8 hingga 15 mbps. Trafiknya tidak rata dan fluktuatif. Ada perkiraan fluktuatifnya SR2 ini dipengaruhi oleh suhu. Namun, jika kita mencoba menjalankan configured data tares, trafik bisa meningkat hingga 17-19 db. </li>
<li>CM9 : memiliki traffic cukup stabil di kisaran 22 - 23 mbps!</li>
<li>Atheros 100 mWatt : performanya berkisar 10 - 12 mbps</li>
<li>Atheros 200 mWatt : meskipun tidak sebesar CM9, kartu ini memiliki kemampuan cukup baik di kisaran 20 - 21 mbps. </li>
</ul>
<img alt="" height="186" src="http://www.mikrotik.co.id/images/artikel/wireless-comparation-03.jpg" style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" title="" width="360" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;"> </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><em style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Screen capture hasil bandwidth test dan ping menggunakan wireless card CM9</em><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;"> </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Well, kesemua data di atas tidaklah akurat 100%. Kadang terjadi fluktuatif yang menyebabkan kami harus melakukan bandwidth test berulang-ulang. Karakteristik tiap card sendiri memang berbeda-beda. Ada kartu yang malah bagus saat dipasangi tx-rate, namun ada yang lebih bagus jika tx ratesnya dibuat default. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="font-family: verdana, tahoma, arial;"><span style="font-size: 11px; line-height: 16px;">@ MIKROTIK INDONESIA</span></span>Anak Bangsawanhttp://www.blogger.com/profile/09063631266573210417noreply@blogger.com0tag:blogger.com,1999:blog-4155937808142756507.post-81463802173462531902012-04-04T07:10:00.001-07:002012-04-04T07:10:05.702-07:00Autentikasi di Internet<span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">MENGATUR jaringan internet semakin sulit, apalagi dengan berjangkitnya lima musuh jaringan internet, yaitu virus, worm, spam, spyware, dan intrusion. Jika pelanggan internet yang berada dalam satu jaringan terkena salah satu dari gangguan tersebut, bukan tidak mungkin akan merusak seluruh jaringan, seperti yang terjadi pada worm yang dibuat untuk melumpuhkan web-nya SCO pada bulan Desember 2003. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Dengan munculnya berbagai pilihan untuk mengakses internet, pengendalian akan semakin sulit dan dibutuhkan tenaga- tenaga terampil yang menguasai mekanisme jaringan internet. Sementara kenyataannya, tenaga teknisi di Indonesia rata-rata sekelas "kenek" yang hanya menguasai sesuatu berdasarkan praktik dan tidak dapat dikembangkan karena kurangnya pengetahuan dasar. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Masalah pembatasan penggunaan, pemantauan dan pengendalian atas pelanggan yang semakin lama semakin rumit belum sepenuhnya dapat diselesaikan. Ada beberapa solusi yang saat ini dapat dilakukan dengan bantuan tenaga terampil yang mudah-mudahan akan semakin banyak jumlahnya. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Salah satu segi teknis yang dapat menanggulangi masalah yang ada adalah autentikasi atau membatasi kewenangan pelanggan pada satu pelayanan tertentu, sehingga tidak bisa semaunya men-download film yang ratusan megabyte atau menghabiskan bandwidth pada satu situs di internet. </span><br />
<a name='more'></a><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><strong style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Mengendalikan jaringan</strong><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;"> </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Ada tiga jenis pilihan dalam melakukan autentikasi dalam jaringan internet. Pertama, menggunakan peranti yang secara gratis di-download di internet, misalnya program NoCat yang bekerja di sistem operasi Linux. Pilihan ini harus disertai dengan tenaga terampil dengan sertifikasi "grade A", karena kalau dioperasikan secara setengah-setengah hasilnya adalah kegagalan. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Kedua, tenaga "grade menengah" dapat menjalankan peranti Mikrotik yang harus dibeli dengan nilai sekitar Rp 300.000 sampai Rp 1 juta, dan dapat mewujudkan pemantauan dan pembatasan kewenangan pelanggan internet. Semua fasilitas sudah disediakan di Mikrotik, hanya variasi-variasi untuk bidang bisnis dapat dikatakan sangat terbatas. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Dan ketiga, kombinasi peranti keras dan peranti lunak dapat mengatasi tenaga operator atau tenaga ahli di jaringan internet. Karena peranti ini biasanya dapat dijalankan langsung dengan mudah melalui web-base dan semua fungsi sudah disediakan dengan lengkap. Beberapa jenis peranti ini, misalnya IP3, ANTSLab atau Nomandix yang harganya sekitar 3.000-10.000 dollar AS. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Yang diinginkan oleh operator atau penyedia jasa jaringan internet (ISP) dan sebagian perusahaan yang mempunyai jaringan besar adalah mesin atau peranti lunak yang dapat mengendalikan jaringannya, serta memberi kewenangan yang sesuai dengan jumlah uang yang dikeluarkan oleh pelanggannya. Misalnya, ada pelanggan yang hobinya men-download film, kita tinggal memberikan satu produk yang sesuai dengan keinginannya tersebut. Pada saat ini, antara pelanggan yang membayar mahal saling tumpang tindih dengan pelanggan yang bayar murah, karena hampir semua ISP belum mempunyai pola cespleng untuk mengatasi biaya tinggi yang harus dihadapi. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Dalam beberapa kondisi, besar investasi yang dikeluarkan akan setara dengan jumlah teknisi yang dipekerjakan. Jika perantinya murah, otomatis dibutuhkan tenaga yang banyak untuk memantau selama 24 jam, sedang peranti yang harganya mahal relatif dapat diandalkan dan membutuhkan pemantauan yang tidak terlalu intensif. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><strong style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Mesin pengendali</strong><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;"> </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Peranti yang dapat melakukan autentikasi dan pemantauan juga sangat berguna untuk diterapkan di teknologi-teknologi terbaru seperti HotSpot WiFi yang semakin lama semakin diminati oleh pemakai internet, juga peranti ADSL atau VDSL dan kabel modem yang menggunakan kabel sebagai medianya. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Konsep dasar mesin ini adalah kooptasi seluruh kegiatan akses internet dalam satu mesin dengan level yang sangat tinggi, sehingga seluruh kegiatan dapat dikendalikan. Misalnya, salah satu pelanggan di dalam jaringan LAN akan mengakses situs internet, maka mesin autentikasi akan memaksa meminta user name dan password sesuai dengan grup yang sudah ditentukan oleh ISP-nya. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Setelah memasukkan user name dan password, pelanggan dapat mengakses internet dengan fasilitas yang sudah ditentukan. Karena perantinya mempunyai kendali atas MAC Address dan IP Address dari peranti pelanggan. MAC Address adalah "tanda pengenal" dari seluruh peranti jaringan komputer, sementara IP Address adalah alamat di internet, keduanya punya angka yang spesifik dan tidak akan ada duanya. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Pengalaman di lapangan, untuk membuat satu sistem yang dapat menjaga semua bandwidth yang kita miliki dan sekaligus membuat macam-macam layanan adalah sangat sulit. Tetapi dengan bantuan peranti keras atau peranti lunak, seperti menggunakan IP3 dari IP3Networks, semuanya akan menjadi mudah, karena seluruh proses dicatat dan dikendalikan sebaik-baiknya. Pemantauan dapat dilakukan untuk sambungan melalui kabel UTP, nirkabel atau kabel modem. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Peranti IP3, Mikrotik atau NoCat sangat cocok dipakai di bisnis seperti warnet, hotel, kafe, restoran atau dalam satu lingkungan perguruan tinggi, di mana akan banyak orang yang dapat memanfaatkan akses internetnya. Khusus IP3, kemudahan yang didapat disertai dengan peranti keras yang dirancang untuk melakukan autentikasi di semua sambungan, terutama nirkabel. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Terdiri dari beberapa jenis dengan menggunakan prosesor mikro yang berbeda, IP3 dapat masuk ke pangsa pasar berbeda, mulai dari 3.000 dollar AS sampai 9.000 dollar AS untuk jumlah pelanggan yang banyak dan kecepatan tinggi dengan menggunakan prosesor Xeon. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><strong style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Variasi akses</strong><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;"> Saat ini, jika kita masuk ke satu warnet atau layanan akses internet, tidak terlalu banyak variasi yang tersedia, dan semuanya tertumpuk menjadi satu dalam satu koneksi yang saling tumpang tindih. Dengan menggunakan peranti autentikasi, kita dapat membuat banyak variasi untuk mengakses jaringan internet. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Misalnya, kita dapat membuat voucher yang hanya bekerja pada jam-jam tertentu, biasa disebut Happy Hour, lalu membatasi kecepatan dari layanan yang berbeda. Mereka yang bayar mahal mendapatkan kecepatan lebih tinggi dari yang membayar murah, juga variasi peranti keras yang dipakai untuk mengakses jaringan internet, seperti Wireless LAN, Kabel Modem, ADSL, dan lainnya. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Memang, sangat menyedihkan kalau kita bicara tentang variasi dan kemudahan yang didapat, sementara akses internet di Indonesia termasuk barang mewah. Tetapi dalam beberapa kondisi, sudah ada kebutuhan akan hal ini, terutama untuk membuat seimbang pemakainya. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><strong style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Michael S Sunggiardi</strong><em style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">, Managing Director PT BoNet Utama Bogor</em><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;"> </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" />Anak Bangsawanhttp://www.blogger.com/profile/09063631266573210417noreply@blogger.com0tag:blogger.com,1999:blog-4155937808142756507.post-45302842226379955002012-04-04T07:08:00.000-07:002012-04-04T07:08:18.206-07:00Fitur RouterOS<strong style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Penanganan Protokol TCP/IP:</strong><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;"></span><br />
<ul style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<li>Firewall and NAT - stateful packet filtering; Peer-to-Peer protocol filtering; source and destination NAT; classification by source MAC, IP addresses, ports, protocols, protocol options, interfaces, internal marks, content, matching frequency</li>
<li>Routing - Static routing; Equal cost multi-path routing; Policy based routing (classification by source and destination addresses and/or by firewall mark); RIP v1 / v2, OSPF v2, BGP v4</li>
<li>Data Rate Management - per IP / protocol / subnet / port / firewall mark; HTB, PCQ, RED, SFQ, byte limited queue, packet limited queue; hierarchical limitation, CIR, MIR, contention ratios, dynamic client rate equalizing (PCQ)</li>
<li>HotSpot - HotSpot Gateway with RADIUS authentication/accounting; data rate limitation; traffic quota; real-time status information; walled-garden; customized HTML login pages; iPass support; SSL secure authentication</li>
<li>Point-to-Point tunneling protocols - PPTP, PPPoE and L2TP Access Concentrators and clients; PAP, CHAP, MSCHAPv1 and MSCHAPv2 authentication protocols; RADIUS authentication and accounting; MPPE encryption; compression for PPPoE; data rate limitation; PPPoE dial on demand</li>
<li>Simple tunnels - IPIP tunnels, EoIP (Ethernet over IP)</li>
<li>IPsec - IP security AH and ESP protocols; Diffie-Hellman groups 1,2,5; MD5 and SHA1 hashing algorithms; DES, 3DES, AES-128, AES-192, AES-256 encryption algorithms; Perfect Forwarding Secresy (PFS) groups 1,2,5</li>
<li>Web proxy - FTP, HTTP and HTTPS caching proxy server; transparent HTTP caching proxy; SOCKS protocol support; support for caching on a separate drive; access control lists; caching lists; parent proxy support</li>
<li>Caching DNS client - name resolving for local use; Dynamic DNS Client; local DNS cache with static entries</li>
<li>DHCP - DHCP server per interface; DHCP relay; DHCP client; multiple DHCP networks; static and dynamic DHCP leases</li>
<li>Universal Client - Transparent address translation not depending on the client's setup</li>
<li>VRRP - VRRP protocol for high availability</li>
<li>UPnP - Universal Plug-and-Play support</li>
<li>NTP - Network Time Protocol server and client; synchronization with GPS system</li>
<li>Monitoring/Accounting - IP traffic accounting, firewall actions logging</li>
<li>SNMP - read-only access</li>
<li>M3P - MikroTik Packet Packer Protocol for Wireless links and Ethernet</li>
<li>MNDP - MikroTik Neighbor Discovery Protocol; also supports Cisco Discovery Protocol (CDP)</li>
<li>Tools - ping; traceroute; bandwidth test; ping flood; telnet; SSH; packet sniffer</li>
</ul>
<strong style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Layer 2 connectivity</strong><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;"></span><ul style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<li>Wireless - IEEE802.11a/b/g wireless client and Access Point; Wireless Distribution System (WDS) support; virtual AP; 40 and 104 bit WEP; access control list; authentication on RADIUS server; roaming (for wireless client); Access Point bridging</li>
<li>Bridge - spanning tree protocol; multiple bridge interfaces; bridge firewalling</li>
<li>VLAN - IEEE802.1q Virtual LAN support on Ethernet and WLAN links; multiple VLANs; VLAN bridging</li>
<li>Synchronous - V.35, V.24, E1/T1, X.21, DS3 (T3) media types; sync-PPP, Cisco HDLC, Frame Relay line protocols; ANSI-617d (ANDI or annex D) and Q933a (CCITT or annex A) Frame Relay LMI types</li>
<li>Asynchronous - serial PPP dial-in / dial-out; PAP, CHAP, MSCHAPv1 and MSCHAPv2 authentication protocols; RADIUS authentication and accounting; onboard serial ports; modem pool with up to 128 ports; dial on demand</li>
<li>ISDN - ISDN dial-in / dial-out; PAP, CHAP, MSCHAPv1 and MSCHAPv2 authentication protocols; RADIUS authentication and accounting; 128K bundle support; Cisco HDLC, x75i, x75ui, x75bui line protocols; dial on demand</li>
<li>SDSL - Single-line DSL support; line termination and network termination modes</li>
</ul>
<strong style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Hardware requirements</strong><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;"></span><ul style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<li>CPU and motherboard - advanced 4th generation (core frequency 100MHz or more), 5th generation (Intel Pentium, Cyrix 6X86, AMD K5 or comparable) or newer uniprocessor Intel IA-32 (i386) compatible (multiple processors are not supported)</li>
<li>RAM - minimum 48 MB, maximum 1 GB; 64 MB or more recommended</li>
<li>Hard Drive/Flash - standard ATA interface controller and drive (SCSI and USB controllers and drives are not supported; RAID controllers that require additional drivers are not supported) with minimum of 64 MB space</li>
</ul>
<strong style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Hardware needed for installation time only</strong><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;"> </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Depending on installation method chosen the router must have the following hardware:</span><ul style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<li>Floppy-based installation - standard AT floppy controller and 3.5'' disk drive connected as the first floppy disk drive (A); AT, PS/2 or USB keyboard; VGA-compatible video controller card and monitor</li>
<li>CD-based installation - standard ATA/ATAPI interface controller and CD drive supporting "El Torito" bootable CDs (you might need also to check if the router's BIOS supports booting from this type of media); AT, PS/2 or USB keyboard; VGA-compatible video controller card and monitor</li>
<li>Floppy-based network installation - standard AT floppy controller and 3.5'' disk drive connected as the first floppy disk drive (A); PCI Ethernet network interface card supported by MikroTik RouterOS (see the Device Driver List for the list)</li>
<li>Full network-based installation - PCI Ethernet network interface card supported by MikroTik RouterOS (see the Device Driver List for the list) with PXE or EtherBoot extension booting ROM (you might need also to check if the router's BIOS supports booting from network)</li>
</ul>
<strong style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Configuration possibilities</strong><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;"> </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">RouterOS provides powerful command-line configuration interface. You can also manage the router through WinBox - the easy-to-use remote configuration GUI for Windows -, which provides all the benefits of the command-line interface, without the actual "command-line", which may scare novice users. Major features:</span><ul style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<li>Clean and consistent user interface</li>
<li>Runtime configuration and monitoring</li>
<li>Multiple connections</li>
<li>User policies</li>
<li>Action history, undo/redo actions</li>
<li>safe mode operation</li>
<li>Scripts can be scheduled for executing at certain times, periodically, or on events. All command-line commands are supported in scripts</li>
</ul>
<span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">When router is not configured, there are only two ways to configure it:</span><ul style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<li>Local terminal console - AT, PS/2 or USB keyboard and VGA-compatible video controller card with monitor</li>
<li>Serial console - First RS232 asynchronous serial port (usually, onboard port marked as COM1), which is by default set to 9600bit/s, 8 data bits, 1 stop bit, no parity</li>
</ul>
<span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">After the router is configured, it may be managed through the following interfaces:</span><ul style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<li>Local teminal console - AT, PS/2 or USB keyboard and VGA-compatible video controller card with monitor</li>
<li>Serial console - any (you may choose any one; the first, also known as COM1, is used by default) RS232 asynchronous serial port, which is by default set to 9600bit/s, 8 data bits, 1 stop bit, no parity</li>
<li>Telnet - telnet server is running on 23 TCP port by default</li>
<li>SSH - SSH (secure shell) server is running on 22 TCP port by default (available only if security package is installed)</li>
<li>MAC Telnet - MikroTik MAC Telnet potocol server is by default enabled on all Ethernet-like interfaces</li>
<li>Winbox - Winbox is a RouterOS remote administration GUI for Windows, that use 3986 TCP port (or 3987 if security package is installed)</li>
</ul>
@ MIKROTIK INDONESIAAnak Bangsawanhttp://www.blogger.com/profile/09063631266573210417noreply@blogger.com0tag:blogger.com,1999:blog-4155937808142756507.post-1651258221389244092012-04-04T07:06:00.003-07:002012-04-04T07:06:49.468-07:00Groove - New Member Routerboard Family<strong style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px; text-align: -webkit-left;">Groove ?</strong><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px; text-align: -webkit-left;"> </span><br style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px; text-align: -webkit-left;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px; text-align: -webkit-left;">Pada pertengahan tahun 2011 Mikrotik mengeluarkan varian produk wireless router baru, yang diberi nama Groove. Dimensinya yang kecil bahkan merupakan board yang paling kecil yang pernah diproduksi oleh Mikrotik, didalamnya sudah tertanam prosesor Atheros dengan Clock Speed 400MHz dan wireless 200mW 802.11a/n (5GHz). </span><br style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px; text-align: -webkit-left;" /><br />
<div align="center" style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img alt="" height="300" src="http://www.mikrotik.co.id/images/artikel/groove.jpg" title="" width="300" /> </div>
<br style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px; text-align: -webkit-left;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px; text-align: -webkit-left;">Dikemas dalam outdoor box yang didesain weatherproof serta built-in N-Male konektor, perangkat ini bisa langsung dipasangkan dengan Antenna outdoor. Dengan bantuan LED indikator di luar akan sangat memudahkan dalam pemasangan dan instalasinya. </span><br style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px; text-align: -webkit-left;" /><br style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px; text-align: -webkit-left;" /><div align="center" style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img alt="" height="201" src="http://www.mikrotik.co.id/images/artikel/groove2.jpg" title="" width="300" /> </div>
<br style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px; text-align: -webkit-left;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px; text-align: -webkit-left;">Groove memiliki 2 seri dengan spesifikasi yang sedikit berbeda, yaitu Groove A-5Hn ditujukan untuk penggunaan small AP (RouterOS lv4) dan Groove-5Hn untuk penggunaan CPE / Point to Point (RouterOS lv3). </span><br style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px; text-align: -webkit-left;" /><br style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px; text-align: -webkit-left;" /><div align="center" style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img alt="" height="200" src="http://www.mikrotik.co.id/images/artikel/groove-inside_%281%29.jpg" title="" width="350" /> </div>
<br style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px; text-align: -webkit-left;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px; text-align: -webkit-left;">Detail Spesifikasi Produk: <a name='more'></a></span><br style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px; text-align: -webkit-left;" /><br style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px; text-align: -webkit-left;" /><table style="background-color: white; font-family: verdana, tahoma, arial;"><tbody>
<tr bgcolor="#800517"><td align="center" style="font-size: 11px; line-height: 12pt;"><span style="color: white;">Product Code</span></td><td align="center" style="font-size: 11px; line-height: 12pt;"><span style="color: white;">GrooveA-5Hn</span></td><td align="center" style="font-size: 11px; line-height: 12pt;"><span style="color: white;">Groove-5Hn</span></td></tr>
<tr bgcolor="#C8BBBE"><td style="font-size: 11px; line-height: 12pt;">CPU Speed</td><td align="center" colspan="2" style="font-size: 11px; line-height: 12pt;">Atheros AR7241 400MHz</td></tr>
<tr><td style="font-size: 11px; line-height: 12pt;">Memory</td><td align="center" style="font-size: 11px; line-height: 12pt;">64MB</td><td align="center" style="font-size: 11px; line-height: 12pt;">32MB</td></tr>
<tr bgcolor="#C8BBBE"><td style="font-size: 11px; line-height: 12pt;">BOOT Loader</td><td align="center" colspan="2" style="font-size: 11px; line-height: 12pt;">RouterBOOT</td></tr>
<tr><td style="font-size: 11px; line-height: 12pt;">Storage</td><td align="center" colspan="2" style="font-size: 11px; line-height: 12pt;">64MB</td></tr>
<tr bgcolor="#C8BBBE"><td style="font-size: 11px; line-height: 12pt;">Ethernet</td><td align="center" colspan="2" style="font-size: 11px; line-height: 12pt;">One 10/100 Mbit/s Fast Etthernet port with Auto MDI/X<br />L2MTU frame size up to 2030</td></tr>
<tr><td style="font-size: 11px; line-height: 12pt;">Wireless</td><td align="center" colspan="2" style="font-size: 11px; line-height: 12pt;">Built-in 5GHz 802.11a/n 1x1 MIMO, N-Male connector</td></tr>
<tr bgcolor="#C8BBBE"><td style="font-size: 11px; line-height: 12pt;">Extras</td><td align="center" colspan="2" style="font-size: 11px; line-height: 12pt;">Reset Switch, Beeper, Voltage Monitor, Temperature Monitor</td></tr>
<tr><td style="font-size: 11px; line-height: 12pt;">LEDs</td><td align="center" colspan="2" style="font-size: 11px; line-height: 12pt;">5 Wireless signal LEDs, Ethernet activity LED (configurable)</td></tr>
<tr bgcolor="#C8BBBE"><td style="font-size: 11px; line-height: 12pt;">Power Options</td><td align="center" colspan="2" style="font-size: 11px; line-height: 12pt;">Passive 9-30V PoE only, 16KV ESD protection on RF port</td></tr>
<tr><td style="font-size: 11px; line-height: 12pt;">Consumption</td><td align="center" colspan="2" style="font-size: 11px; line-height: 12pt;">Up to 0,19A at 24V (4,56W)</td></tr>
<tr bgcolor="#C8BBBE"><td style="font-size: 11px; line-height: 12pt;">Dimension</td><td align="center" colspan="2" style="font-size: 11px; line-height: 12pt;">177x44x44mm, 193g. Must be mounted with Ethernet pointing down</td></tr>
<tr><td style="font-size: 11px; line-height: 12pt;">Operating Temperature</td><td align="center" colspan="2" style="font-size: 11px; line-height: 12pt;">-30 to + 70C</td></tr>
<tr bgcolor="#C8BBBE"><td style="font-size: 11px; line-height: 12pt;">Operating System</td><td align="center" style="font-size: 11px; line-height: 12pt;"><strong>Level 4 license</strong><br />(AP, station, or point-to-point)</td><td align="center" style="font-size: 11px; line-height: 12pt;"><strong>Level 3 license</strong><br />(station, or point-to-point)</td></tr>
<tr><td style="font-size: 11px; line-height: 12pt;">RX Sensitivity</td><td align="center" colspan="2" style="font-size: 11px; line-height: 12pt;">802.11a: -93 dBm @ 6Mbps to -77 dBm @ 54 Mbps<br />802.11n: -93 dBm @ MCS0 to -71 dBm @ MCS7</td></tr>
<tr bgcolor="#C8BBBE"><td style="font-size: 11px; line-height: 12pt;">TX Power</td><td align="center" colspan="2" style="font-size: 11px; line-height: 12pt;">802.11a: 23dBm @ 6Mbps to 19dBm @ 54 Mbps<br />802.11n: 22dBm @ MCS0 to 15dBm @ MCS7</td></tr>
<tr><td style="font-size: 11px; line-height: 12pt;">Modulations</td><td align="center" colspan="2" style="font-size: 11px; line-height: 12pt;">OFDM: BPSK, QPSK, 16 QAM, 64 QAM<br />DSSS: DBPSK, DQPSK, CCK</td></tr>
</tbody></table>
<br style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px; text-align: -webkit-left;" /><strong style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px; text-align: -webkit-left;">Performance</strong><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px; text-align: -webkit-left;"> </span><br style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px; text-align: -webkit-left;" /><br style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px; text-align: -webkit-left;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px; text-align: -webkit-left;">Karena kedua type groove ini memiliki spesifikasi hardware yang hampir identik, maka hasil test antara Groove A-5Hn dengan Groove-5Hn pun saling mendekati, dimana kedua perangkat ini cukup stabil untuk melewatkan data / bandwidth sebesar 50Mbps Upstream dan 50Mbps downstream atau 100Mbps Half Duplex dengan CPU load bekisar 70-80% </span><br style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px; text-align: -webkit-left;" /><br style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px; text-align: -webkit-left;" /><div align="center" style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img alt="" height="431" src="http://www.mikrotik.co.id/images/artikel/N-HT-Extention_Channel-1.jpeg" title="" width="319" /> <br /><br /><div align="left">
Dengan harga yang sangat terjangkau, Wireless Router Groove Series dengan performance wireless yang hampir setara dengan performance jaringan kabel. Maka tidak salah jika Groove menjadi pilihan yang tepat untuk koneksi wireless point-to-point sekelas SOHO. </div>
</div>
<br style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px; text-align: -webkit-left;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px; text-align: -webkit-left;">By. Pujo Dewobroto </span>
<br />
<span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px; text-align: -webkit-left;">@ MIKROTIK INDONESIA</span>Anak Bangsawanhttp://www.blogger.com/profile/09063631266573210417noreply@blogger.com0tag:blogger.com,1999:blog-4155937808142756507.post-42090279453644754042012-04-04T07:04:00.003-07:002012-04-04T07:04:58.562-07:00Mendalami HTB pada QoS RouterOS Mikrotik<span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Implementasi QoS (</span><em style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Quality of Services</em><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">) di Mikrotik banyak bergantung pada sistem HTB (</span><em style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Hierarchical Token Bucket</em><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">). HTB memungkinkan kita membuat queue menjadi lebih terstruktur, dengan melakukan pengelompokan-pengelompokan bertingkat. Yang banyak tidak disadari adalah, jika kita tidak mengimplementasikan HTB pada Queue (baik </span><em style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Simple Queue </em><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">maupun</span><em style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Queue Tree</em><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">), ternyata ada beberapa parameter yang tidak bekerja seperti yang kita inginkan.Beberapa parameter yang tidak bekerja adalah priority, dan </span><em style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">dual limitation </em><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">(CIR / MIR). </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Pada pembahasan artikel ini, kita akan mengambil contoh sebuah sistem QoS sederhana, di mana kita ingin mengalokasikan bandwidth sebesar 400kbps untuk 3 client, di mana masing-masing client bisa mendapatkan maksimal 200kbps. Di antara ketiga client tersebut, memiliki prioritas yang berbeda, yaitu: 1,2, dan 3. </span><br />
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Untuk mempermudah pemantauan dan pembuktian, kita akan menggunakan <em>queue tree</em>.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Cara paling mudah untuk melakukan queue dengan <em>queue tree</em>, adalah dengan menentukan parameter :</div>
<ul style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<li><u>parent </u>(yang harus diisi dengan outgoing-interface), </li>
<li><u>packet-mark </u>(harus dibuat terlebih dahulu di ip-firewall-mangle), </li>
<li><u>max-limit </u>(yang merupakan batas kecepatan maksimum), atau dikenal juga dengan MIR (<em>Maximum Information Rate</em>) </li>
</ul>
<span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Untuk percobaan awal, semua priority diisi angka yang sama: 8, dan parameter limit-at tidak kita isi. Gambar berikut ini adalah ilustrasi apa yang akan terjadi dengan konfigurasi di atas. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img alt="" height="84" src="http://www.mikrotik.co.id/images/artikel/qos-htb-01/01.jpg" title="" width="438" /> </div>
<a name='more'></a><br />
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Karena alokasi bandwidth yang tersedia hanya 400kbps, sedangkan total akumulasi ketiga client melebihinya (600 kbps), maka ketiga client akan saling berebut, dan tidak bisa diprediksikan siapa yang akan menang (menggunakan bandwidth secara penuh) dan siapa yang akan kalah (tidak mendapatkan bandwidth yang sesuai). </div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Misalkan q1 adalah client dengan prioritas tertinggi, dan q3 adalah client dengan prioritas terbawah. Kita akan mencoba memasukkan nilai prioritas untuk masing-masing client sesuai dengan prioritasnya. </div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img alt="" height="84" src="http://www.mikrotik.co.id/images/artikel/qos-htb-01/02.jpg" title="" width="438" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Tampak pada gambar di atas, meskipun sekarang q1 sudah memiliki prioritas tertinggi, namun ketiga client masih berebutan bandwidth dan tidak terkontrol. </div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Gambar berikut akan mencoba mengimplementasikan nilai limit-at. Seharusnya, limit-at adalah CIR (<em>Committed Information Rate</em>), merupakan parameter di mana suatu client akan mendapatkan bandwidthnya, apapun kondisi lainnya, selama bandwidthnya memang tersedia. </div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img alt="" height="84" src="http://www.mikrotik.co.id/images/artikel/qos-htb-01/03.jpg" title="" width="438" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Ternyata q1 masih tidak mendapatkan bandwidth sesuai dengan limit-at (CIR) nya. Padahal, karena bandwidth yang tersedia adalah 400kbps, seharusnya mencukupi untuk mensuplai masing-masing client sesuai dengan limit-at nya.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Berikutnya, kita akan menggunakan parent queue, dan menempatkan ketiga queue client tadi sebagai child queue dari parent queue yang akan kita buat. Pada parent queue, kita cukup memasukkan outgoing-interface pada parameter parent, dan untuk ketiga child, kita mengubah parameter parent menjadi nama parent queue. Pertama-tama, kita belum akan memasukkan nilai max-limit pada parent-queue, dan menghapus semua parameter limit-at pada semua client. </div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img alt="" height="84" src="http://www.mikrotik.co.id/images/artikel/qos-htb-01/04.jpg" title="" width="438" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Tampak pada contoh di atas, karena kita tidak memasukkan nilai max-limit pada parent, maka priority pada child pun belum bisa terjaga. </div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Setelah kita memasang parameter max-limit pada parent queue, barulah prioritas pada client akan berjalan. </div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img alt="" height="84" src="http://www.mikrotik.co.id/images/artikel/qos-htb-01/05.jpg" title="" width="438" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Tampak pada contoh di atas, q1 dan q2 mendapatkan bandwidth hampir sebesar max-limitnya, sedangkan q3 hampir tidak kebagian bandwidth. Prioritas telah berjalan dengan baik. Namun, pada kondisi sebenarnya, tentu kita tidak ingin ada client yang sama sekali tidak mendapatkan bandwidth. </div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Untuk itu, kita perlu memasang nilai limit-at pada masing-masing client. Nilai limit-at ini adalah kecepatan minimal yang akan di dapatkan oleh client, dan tidak akan terganggu oleh client lainnya, seberapa besarpun client lainnya 'menyedot' bandwidth, ataupun berapapun prioritasnya. Kita memasang nilai 75kbps sebagai limit-at di semua client. </div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img alt="" height="84" src="http://www.mikrotik.co.id/images/artikel/qos-htb-01/06.jpg" title="" width="438" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Tampak bahwa q3, yang memiliki prioritas paling bawah, mendapatkan bandwidth sebesar limit-at nya. q1 yang memiliki prioritas tertinggi, bisa mendapatkan bandwidth sebesar max-limitnya, sedangkan q2 yang prioritasnya di antara q1 dan q3, bisa mendapatkan bandwidth di atas limit-at, tapi tidak mencapai max-limit. Pada contoh di atas, semua client akan terjamin mendapatkan bandwidth sebesar limit-at, dan jika ada sisa, akan dibagikan hingga jumlah totalnya mencapai max-limit parent, sesuai dengan prioritas masing-masing client. </div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Jumlah akumulatif dari limit-at tidaklah boleh melebihi max-limit parent. Jika hal itu terjadi, seperti contoh di bawah ini, jumlah limit-at ketiga client adalah 600kbps, sedangkan nilai max-limit parent hanyalah 400kbps, maka max-limit parent akan bocor. Contoh di bawah ini mengasumsikan bahwa kapasitas keseluruhan memang bisa mencapai nilai total limit-at. Namun, apabila bandwidth yang tersedia tidak mencapai total limit-at, maka client akan kembali berebutan dan sistem prioritas menjadi tidak bekerja. </div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img alt="" height="84" src="http://www.mikrotik.co.id/images/artikel/qos-htb-01/07.jpg" title="" width="438" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Sedangkan, mengenai max-limit, max-limit sebuah client tidak boleh melebihi max-limit parent. Jika hal ini terjadi, maka client tidak akan pernah mencapai max-limit, dan hanya akan mendapatkan kecepatan maksimum sebesar max-limit parent (lebih kecil dari max-limit client).</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img alt="" height="84" src="http://www.mikrotik.co.id/images/artikel/qos-htb-01/09.jpg" title="" width="438" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Jika semua client memiliki prioritas yang sama, maka client akan berbagi bandwidth sisa. Tampak pada contoh di bawah ini, semua client mendapatkan bandwidth yang sama, sekitar 130kbps (total 400kbps dibagi 3). </div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img alt="" height="84" src="http://www.mikrotik.co.id/images/artikel/qos-htb-01/08.jpg" title="" width="438" /> </div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<strong>Yang perlu diingat mengenai HTB:</strong></div>
<ol style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<li>HTB hanya bisa berjalan, apabila rule queue client berada di bawah setidaknya 1 level parent, setiap queue client memiliki parameter limit-at dan max-limit, dan parent queue harus memiliki besaran max-limit.</li>
<li>Jumlah seluruh limit-at client tidak boleh melebihi max-limit parent.</li>
<li>Max-limit setiap client harus lebih kecil atau sama dengan max-limit parent.</li>
<li>Untuk parent dengan level tertinggi, hanya membutuhkan max-limit (tidak membutuhkan parameter limit-at).</li>
<li>Untuk semua parent, maupun sub parent, parameter priority tidak diperhitungkan. Priority hanya diperhitungkan pada child queue. </li>
<li>Perhitungan priority baru akan dilakukan setelah semua limit-at (baik pada child queue maupun sub parent) telah terpenuhi. </li>
</ol>
<strong style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Panduan praktis cara perhitungan limit-at dan max-limit </strong><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;"></span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Di asumsikan bandwidth yang tersedia sebesar 1000kbps. Dan jumlah seluruh client adalah 70. Yang perlu diketahui adalah : </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><ol style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<li>Berapa jumlah maksimal client yang menggunakan internet pada saat yang bersamaan. Jumlah ini belum tentu sama dengan jumlah komputer yang ada, apabila semua client tidak pernah terkoneksi secara bersamaan. Sebagai contoh, untuk kasus ini kita asumsikan adalah 50. </li>
<li>Berapa jumlah minimal client yang menggunakan internet pada saat yang bersamaan. Sebagai contoh, untuk kasus ini kita asumsikan adalah 10</li>
</ol>
<span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Maka, untuk setiap client (1 client dibuatkan 1 rule queue), limit-at nya adalah 1000 / 50 = 20kbps, dan max-limit nya adalah 1000 / 10 = 100 kbps. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Jangan lupa untuk menambahkan parent dengan max-limit sebesar 1000kbps (tidak perlu limit-at), dan memasukkan semua queue client di bawah parent queue. Jika untuk terminal tertentu membutuhkan priority lebih besar, maka kita bisa menggunakan priority yang berbeda-beda, tergantung dengan urutan prioritasnya. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;"> </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Dibuat oleh: Valens Riyadi - MIKROTIK INDONESIA - www.mikrotik.co.id </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" />Anak Bangsawanhttp://www.blogger.com/profile/09063631266573210417noreply@blogger.com0tag:blogger.com,1999:blog-4155937808142756507.post-42580513444838595792012-04-04T07:03:00.000-07:002012-04-04T07:03:54.556-07:00BGP-Peer, Memisahkan Routing dan Bandwidth Management<br />
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Dalam artikel ini, akan dibahas cara untuk melakukan BGP-Peer ke BGP Router Mikrotik Indonesia untuk melakukan pemisahan gateway untuk koneksi internet internasional dan OpenIXP (NICE). Setelah pemisahan koneksi ini dilakukan, selanjutnya akan dibuat queue untuk tiap klien, yang bisa membatasi penggunaan untuk bandwidth internasional dan OpenIXP (NICE).</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Beberapa asumsi yang akan dipakai untuk kasus kali ini adalah :</div>
<ol style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<li>Router memiliki 3 buah interface, yang masing-masing terhubung ke gateway internasional, gateway OpenIXP (NICE), dan ke network klien.</li>
<li>Untuk koneksi ke OpenIXP (NICE), router milik Anda harus memiliki IP publik.</li>
<li>Untuk klien, akan menggunakan IP private, sehingga akan dilakukan NAT (network address translation)</li>
<li>Mikrotik RouterOS Anda menggunakan versi 2.9.39 atau yang lebih baru, dan mengaktifkan paket routing-test</li>
</ol>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img border="0" height="373" src="http://www.mikrotik.co.id/images/artikel/bgp-09.png" width="438" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Jika Anda menghadapi kondisi yang tidak sesuai dengan parameter di atas, harus dilakukan penyesuaian.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img border="0" height="18" src="http://www.mikrotik.co.id/images/line.gif" width="438" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<strong>PENGATURAN DASAR</strong></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Diagram network dan konfigurasi IP Address yang digunakan pada contoh ini adalah seperti gambar berikut ini.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img border="0" height="336" src="http://www.mikrotik.co.id/images/artikel/bgp-01.png" width="438" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Untuk mempermudah pemberian contoh, kami mengupdate nama masing-masing interface sesuai dengan tugasnya masing-masing.<br /> </div>
<table border="0" cellpadding="3" cellspacing="0"><tbody>
<tr><td bgcolor="#FFFFCC" style="font-size: 11px; line-height: 12pt;"><pre>[admin@MikroTik] > /in pr
Flags: X - disabled, D - dynamic, R - running
# NAME TYPE RX-RATE TX-RATE MTU
0 R ether1-intl ether 0 0 1500
1 R ether2-iix ether 0 0 1500
2 R ether3-client ether 0 0 1500
</pre>
</td></tr>
</tbody></table>
<br />
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Konfigurasi IP Address sesuai dengan contoh berikut ini. Sesuaikanlah dengan IP Address yang Anda gunakan. Dalam contoh ini, IP Address yang terhubung ke OpenIXP (NICE) menggunakan IP 202.65.113.130/29, terpasang pada interface ether2-iix dan gatewaynya adalah 202.65.113.129. Sedangkan untuk koneksi ke internasional menggunakan IP Address 69.1.1.2/30 pada interface ether1-intl, dengan gateway 69.1.1.1.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Untuk klien, akan menggunakan blok IP 192.168.1.0/24, dan IP Address 192.168.1.1 difungsikan sebagai gateway dan dipasang pada ether3-client. Klien dapat menggunakan IP Address 192.168.1-2 hingga 192.168.1.254 dengan subnet mask 255.255.255.0.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img border="0" height="79" src="http://www.mikrotik.co.id/images/artikel/bgp-02.png" width="438" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Jangan lupa melakukan konfigurasi DNS server pada router, dan mengaktifkan fitur "allow remote request".</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Karena klien menggunakan IP private, maka kita harus melakukan fungsi src-nat untuk kedua jalur gateway.<br /> </div>
<table border="0" cellpadding="3" cellspacing="0"><tbody>
<tr><td bgcolor="#FFFFCC" style="font-size: 11px; line-height: 12pt;"><pre>[admin@MikroTik] > /ip fi nat pr
Flags: X - disabled, I - invalid, D - dynamic
0 chain=srcnat out-interface=ether1-intl action=masquerade
1 chain=srcnat out-interface=ether2-iix action=masquerade
</pre>
</td></tr>
</tbody></table>
<br />
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
CEK: Pastikan semua konfigurasi telah berfungsi baik. Buatlah default route pada router secara bergantian ke IP gateway OpenIXP (NICE) dan internasional. Lakukanlah ping (baik dari router maupun dari klien) ke luar network Anda secara bergantian.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img border="0" height="18" src="http://www.mikrotik.co.id/images/line.gif" width="438" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<strong>PENGATURAN BGP-PEER</strong></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Pertama-tama, pastikan bahwa Anda menggunakan gateway internasional Anda sebagai default route, dalam contoh ini adalah 69.1.1.1. Kemudian Anda perlu membuat sebuah static route ke mesin BGP Mikrotik Indonesia, yaitu IP 202.65.120.250.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Lalu periksalah apakah Anda bisa melakukan ping ke 202.65.120.250. Periksalah juga dengan traceroute dari router, apakah jalur pencapaian ke IP 202.65.120.250 telah melalui jalur koneksi yang diperuntukkan bagi trafik OpenIXP (NICE), dan bukan melalui jalur internasional.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img border="0" height="112" src="http://www.mikrotik.co.id/images/artikel/bgp-03.png" width="438" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Kemudian, Anda harus mendaftarkan IP Address Anda di website Mikrotik Indonesia untuk mengaktifkan layanan BGP-Peer ini. Aktivasi bisa dilakukan di <a href="http://www.mikrotik.co.id/user_bgp_aktivasi.php" style="color: #751208;">halaman ini</a>. IP Address yang bisa Anda daftarkan hanyalah IP Address yang bisa di-ping dari mesin kami, dan juga harus sudah diadvertise di OIXP. Aturan selengkapnya mengenai penggunaan layanan ini bisa dibaca di <a href="http://www.mikrotik.co.id/index_lihat.php?id=22" style="color: #751208;">halaman ini</a>. Setelah Anda mendaftarkan IP Address Anda, jika semua syarat sudah terpenuhi, Anda akan diinformasikan bahwa aktivasi layanan BGP-Peer Anda sudah sukses. Selanjutnya Anda bisa melihat status layanan BGP Anda di <a href="http://www.mikrotik.co.id/user_bgp_manage.php" style="color: #751208;">halaman ini</a>.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
BGP Router Mikrotik Indonesia akan menggunakan IP Address 202.65.120.250 dan AS Number 64888, dan Router Anda akan menjadi BGP Peer dengan menggunakan AS Number 64666.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Berikutnya adalah langkah-langkah yang harus Anda lakukan pada router Anda. Pertama-tama Anda harus membuat beberapa prefix-list untuk BGP ini. Untuk prefix yang akan Anda terima, untuk alasan keamanan dan hematnya agregasi routing, maka Anda perlu melakukan setting untuk menerima hanya prefix 8 hingga 24. Prefix 0 sampai 7, dan 25 sampai 32 akan Anda blok. Prefix ini kita berinama prefix-in. Untuk prefix-in yang accept, harap diperhatikan bahwa Anda perlu menentukan gateway untuk informasi routing ini, yaitu IP gateway OpenIXP (NICE) Anda. Dalam contoh ini adalah 202.65.113.129. Gantilah IP ini sesuai dengan gateway OpenIXP (NICE) Anda.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Sedangkan karena sifat BGP-Peer ini hanya Anda menerima informasi routing saja, di mana Anda tidak dapat melakukan advertisement, maka harus dilakukan blok untuk semua prefix yang dikirimkan, dan kita beri nama prefix-out.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Berikut ini adalah konfigurasi prefix list yang telah dibuat.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img border="0" height="86" src="http://www.mikrotik.co.id/images/artikel/bgp-04.png" width="438" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Tahap selanjutnya adalah konfigurasi BGP instance. Yang perlu di-set di sini hanyalah AS Number Anda, pada kasus ini kita menggunakan AS Number private, yaitu 64666.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img border="0" height="78" src="http://www.mikrotik.co.id/images/artikel/bgp-05.png" width="438" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Dan langkah terakhir pada konfigurasi BGP ini adalah konfigurasi peer. AS Number BGP Router Mikrotik Indonesia adalah 64888 dan IP Addressnya adalah 202.65.120.250. Karena kita sulit menentukan berapa hop jarak BGP Router Mikrotik Indonesia dengan Router Anda, maka kita melakukan konfigurasi TTL menjadi 255. Jangan lupa mengatur rule prefix-in dan prefix-out sesuai dengan prefix yang telah kita buat sebelumnya.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img border="0" height="90" src="http://www.mikrotik.co.id/images/artikel/bgp-06.png" width="438" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Setelah langkah ini, seharusnya BGP Router Mikrotik sudah dapat terkoneksi dengan Router Anda. Koneksi ini ditandai dengan status peer yang menjadi "established" dan akan dicantumkan pula jumlah informasi routing yang diterima. Anda juga bisa mengecek status peer ini dari sisi BGP Router Mikrotik Indonesia dengan melihat pada <a href="http://www.mikrotik.co.id/user_bgp_manage.php" style="color: #751208;">halaman ini</a>.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img border="0" height="153" src="http://www.mikrotik.co.id/images/artikel/bgp-07.png" width="438" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Cek pula pada bagian IP Route, seharusnya sudah diterima ribuan informasi routing, dan pastikan bahwa gatewaynya sesuai dengan gateway OpenIXP (NICE) Anda, dan berada pada interface yang benar, dalam contoh ini adalah "ether2-iix".</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img border="0" height="401" src="http://www.mikrotik.co.id/images/artikel/bgp-08.png" width="374" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Jika semua sudah berjalan, pastikan bahwa penggunaan 2 buah gateway ini sudah sukses dengan cara melakukan tracerute dari router ataupun dari laptop ke beberapa IP Address baik yang berada di internasional maupun yang berada di jaringan OpenIXP (NICE). </div>
<a name='more'></a><br /> <table border="0" cellpadding="3" cellspacing="0"><tbody>
<tr><td bgcolor="#FFFFCC" style="font-size: 11px; line-height: 12pt;"><pre>C:>tracert www.yahoo.com
Tracing route to www.yahoo-ht2.akadns.net
[209.131.36.158]
over a maximum of 30 hops:
1 <1 ms <1 ms <1 ms 192.168.1.1
2 1 ms <1 ms <1 ms 69.1.1.1
3 222 ms 223 ms 223 ms 157.130.195.13
4 222 ms 289 ms 222 ms 152.63.54.118
5 226 ms 242 ms ^C
C:>tracert www.cbn.net.id
Tracing route to web.cbn.net.id [210.210.145.202]
over a maximum of 30 hops:
1 <1 ms <1 ms <1 ms 192.168.1.1
2 1 ms <1 ms 1 ms 202.65.113.129
3 11 ms 12 ms 127 ms 218.100.27.218
4 21 ms 41 ms 21 ms 218.100.27.165
5 22 ms 24 ms ^C
</pre>
</td></tr>
</tbody></table>
<br />
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img border="0" height="18" src="http://www.mikrotik.co.id/images/line.gif" width="438" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<strong>PENGATURAN BANDWIDTH MANAGEMENT</strong></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Setelah semua routing dan BGP Peer berjalan dengan baik, yang perlu kita lakukan sekarang adalah mengkonfigurasi bandwidth management. Untuk contoh ini kita akan menggunakan mangle dan queue tree.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Karena network klien menggunakan IP private, maka kita perlu melakukan connection tracking pada mangle. Pastikan bahwa Anda telah mengaktifkan connection tracking pada router Anda.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img border="0" height="135" src="http://www.mikrotik.co.id/images/artikel/bgp-10.png" width="330" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Untuk masing-masing trafik, lokal dan internasional, kita membuat sebuah rule mangle connection. Dari connection mark tersebut kemudian kita membuat packet-mark untuk masing-masing trafik.<br /> </div>
<table border="0" cellpadding="3" cellspacing="0"><tbody>
<tr><td bgcolor="#FFFFCC" style="font-size: 11px; line-height: 12pt;"><pre>[admin@MikroTik] > /ip firewall mangle print
Flags: X - disabled, I - invalid, D - dynamic
0 chain=forward out-interface=ether1-intl
src-address=192.168.1.2 action=mark-connection
new-connection-mark=conn-intl
passthrough=yes
1 chain=forward out-interface=ether2-iix
src-address=192.168.1.2 action=mark-connection
new-connection-mark=conn-nice
passthrough=yes
2 chain=forward connection-mark=conn-intl
action=mark-packet
new-packet-mark=packet-intl passthrough=yes
3 chain=forward connection-mark=conn-nice
action=mark-packet new-packet-mark=packet-nice
passthrough=yes
</pre>
</td></tr>
</tbody></table>
<br />
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Untuk setiap klien, Anda harus membuat rule seperti di atas, sesuai dengan IP Address yang digunakan oleh klien.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Langkah berikutnya adalah membuat queue tree rule. Kita akan membutuhkan 4 buah rule, untuk membedakan upstream / downstream untuk koneksi internasional dan lokal.<br /> </div>
<table border="0" cellpadding="3" cellspacing="0"><tbody>
<tr><td bgcolor="#FFFFCC" style="font-size: 11px; line-height: 12pt;"><pre>[admin@MikroTik] > queue tree print
Flags: X - disabled, I - invalid
0 name="intl-down" parent=ether3-client
packet-mark=packet-intl limit-at=0
queue=default priority=8 max-limit=128000
burst-limit=0 burst-threshold=0 burst-time=0s
1 name="intl-up" parent=ether1-intl
packet-mark=packet-intl limit-at=0
queue=default priority=8 max-limit=32000
burst-limit=0 burst-threshold=0 burst-time=0s
2 name="nice-up" parent=ether2-iix
packet-mark=packet-nice limit-at=0
queue=default priority=8 max-limit=256000
burst-limit=0 burst-threshold=0 burst-time=0s
3 name="nice-down" parent=ether3-client
packet-mark=packet-nice limit-at=0
queue=default priority=8 max-limit=1024000
burst-limit=0 burst-threshold=0 burst-time=0s
</pre>
</td></tr>
</tbody></table>
<br />
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Besarnya limit-at / max-limit dan burst bisa Anda sesuaikan dengan layanan yang dibeli oleh klien.</div>
<br class="Apple-interchange-newline" /><br />
<b>@ MIKROTIK INDONESIA</b>Anak Bangsawanhttp://www.blogger.com/profile/09063631266573210417noreply@blogger.com0tag:blogger.com,1999:blog-4155937808142756507.post-88034297482447565572012-04-04T06:56:00.001-07:002012-04-04T06:56:08.164-07:00Simple Queue, Memisah Bandwidth Lokal dan Internasional<br />
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Selama mengelola Mikrotik Indonesia, banyak sekali muncul pertanyaan bagaimana cara melakukan pemisahan queue untuk trafik internet internasional dan trafik ke internet Indonesia (OpenIXP dan IIX). Di internet sebetulnya sudah ada beberapa website yang menampilkan cara pemisahan ini, tapi kami akan coba menampilkan kembali sesederhana mungkin supaya mudah diikuti.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Pada artikel ini, kami mengasumsikan bahwa:</div>
<ol style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<li>Router Mikrotik melakukan Masquerading / src-nat untuk client. Client menggunakan IP privat.</li>
<li>Gateway yang digunakan hanya satu, baik untuk trafik internasional maupun IIX.</li>
<li>Anda bisa menggunakan web-proxy internal ataupun tanpa web-proxy. Jika Anda menggunakan web-proxy, maka ada beberapa tambahan rule yang perlu dilakukan. Perhatikan bagian NAT dan MANGLE pada contoh di bawah ini.</li>
</ol>
<span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">Jika ada parameter di atas yang berbeda dengan kondisi Anda di lapangan, maka konfigurasi yang ada di artikel ini harus Anda modifikasi sesuai dengan konfigurasi network Anda. </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><img alt="network diagram" height="18" src="http://www.mikrotik.co.id/images/line.gif" style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" title="network diagram" width="438" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;"></span><div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<strong>Pengaturan Dasar</strong><br /><br />Berikut ini adalah diagram network dan asumsi IP Address yang akan digunakan dalam contoh ini.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img alt="" height="290" src="http://www.mikrotik.co.id/images/artikel/iix-01.jpg" title="" width="438" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Untuk mempermudah pemberian contoh, kami mengupdate nama masing-masing interface sesuai dengan tugasnya masing-masing.<br /> </div>
<table border="0" cellpadding="3" cellspacing="0"><tbody>
<tr><td bgcolor="#ffffcc" style="font-size: 11px; line-height: 12pt;"><pre>[admin@MikroTik] > /interface pr
Flags: X - disabled, D - dynamic, R - running
# NAME TYPE RX-RATE TX-RATE MTU
0 R ether-public ether 0 0 1500
1 R ether-local ether 0 0 1500
</pre>
</td></tr>
</tbody></table>
<br />
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Untuk klien, akan menggunakan blok IP 192.168.0.0/24, dan IP Address 192.168.0.1 difungsikan sebagai gateway dan dipasang pada router, interface ether-local. Klien dapat menggunakan IP Address 192.168.0-2 hingga 192.168.0.254 dengan subnet mask 255.255.255.0.<br /> </div>
<table border="0" cellpadding="3" cellspacing="0"><tbody>
<tr><td bgcolor="#ffffcc" style="font-size: 11px; line-height: 12pt;"><pre>[admin@MikroTik] > /ip ad pr
Flags: X - disabled, I - invalid, D - dynamic
# ADDRESS NETWORK BROADCAST INTERFACE
0 202.0.0.1/24 202.0.0.0 202.0.0.255 ether-public
1 192.168.0.1/24 192.168.0.0 192.168.0.255 ether-local </pre>
</td></tr>
</tbody></table>
<br />
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Jangan lupa melakukan konfigurasi DNS server pada router, dan mengaktifkan fitur "allow remote request".</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Karena klien menggunakan IP private, maka kita harus melakukan fungsi src-nat seperti contoh berikut.<br /> </div>
<table border="0" cellpadding="3" cellspacing="0"><tbody>
<tr><td bgcolor="#ffffcc" style="font-size: 11px; line-height: 12pt;"><pre>[admin@MikroTik] > /ip fi nat pr
Flags: X - disabled, I - invalid, D - dynamic
0 chain=srcnat out-interface=ether-public
action=masquerade</pre>
</td></tr>
</tbody></table>
<br />
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Jika Anda menggunakan web-proxy transparan, Anda perlu menambahkan rule nat redirect, seperti terlihat pada contoh di bawah ini (rule tambahan yang tercetak tebal).<br /> </div>
<table border="0" cellpadding="3" cellspacing="0"><tbody>
<tr><td bgcolor="#ffffcc" style="font-size: 11px; line-height: 12pt;"><pre>[admin@MikroTik] > /ip fi nat pr
Flags: X - disabled, I - invalid, D - dynamic
0 chain=srcnat out-interface=ether-public
action=masquerade
<strong>1 chain=dstnat in-interface=ether-local protocol=tcp
dst-port=80 action=redirect to-ports=8080</strong></pre>
</td></tr>
</tbody></table>
<br />
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Jangan lupa mengaktifkan fitur web-proxy, dan men-set port layanan web-proxynya, dan disesuaikan dengan port redirect pada contoh di atas.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
CEK: Pastikan semua konfigurasi telah berfungsi baik. Lakukanlah ping (baik dari router maupun dari klien) ke luar network Anda secara bergantian.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img alt="" height="18" src="http://www.mikrotik.co.id/images/line.gif" title="" width="438" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<strong>Pengaturan IP Address List</strong></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Mulai Mikrotik RouterOS versi 2.9, dikenal dengan fitur yang disebut IP Address List. Fitur ini adalah pengelompokan IP Address tertentu dan setiap IP Address tersebut bisa kita namai. Kelompok ini bisa digunakan sebagai parameter dalam mangle, firewall filter, nat, ataupun queue.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Mikrotik Indonesia telah menyediakan daftar IP Address yang diadvertise di OpenIXP dan IIX, yang bisa didownload dengan bebas di URL:<a href="http://www.mikrotik.co.id/getfile.php?nf=nice.rsc" style="color: #751208;" target="_blank">http://www.mikrotik.co.id/getfile.php?nf=nice.rsc</a></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
File nice.rsc ini dibuat secara otomatis di server Mikrotik Indonesia setiap jam, dan merupakan data yang telah dioptimalkan untuk menghilangkan duplikasi entri dan tumpang tindih subnet. Saat ini jumlah baris pada script tersebut berkisar 7000 baris.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Contoh isi file nice.rsc :<br /> </div>
<table border="0" cellpadding="3" cellspacing="0"><tbody>
<tr><td bgcolor="#ffffcc" style="font-size: 11px; line-height: 12pt;"><pre># Script created by: Valens Riyadi @ www.mikrotik.co.id
# Generated at 26 April 2007 05:30:02 WIB ... 431 lines
/ip firewall address-list
add list=nice address="1.2.3.4"
rem [find list=nice]
add list=nice address="125.162.0.0/16"
add list=nice address="125.163.0.0/16"
add list=nice address="152.118.0.0/16"
add list=nice address="125.160.0.0/16"
add list=nice address="125.161.0.0/16"
add list=nice address="125.164.0.0/16"
.
.
dst...
</pre>
</td></tr>
</tbody></table>
<br />
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Proses pengambilan file nice.rsc bisa dilakukan langsung dari terminal di RouterOS dengan perintah:<br /> </div>
<table border="0" cellpadding="3" cellspacing="0"><tbody>
<tr><td bgcolor="#ffffcc" style="font-size: 11px; line-height: 12pt;"><pre>/tool fetch address=ixp.mikrotik.co.id src-path=/download/nice.rsc;
</pre>
</td></tr>
</tbody></table>
<br />
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Kemudian, import-lah file tersebut.<br /> </div>
<table border="0" cellpadding="3" cellspacing="0"><tbody>
<tr><td bgcolor="#ffffcc" style="font-size: 11px; line-height: 12pt;"><pre>[admin@MikroTik] > <strong>import nice.rsc</strong>
Opening script file nice.rsc
Script file loaded and executed successfully
</pre>
</td></tr>
</tbody></table>
<br />
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Pastikan bahwa proses import telah berlangsung dengan sukses, dengan mengecek Address-List pada Menu IP - Firewall </div>
<a name='more'></a><br /><img alt="address list nice" height="534" src="http://www.mikrotik.co.id/images/artikel/iix-02.jpg" title="address list nice" width="438" /><br />
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Proses upload ini dapat juga dilakukan secara otomatis jika Anda memiliki pengetahuan scripting. Misalnya Anda membuat shell script pada Linux untuk melakukan download secara otomatis dan mengupload file secara otomatis setiap pk 06.00 pagi. Kemudian Anda tinggal membuat scheduler pada router untuk melakukan import file.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Jika Anda menggunakan RouterOS versi 3.x, proses update juga dapat dilakukan secara otomatis.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Perintah yang perlu dibuat adalah :<br /> </div>
<table border="0" cellpadding="3" cellspacing="0"><tbody>
<tr><td bgcolor="#ffffcc" style="font-size: 11px; line-height: 12pt;">/system sched add comment=”update-nice” disabled=no interval=1d name=”update-nice-rsc” on-event=”:if ([:len [/file find name=nice.rsc]] > 0) do={/file remove nice.rsc }; /tool fetch address=ixp.mikrotik.co.id src-path=/download/nice.rsc mode=http;/import nice.rsc” start-date=jan/01/1970 start-time=06:00:00</td></tr>
</tbody></table>
<br />
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Hati-hati! : Setelah copy paste, pastikan hasil copy paste sama persis. Proses copy paste kadang-kadang menghilangkan beberapa karakter tertentu. </div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img alt="" height="18" src="http://www.mikrotik.co.id/images/line.gif" title="" width="438" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<strong>Pengaturan Mangle</strong></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Langkah selanjutnya adalah membuat mangle. Kita perlu membuat 1 buah connection mark dan 2 buah packet mark, masing-masing untuk trafik internasional dan lokal.<br /> </div>
<table border="0" cellpadding="3" cellspacing="0"><tbody>
<tr><td bgcolor="#ffffcc" style="font-size: 11px; line-height: 12pt;"><pre>[admin@MikroTik] > /ip firewall mangle pr
Flags: X - disabled, I - invalid, D - dynamic
0 chain=prerouting in-interface=ether-local
dst-address-list=nice
action=mark-connection new-connection-mark=conn-iix
passthrough=yes
1 chain=prerouting connection-mark=conn-iix
action=mark-packet new-packet-mark=packet-iix
passthrough=no
2 chain=prerouting action=mark-packet
new-packet-mark=packet-intl passthrough=no
</pre>
</td></tr>
</tbody></table>
<br />
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Untuk rule #0, pastikanlah bahwa Anda memilih interface yang mengarah ke client. Untuk chain, kita menggunakan prerouting, dan untuk kedua packet-mark, kita menggunakan passthrough=no.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Jika Anda menggunakan web-proxy internal dan melakukan redirecting trafic, maka Anda membuat 2 buah rule tambahan seperti contoh di bawah ini (rule tambahan yang tercetak tebal).<br /> </div>
<table border="0" cellpadding="3" cellspacing="0"><tbody>
<tr><td bgcolor="#ffffcc" style="font-size: 11px; line-height: 12pt;"><pre>[admin@MikroTik] > /ip firewall mangle pr
Flags: X - disabled, I - invalid, D - dynamic
0 chain=prerouting in-interface=ether-local
dst-address-list=nice
action=mark-connection new-connection-mark=conn-iix
passthrough=yes
1 chain=prerouting connection-mark=conn-iix
action=mark-packet new-packet-mark=packet-iix
passthrough=no
<strong>2 chain=output connection-mark=conn-iix
action=mark-packet new-packet-mark=packet-iix
passthrough=no</strong>
3 chain=prerouting action=mark-packet
new-packet-mark=packet-intl passthrough=no
<strong>4 chain=output action=mark-packet
new-packet-mark=packet-intl passthrough=no
</strong></pre>
</td></tr>
</tbody></table>
<br />
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img alt="" height="18" src="http://www.mikrotik.co.id/images/line.gif" title="" width="438" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<strong>Pengaturan Simple Queue</strong></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Untuk setiap client, kita harus membuat 2 buah rule simple queue. Pada contoh berikut ini, kita akan melakukan limitasi untuk IP client 192.168.0.2/32, dan kita akan memberikan limitasi iix (up/down) sebesar 64k/256k, dan untuk internasional sebesar (up/down) 32k/128k.<br /> </div>
<table border="0" cellpadding="3" cellspacing="0"><tbody>
<tr><td bgcolor="#ffffcc" style="font-size: 11px; line-height: 12pt;"><pre>[admin@MikroTik]> /queue simple pr
Flags: X - disabled, I - invalid, D - dynamic
0 name="client02-iix" target-addresses=192.168.0.2/32
dst-address=0.0.0.0/0 interface=all parent=none
packet-marks=packet-iix direction=both priority=8
queue=default-small/default-small limit-at=0/0
max-limit=64000/256000 total-queue=default-small
1 name="client02-intl" target-addresses=192.168.0.2/32
dst-address=0.0.0.0/0 interface=all parent=none
packet-marks=packet-intl direction=both priority=8
queue=default-small/default-small limit-at=0/0
max-limit=32000/128000 total-queue=default-small
</pre>
</td></tr>
</tbody></table>
<br />
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img alt="simple queue" height="345" src="http://www.mikrotik.co.id/images/artikel/iix-03.jpg" title="simple queue" width="438" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img alt="" height="18" src="http://www.mikrotik.co.id/images/line.gif" title="" width="438" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<strong>Pengecekan Akhir</strong></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Setelah selesai, lakukanlah pengecekan dengan melakukan akses ke situs lokal maupun ke situs internasional, dan perhatikanlah counter baik pada firewall mangle maupun pada simple queue.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Anda juga dapat mengembangkan queue type menggunakan pcq sehingga trafik pada setiap client dapat tersebar secara merata.</div>
<br class="Apple-interchange-newline" />Anak Bangsawanhttp://www.blogger.com/profile/09063631266573210417noreply@blogger.com0tag:blogger.com,1999:blog-4155937808142756507.post-82777080713487514252012-04-04T06:54:00.000-07:002012-04-04T06:54:03.519-07:00Sistem Level Lisensi Mikrotik (BARU)<br />
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Mikrotik menerapkan sistem level lisensi yang baru. Dengan adanya sistem level lisensi yang baru ini, diharapkan pengguna lebih diuntungkan, karena harganya yang lebih murah dan jangka waktu free upgrade yang lebih lama (sekarang menjadi 3 tahun untuk level 5 dan 6).</div>
<br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img alt="" src="http://www.mikrotik.co.id/images/lisensi.gif" /></div>
<br class="Apple-interchange-newline" />Anak Bangsawanhttp://www.blogger.com/profile/09063631266573210417noreply@blogger.com0tag:blogger.com,1999:blog-4155937808142756507.post-72598881907890302772012-04-04T06:50:00.001-07:002012-04-04T06:50:11.655-07:00Selayang Pandang RB800 Wireless Router<br />
<div align="left" style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Bermunculnya varian baru produk Routerboard terus dikumandangkan oleh Mikrotik selama tahun 2009. Yang berawal dengan RB750 yang terkenal dengan Best Value Router dan Router Mungil kemudian disusul dengan RB750G yang sudah menggunakan Gigabit Ethernet. Keduanya merupakan varian Routerboard seri 700 yang Hampir sama seperti Seri 400 yaitu sama-sama menggunakan arsitektur processor Atheros tetapi berbeda type, yang memang ditujukan untuk kelas Low-end Router. Di tahun yang sama Mikrotik juga mengeluarkan produk Routerboard kelas High-end yaitu Routerboard seri 800 yang diberi kode RB800. </div>
<div align="left" style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<div align="left">
<div align="left" style="line-height: 12pt;">
<br /></div>
<div align="left">
<div align="left">
<div align="left" style="line-height: 12pt;">
<strong>RB800</strong></div>
<div align="left">
<br />Routerboard seri 800 sepertinya merupakan kelanjutan dari RB600 yang memang memiliki dimensi dan spesifikasi yang hampir sama, tetapi jika dilihat lebih detail spesifikasi RB800 ini hampir dua kali lipat RB600 dan lebih lengkap dengan beberapa tambahan expansion slot untuk hardware-hardware terbaru yang sebelumnya tidak ada di RB600.<br /><div align="left">
<div align="center">
<img alt="" height="324" src="http://www.mikrotik.co.id/images/compare.jpg" title="" width="399" /> </div>
<div align="center">
<img alt="" height="403" src="http://www.mikrotik.co.id/images/artikel/RB800-Speck.jpg" title="" width="253" /> </div>
</div>
<br /><div align="left">
<div align="left">
<div align="left">
<div align="left" style="line-height: 12pt;">
<strong>Processor</strong></div>
<div align="left">
<br />RB800 yang menggunakan MPC8544 network processor (FreeScale PowerPC-based processor) memiliki kecepatan 800Mhz dan bisa dicustom hingga 1Ghz (999Mhz) merupakan processor terkuat saat ini untuk kategori Wireless Router. Dengan HeatSink dan HeatFan yang menjaga processor jika terjadi overhead merupakan salah satu inovasi Mikrotik supaya Performance Router ini dapat maksimal. Fungsi "System Health" (Temperature dan Voltage) juga ditambahkan di software RouterOS untuk memudahkan user memonitoring Router Wireless ini.<br /><br /><div align="left">
<div align="center">
<img alt="" height="449" src="http://www.mikrotik.co.id/images/artikel/RB800-1ghz-2.jpg" title="" width="383" /> </div>
<br /><div align="center">
<img alt="" height="175" src="http://www.mikrotik.co.id/images/artikel/system_health.jpg" title="" width="264" /> </div>
</div>
<br /><div align="left">
<div align="left" style="line-height: 12pt;">
<strong>Expansion Slot</strong></div>
<div align="left">
<br />Dengan tersedianya Resource yang tinggi RB800 siap untuk menjalankan semua fungsi yang ada di RouterOS, fleksibilitas menjadi salah satu point penting pada sebuah perangkat router maka pada RB800 sudah disiapkan beberapa pilihan expansion slot untuk memperkaya fungsi dari Routerboard ini. Seperti pendahulunya Doughterboard Slot selalu menyertai seri Routerboard yang High End, di RB800 ini Doughterboard Slot tersedia dua versi yaitu Doughterboard slot standard PCI yang support untuk Doughterboard seri pendahulu (RB564, RB502, RB604 dan RB816) dan juga Doughterboard type PCIe.<br />Slot MiniPCIe juga sudah disediakan untuk menambah RB800 ini dengan hardware terbaru. <br /><br /> <img alt="" height="150" src="http://www.mikrotik.co.id/images/artikel/IMG_2356.JPG" title="" width="200" /> <img alt="" height="150" src="http://www.mikrotik.co.id/images/artikel/IMG_2343.JPG" title="" width="200" /> <br /><br /><div align="left">
<div align="left" style="line-height: 12pt;">
<strong>Performace</strong></div>
<div align="left">
<br />Tingginya Spesifikasi pada RB800 tidak hanya di atas kertas brosur saja tetapi juga perlu dibuktikan, test telah kami lakukan menggunakan mesin Core2Duo dan RB44GV. Hasilnya sangat memuaskan dengan traffic 250~300 Mbps full duplex, dengan beban traffic tersebut RB800 dapat tetap beroperasional oprtimal dan temperatur tetap normal.<br /><br /><div align="left">
<div align="center">
<img alt="" height="189" src="http://www.mikrotik.co.id/images/artikel/rb800-test-small.jpg" title="" width="420" /> </div>
</div>
Dengan melakukan Customisasi Clock processor RB800 diprediksi dapat dilewati traffic lebih besar dari 300mbps.<br /><br />By: Novan Chris (Mikrotik.co.id)<br /><div align="left">
<div align="left" style="line-height: 12pt;">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<br class="Apple-interchange-newline" />Anak Bangsawanhttp://www.blogger.com/profile/09063631266573210417noreply@blogger.com0tag:blogger.com,1999:blog-4155937808142756507.post-61161366048893905552012-04-04T06:47:00.003-07:002012-04-04T06:47:39.042-07:00Load Balance menggunakan Metode PCC<br />
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Load balance pada mikrotik adalah teknik untuk mendistribusikan beban trafik pada dua atau lebih jalur koneksi secara seimbang, agar trafik dapat berjalan optimal, memaksimalkan throughput, memperkecil waktu tanggap dan menghindari overload pada salah satu jalur koneksi.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Selama ini banyak dari kita yang beranggapan salah, bahwa dengan menggunakan loadbalance dua jalur koneksi , maka besar bandwidth yang akan kita dapatkan menjadi dua kali lipat dari bandwidth sebelum menggunakan loadbalance (akumulasi dari kedua bandwidth tersebut). Hal ini perlu kita perjelas dahulu, bahwa loadbalance tidak akan menambah besar bandwidth yang kita peroleh, tetapi hanya bertugas untuk membagi trafik dari kedua bandwidth tersebut agar dapat terpakai secara seimbang. </div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Dengan artikel ini, kita akan membuktikan bahwa dalam penggunaan loadbalancing tidak seperti rumus matematika 512 + 256 = 768, akan tetapi 512 + 256 = 512 + 256, atau 512 + 256 = 256 + 256 + 256. </div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Pada artikel ini kami menggunakan RB433UAH dengan kondisi sebagai berikut :<br />1. Ether1 dan Ether2 terhubung pada ISP yang berbeda dengan besar bandwdith yang berbeda. ISP1 sebesar 512kbps dan ISP2 sebesar 256kbps.<br />2. Kita akan menggunakan web-proxy internal dan menggunakan openDNS.<br />3. Mikrotik RouterOS anda menggunakan versi 4.5 karena fitur PCC mulai dikenal pada versi 3.24. </div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Jika pada kondisi diatas berbeda dengan kondisi jaringan ditempat anda, maka konfigurasi yang akan kita jabarkan disini harus anda sesuaikan dengan konfigurasi untuk jaringan ditempat anda.<br /><br /><strong>Konfigurasi Dasar</strong><br /><br />Berikut ini adalah Topologi Jaringan dan IP address yang akan kita gunakan</div>
<div align="center" style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img alt="" height="239" src="http://www.mikrotik.co.id/images/artikel/LoadBalance/LoadBalance.png" style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;" title="" width="420" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<br /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
</div>
<table><tbody>
<tr><td bgcolor="#ffffcc" style="font-size: 11px; line-height: 12pt;">/ip address<br />add address=192.168.101.2/30 interface=ether1<br />add address=192.168.102.2/30 interface=ether2<br />add address=10.10.10.1/24 interface=wlan2<br />/ip dns<br />set allow-remote-requests=yes primary-dns=208.67.222.222 secondary-dns=208.67.220.220</td></tr>
</tbody></table>
<br /><br />Untuk koneksi client, kita menggunakan koneksi wireless pada wlan2 dengan range IP client 10.10.10.2 s/d 10.10.10.254 netmask 255.255.255.0, dimana IP 10.10.10.1 yang dipasangkan pada wlan2 berfungsi sebagai gateway dan dns server dari client. Jika anda menggunakan DNS dari salah satu isp anda, maka akan ada tambahan mangle yang akan kami berikan tanda tebal<br /><br />Setelah pengkonfigurasian IP dan DNS sudah benar, kita harus memasangkan default route ke masing-masing IP gateway ISP kita agar router meneruskan semua trafik yang tidak terhubung padanya ke gateway tersebut. Disini kita menggunakan fitur check-gateway berguna jika salah satu gateway kita putus, maka koneksi akan dibelokkan ke gateway lainnya.<br /><br /><table><tbody>
<tr><td bgcolor="#ffffcc" style="font-size: 11px; line-height: 12pt;">/ip route<br />add dst-address=0.0.0.0/0 gateway=192.168.101.1 distance=1 check-gateway=ping<br />add dst-address=0.0.0.0/0 gateway=192.168.102.1 distance=2 check-gateway=ping</td></tr>
</tbody></table>
<br /><br />Untuk pengaturan Access Point sehingga PC client dapat terhubung dengan wireless kita, kita menggunakan perintah<br /><br /><table><tbody>
<tr><td bgcolor="#ffffcc" style="font-size: 11px; line-height: 12pt;">/interface wireless<br />set wlan2 mode=ap-bridge band=2.4ghz-b/g ssid=Mikrotik disabled=no</td></tr>
</tbody></table>
<br /><br />Agar pc client dapat melakukan koneksi ke internet, kita juga harus merubah IP privat client ke IP publik yang ada di interface publik kita yaitu ether1 dan ether2.<br /><br /><table><tbody>
<tr><td bgcolor="#ffffcc" style="font-size: 11px; line-height: 12pt;">/ip firewall nat<br />add action=masquerade chain=srcnat out-interface=ether1<br />add action=masquerade chain=srcnat out-interface=ether2</td></tr>
</tbody></table>
<br /><br />Sampai langkah ini, router dan pc client sudah dapat melakukan koneksi internet. Lakukan ping baik dari router ataupun pc client ke internet. Jika belum berhasil, cek sekali lagi konfigurasi anda.<br />
<a name='more'></a><br /><br />
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<br /><strong>Webproxy Internal</strong> </div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Pada routerboard tertentu, seperti RB450G, RB433AH, RB433UAH, RB800 dan RB1100 mempunyai expansion slot (USB, MicroSD, CompactFlash) untuk storage tambahan. Pada contoh berikut, kita akan menggunakan usb flashdisk yang dipasangkan pada slot USB. Untuk pertama kali pemasangan, storage tambahan ini akan terbaca statusnya invalid di /system store. Agar dapat digunakan sebagai media penyimpan cache, maka storage harus diformat dahulu dan diaktifkan Nantinya kita tinggal mengaktifkan webproxy dan set cache-on-disk=yes untuk menggunakan media storage kita. Jangan lupa untuk membelokkan trafik HTTP (tcp port 80) kedalam webproxy kita.<br /></div>
<table><tbody>
<tr><td bgcolor="#ffffcc" style="font-size: 11px; line-height: 12pt;">/store disk format-drive usb1<br /><div style="line-height: 12pt;">
/store<br />add disk=usb1 name=cache-usb type=web-proxy<br />activate cache-usb<br /><br />/ip proxy<br />set cache-on-disk=yes enabled=yes max-cache-size=200000KiB port=8080<br /><br />/ip firewall nat<br />add chain=dstnat protocol=tcp dst-port=80 in-interface=wlan2 action=redirect to-ports=8080</div>
</td></tr>
</tbody></table>
<br /><br /><br /><strong>Pengaturan Mangle</strong><br /><br />
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Pada loadbalancing kali ini kita akan menggunakan fitur yang disebut PCC (Per Connection Classifier). Dengan PCC kita bisa mengelompokan trafik koneksi yang melalui atau keluar masuk router menjadi beberapa kelompok. Pengelompokan ini bisa dibedakan berdasarkan src-address, dst-address, src-port dan atau dst-port. Router akan mengingat-ingat jalur gateway yang dilewati diawal trafik koneksi, sehingga pada paket-paket selanjutnya yang masih berkaitan dengan koneksi awalnya akan dilewatkan pada jalur gateway yang sama juga. Kelebihan dari PCC ini yang menjawab banyaknya keluhan sering putusnya koneksi pada teknik loadbalancing lainnya sebelum adanya PCC karena perpindahan gateway..<br />Sebelum membuat mangle loadbalance, untuk mencegah terjadinya loop routing pada trafik, maka semua trafik client yang menuju network yang terhubung langsung dengan router, harus kita bypass dari loadbalancing. Kita bisa membuat daftar IP yang masih dalam satu network router dan memasang mangle pertama kali sebagai berikut<br /></div>
<table><tbody>
<tr><td bgcolor="#ffffcc" style="font-size: 11px; line-height: 12pt;">/ip firewall address-list<br />add address=192.168.101.0/30 list=lokal<br />add address=192.168.102.0/30 list=lokal<br />add address=10.10.10.0/24 list=lokal<br /><br />/ip firewall mangle<br />add action=accept chain=prerouting dst-address-list=lokal in-interface=wlan2 comment=”trafik lokal”<br />add action=accept chain=output dst-address-list=lokal</td></tr>
</tbody></table>
<br /><br />Pada kasus tertentu, trafik pertama bisa berasal dari Internet, seperti penggunaan remote winbox atau telnet dari internet dan sebagainya, oleh karena itu kita juga memerlukan mark-connection untuk menandai trafik tersebut agar trafik baliknya juga bisa melewati interface dimana trafik itu masuk<br /><br /><table><tbody>
<tr><td bgcolor="#ffffcc" style="font-size: 11px; line-height: 12pt;">/ip firewall mangle<br />add action=mark-connection chain=prerouting connection-mark=no-mark in-interface=ether1 new-connection-mark=con-from-isp1 passthrough=yes comment=”trafik dari isp1”<br />add action=mark-connection chain=prerouting connection-mark=no-mark in-interface=ether2 new-connection-mark=con-from-isp2 passthrough=yes comment=”trafik dari isp2”</td></tr>
</tbody></table>
<br /><br />Umumnya, sebuah ISP akan membatasi akses DNS servernya dari IP yang hanya dikenalnya, jadi jika anda menggunakan DNS dari salah satu ISP anda, anda harus menambahkan mangle agar trafik DNS tersebut melalui gateway ISP yang bersangkutan bukan melalui gateway ISP lainnya. Disini kami berikan mangle DNS ISP1 yang melalui gateway ISP1. Jika anda menggunakan publik DNS independent, seperti opendns, anda tidak memerlukan mangle dibawah ini.<br /><br /><table><tbody>
<tr><td bgcolor="#ffffcc" style="font-size: 11px; line-height: 12pt;">/ip firewall mangle<br />add action=mark-connection chain=output comment=dns dst-address=202.65.112.21 dst-port=53 new-connection-mark=dns passthrough=yes protocol=tcp comment=”trafik DNS citra.net.id”<br />add action=mark-connection chain=output dst-address=202.65.112.21 dst-port=53 new-connection-mark=dns passthrough=yes protocol=udp<br />add action=mark-routing chain=output connection-mark=dns new-routing-mark=route-to-isp1 passthrough=no</td></tr>
</tbody></table>
<br /><br />Karena kita menggunakan webproxy pada router, maka trafik yang perlu kita loadbalance ada 2 jenis. Yang pertama adalah trafik dari client menuju internet (non HTTP), dan trafik dari webproxy menuju internet. Agar lebih terstruktur dan mudah dalam pembacaannya, kita akan menggunakan custom-chain sebagai berikut :<br /><br /><table><tbody>
<tr><td bgcolor="#ffffcc" style="font-size: 11px; line-height: 12pt;">/ip firewall mangle<br />add action=jump chain=prerouting comment=”lompat ke client-lb” connection-mark=no-mark in-interface=wlan2 jump-target=client-lb<br />add action=jump chain=output comment=”lompat ke lb-proxy” connection-mark=no-mark out-interface=!wlan2 jump-target=lb-proxy</td></tr>
</tbody></table>
<br /><br />Pada mangle diatas, untuk trafik loadbalance client pastikan parameter in-interface adalah interface yang terhubung dengan client, dan untuk trafik loadbalance webproxy, kita menggunakan chain output dengan parameter out-interface yang bukan terhubung ke interface client. Setelah custom chain untuk loadbalancing dibuat, kita bisa membuat mangle di custom chain tersebut sebagai berikut<br /><br /><table><tbody>
<tr><td bgcolor="#ffffcc" style="font-size: 11px; line-height: 12pt;">/ip firewall mangle<br />add action=mark-connection chain=client-lb dst-address-type=!local new-connection-mark=to-isp1 passthrough=yes per-connection-classifier=both-addresses:3/0 comment=”awal loadbalancing klien”<br />add action=mark-connection chain=client-lb dst-address-type=!local new-connection-mark=to-isp1 passthrough=yes per-connection-classifier=both-addresses:3/1<br />add action=mark-connection chain=client-lb dst-address-type=!local new-connection-mark=to-isp2 passthrough=yes per-connection-classifier=both-addresses:3/2<br />add action=return chain=client-lb comment=”akhir dari loadbalancing”<br /><br />/ip firewall mangle<br />add action=mark-connection chain=lb-proxy dst-address-type=!local new-connection-mark=con-from-isp1 passthrough=yes per-connection-classifier=both-addresses:3/0 comment=”awal load balancing proxy”<br />add action=mark-connection chain=lb-proxy dst-address-type=!local new-connection-mark=con-from-isp1 passthrough=yes per-connection-classifier=both-addresses:3/1<br />add action=mark-connection chain=lb-proxy dst-address-type=!local new-connection-mark=con-from-isp2 passthrough=yes per-connection-classifier=both-addresses:3/2<br />add action=return chain=lb-proxy comment=”akhir dari loadbalancing”</td></tr>
</tbody></table>
<br /><br />Untuk contoh diatas, pada loadbalancing client dan webproxy menggunakan parameter pemisahan trafik pcc yang sama, yaitu both-address, sehingga router akan mengingat-ingat berdasarkan src-address dan dst-address dari sebuah koneksi. Karena trafik ISP kita yang berbeda (512kbps dan 256kbps), kita membagi beban trafiknya menjadi 3 bagian. 2 bagian pertama akan melewati gateway ISP1, dan 1 bagian terakhir akan melewati gateway ISP2. Jika masing-masing trafik dari client dan proxy sudah ditandai, langkah berikutnya kita tinggal membuat mangle mark-route yang akan digunakan dalam proses routing nantinya<br /><br /><table><tbody>
<tr><td bgcolor="#ffffcc" style="font-size: 11px; line-height: 12pt;">/ip firewall mangle<br />add action=jump chain=prerouting comment=”marking route client” connection-mark=!no-mark in-interface=wlan2 jump-target=route-client<br />add action=mark-routing chain=route-client connection-mark=to-isp1 new-routing-mark=route-to-isp1 passthrough=no<br />add action=mark-routing chain=route-client connection-mark=to-isp2 new-routing-mark=route-to-isp2 passthrough=no<br />add action=mark-routing chain=route-client connection-mark=con-from-isp1 new-routing-mark=route-to-isp1 passthrough=no<br />add action=mark-routing chain=route-client connection-mark=con-from-isp2 new-routing-mark=route-to-isp2 passthrough=no<br />add action=return chain=route-client disabled=no<br /><br />/ip firewall mangle<br />add action=mark-routing chain=output comment=”marking route proxy” connection-mark=con-from-isp1 new-routing-mark=route-to-isp1 out-interface=!wlan2 passthrough=no<br />add action=mark-routing chain=output connection-mark=con-from-isp2 new-routing-mark=route-to-isp2 out-interface=!wlan2 passthrough=no</td></tr>
</tbody></table>
<br /><br /><br /><strong>Pengaturan Routing</strong><br /><br />
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Pengaturan mangle diatas tidak akan berguna jika anda belum membuat routing berdasar mark-route yang sudah kita buat. Disini kita juga akan membuat routing backup, sehingga apabila sebuah gateway terputus, maka semua koneksi akan melewati gateway yang masing terhubung<br /></div>
<table><tbody>
<tr><td bgcolor="#ffffcc" style="font-size: 11px; line-height: 12pt;">/ip route<br />add check-gateway=ping dst-address=0.0.0.0/0 gateway=192.168.101.1 routing-mark=route-to-isp1 distance=1<br />add check-gateway=ping dst-address=0.0.0.0/0 gateway=192.168.102.1 routing-mark=route-to-isp1 distance=2<br />add check-gateway=ping dst-address=0.0.0.0/0 gateway=192.168.102.1 routing-mark=route-to-isp2 distance=1<br />add check-gateway=ping dst-address=0.0.0.0/0 gateway=192.168.101.1 routing-mark=route-to-isp2 distance=2</td></tr>
</tbody></table>
<strong><br /><br />Pengujian </strong><br /><br />
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Dari hasil pengujian kami, didapatkan sebagai berikut </div>
<div align="center" style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img alt="" height="384" src="http://www.mikrotik.co.id/images/artikel/LoadBalance/LoadBalance-test.jpg" title="" width="420" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<br /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Dari gambar terlihat, bahwa hanya dengan melakukan 1 file download (1 koneksi), kita hanya mendapatkan speed 56kBps (448kbps) karena pada saat itu melewati gateway ISP1, sedangkan jika kita mendownload file (membuka koneksi baru) lagi pada web lain, akan mendapatkan 30kBps (240kbps). Dari pengujian ini terlihat dapat disimpulkan bahwa </div>
<div align="center" style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<strong>512kbps + 256kbps ≠ 768kbps</strong> </div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<strong>Catatan :</strong> </div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
* Loadbalancing menggunakan teknik pcc ini akan berjalan efektif dan mendekati seimbang jika semakin banyak koneksi (dari client) yang terjadi.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
* Gunakan ISP yang memiliki bandwith FIX bukan Share untuk mendapatkan hasil yang lebih optimal.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
* Load Balance menggunakan PCC ini bukan selamanya dan sepenuhnya sebuah solusi yang pasti berhasil baik di semua jenis network, karena proses penyeimbangan dari traffic adalah berdasarkan logika probabilitas. </div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<br /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
By: Pujo Dewobroto (Mikrotik.co.id) </div>
<br class="Apple-interchange-newline" />Anak Bangsawanhttp://www.blogger.com/profile/09063631266573210417noreply@blogger.com0tag:blogger.com,1999:blog-4155937808142756507.post-75839193630492577682012-04-04T06:46:00.001-07:002012-04-04T06:46:29.286-07:00RB250GS sebagai Multi Fungsi Switch<br />
<div align="center" style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<div align="left">
<strong>LAN ?</strong><br /><br />Lan adalah sebuah jaringan area lokal yang didefinisikan dan dinaungi oleh alamat network dan alamat broadcast yang sama.<br />Perlu Anda ingat juga bahwa pada perangkat Router akan menghentikan traffic broadcast apapun itu protocolnya, tetapi pada switch akan secara otomatis akan meneruskannya.<br /><br /><br /><strong>VLAN ?</strong><br /><br />VLAN adalah Virtual LAN yaitu sebuah jaringan LAN yang secara virtual dibuat di sebuah switch. Pada switch standard biasanya akan meneruskan traffic dari satu port ke semua port yang lain ketika ada traffic dengan domain broadcast yang sama melewati port tersebut.<br />Untuk switch yang khusus, mereka mampu untuk membuat beberapa LAN yang berbeda dengan id yang berbeda di tiap portnya, dan hanya akan meneruskan traffic ke port-port yang memiliki id yang sama.<br />Switch type khusus ini sebenarnya sudah secara otomatis memasang VLAN di dalamnya (vlan id = 1) yang beranggotakan semua port yang ada.<br /><br /><br /><strong>Mengapa VLAN dibutuhkan ?<br /></strong>Menjadi Sangat penting juga VLAN ini digunakan, yaitu ketika network Anda menjadi semakin besar skalanya dan traffic broadcast menjadi beban di seluruh network Anda.<br />Beban terlalu besar yang disebabkan oleh traffic broadcast ini bisa menyebabkan network Anda jatuh dan tidak se-responsif sebelumnya.<br /><br /><br /><strong>Kapan VLAN perlu diimplementasikan ?</strong><br /><br />Anda memerlukan VLAN ketika kondisi jaringan Anda :<br /><br /><ul>
<li>Memiliki lebih dari 200 node perangkat di dalam jaringan Anda</li>
<li>Banyak terjadi traffic broadcast di jaringan Anda</li>
<li>Anda ingin membagi beberapa user Anda menjadi group-group tersendiri untuk meningkatkan keamanan</li>
<li>Mengurangi traffic broadcast yang banyak disebabkan oleh serangan virus dan program pengganggu lain yang akan memporak porandakan jaringan Anda.</li>
<li>Atau Anda hanya ingin membuat beberapa virtual switch dari switch yang sudah ada</li>
</ul>
<br /><strong>Mengapa tidak menggunakan satu subnet saja ?</strong><br /><br />Pada perkembangan jaringan Anda, bisa saja membutuhkan perlakukan yang berbeda (VOIP network, server network, local network, Gateway yang berbeda) tetapi masih berada di dalam infrastruktur dan lokasi yang sama.<br />Atau bisa juga sebaliknya, Anda memiliki beberapa perangkat yang berlainan infrastruktur dan lokasi tetapi masih berada dalam satu segmen network yang sama (infrastructure sharing).<br /><br /><br /><strong>Bagaimana perangkat yang berbeda VLAN bisa berkomunikasi ?</strong><br /><br />Pada perangkat yang berbeda vlan akan dapat berkomunikasi satu sama lain melalui router (routing protocol). Sama seperti halnya beberapa subnet yang berbeda berkomunikasi satu sama lain dengan bantuan router.<br /><br /><br /><strong>RB250GS ?</strong><br /><br />Salah satu produk Mikrotik terbaru yaitu RB250GS adalah termasuk didalam switch khusus yang bisa mengimplementasikan VLAN di setiap portnya. Dan mungkin switch manageable terkecil dan termurah yang pernah dibuat. Selain membuat Jaringan Anda lebih terorganisasi dengan baik mungkin switch kecil ini bisa menjadi sarana hemat Anda untuk mengenal dan mengimplementasikan VLAN di jaringan Anda. <br /><br /><strong>Implementasi Dasar VLAN menggunakan RB250GS</strong><br /><br />Pada bagan di bawah ini adalah bagan jaringan untuk contoh implememtasi VLAN yang bisa dilakukan oleh produk router mikrotik dan tentunya dipadukan dengan switch mikrotik RB250GS. </div>
<br /><img alt="" height="367" src="http://www.mikrotik.co.id/images/artikel/rb250gs/bagan1_copy.jpg" title="" width="400" /><br /><br /><img alt="" height="104" src="http://www.mikrotik.co.id/images/artikel/rb250gs/Slide3.jpg" title="" width="300" /><br /><br /><div align="left">
Pada Bagan Network di atas sudah digambarkan se-sederhana mungkin dengan dilengkapi keterangan jalur dan warna yang berbeda untuk membedakan fungsi dan tugasnya.<br /><br />Jalur Internet akan masuk ke dalam router mikrotik Anda melalui interface<strong>Ether1</strong> dan akan didistribusikan kembali ke jaringan Local melalui Interface<strong>Ether2</strong>.<br /><br />Pada Ether2 di router terdapat 2 VLAN yaitu <strong>VLAN2</strong> (untuk melambangkan segmen network 1) dan <strong>VLAN3 </strong>(untuk melambangkan segmen network 2). Kedua informasi VLAN ini akan diteruskan ke switch RB250GS dengan menghubungkan Ether2 dari router ke <strong>Ether1-Switch</strong>.<br /> <br />Pada switch RB250GS segmen network 1 dan network 2 akan didistribusikan ke interface yang berbeda, yaitu network 1 distribusi ke <strong>Ether2-Switch</strong>sedangkan segmen network 2 akan didistribusikan ke <strong>Ether3-Switch</strong>.<br /><br />Dengan konfigurasi seperti ini, semua Perangkat apapun yang tekoneksi ke Ether2-Switch (<strong>PC</strong>, <strong>Printer</strong>) akan memiliki subnet yang berbeda dengan perangakat (<strong>Server</strong>, <strong>Voip phone</strong>, <strong>IP Cam</strong>) yang terhubung ke Ether3-Switch.<br /><br />Semua perangkat yang terhubung di kedua port switch ini harus menggunakan routing terlebih dahulu di router untuk berkomunikasi satu sama lain. <a name='more'></a></div>
<br /><br /><div align="left">
<strong>Trunk Link ?</strong><br /><br />Trunk link adalah sebuah komunikasi antara <strong>Switch dengan Switch</strong> atau bisa juga antara <strong>Switch dengan Router</strong>, yang membawa informasi beberapa VLAN (VLAN ID) yang bebeda diantara kedua perangkat tersebut. Pada Ether2 di router akan menyeberangkan informasi VLAN2 (<strong>VLAN ID=2</strong>) dan VLAN3 (<strong>VLAN ID=3</strong>) ke Ether1-Switch. </div>
<div align="left">
<br /></div>
<img alt="" height="284" src="http://www.mikrotik.co.id/images/artikel/rb250gs/vlan_2.png" title="" width="375" /><br /><br /><br /><img alt="" height="288" src="http://www.mikrotik.co.id/images/artikel/rb250gs/vlan_3.png" title="" width="374" /><br /><br /><div align="left">
Pada dua gambar capture di atas adalah contoh pembuatan Trunk Interface di router (Interface master Ether2).<br />IP Address yang berbeda segmen sudah bisa dipasang di kedua Vlan interface.<br /><br /><br /><strong>RB250GS Config<br /></strong>Langkah selanjutnya adalah melakukan konfigurasi Switch manageable RB250GS, Untuk konfigurasi RB250GS dilakukan menggunakan Web browser dan gunakan <strong>Username</strong>=admin <strong>password</strong>=[kosong].<br />Direkomendasikan untuk langkah awal adalah mengubah ip default di switch dari 192.168.88.1 menjadi ip yang lain untuk menghindari terjadinya conflict dengan ip default router. </div>
<br /><img alt="" height="220" src="http://www.mikrotik.co.id/images/artikel/rb250gs/ganti_ip_copy.jpg" title="" width="400" /><br /><br /><div align="left">
<strong>Vlan Table </strong><br />Langkah selanjutnya adalah untuk mendaftarkan Vlan ID yang akan didistribusikan ke switch. <strong>Port1-Switch</strong> akan bertindak sebagai trunk port sehingga Vlan2 dan Vlan3 akan diforward di port ini. Sedangkan pada<strong>Port2-Switch</strong> akan hanya memforward vlan 2 dan <strong>Port3-Switch</strong> hanya akan memforward vlan 3. </div>
<img alt="" height="136" src="http://www.mikrotik.co.id/images/artikel/rb250gs/vlan_table_copy.jpg" title="" width="440" /><br /><div align="left">
Ilustrasi di atas dalah contoh config untuk Membuat Vlan table di RB250GS.<br /><br />Pada switch manageable dikenal adanya <strong>Ingress Filtering</strong> dan <strong>Egress Filtering</strong> untuk mengatur bagaimana switch memperlakukan traffic yang datang dan meninggalkan port tersebut.<br />Ingress filtering adalah policy dari switch untuk mengatur traffic yang datang, sedangkan Egress filter untuk mengatur traffic yang keluar dari port tersebut. </div>
<br /><img alt="" height="207" src="http://www.mikrotik.co.id/images/artikel/rb250gs/vlan_tag_copy.jpg" title="" width="440" /><br /><br /><div align="left">
Pada ilustrasi di atas menunjukkan pada Ingress port di switch RB250GS pada port 1,2 dan 3 akan diperlakukan vlan forward policy (<strong>Vlan Mode = Enabled</strong>), yang disesuaikan dengan konfigurasi di Vlan table.<br />Pada setting Egress filter policy akan menunjukkan fungsi dari port itu sendiri. Contohnya pada Port1-Switch karena bertindak sebagai Trunk maka policy yang digunakan adalah "<strong>add if missing</strong>", sedangkan pada Port2 dan Port3-Switch akan bertindak sebagai Access port maka akan menggunakan policy "<strong>always strip</strong>".<br /><br />Cara kerjanya adalah sebagai berikut :<br /><ul>
<li>Traffic yang datang dari Port1-Switch adalah traffic yang memiliki vlan header dan Vlan ID yang akan diterima dan diteruskan adalah Vlan dengan ID 2 dan 3 (sesuai dengan Vlan table).</li>
<li>Kita ambil contoh Ketika ada traffic dari Router dengan vlan ID=2 maka akan diteruskan ke Port2-Switch (sesuai vlan table). Dan pada saat traffic meninggalkan port2-switch, vlan header akan dihilangkan (egress policy di port2-switch yaitu "always strip").</li>
<li>Berbeda perlakuannya Pada traffic balik atau traffic balas yang datang dari port2-Switch menuju ke router maka akan diforward ke port1-switch, dan akan ditambahkan vlan header sesuai dengan default vlan id yang ada di port2-switch pada saat traffic meninggalkan port1-swith (egress port policy add if missing).</li>
</ul>
<br /><strong>Kombinasi dengan Switch Manageable lain</strong><br /><br />Ada kondisi tertentu dimana Anda sudah mengimplementasikan VLAN di network Anda, dan kebetulan memang sudah memiiki beberapa vlan yang ada di switch manageable Anda. Maka jika Anda ingin menggabungkan atau mengkombinasi antara switch manageable yang sudah ada dengan switch RB250GS, maka konfigurasi di RB250GS tidak akan jauh berbeda.<br />Kuncinya ada di vlan ID yang sudah ada sebelumnya tetap harus dideklarasikan di vlan table RB250GS, dan port trunk tetap harus dibuat di salah satu port. Port trunk ini akan menjadi penjembatan antara Swich manageable Anda dengan RB250GS ini sendiri.<br /> </div>
<img alt="" height="279" src="http://www.mikrotik.co.id/images/artikel/rb250gs/bagan2_copy.jpg" title="" width="400" /><br /><br /><div align="left">
Pada bagan diatas, merupakan contoh bagan pengguaan RB250GS yang dikombinasikan dengan Switch manageable yang lain. </div>
<br /><img alt="" height="322" src="http://www.mikrotik.co.id/images/artikel/rb250gs/switch_manageable_copy.jpg" title="" width="440" /><br /><br /><div align="left">
Trunk port harus dibuat di switch manageable yaitu untuk menghubungkan antara router ke switch manageable dan satu lagi trunk port untuk menghubungkan switch manageable tersebut ke switch RB250GS. </div>
</div>
<br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><span style="background-color: white; font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">By. Novan Chris </span><br style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;" /><br class="Apple-interchange-newline" />Anak Bangsawanhttp://www.blogger.com/profile/09063631266573210417noreply@blogger.com0tag:blogger.com,1999:blog-4155937808142756507.post-9907998687609241462012-04-04T06:45:00.001-07:002012-04-04T06:45:20.151-07:00Mikrotik sebagai 3G/EVDO Router<br />
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Port USB layaknya di perangkat PC, bisa digunakan untuk media storage tambahan seperti USB flashdisk. Ternyata bisa juga difungsikan sebagai interface untuk menghubungkan modem 3G/EVDO. Sehingga menjadikan perangkat Mikrotik lebih flexible dalam pemasangannya, terutama di lokasi yang belum terjangkau koneksi internet yang biasanya menggunakan kabel ataupun wireless. </div>
<div align="center" style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img alt="" height="191" src="http://www.mikrotik.co.id/images/artikel/usb-router/751-usb.jpg" title="" width="400" /> </div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Perangkat RouterBoard yang telah support interface USB mempunyai ciri-ciri memiliki kode “U” seperti RB411U, RB411UAHR, RB433UAH, RB751U-2HnD, RB751G-2HnD, RB750UP dan sebagainya. (Catatan: Untuk RB411UAHR dibutuhkan USB power injector untuk menghidupkan sebuah perangkat USB). </div>
<a name='more'></a><br /><br />
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<strong>Topologi</strong><br />Dalam artikel ini akan diberikan tutorial langkah langkah dalam menggunakan fungsi port USB untuk modem, sebagai gambaran kondisi jaringan, tutorial kali ini menggunakan perangkat RouterBoard Indoor RB751U-2HnD dan modem sierra 3G 881U, dimana bentuk topologinya seperti yang ada pada gambar dibawah :</div>
<div align="center" style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img alt="" height="306" src="http://www.mikrotik.co.id/images/artikel/usb-router/RB751U-2HnD.jpg" title="" width="440" /> </div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<br />Berikut ini Beberapa langkah yang harus kita lakukan dalam konfigurasi : </div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<strong><br /></strong></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<strong>IP Address</strong><br />Langkah pertama kita tambahkan di router kita adalah IP Address di interface yang akan kita gunakan untuk jaringan lokal. </div>
<div align="center" style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img alt="" height="137" src="http://www.mikrotik.co.id/images/artikel/usb-router/settingip.jpg" title="" width="336" /> </div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<strong>Wireless Access Point</strong><br />berikutnya adalah mengaktifkan interface wlan1 sebagai access point untuk distribusi koneksi wireless ke jaringan local. </div>
<div align="center" style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img alt="" height="178" src="http://www.mikrotik.co.id/images/artikel/usb-router/settingwireless.jpg" title="" width="444" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<strong><br /></strong></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<strong>DNS</strong><br />Untuk setting DNS kita harus mengaktifkan parameter “allow remote request” supaya client kita bisa request DNS ke router kita. </div>
<div align="center" style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img alt="" height="166" src="http://www.mikrotik.co.id/images/artikel/usb-router/settingdns.jpg" title="" width="364" /> </div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<strong><br /></strong></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<strong>USB Devices</strong><br />Jika IP, interface (ethernet dan wireless) dan DNS sudah dikonfigurasi, kita pasangkan 3G modem kita ke port usb di router. Hal yang perlu kita cek kembali adalah menu "/system resource usb". </div>
<div align="center" style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img alt="" height="265" src="http://www.mikrotik.co.id/images/artikel/usb-router/resource.jpg" title="" width="360" /> </div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Untuk perangkat yang sudah disupport Mikrotik, biasanya akan muncul USB device baru secara otomatis. Mikrotik juga akan membuatkan interface baru “ppp-out1”. </div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<strong>PPP-Out Internet Dial</strong><br />Untuk memasukkan Username, Password dan APN dari provider kita, kita masukan di interface ppp-out1 yang sudah dibuat oleh Mikrotik.</div>
<div align="center" style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img alt="" height="429" src="http://www.mikrotik.co.id/images/artikel/usb-router/interfaceppp.jpg" title="" width="430" /> </div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<strong>NAT Masquerade</strong><br />Langkah terakhir, kita harus menambahkan srcnat masquerade untuk interface ppp-out1 supaya client bisa akses ke internet.</div>
<div align="center" style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img alt="" height="273" src="http://www.mikrotik.co.id/images/artikel/usb-router/nat.jpg" title="" width="400" /> </div>
<div align="left" style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Catatan : Pastikan bahwa modem yang anda gunakan sudah sikenali oleh OS mikrotik. Daftar lengkap Modem yang sudah dikenali oleh OS mikrotik ada di :</div>
<div align="left" style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
http://wiki.mikrotik.com/wiki/Supported_Hardware#3G_cards</div>
<div align="left" style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<br /></div>
<div align="left" style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
by. Pujo Dewobroto </div>
<br class="Apple-interchange-newline" />Anak Bangsawanhttp://www.blogger.com/profile/09063631266573210417noreply@blogger.com0tag:blogger.com,1999:blog-4155937808142756507.post-3148810940073881402012-04-04T06:40:00.002-07:002012-04-04T06:56:36.080-07:00Artikel BGP-Peer, Memisahkan Routing dan Bandwidth Management<br />
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Dalam artikel ini, akan dibahas cara untuk melakukan BGP-Peer ke BGP Router Mikrotik Indonesia untuk melakukan pemisahan gateway untuk koneksi internet internasional dan OpenIXP (NICE). Setelah pemisahan koneksi ini dilakukan, selanjutnya akan dibuat queue untuk tiap klien, yang bisa membatasi penggunaan untuk bandwidth internasional dan OpenIXP (NICE).</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Beberapa asumsi yang akan dipakai untuk kasus kali ini adalah :</div>
<ol style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<li>Router memiliki 3 buah interface, yang masing-masing terhubung ke gateway internasional, gateway OpenIXP (NICE), dan ke network klien.</li>
<li>Untuk koneksi ke OpenIXP (NICE), router milik Anda harus memiliki IP publik.</li>
<li>Untuk klien, akan menggunakan IP private, sehingga akan dilakukan NAT (network address translation)</li>
<li>Mikrotik RouterOS Anda menggunakan versi 2.9.39 atau yang lebih baru, dan mengaktifkan paket routing-test</li>
</ol>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img border="0" height="373" src="http://www.mikrotik.co.id/images/artikel/bgp-09.png" width="438" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Jika Anda menghadapi kondisi yang tidak sesuai dengan parameter di atas, harus dilakukan penyesuaian.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img border="0" height="18" src="http://www.mikrotik.co.id/images/line.gif" width="438" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<strong>PENGATURAN DASAR</strong></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Diagram network dan konfigurasi IP Address yang digunakan pada contoh ini adalah seperti gambar berikut ini.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img border="0" height="336" src="http://www.mikrotik.co.id/images/artikel/bgp-01.png" width="438" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Untuk mempermudah pemberian contoh, kami mengupdate nama masing-masing interface sesuai dengan tugasnya masing-masing.<br />
</div>
<table border="0" cellpadding="3" cellspacing="0"><tbody>
<tr><td bgcolor="#FFFFCC" style="font-size: 11px; line-height: 12pt;"><pre>[admin@MikroTik] > /in pr
Flags: X - disabled, D - dynamic, R - running
# NAME TYPE RX-RATE TX-RATE MTU
0 R ether1-intl ether 0 0 1500
1 R ether2-iix ether 0 0 1500
2 R ether3-client ether 0 0 1500
</pre>
</td></tr>
</tbody></table>
<br />
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Konfigurasi IP Address sesuai dengan contoh berikut ini. Sesuaikanlah dengan IP Address yang Anda gunakan. Dalam contoh ini, IP Address yang terhubung ke OpenIXP (NICE) menggunakan IP 202.65.113.130/29, terpasang pada interface ether2-iix dan gatewaynya adalah 202.65.113.129. Sedangkan untuk koneksi ke internasional menggunakan IP Address 69.1.1.2/30 pada interface ether1-intl, dengan gateway 69.1.1.1.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Untuk klien, akan menggunakan blok IP 192.168.1.0/24, dan IP Address 192.168.1.1 difungsikan sebagai gateway dan dipasang pada ether3-client. Klien dapat menggunakan IP Address 192.168.1-2 hingga 192.168.1.254 dengan subnet mask 255.255.255.0.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img border="0" height="79" src="http://www.mikrotik.co.id/images/artikel/bgp-02.png" width="438" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Jangan lupa melakukan konfigurasi DNS server pada router, dan mengaktifkan fitur "allow remote request".</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Karena klien menggunakan IP private, maka kita harus melakukan fungsi src-nat untuk kedua jalur gateway.<br />
</div>
<table border="0" cellpadding="3" cellspacing="0"><tbody>
<tr><td bgcolor="#FFFFCC" style="font-size: 11px; line-height: 12pt;"><pre>[admin@MikroTik] > /ip fi nat pr
Flags: X - disabled, I - invalid, D - dynamic
0 chain=srcnat out-interface=ether1-intl action=masquerade
1 chain=srcnat out-interface=ether2-iix action=masquerade
</pre>
</td></tr>
</tbody></table>
<br />
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
CEK: Pastikan semua konfigurasi telah berfungsi baik. Buatlah default route pada router secara bergantian ke IP gateway OpenIXP (NICE) dan internasional. Lakukanlah ping (baik dari router maupun dari klien) ke luar network Anda secara bergantian.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img border="0" height="18" src="http://www.mikrotik.co.id/images/line.gif" width="438" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<strong>PENGATURAN BGP-PEER</strong></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Pertama-tama, pastikan bahwa Anda menggunakan gateway internasional Anda sebagai default route, dalam contoh ini adalah 69.1.1.1. Kemudian Anda perlu membuat sebuah static route ke mesin BGP Mikrotik Indonesia, yaitu IP 202.65.120.250.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Lalu periksalah apakah Anda bisa melakukan ping ke 202.65.120.250. Periksalah juga dengan traceroute dari router, apakah jalur pencapaian ke IP 202.65.120.250 telah melalui jalur koneksi yang diperuntukkan bagi trafik OpenIXP (NICE), dan bukan melalui jalur internasional.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img border="0" height="112" src="http://www.mikrotik.co.id/images/artikel/bgp-03.png" width="438" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Kemudian, Anda harus mendaftarkan IP Address Anda di website Mikrotik Indonesia untuk mengaktifkan layanan BGP-Peer ini. Aktivasi bisa dilakukan di <a href="http://www.mikrotik.co.id/user_bgp_aktivasi.php" style="color: #751208;">halaman ini</a>. IP Address yang bisa Anda daftarkan hanyalah IP Address yang bisa di-ping dari mesin kami, dan juga harus sudah diadvertise di OIXP. Aturan selengkapnya mengenai penggunaan layanan ini bisa dibaca di <a href="http://www.mikrotik.co.id/index_lihat.php?id=22" style="color: #751208;">halaman ini</a>. Setelah Anda mendaftarkan IP Address Anda, jika semua syarat sudah terpenuhi, Anda akan diinformasikan bahwa aktivasi layanan BGP-Peer Anda sudah sukses. Selanjutnya Anda bisa melihat status layanan BGP Anda di <a href="http://www.mikrotik.co.id/user_bgp_manage.php" style="color: #751208;">halaman ini</a>.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
BGP Router Mikrotik Indonesia akan menggunakan IP Address 202.65.120.250 dan AS Number 64888, dan Router Anda akan menjadi BGP Peer dengan menggunakan AS Number 64666.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Berikutnya adalah langkah-langkah yang harus Anda lakukan pada router Anda. Pertama-tama Anda harus membuat beberapa prefix-list untuk BGP ini. Untuk prefix yang akan Anda terima, untuk alasan keamanan dan hematnya agregasi routing, maka Anda perlu melakukan setting untuk menerima hanya prefix 8 hingga 24. Prefix 0 sampai 7, dan 25 sampai 32 akan Anda blok. Prefix ini kita berinama prefix-in. Untuk prefix-in yang accept, harap diperhatikan bahwa Anda perlu menentukan gateway untuk informasi routing ini, yaitu IP gateway OpenIXP (NICE) Anda. Dalam contoh ini adalah 202.65.113.129. Gantilah IP ini sesuai dengan gateway OpenIXP (NICE) Anda.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Sedangkan karena sifat BGP-Peer ini hanya Anda menerima informasi routing saja, di mana Anda tidak dapat melakukan advertisement, maka harus dilakukan blok untuk semua prefix yang dikirimkan, dan kita beri nama prefix-out.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Berikut ini adalah konfigurasi prefix list yang telah dibuat.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img border="0" height="86" src="http://www.mikrotik.co.id/images/artikel/bgp-04.png" width="438" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Tahap selanjutnya adalah konfigurasi BGP instance. Yang perlu di-set di sini hanyalah AS Number Anda, pada kasus ini kita menggunakan AS Number private, yaitu 64666.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img border="0" height="78" src="http://www.mikrotik.co.id/images/artikel/bgp-05.png" width="438" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Dan langkah terakhir pada konfigurasi BGP ini adalah konfigurasi peer. AS Number BGP Router Mikrotik Indonesia adalah 64888 dan IP Addressnya adalah 202.65.120.250. Karena kita sulit menentukan berapa hop jarak BGP Router Mikrotik Indonesia dengan Router Anda, maka kita melakukan konfigurasi TTL menjadi 255. Jangan lupa mengatur rule prefix-in dan prefix-out sesuai dengan prefix yang telah kita buat sebelumnya.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img border="0" height="90" src="http://www.mikrotik.co.id/images/artikel/bgp-06.png" width="438" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Setelah langkah ini, seharusnya BGP Router Mikrotik sudah dapat terkoneksi dengan Router Anda. Koneksi ini ditandai dengan status peer yang menjadi "established" dan akan dicantumkan pula jumlah informasi routing yang diterima. Anda juga bisa mengecek status peer ini dari sisi BGP Router Mikrotik Indonesia dengan melihat pada <a href="http://www.mikrotik.co.id/user_bgp_manage.php" style="color: #751208;">halaman ini</a>.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img border="0" height="153" src="http://www.mikrotik.co.id/images/artikel/bgp-07.png" width="438" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Cek pula pada bagian IP Route, seharusnya sudah diterima ribuan informasi routing, dan pastikan bahwa gatewaynya sesuai dengan gateway OpenIXP (NICE) Anda, dan berada pada interface yang benar, dalam contoh ini adalah "ether2-iix".</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img border="0" height="401" src="http://www.mikrotik.co.id/images/artikel/bgp-08.png" width="374" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Jika semua sudah berjalan, pastikan bahwa penggunaan 2 buah gateway ini sudah sukses dengan cara melakukan tracerute dari router ataupun dari laptop ke beberapa IP Address baik yang berada di internasional maupun yang berada di jaringan OpenIXP (NICE).<br />
</div>
<table border="0" cellpadding="3" cellspacing="0"><tbody>
<tr><td bgcolor="#FFFFCC" style="font-size: 11px; line-height: 12pt;"><pre>C:>tracert www.yahoo.com
Tracing route to www.yahoo-ht2.akadns.net
[209.131.36.158]
over a maximum of 30 hops:
1 <1 ms <1 ms <1 ms 192.168.1.1
2 1 ms <1 ms <1 ms 69.1.1.1
3 222 ms 223 ms 223 ms 157.130.195.13
4 222 ms 289 ms 222 ms 152.63.54.118
5 226 ms 242 ms ^C
C:>tracert www.cbn.net.id
Tracing route to web.cbn.net.id [210.210.145.202]
over a maximum of 30 hops:
1 <1 ms <1 ms <1 ms 192.168.1.1
2 1 ms <1 ms 1 ms 202.65.113.129
3 11 ms 12 ms 127 ms 218.100.27.218
4 21 ms 41 ms 21 ms 218.100.27.165
5 22 ms 24 ms ^C
</pre>
</td></tr>
</tbody></table>
<br />
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img border="0" height="18" src="http://www.mikrotik.co.id/images/line.gif" width="438" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<strong>PENGATURAN BANDWIDTH MANAGEMENT</strong></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Setelah semua routing dan BGP Peer berjalan dengan baik, yang perlu kita lakukan sekarang adalah mengkonfigurasi bandwidth management. Untuk contoh ini kita akan menggunakan mangle dan queue tree.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Karena network klien menggunakan IP private, maka kita perlu melakukan connection tracking pada mangle. Pastikan bahwa Anda telah mengaktifkan connection tracking pada router Anda.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<img border="0" height="135" src="http://www.mikrotik.co.id/images/artikel/bgp-10.png" width="330" /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Untuk masing-masing trafik, lokal dan internasional, kita membuat sebuah rule mangle connection. Dari connection mark tersebut kemudian kita membuat packet-mark untuk masing-masing trafik.<br />
</div>
<table border="0" cellpadding="3" cellspacing="0"><tbody>
<tr><td bgcolor="#FFFFCC" style="font-size: 11px; line-height: 12pt;"><pre>[admin@MikroTik] > /ip firewall mangle print
Flags: X - disabled, I - invalid, D - dynamic
0 chain=forward out-interface=ether1-intl
src-address=192.168.1.2 action=mark-connection
new-connection-mark=conn-intl
passthrough=yes
1 chain=forward out-interface=ether2-iix
src-address=192.168.1.2 action=mark-connection
new-connection-mark=conn-nice
passthrough=yes
2 chain=forward connection-mark=conn-intl
action=mark-packet
new-packet-mark=packet-intl passthrough=yes
3 chain=forward connection-mark=conn-nice
action=mark-packet new-packet-mark=packet-nice
passthrough=yes
</pre>
</td></tr>
</tbody></table>
<br />
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Untuk setiap klien, Anda harus membuat rule seperti di atas, sesuai dengan IP Address yang digunakan oleh klien.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Langkah berikutnya adalah membuat queue tree rule. Kita akan membutuhkan 4 buah rule, untuk membedakan upstream / downstream untuk koneksi internasional dan lokal.<br />
</div>
<table border="0" cellpadding="3" cellspacing="0"><tbody>
<tr><td bgcolor="#FFFFCC" style="font-size: 11px; line-height: 12pt;"><pre>[admin@MikroTik] > queue tree print
Flags: X - disabled, I - invalid
0 name="intl-down" parent=ether3-client
packet-mark=packet-intl limit-at=0
queue=default priority=8 max-limit=128000
burst-limit=0 burst-threshold=0 burst-time=0s
1 name="intl-up" parent=ether1-intl
packet-mark=packet-intl limit-at=0
queue=default priority=8 max-limit=32000
burst-limit=0 burst-threshold=0 burst-time=0s
2 name="nice-up" parent=ether2-iix
packet-mark=packet-nice limit-at=0
queue=default priority=8 max-limit=256000
burst-limit=0 burst-threshold=0 burst-time=0s
3 name="nice-down" parent=ether3-client
packet-mark=packet-nice limit-at=0
queue=default priority=8 max-limit=1024000
burst-limit=0 burst-threshold=0 burst-time=0s
</pre>
</td></tr>
</tbody></table>
<br />
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
Besarnya limit-at / max-limit dan burst bisa Anda sesuaikan dengan layanan yang dibeli oleh klien.</div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
<br /></div>
<div style="font-family: verdana, tahoma, arial; font-size: 11px; line-height: 16px;">
@ <i><b>MIKROTIK INDONESIA</b></i></div>Anak Bangsawanhttp://www.blogger.com/profile/09063631266573210417noreply@blogger.com0