HTML Mengolah Format Texs

HTML FORMAT TEKS ::

OBJEKTIF:
Setelah mempelajari materi ini diharapkan anda dapat memahami penggunaan element-element untuk pemformatan teks.

MATERI:
Element BR(line break), Element P(paragraph), Element H1,H2,H3,H4,H5,H6(header), Element B(bold), Element I(italic), Element U(underline), Element PRE(preformated text), Element CENTER, Element BASEFONT, Element FONT, Element HR(horizontal rule)


ELEMENT BR (Line Break)
Element BR berfungsi untuk ganti baris. Dan element BR ini tidak mempunyai tag penutup.

Sintaks:
<br>


ELEMENT P (Paragraph)
Element P berfungsi untuk ganti paragraf yang diikuti dengan baris kosong di awal dan akhir paragraf. Tag penutup </p> sifatnya optional jika suatu paragraf diikuti oleh paragraf berikutnya. Jika tag </p> diabaikan, maka paragraf itu tidak akan diikuti dengan baris kosong di akhir paragraf.
Element P mempunyai attribute yaitu align yang bernilai "left", "center", "right" yang menspesifikasikan posisi tepi horizontal dari paragraf (default: "left").

Sintaks:
<p align="left"|"center"|"right">
      ..........................
</p>


ELEMENT H1,H2,H3,H4,H5,H6 (Header)
Element H1,H2,H3,H4,H5,H6 berfungsi untuk membuat header dengan format 6 jenis ukuran huruf  dan tercetak tebal. Nilai ukuran huruf terbesar adalah H1 dan terkecil adalah H6. Element ini mempunyai attribute yaitu align yang bernilai "left", "center", "right" yang menspesifikasikan posisi horizontal dari header (default: "left").

Sintaks:
<hx align="left"|"center"|"right">
      ..........................
</hx>

x : 1 ... 6


ELEMENT B (Bold)
Element B berfungsi untuk membuat tampilan teks tercetak tebal (bold).

Sintaks:
<b>
      ..........................
</b>


ELEMENT I (Italic)
Element I berfungsi untuk membuat tampilan teks tercetak miring (italic).

Sintaks:
<i>
      ..........................
</i>


ELEMENT U (Underline)
Element U berfungsi untuk membuat tampilan teks tercetak garis bawah (underline).

Sintaks:
<u>
      ..........................
</u>


ELEMENT PRE (Preformated text)
Element PRE berfungsi untuk menampilkan teks seperti apa adanya.

Sintaks:
<pre>
      ..........................
</pre>


ELEMENT CENTER 
Element CENTER berfungsi untuk menampilkan teks dengan posisi horizontal ditengah.

Sintaks:
<center>
      ..........................
</center>


ELEMENT BASEFONT
Element BASEFONT berfungsi untuk merubah dasar ukuran huruf tampilan dari web browser. Attribute dari element ini adalah size yang merupakan ukuran  huruf dengan nilai "1" sampai dengan "7" pixel, atau berupa ukuran relatif ( + atau - ), default nya adalah "3" pixel. Element ini tidak mempunyai tag penutup.

Sintaks:
<basefont size="pixel">
 

ELEMENT FONT
Element FONT berfungsi untuk merubah jenis, ukuran dan warna dari tampilan huruf. Element ini mempunyai attribute color untuk merubah warna huruf, face untuk merubah jenis huruf (jika lebih dari satu jenis huruf, harus dibatasi dengan koma), dan size untuk merubah ukuran huruf (pixel).

Sintaks:
<font color="warna" face="font" size="pixel">
      ..........................
</font>


ELEMENT HR (Horizontal Rule)
Element HR berfungsi untuk membuat suatu garis horizontal. Element ini tidak mempunyai tag penutup dan mempunyai attribute align untuk menempatkan posisi secara horizontal ("left", "center", "right"), size untuk ukuran ketebalan garis ("pixel"), width untuk ukuran panjang garis ("persen"), dan noshade (garis solid).

