Tag Archives: internet

SEO untuk Jurnal Ilmiah

Kalo banyak orang membicarakan Search Engine Optimization (SEO) pada web-web mereka, saya akan membawakan artikel yang sedikit berbeda yaitu mengenai SEO khusus untuk jurnal-jurnal ilmiah.

Saya sebagai mahasiswa bidang rekayasa (engineering) sangat sering mencari artikel mengenai bidang yang berhubungan dengan profesi saya, yang paling sering adalah berkaitan dengan dokumen ilmiah, baik itu dokumen teknis, dokumen pendukung teori, ataupun dokumen ilmiah lainnya. Seperti tulisan-tulisan ilmiah lainnya, sebuah tulisan akan lebih bisa dipercayai dan diakui jika tulisan tersebut berada pada tempat yang tepat, misalnya saja website jurnal ilmiah atau website organisasi/perusahaan yang memang bergerak secara profesional di bidang itu, contohnya dokumen yang diletakkan di website sebuah laboratorium, atau website sebuah konsultan.

Format tulisan yang diberikan pun bisa bermacam-macam, mulai dari halaman HTML statik, file presentasi, Microsoft Word (docx), arsip (zip), postscript (ps), Latex, hingga yang terkenal saat ini adalah format PDF. Semua dokumen tersebut terindeks oleh Google. Permasalahan yang sering terjadi adalah banyak artikel-artikel yang bagus namun tidak muncul di halaman depan (baru muncul di halaman ke-n pada hasil pencarian Google).

Setelah melakukan riset (pengamatan) dalam beberapa waktu belakangan ini, saya mengambil beberapa kesimpulan agar dokumen terindeks dengan baik oleh Google:

  1. Dokumen ilmiah sebaiknya ditulis dalam format PDF. Selain format ini memiliki ukuran file yang kecil, format PDF juga bersih dan nyaman saat di baca. Semua orang akan lebih suka membaca file yang siap dibaca dan diprint seperti PDF dan tidak seperti format file yang masih bisa diedit (doc, odt, ppt) dan masih diberi garis bawah berwarna merah akibat fungsi spell checker pada word processor. Hal ini memang tidak berhubungan langsung dengan teknik SEO, tapi pembaca akan lebih memilih membaca format PDF dibandingkan format lainnya.
  2. Beri nama file dengan judul yang sesuai dengan isi artikel. Contohnya saja judul artikel adalah Pushover Analysis for Tall Building, maka beri saja nama file dengan nama yang sama: Pushover Analysis for Tall Building.pdf. Dengan teknik seperti ini, Google akan memberikan nilai lebih pada dokumen tersebut.
  3. Beri judul file dengan nama yang sama dengan judul pada isi artikel. Bingung ya? Maksudnya, ketika kita membuka sebuah file PDF, halaman pertama akan menampilkan judul isi artikel, namun judul file belum tentu sama. Coba saja tekan Alt+Enter pada saat membuka file dengan PDF viewer, kamu akan melihat judul file yang sebenarnya. Judul inilah yang akan diindeks sebagai judul file kita, bukan judul yang diberikan pada halaman pertama file PDF tersebut. Software konverter ke pdf biasanya memberikan opsi untuk judul artikel tersebut.
  4. Beri 1 halaman web khusus untuk tiap 1 artikel. Untuk mengunduh file PDF tersebut, ada baiknya untuk membuat 1 halaman khusus untuk tiap 1 artikel, jangan lupa untuk memberi title halaman web pada header dengan judul artikel tersebut. Bila perlu halaman ini memuat abstrak dokumen ilmiah dan link download untuk artikel ilmiah yang dimaksud.
  5. Semakin banyak artikel yang terpublish di web tersebut, maka semakin tinggi pula nilainya dan akan sering ditampilkan di halaman depan hasil pencarian Google.

OSI Layer dan Model TCP/IP