Sintaks:
<hr align="left"|"center"|"right" size="pixel" width="persen" noshade>

LATIHAN

Gunakan teks editor misalkan "Notepad" untuk menyunting dan menyimpan script latihan di bawah ini. Untuk melihat hasilnya bukalah file tersebut dengan menggunakan web browser atau gunakan editor yang telah tersedia pada modul ini dengan mengklik menu Editor.


Latihan 1:
Menampilkan teks dengan ganti baris (element BR):

                           Belajar bahasa pemrograman web. Dengan materi dasar HTML. Dan JSP
                         
                           Belajar bahasa pemrograman web.
                           Dengan materi dasar HTML.
                           Dan JSP.

Nama file: latihan2_1.html

<html> <head> <title>Latihan2-1</title> </head> <body> Belajar bahasa pemgrograman web. Dengan mater dasar HTML. Dan JSP. <br> <br>Belajar bahasa pemrograman web.<br>Dengan materi dasar HTML.<br>Dan JSP. </body> </html>

Latihan 2:
Menampilkan teks dalam bentuk paragraf (element P):

                           Tampilan teks sebelum paragraf.

                           Tampilan teks paragraf pertama.

                           Tampilan teks paragraf kedua.

                           Tampilan teks setelah paragraf.

Nama file: latihan2_2.html

<html> <head> <title>Latihan2-2</title> </head> <body> Tampilan teks sebelum paragraf. <p>Tampilan teks paragraf pertama.</p> <p>Tampilan teks paragraf kedua.</p> Tampilan teks setelah paragraf. </body> </html>

Tugas tambahan:
Gantilah setiap tag </p> dengan element BR, dan lihat hasilnya.


Latihan 3:
Menampilkan posisi horizontal kelurusan paragraf:

                           Paragraf ini pada posisi rata kiri (default)
                                                         Paragraf ini pada posisi rata tengah
                                                                                       Paragraf ini pada posisi rata kanan
                           Paragraf ini pada posisi rata kiri

Nama file: latihan2_3.html

<html> <head> <title>Latihan2-3</title> </head> <body> <p>Paragraf ini pada posisi rata kiri (default)</p> <p align="center">Paragraf ini pada posisi rata tengah</p> <p align="right">Paragraf ini pada posisi rata kanan</p> <p align="left">Paragraf ini pada posisi rata kiri</p> </body> </html>

Latihan 4:
Menampilkan teks sebagai header (element H):

             Ini Heading-1

                  Ini Heading-2

                      Ini Heading-3

                        Ini Heading-4

                                    Ini Heading-5

                                     Ini Heading-6

Nama file: latihan2_4.html

<html> <head> <title>Latihan2-4</title> </head> <body> <h1>Ini Heading-1</h1> <h2>Ini Heading-2</h2> <h3>Ini Heading-3</h3> <h4>Ini Heading-4</h4> <h5>Ini Heading-5</h5> <h6>Ini Heading-6</h6> </body> </html>

Tugas tambahan:
Tempatkanlah tampilan isi element H3 di kanan dan H5 di tengah.


Latihan 5:
Menampilkan teks dalam format tebal, miring dan garis bawah:

                           Ini normal teks
                           Ini teks tercetak tebal (bold)
                           Ini teks tercetak miring (italic)
                           Ini teks tercetak garis bawah (underline)

Nama file: latihan2_5.html

<html> <head> <title>Latihan2-5</title> </head> <body> Ini normal teks<br> <b>Ini teks tercetak tebal (bold)</b><br> <i>Ini teks tercetak miring (italic)</i><br> <u>Ini teks tercetak garis bawah (underline)</u> </body> </html>

Tugas tambahan:
Buat teks tercetak miring dan tebal.


Latihan 6:
Menampilkan teks dalam bentuk apa adanya (element PRE):

                           Ini bentuk penulisan preformated text
                                apapun bentuknya tulisan ini akan ditampilkan
                           pada web browser
                                                 seperti apa adanya, alias yang ditulis
                         
Nama file: latihan2_6.html

<html> <head> <title>Latihan2-6</title> </head> <body> <pre> Ini bentuk penulisan preformated text       apapun bentuknya tulisan ini akan ditampilkan pada web browser                         seperti apa adanya, alias yang ditulis </pre> </body> </html>

Latihan 7:
Menampilkan teks pada posisi tengah jendela web browser (element CENTER):

                           Teks ini terletak di tengah layar web browser
                               dengan menggunakan element CENTER
                         
                         
                         
Nama file: latihan2_7.html

<html> <head> <title>Latihan2-7</title> </head> <body> <center> Teks ini terletak di tengah layar web browser<br>  dengan menggunakan element CENTER </center> </body> </html>

Latihan 8:
Menampilkan teks berdasarkan element BASEFONT:

                          Teks ini mempunyai size = 1
                          Teks ini mempunyai size = 2
                          Teks ini mempunyai size = 3
                          Teks ini mempunyai size = 4
                          Teks ini mempunyai size = 5
                          Teks ini mempunyai size = 6
                          Teks ini mempunyai size = 7
                         
                         
Nama file: latihan2_8.html

<html> <head> <title>Latihan2-8</title> </head> <body> <basefont size="1">Teks ini mempunyai size=1<br> <basefont size="2">Teks ini mempunyai size=2<br> <basefont size="3">Teks ini mempunyai size=3<br>   <basefont size="4">Teks ini mempunyai size=4<br> <basefont size="5">Teks ini mempunyai size=5<br> <basefont size="6">Teks ini mempunyai size=6<br> <basefont size="7">Teks ini mempunyai size=7 </body> </html>

Latihan 9:
Menampilkan teks dengan menggunakan element FONT:

                           Teks dengan format color=fuchia; size=+2; face=verdana
                           Teks dengan format color=gray; size=6; face=algerian
                           Teks dengan format color=red; size=-1; face=impact
                         
                         
                         
Nama file: latihan2_9.html

<html> <head> <title>Latihan2-9</title> </head> <body> <font color="fuchsia" size="+2" face="verdana"> Teks dengan format color=fuchsia; size=+2; face=verdana<br> </font> <font color="gray" size="6" face="algerian"> Teks dengan format color=gray; size=6; face=algerian<br> </font> <font color="red" size="-1" face="impact"> Teks dengan format color=red; size=-1; face=impact </font> </body> </html>

Latihan 10:
Menampilkan garis horizontal menggunakan elemen HR:
                          

---

---

                                                                              
Nama file: latihan2_10.html

<html> <head> <title>Latihan2-10</title> </head> <body> <hr align="left" size="6" width="30%"> <hr align="left" size="6" width="30%" noshade> </body> </html>

Tugas tambahan:
Buatlah garis horizontal di bawah ini dengan size=5, align=center dengan urutan width 40%, 20%, 10%:

---

---

---

oleh fsakti FASANA IT | Tutorial Computer Updated at : 22.36

Baca Selenkapnya...

Dasar - dasar HTML

OBJEKTIF:
Setelah mempelajari materi ini diharapkan anda dapat memahami struktur dasar dari dokumen HTML.

MATERI:
Struktur dasar dokumen HTML(Tag, Element, Attribute), Element HTML, Element HEAD, Element TITLE, Element BODY.


STRUKTUR DASAR DOKUMEN HTML
HTML merupakan singkatan dari HyperText Markup Language adalah script untuk menyusun dokumen-dokumen Web. Dokumen HTML disimpan dalam format teks reguler dan mengandung tag-tag yang memerintahkan web browser untuk mengeksekusi perintah-perintah yang dispesifikasikan.

Struktur dasar dokumen HTML adalah sebagai berikut:

<html> <head> <title>Disini Judul Dokumen HTML</title> </head> <body>         Disini penulisan informasi Web </body> </html>

Dari struktur dasar HTML di atas dapat dijelaskan sebagai berikut:

a. Tag
Adalah teks khusus (markup) berupa dua karakter "<" dan ">",  sebagai contoh <body> adalah tag dengan nama body.
Secara umum tag ditulis secara berpasangan, yang terdiri atas tag pembuka dan tag penutup (ditambahkan karakter "/" setelah karakter "<"), sebagai contoh <body> ini adalah tag pembuka isi dokumen HTML, dan </body> ini adalah tag penutup isi dokumen HTML.

b. Element
Element terdiri atas tiga bagian, yaitu tag pembuka, isi, dan tag penutup. Sebagai contoh untuk menampilkan judul dokumen HTML pada web browser digunakan element title, dimana:

<title> ini adalah tag pembuka judul dokumen HTML
Disini Judul Dokumen HTML ini adalah isi judul dokumen HTML
</title> ini adalah tag penutup judul dokumen HTML

Tag-tag yang ditulis secara berpasangan pada suatu element HTML,  tidak boleh saling tumpang tindih dengan pasangan tag-tag lainnya.
Contoh penulisan tag-tag yang benar

<p>     <b>         ................     </b> </p>

Contoh penulisan tag-tag yang salah

<p>     <b>         ................     </p> </b>

c. Attribute
Attribute mendefinisikan property dari suatu element HTML, yang terdiri atas nama dan nilai. Penulisannya adalah sebagai berikut:

<TAG    nama-attr="nilai-attr"    nama-attr="nilai-attr"    ................. >    ................. </TAG>

Secara umum nilai attribute harus berada dalam tanda petik satu atau dua. Sebagai contoh, untuk membuat warna teks menjadi kuning dan latarbelakang halaman web menjadi hitam, penulisannya adalah <body bgcolor="black" text="yellow">

d. Element HTML
Menyatakan pada browser bahwa dokumen Web yang digunakan adalah HTML.

Sintaks:
<html>
..........
</html>

e. Element HEAD
Merupakan kepala dari dokumen HTML. Tag <head> dan tag </head> terletak di antara tag <html> dan tag </html>.

Sintaks:
<head>
...........
</head>

f. Element TITLE
Merupakan judul dari dokumen HTML yang ditampilkan pada judul jendela browser. Tag <title> dan tag </title> terletak di antara tag <head> dan tag </head>.

Sintaks:
<title>
.........
</title>

g. Element BODY
Element ini untuk menampilkan isi dokumen HTML. Tag <body> dan tag </body> terletak di bawah tag <head> dan tag </head>.
Element BODY mempunyai attribute-attribute yang menspesifikasikan khususnya warna dan latarbelakang dokumen yang akan ditampilkan pada browser.

Sintaks:
<body text="v" bgcolor="w" background="uri" link="x" alink="y" vlink="z">
..............
</body>

Attribute text memberikan warna pada teks, bgcolor memberikan warna pada latarbelakang dokumen HTML, background memberikan latarbelakang dokumen HTML dalam bentuk gambar, link memberikan nilai warna untuk link, alink memberikan warna untuk link yang sedang aktif, vlink memberikan warna untuk link yang telah dikunjungi.
Jika attribute bgcolor dan background keduanya dispesifikasikan maka attribute background yang akan digunakan, akan tetapi jika nilai attribute background (gambar) tidak ditemukan pada dokumen HTML maka attribute bgcolor yang akan digunakan.

LATIHAN

Gunakan teks editor misalkan "Notepad" untuk menyunting dan menyimpan script latihan di bawah ini. Untuk melihat hasilnya bukalah file tersebut dengan menggunakan web browser atau gunakan editor yang telah tersedia pada modul ini dengan mengklik menu Editor.