Artikel ini saya buat dengan tujuan agar saya lebih mudah mengingat kembali mengenai teori OSI Layer dan model TCP/IP. Untuk beberapa hal, terkadang saya sering lupa pada poin-poin penting dari kedua model tersebut. Tulisan ini adalah ringkasan dari buku CCNA Self-Study CCNA INTRO Exam Certification Guide. Bukan berarti jika saya membaca buku tersebut, maka saya akan mengikuti ujian CCNA atau ujian semacamnya, hanya saja buku tersebut memberikan penjelasan yang sangat baik mengenai model OSI dan TCP/IP.

Pada awalnya, setiap alat komunikasi memiliki protokol sendiri-sendiri dalam berkomunikasi dengan alat lain. Misalnya saja mesin IBM akan memiliki protokol komunikasi sendiri yang hanya bisa dimengerti oleh sesama mesin IBM. Mesin IBM ini tidak akan bisa berkomunikasi dengan mesin Apple karena Apple juga memiliki protokol sendiri yang tidak dimengerti oleh mesin lain selain mesin Apple itu sendiri. Jika hendak berkomunikasi dengan mesin yang berbeda, maka dibutuhkan semacam “konverter” agar mesin-mesin tersebut bisa saling mengerti.

Karena terlalu banyak protokol yang berbeda-beda, maka ISO (International Organization for Standardization) melakukan standarisasi agar semua alat yang membutuhkan komunikasi, memiliki protokol yang sama. ISO menyusun protokol tersebut ke dalam model OSI (Open System Interconnection). Tujuannya hanya satu: agar semua alat di seluruh bumi bisa saling berkomunikasi. Protokol ini dibagi menjadi ke dalam 7 layer. Sementara itu, ada lagi protokol yang diciptakan oleh Departemen Pertahanan Amerika Serikat. Protokol ini dikenal sebagai model TCP/IP dengan jumlah 4 layer. Karena model OSI sangat formal dan sangat lamban perkembangannya, maka model yang paling sering dipakai dalam aplikasi praktis adalah model TCP/IP. Sedangkan model OSI hanya dipakai untuk menjelaskan dengan lebih baik mengenai perjalanan paket data dari satu alat ke alat yang lainnya.

Perbandingan Model OSI, TCP/IP, dan NetWare

Perbandingan berbagai model jaringan dan kesetaraannya dengan model lainnya diberikan dalam gambar di atas. Selain kedua model tersebut, ada juga model lainnya seperti model NetWare namun jarang dipakai. Ada juga model-model proprietary dan umumnya tertutup di kalangan perusahaan dan tidak disebarluaskan kepada orang lain.

Model TCP/IP

Model TCP/IP terdiri dari 4 layer: Application (Layer 4), Transport, Internetwork, dan Network Interface Layer (Layer 1).

  • Application layer adalah layer yang bersentuhan langsung dengan aplikasi komputer yang dipakai, contoh protokol yang sering dipakai adalah POP3, IMAP, HTTP, FTP, dan SMTP.
  • Transport layer adalah layer yang berguna untuk pengecekan data dan validitas data. Umumnya ada 2 protokol yang dikenal dalam layer ini: TCP dan UDP. TCP adalah protokol yang memastikan data yang dikirim dan diterima tidak rusak dan semua paket data yang dipecah bisa disusun kembali. Jika ada paket data yang rusak, maka TCP bertugas untuk meminta kembali paket data yang rusak tersebut. Berbeda dengan protokol TCP, protokol UDP tidak perlu mengecek apakah data yang diterima memiliki kondisi baik atau rusak. UDP mirip dengan broadcast data yang kontinu dan hanya 1 kali melakukan pengiriman data. Contoh penggunaan TCP adalah pada browser dan pada aplikasi chatting. Contoh penggunaan UDP adalah pada video broadcasting (live streaming) dan pada permainan game online.
  • Internetwork layer adalah layer yang bertugas sebagai tukang pos yang mengirimkan dan menerima data dari sumber ke tujuan. Semua alat komunikasi memiliki sebuah alamat berupa IP (Internet Protocol). IP ini fungsinya sama seperti alamat rumah. Protokol IP bertugas untuk memasukkan data dan mencantumkan alamat sumber dan alamat tujuan data yang diminta. Layer ini biasanya dikerjakan oleh router yang biasanya lebih tau dalam hal pengiriman data ke suatu alamat.
  • Network Interface layer adalah layer yang berkaitan dengan fisik alat komunikasi yang disambung. Contohnya adalah kartu Ethernet, kabel UTP, termasuk RJ-45 dikategorikan sebagai network interface layer.