Latihan 1:
Menampilkan teks:

                           Belajar bahasa pemrograman web ternyata mudah juga :)

Nama file: latihan1_1.html

<html> <head> <title>Latihan1-1</title> </head> <body>         Belajar bahasa pemrograman web ternyata mudah juga :) </body> </html>

Tugas tambahan:
Gantilah teks tersebut dengan teks lainnya.


Latihan 2:
Merubah warna teks menjadi merah:

                        Belajar bahasa pemrograman web ternyata mudah juga :)

Nama file: latihan1_2.html

<html> <head> <title>Latihan1-2</title> </head> <body text="red">         Belajar bahasa pemrograman web ternyata mudah juga :) </body> </html>

Tugas tambahan:
Cobalah untuk warna: maroon, black, yellow, white, lime, green, blue, red, olive, navy, purple, teal, gray, silver, fuchsia, aqua.

Latihan 3:
Merubah warna background menjadi hitam.
                        
Nama file: latihan1_3.html

<html> <head> <title>Latihan1-3</title> </head> <body text="red" bgcolor="black">         Belajar bahasa pemrograman web ternyata mudah juga :) </body> </html>

Tugas tambahan:
Cobalah untuk warna: maroon, black, yellow, white, lime, green, blue, red, olive, navy, purple, teal, gray, silver, fuchsia, aqua.

Latihan 4:
Merubah background dengan suatu gambar.

Nama file: latihan1_4.html

<html> <head> <title>Latihan1-4</title> </head> <body text="red" bgcolor="aqua" background="./images/image027.jpg">         Belajar bahasa pemrograman web ternyata mudah juga :) </body> </html>

catatan:
./images/ = nama direktori file gambar disimpan
image027.jpg = nama file gambar

Tugas tambahan:
Cobalah untuk file gambar: image050.jpg, image052.jpg, image058.jpg dan image060.jpg.

Refrensi w3schools

oleh fsakti FASANA IT | Tutorial Computer Updated at : 22.16

Baca Selenkapnya...

Cara Mudah Membuat Thumbnail dengan PHP dengan Cara Resize dan Crop Image

Thumbnail merupakan gambar kecil atau seperti icon yang merupakan hasil resize menjadi ukuran lebih kecil dari gambar aslinya. Secara sederhana untuk membuat thumbnail, kita cukup merubah ukuran gambar menjadi lebih kecil. Tetapi yang jadi masalah adalah kalau mentah-mentah diubah ukurannya, maka jika gambar yang tidak persegi (gambarnya bisa lebih panjang atau lebih tinggi) akan menghasilkan gambar yang tidak bagus atau perbandingan antara panjang dan lebar tidak sama dengan aslinya.
Untuk mengatasi gambar yang persegi panjang, supaya menghasilkan thumbnail yang bagus, maka yang perlu dilakukan adalah:

1. Resize gambar, dengan perbandingan panjang dan lebarnya sama dengan aslinya
2. Crop gambar di tengah-tengah.

Kode PHP Thumbnail

Setelah mengetahui konsep pembuatan thumbnail di atas, mari kita buat kode PHP nya. Di sini kita akan menggunakan GD Functions yang ada di PHP. Untuk menggunakan fungsi GD ini, pastikan anda sudah mengaktifkan GD library. Caranya edit file php.ini, lalu cari baris ;extension=php_gd2.dll, hilangkan tanda titik komanya. Restart kembali web server anda.


Berikut kode PHP untuk membuat thumbnail
drzthumb.php

<?php

// Gambar aslinya
$filename = 'gambar.jpg';

// ambil ukuran asli image
list($lebar_asli, $tinggi_asli) = getimagesize($filename);

$persegi = 200; //ukuran thumbnail, artinya 200 x 200;

$canvas = imagecreatetruecolor($persegi, $persegi);
$current_image = imagecreatefromjpeg($filename);