Model OSI

Model OSI sangat baik untuk menjelaskan secara detail proses perjalanan data. Model ini lebih direkomendasikan untuk dipelajari karena mencakup berbagai aspek yang bisa dianalisis ketika sedang melakukan troubleshoot atau sedang melakukan analisis yang mendalam.

Fungsi dari masing-masing OSI Layer
OSI Layer

Cara berkomunikasi

Pada dasarnya, setiap layer yang sama akan saling berkomunikasi. Misalnya layer aplikasi pada browser A akan berkomunikasi dengan layer aplikasi pada server WWW di B. Demikian juga dengan layer-layer lainnya hanya dapat berkomunikasi dengan layer yang sama dengan layer tersebut. Agar bisa berkomunikasi, maka layer yang paling atas akan dibantu oleh layer yang lebih bawah. Contohnya, layer aplikasi akan dipaketkan ke dalam data dan dibantu oleh layer protokol TCP. Lalu, paket TCP akan dibungkus dan dibantu oleh paket IP, dst. hingga sampai ke tujuan. Ringkasnya, interaksi layer yang sama dilakukan oleh 2 komputer yang berbeda, sedangkan interaksi layer yang satu dengan layer di bawahnya dilakukan pada komputer yang sama.

Proses pemaketan data ini disebut dengan enkapsulasi. Dalam model TCP/IP, data pada tiap layer akan disertai dengan header. Header dan data ini akan dibungkus dan berikutnya diberikan pada layer di bawahnya. Paket header TCP dan datanya disebut juga dengan Segment, paket header IP dan datanya disebut dengan Packet, dan header Network Interface besarnya datanya disebut dengan Frame.

Enkapsulasi TCP/IP
5 Tahapan enkapsulasi TCP/IP

Sedangkan pada model OSI, paket data dan header pada tiap layer disebut dengan Packet Data Unit (PDU).

Packet Data Unit pada model OSI

Beberapa Tips WordPress Security Hardening

Saya melihat sebuah email pada milis di kampus yang memberitakan adanya website kampus yang di-deface oleh orang yang tidak bertanggung jawab. Website tersebut menggunkan WordPress sebagai content management system (CMS).

Ngomong-ngomong masalah hack, dulu blog ini juga pernah kebobolan. Pengguna mengganti .htaccess dan efek yang dihasilkan adalah redirect ke url lain begitu kita membuka blog ini. Juga pernah kejadian craker mengganti username dan mengganti password di database, tapi syukurlah tidak sampai merusak data-data yang ada.

Sejak saat itu, saya jadi sedikit concern pada sekuritas web terutama wordpress. Banyak sumber yang menyebutkan jika 3rd party pada wordpress seperti themes dan plugin rentan pada serangan-serangan tersebut. Intinya, jika plugin dan themes tidak pernah di-update, maka blog atau web rentan terhadap serangan hacking.

Saya akan memberikan beberapa tips untuk mengamankan website berbasis wordpress dan menurut saya tips ini sudah lebih dari cukup. Cukup bermodalkan htaccess, kita bisa membatasi setiap pergerakan orang yang berniat iseng pada website kita.

  • Buatlah sebuah file .htaccess pada root direktori web, jika sudah ada, silahkan ditambahkan pada bagian bawah baris yang sudah ada.
############
# Disallow #
############
<Files wp-config.php>
  Order allow,deny
  Deny from all
</Files>
<Files readme.html>
  Order allow,deny
  Deny from all
</Files>
<Files install.php>
  Order allow,deny
  Deny from all
</Files>
 
#########
# Allow #
#########
<Files index.php>
  Order allow,deny
  Allow from all
</Files>
  • Buat juga sebuah file .htaccess pada wp-content/plugins
<Files *.php>
  Order allow,deny
  Deny from all
</Files>
<Files smiley.php>
  Order allow,deny
  Allow from all
</Files>
  • Sebuah file .htaccess pada wp-content/themes
<Files *.php>
  Order allow,deny
  Deny from all
</Files>
  • Sebuah lagi pada wp-includes
<Files *.php>
  Order allow,deny
  Deny from all
</Files>
<Files wp-tinymce.php>
  Order allow,deny
  Allow from all
</Files>
  • Sebuah lagi pada wp-includes
<Files *.php>
  Order deny,allow
  Deny from all
  Allow from 127.0.0.1
  Allow from 74.79.0.0/16
  Allow from 179.15.22.0/24
</Files>

Filosofi dari baris-baris tersebut adalah kita membatasi gerakan peretas yang ingin merusak website kita. Kebanyakan file-file wordpress tidak dipanggil secaa langsung ketika dibuka dari browser, melainkan melalui induk file index.php. File inilah yang memanggil file-file yang lainnya. Oleh karena itu, kita bisa memproteksinya dengan menggunakan htacces di atas. Namun ada juga file-file yang diakses secara langsung dan jika kita memproteksinya, otomatis website kita tidak akan berjalan dengan baik. Pengecekan mana file-file yang diakses langsung bisa menggunakan fitur inspect elemen pada google chrome, lalu membuka tab Console. Jika tidak ada error, maka proteksi yang digunakan berjalan dengan baik. Efek dari kode di atas adalah ketika mengakses langsung file yang telah diproteksi, blog akan mengeluarkan kode 404 yang menyatakan bahwa file tidak ada.

Untuk artikel kali ini, saya hanya akan membahas trik dengan htaccess. Untuk menambah keamanan, jangan lupa untuk mengganti permission htaccess menjadi 444. Ini untuk memastikan bahwa file htaccess tidak bisa ditulis secara langsung.

MediaWiki at Localhost and Support for Formula (LaTex)

Recently, I tried to install and use mediawiki for private consume at my own notebook. I get a difficult task when to  integrate it with latex formula. From it’s documentation on internet, there are some extensions that can be used for supporting latex on mediawiki. But, they are using Texvc program. I tried to compile it on Windows, it hard to install and I don’t know what I should do.

When searching again on internet, I stop at Mathtex and Mimetex website and from this web, I know they provide the same function like texvc: for generating latex image. Mathtex provides better formula image than mimitex, but you should install latex program first when compiling it and it gets difficult task (I’m not successfull install mathtex).

Mimetex doesn’t use latex program because they generate images from their own fonts. For consequence, the images is not smooth as mathtex product.

For Windows user, you can use mimetex because it gives you simple solution. Download the source code from mimetex website and compile it with gcc (I use Mingw)

gcc -DAA -DWINDOWS mimetex.c gifsave.c -lm -o mimetex.exe

If you don’t know how to compile, you can download the binary program from this. Choose windows and download mimetex.zip. Open the archieve and you can see a file that has an extension cgi. Save it to your cgi-bin directory on web server (if you use XAMPP, you can save it on /xampp/cgi-bin).

Now, save the codes below to your Mediawiki extensions directory (extensions/Mtag.php). I got it from Mediawiki website.

<?php
# Place this file in extension directory as Mtag.php
# Add the following line to LocalSettings.php:
# include './extensions/Mtag.php';
# Mediawiki will render as LaTeX the code within <m> </m> tags.

$wgExtensionFunctions[] = "wfMtag";
 
function wfMtag() {
        global $wgParser;
        $wgParser->setHook( "m", "returnMtagged" );
}
 
function returnMtagged( $code, $argv)
{
 
# if you have mathtex.cgi installed:
# $txt='<img src="/cgi-bin/mathtex.cgi?'.$code.'">';
# OR if you want to temporarily test a public mathtex.cgi:
 $txt='<img src="http://localhost/cgi-bin/mimetex.cgi?'.$code.'">';
 
 return $txt;
}
 