if($lebar_asli > $tinggi_asli){
    $tinggi = $persegi;
    $lebar =  ceil(($persegi/$tinggi_asli) * $lebar_asli);
    $x = ceil(($lebar/2) - ($persegi/2));
    imagecopyresized($canvas, $current_image, 0, 0, $x, 0, $lebar, $tinggi, $lebar_asli, $tinggi_asli);
}else{
    $lebar = $persegi;
    $tinggi = ceil(($persegi/$lebar_asli) * $tinggi_asli);
    $y = ceil(($tinggi/2) - ($persegi/2));
    imagecopyresized($canvas, $current_image, 0, 0, 0, $y, $lebar, $tinggi, $lebar_asli, $tinggi_asli);
}

header('Content-type: image/jpeg');

imagejpeg($canvas);

imagedestroy($canvas);

?>

Downloadselangkapnya


trims ..codingwear 

oleh fsakti FASANA IT | Tutorial Computer Updated at : 22.50

Baca Selenkapnya...

gratis Download Azon Profit Master (APM)

Apa itu Azon Profit Master ? Azon Profit Master atau APM ini merupakan Software Autoblog yang mampu memposting produk Amazon ke dalam Blogspot, Facebook dan WordPress (.com dan self hosting) sekaligus. Wow, Penasaran ! Mau  Apa yang bisa dilakukan oleh Azon Profit Master ?

Seperti yang telah disinggung sedikit diatas, fungsi utama dari Azon Profit Master adalah posting produk-produk Amazon ke website dengan hosting sendiri bahkan posting ke blog gratisan secara otomatis. Untuk mengetahui apa saja yang bisa dilakukan oleh APM ini secara detail (saat ini):
- Support Blogspot
- Support WordPress (.com maupun self hosting (hosting sendiri))
- Facebook FanPage
- Unlimited Page dan Blog!
- Project Manager yang mudah, jadi kamu gak perlu lagi mengingat username/password/url
- Backdate/Schedule Article
- Tersedia opsi “threading” untuk menyesuaikan kecepatan koneksi internet kamu
- Support SPIN Format title dan artikel template untuk Amazon .com .de .ca .co .uk .fr .it
- NEW! Support Rewrite/Spin
- NEW! Auto SEO OnPage

Dulu saya pun ragu dengan Azon Profit Master ini karena saya pikir software ini dari namanya saja bahasa Inggris pasti yang membuat orang Inggris yang bahasa pasti Inggris juga. Namun ternyata tidak, semua dugaan saya salah, software ini di buat oleh orang Indonesia. Dengan cepat semua yang saya tanyakan langsung dibalas. Video Tutorial bagaimana menjalankan software ini dengan benar juga tersedia. Pokoknya lengkap deh..

Ingat! Software ini bukan alat SULAP yang bisa menjadikan Anda langsung kaya tanpa kerja. Azon Profit Master ini hanya sebagai alat bantu dalam Anda menjalankan bisnis online di internet khususnya Amazon.

Bagi anda yang ingin download azon profit master gratis, silahkan klik disini.

oleh fsakti FASANA IT | Tutorial Computer Updated at : 21.21

Baca Selenkapnya...

Cara Mudah Membuat Link Pada Blog

Secara umum penulisanya sbb :
<a href=" http://77sakti.wordpress.com/ ">Sorce Program</a>
cara membuat link dengan fungsinya masing - masing.:
 Diantaranya :
1. Cara Membuat Link Pada Blog yang Membuka Tab Baru saat Link Di Klik
2. Cara Membuat Link Pada Blog yang Membuka 2 Halaman / Situs Sekaligus saat di Klik
3. Cara Membuat Link Pada Blog yang Membuka Halaman / Situs yang dituju link tanpa di klik.
4. Cara Membuat Link Gambar / LINK BANNER Pada Blog.

• 1. LINK YANG MEMBUKA TAB BARU

Saat pengunjung mengklik link jenis ini, halaman yang dituju link akan terbuka di tab baru browser. untuk membuatnya kita hanya perlu menambahkan kodetarget="_blank" setelah alamat url yang dituju link. Bisa juga menggunakan kode target="_new" , dan bisa juga menggunakan kode target="_up".
Contoh kode yang digunakan seperti ini : 
<a href=" http://bo-fsakti.blogspot.com /" target="_blank">e-bisinis</a>

• 2. LINK YANG MEMBUKA 2 HALAMAN

Link jenis ini akan membuka 2 halaman sekaligus pada saat bersamaan saat linknya di klik
Contoh kode yang digunakan seperti ini : 

<a href=" http://bo-fsakti.blogspot.com " target="_blank"
onclick="window.open(' http://77sakti.wordpress.com/ ')">Sorce Program</a>

• 3. LINK YANG TERBUKA TANPA DI KLIK

Link jenis ini akan langsung terbuka tanpa di klik saat mouse menyentuh / melewati link.
Contoh kode yang digunakan seperti ini :  

<a href=" http://bo-fsakti.blogspot.com " onmouseover="window.location=this.href">e-bisnis</a>

4. MENGGUNAKAN GAMBAR SEBAGAI LINK / LINK BANNER 

Selain menggunakan kata atau kalimat, kita juga bisa menggunakan gambar sebagai link. Untuk jenis link yang satu ini kita membutuhkan sebuah gambar yang tersimpan pada imge hosting lalu menggunakan alamat URL Gambar tersebut. Misalnya kita akan menggunakan Gambar di bawah ini sebagai link 

Untuk membuat gambarnya menjadi link, Contoh kode yang digunakan seperti ini : 

<a href="http://hdt.16mb.com" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjkZCZ7mkrzkVHbW0f_KUubZDztleDSAHAByzqveGyqnesjGlOJe-2FWzsuP5Z1I78TenTcfGLgwGLlX_LlDK1LDWnvGX4ZB0v3mvnkcH6IXvWitw9UyxW8sOx9ShwxPWnVCjcoitH48-jQ/s1600/help+disk+technology.jpg" border="0" /></a>

trims: blogger-bugis 

oleh fsakti FASANA IT | Tutorial Computer Updated at : 20.18

Baca Selenkapnya...

Pengenalan PHP

tag PHP diawali dg "<?php" atau cukup dg "<?"  dan diakhiri dg "?>" semua tanpa tanda kutip.

contoh :

<?php

echo "Saya Lagi Belajar PHP";

?>

Cara nampilinnya, install dulu aplikasi servernya, misal: AppServ atau XAMPP; gratis kok !,  (akan ditulis di Materi A.3),

save baris kode itu dg index.php, taruh di folder (misal) c:\appserv\www\belajar1\

kemudian buka dg cara :

- browser di jalanin

- ketik di address bar: localhost/belajar1

- enter

kurang-lebih seperti itu. lanjut

oleh fsakti FASANA IT | Tutorial Computer Updated at : 19.58

Baca Selenkapnya...

Apa Search Engine Optimization (SEO)

Definisi dan Latar Belakangnya

SEO adalah kependekan dari Search Engine Optimization, yang dalam bahasa kita diartikan menjadi optimasi mesin pencari. Definisinya kurang lebih, SEO merupakan teknik atau proses untuk meningkatkan performansi sebuah situs agar mempunyai peringkat yang tinggi pada halaman hasil pencarian mesin pencari ( SERP = Search Engine Results Page ), sehingga akan memaksimalkan traffic ke situs tersebut, baik itu website statis maupun blog.

Bagi seorang blogger, traffic atau 'lalu lintas' pengunjung yang datang adalah salah satu pilar penting sebuah blog. Tingkat kepentingannya juga akan menjadi semakin tinggi jika blog tersebut digunakan sebagai media berbisnis online. Ini disebabkan karena traffic inilah calon-calon konsumen mereka. Semakin banyak traffic, peluang untuk sukses semakin terbuka lebar.