?>

Then edit your LocalSettings.php so the mediawiki know that we use latex from the extension.

require_once( "$IP/extensions/Mtag.php" );
$wgUseTeX = true;

If you have a mediawiki on shared hosting and they didn’t provide cgi-bin directory or texvc program, you can use online latex generator from mathtex itself. Just change the above code that contains url for generating the image.

$txt='<img src="http://www.forkosh.com/mathtex.cgi?'.$code.'">';

Now, you can generate formula from Mediawiki with example tag

<m> x=23x+7 </m>

But, it’s better if you use your own mathtex program. Finally, you can use formula at your own mediawiki.

Modifikasi Sendiri Theme pada WordPress

Kemarin saya memodifikasi beberapa bagian pada tema wordpress blog ini. Saya menambahkan style pada button agar menarik dan mirip dengan tombol yang digunakan oleh Google. Selain itu, kotak input teks dan teks area saya ubah agar mirip dengan kotak input yang ada pada Twitter, menampilkan border berwarna biru terang (glow).

Kode yang saya gunakan saya ambil dari internet dan saya modifikasi sedikit untuk penyesuaian pada template yang sudah ada.

Untuk tombol (button) Google, kamu bisa mendapatkan tutorial lengkapnya dari blog pixify. Di sana akan diberikan style CSS yang lebih lengkap. Saya hanya menggunakan beberapa potong kode saja.