Pemakai internet biasanya menggunakan search engine untuk menemukan apa yang dicarinya. Kebanyakan di antara mereka kemudian hanya akan tertarik pada 10 atau 20 situs pertama pada halaman 1 dan 2 dari SERP, tanpa ada keinginan untuk melihat ribuan, ratusan ribu, atau mungkin jutaan situs yang ada di halaman berikutnya.

Jadi, jika blog kita muncul di halaman 1 hasil pencarian search engine dengan keyword yang kita incar, maka akan semakin banyak traffic yang akan datang ke blog kita. Inilah sebabnya SEO itu lahir. Search Engine Optimization memang kemudian menjadi 'mata kuliah wajib' bagi para webmaster dan blogger.

SEO : Gampang atau Susah ?

Nah.. pertanyaan yang ini susah dijawab. Karena, 'mata kuliah wajib' yang satu ini sepertinya lebih banyak dibilang susah daripada gampang :-( . Teknik yang dikembangkan juga bermacam-macam. SEO yang dianggap jitu oleh seorang blogger belum tentu dipakai oleh blogger yang lain. Satu yang jelas, SEO membutuhkan keuletan, kesabaran dan waktu untuk mendapat hasil yang kita inginkan. Hingga berbulan-bulan? Bisa jadi !

Pada dasarnya ada 2 macam SEO  :

1.  ONPAGE OPTIMIZATION

Sesuai dengan namanya, SEO jenis ini berisi tentang teknik-teknik optimasi dengan memodifikasi faktor-faktor tertentu di dalam webpage / blog itu sendiri, misalnya :

• Pemilihan keyword yang cerdik, termasuk penggunaannya dalam frase.
• Hanya menggunakan keyword yang diincar pada Title.
• Menggunakan symbol «|» pada Title.
• Penggunan Header Tag.
• Kerapatan keyword yang cukup pada content, dan bukan keyword spamming.
• Penempatan keyword pada awal dan akhir webpage.
• Penggunaan Alt Tag yang tepat pada image.

2.  OFFPAGE OPTIMIZATION

Offpage optimization pada dasarnya terdiri dari faktor-faktor yang tidak terdapat pada halaman website / blog kita, tapi digunakan dalam algoritma search engine ketika menentukan ranking sebuah situs. Menurut Brad Callen dari Bryxen Software, faktor-faktor ini misalnya :

• Jenis-jenis situs yang memberi link ke kita.
• Jumlah situs yang memberi link ke kita.
• Page Rank situs yang memberi link.
• Anchor text yang digunakan pada link.
• Jumlah dan tipe situs yang me-link ke situs yang me-link ke situs kita tadi.

Perkembangan SEO

Sekarang ini, jutaan situs 'perang online' di jagad internet untuk jadi nomor wahid di mata search engine. Tentu sulit memenangkan pertarungan ini. Beberapa webmaster / blogger menerapkan teknik-teknik SEO yang natural dan halal di mata search engine. Teknik yang ini sering dikenal dengan White Hat SEO. Lawannya.. ya Black Hat SEO. Teknik Black Hat SEO biasanya beresiko. Situs yang bersangkutan bisa di-banned oleh search engine.

( Saya juga menulis tentang SEO yang sah dan illegal versi Google. Baca ya...  )

Pada sisi yang lain, si search engine menggunakan faktor yang semakin kompleks dan selalu memperbaiki algoritma untuk meningkatkan kualitas SERP mereka. Algoritma yang dipakai search engine pun tidaklah sama. Ini sebabnya, SERP setiap search engine bisa berbeda-beda untuk keyword yang sama. Repot ya?! Kesimpulannya, kita harus selalu belajar banyak tentang SEO.

trim's blogiologi

oleh fsakti FASANA IT | Tutorial Computer Updated at : 23.23

Baca Selenkapnya...