/* Google style*/
#nav li a,input[type=submit] {
    color: #6e6e6e;
    font: bold 12px Helvetica, Arial, sans-serif;
    text-decoration: none;
    padding: 7px 12px;
    position: relative;
    display: inline-block;
    text-shadow: 0 1px 0 #fff;
    -webkit-transition: border-color .218s;
    -moz-transition: border .218s;
    -o-transition: border-color .218s;
    transition: border-color .218s;
    background: #f3f3f3;
    background: -webkit-gradient(linear,0% 40%,0% 70%,from(#F5F5F5),to(#F1F1F1));
    background: -moz-linear-gradient(linear,0% 40%,0% 70%,from(#F5F5F5),to(#F1F1F1));
    border: solid 1px #dcdcdc;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    margin-right: 10px;
}
#nav li a,input[type=submit]:hover {
    color: #333;
    border-color: #999;
    -moz-box-shadow: 0 2px 0 rgba(0, 0, 0, 0.2) -webkit-box-shadow:0 2px 5px rgba(0, 0, 0, 0.2);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
}
#nav li a,input[type=submit]:active {
    color: #000;
    border-color: #444;
}

Untuk kotak twitter, sebenarnya ada banyak sumber yang bisa dijadikan contoh, salah satu yang menjadi proyek twitter sendiri adalah Bootstrap. Bootstrap adalah sebuah css framework yang menjadi komponen penting dalam style Twitter sendiri. Namun, saya menggunakan potongan yang saya anggap perlu saja, yaitu untuk glowing box.

/* Twitter-like glow input box */
input[type=text], textarea {
	transition: all 0.30s ease-in-out;
	-webkit-transition: all 0.30s ease-in-out;
 	-moz-transition: all 0.30s ease-in-out;
 	border:#fff 1px solid;
 	outline:none;
	padding: 3px 0px 3px 3px;
	margin: 5px 1px 3px 0px;
	border: 1px solid #DDDDDD;
}
 
input[type=text]:focus, textarea:focus {
	box-shadow: 0 0 5px rgba(81, 203, 238, 1);
	-webkit-box-shadow: 0 0 5px rgba(81, 203, 238, 1);
	-moz-box-shadow: 0 0 5px rgba(81, 203, 238, 1);
	padding: 3px 0px 3px 3px;
	margin: 5px 1px 3px 0px;
	border: 1px solid rgba(81, 203, 238, 1);;
}

Untuk bisa mendapatkan hasil yang maksimal, kamu juga harus memodifikasi kode yang sudah ada. Sebagai contoh, kotak komentar menggunakan tag textarea dengan class .comment, untuk itu semua style yang ditujukan pada class comment harus dihilangkan beberapa yang tidak diperlukan agar hasilnya bisa terlihat lebih baik.

Saya juga menambahkan style untuk mengubah warna background pada text yang dipilih (selected text).

/*Text selection background*/
::selection {
	background: #333; /* Safari */
        color: #FFF;
	}
::-moz-selection {
	background: #333; /* Firefox */
        color: #FFF;
}

Untuk rencana ke depan, saya berencana menambahkan fungsi format post yang sudah ada pada wordpress sejak versi 3. Saat ini, template blog saya hanya bisa mendukung format post dengan type Standar, mudah-mudahan beberapa bulan mendatang, blog ini sudah mendukung format Quote, Status, dan Chat 😀

Games Tebak Kata

Satu aplikasi bisa saya selesaikan malam ini, wow senangnya. Akhir-akhir ini saya sangat bersemangat membuat aplikasi baru, padahal aplikasi lainnya yang baru saja saya buat masih jauh dari sempurna dan butuh pengembangan lebih lanjut 🙂

Permainan ini pernah saya jumpai entah di web mana, saya juga lupa alamatnya. Sore ini saya terpikir untuk membuat games yang serupa dengan games yang pernah saya lihat tersebut. Bukan bermaksud untuk meniru, namun saya ingin mempunyai games di web ini, biar suasananya ga garing 😆

Silahkan saja dicoba di alamat http://duken.info/aplikasi/games/tebak/.

Saya sangat menunggu kritik dan saran kalian semua 😀

Lirik Lagu Rohani

Senin depan saya ada Ujian Akhir Semester. Bukannya belajar mempersiapkan ujian, saya malah asyik ngoding-ngoding ga jelas, haha 😆

Satu aplikasi yang masih sangat sederhana akhirnya bisa saya selesaikan. Lirik Lagu Rohani, saya bingung mencari nama yang cocok untuk aplikasi ini, jadi asal ngambil nama saja. Akhir-akhir ini saya sering mendengar lagu-lagu gereja yang bagus, namun saya kesulitan untuk menyimpannya. Kertas-kertas dari gereja yang berisi teks lagu biasanya terbuang begitu saja. Walaupun saya sering menyimpan kertas-kertas tersebut, tetap saja ada yang masih hilang.

Nah, saya tertarik mendokumentasikan dan membuat sistem database daftar lagu-lagu ini. Makanya seharian ini, dari pagi hingga sore, aplikasi kecil ini bisa saya publish. Masih banyak bug dan kekurangan dalam aplikasi ini, tampilannya pun belum ada ;). Kalau ada yang berminat untuk mendesain tampilannya, silahkan saja menghubungi saya 🙂

Lirik Lagu Rohani ini bisa diakses di http://duken.info/aplikasi/llr/

Untuk saat ini, hanya ada 2 lagu saja yang ada di sana. Sebenarnya saya ingin semua orang bisa menambahkan dan mengedit lirik lagu dalam aplikasi itu, namun sistemnya belum saya kerjakan, jadi untuk saat ini, hanya saya saja dulu yang menambahkan. Rencananya saya akan fokus untuk mengisi aplikasi ini dengan lagu dari Buku Ende bahasa Batak, Kidung Jemaat, yang lainnya mungkin dari lagu bahasa Indonesia dan Inggris 🙂

Alkitab Online: Kings James Version

Dalam tulisan saya sebelumnya, saya menceritakan tentang aplikasi alkitab yang saya buat dengan PHP. Ada banyak rencana yang saya susun di bagian about. Namun banyaknya halangan dan tugas-tugas membuat saya tidak sempat bekerja banyak mengembangkan lebih lanjut aplikasi ini. Kodenya pun banyak yang berantakan.

Untuk update sementara, saya menambahkan database alkitab berbahasa Inggris menggunakan KJV (Kings James Version). Semoga bisa bermanfaat buat teman-teman 😉

Alamat Alkitab KJV bisa diakses di http://duken.info/alkitab/kjv