FORMAT TEKS PADA HTML

Ini merupakan lanjutan dari posting saya yang sebelumnya mengenai belajar HTML, bagi yang masih kurang memahami tulisan saya ini atau ingin mengetahui saja mengenai struktur dasar penulisan HTML ada baiknya melihat tulisan sebelumnya.

Adapun format teks yang digunakan dalam HTML antara lain :

Line Break / Page Break

Berfungsi sebagai pengganti baris dan tidak memiliki element penutup

Sintaks:

<br>

Paragraph

Berguna sebagai pengganti paragraf yang diikuti dengan baris kosong pada awal dan akhir paragraph. Memiliki panutup </p> yang bersifat optional, maksudnya dapat tidak digunakan dengan kompensasi paragraf tidak akan diikuti baris kosong pertanda akhir paragraf. Memiliki attribute “align” yang bernilai “left”,”center” dan “right”.

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

Block Level Element (Header)

Element H terdiri dari H1,H2,H3,H4,H5,H6 berfungsi untuk membuat header dengan format 6 jenis ukuran huruf dan tercetak tebal. Nilai ukuran huruf terbersar adalah H1 seterusnya sampai yang terkecil adalah H6. Element ini memiliki attribute “align” yang bernilai “left”,”center” dan “right” yang menspesifikasikan posisi horizontal dari header dengan defaultnya adalah left.

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

x merupakan ukuran dari 1 sampai 6

Ini Heading-1

Ini Heading-2

Ini Heading-3

Ini Heading-4

Ini Heading-5

Preformated text

Element ini akan menampilkan teks seperti apa adanya, maksudnya akan tampilk seperti apa yang kita tulis.

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

Center

Berfungsi untuk menampilkan teks dalam posisi horizontal ditengah.

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

Basefont

Element ini berfungsi untuk mengubah dasar ukuran tampilan dari web browser. Attribute dari element ini adalah “size” yang merupakan ukuran huruf, bernilai dari “1” sampai dengan “7” pixel, atau berupa ukuran relative (+ atau -), default dari basefont adalah “3” pixel dan element ini tidak memerlukan penutup.

Sintaks:
<basefont size=”pixel”>

Horizontal Rule

Berfungsi untuk membuat satu garis horizontal tidak memiliki penutup dan memiliki attribute align, size(ukuran), width (lebar) dan noshade (garis solid)

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

Hyperlink

Link Address

1. Absolute Link Address merupakan alamat pada internet (URL) yang meliputi protocol, network location dan patch dan nama file.

Contoh:

http://sevli024.wordpress.com

2. Relatif Address, URL yang tidak menyebutkan protocol dan network location atau hanya patch dan nama file

Anchor

Anchor tag <A> untuk menentukan hyperlink dalam document HTML. HREF property digunakan untuk menentukan tujuan dari hyperlink tersebut

<A HREF=”protocol://host.domain:port/path/filename”> Hypertext </A>

Daftar Urutan

Daftar Urutan digunakan untuk mengelompokkan data baik yang berurutan (ordered list) maupun yang tidak berurutan (unordered list).

Ada dua macam list pada HTML

1. Unordered List (Bullet)

Sintaks ordered list:
<ol start=”number” type=”A”|”a”|”I”|”i”|”1″>
……………………
</ol>

2. Ordered List (Numbering)

Sintaks:
<ul type=”circle”|”square”|”disc”>
……………………..
</ul>

Tag	Attribute	Value	Description
<OL>	TYPE	I i A a	Upper Roman Lower Roman Uppercase Lowercase
<OL>	START	N	Begin Number

ELEMENT LI (List Item)
Element LI merupakan isi dari pada daftar. Element ini harus berada di dalam element OL atau UL. Element ini mempunyai attribute type dan value. Nilai attribute type adalah A,a,I,i,1,circle,square,disc dan attribute value berisikan nilai nomor urutan dari attribute type.

Sintaks list item:
<li type=”A”|”a”|”I”|”i”|”1″|”circle”|”square”|”disc”>
……………………..
</li>

Definition List

Definition List terdiri diapit oleh tag <DL> … </DL> dan <DT> tag menentukan definition

term serta <DD> tag menentukan definition itu sendiri.

Font

Elemen font berfungsi mengubah tampilan dari font yang digunakan seperti warna, jenis, ukuran dan jenisnya.

Sintaks:

<font color=”warna” face=”font” size=”pixel”>
……………………..
</font>

Attribute penting yang dapat digunakan untuk berbagai keperluan pada HTML

Color

Color merupakan attribute yang dapat ditambahkan pada element body, font, link dan lainnya. Color diwakili dua digit hexadecimal number.

Alignment

Align attribute digunakan untuk menentukan perataan object pada document HTML baik berupa teks, object, image, paragraph, division dan lain lain.

Format Text

Physical Formating

Logical Formating

]]> http://sevli024.wordpress.com/2008/05/16/format-teks-pada-html/feed/ sevli024 http://sevli024.wordpress.com/2008/05/13/struktur-dasar-dokumen-html/ http://sevli024.wordpress.com/2008/05/13/struktur-dasar-dokumen-html/#comments Tue, 13 May 2008 04:41:28 +0000 sevli024 http://sevli024.wordpress.com/?p=25

HTML (HyperText Markup Language) adalah script penyusun dokumen-dokumen Web. Dokumen HTML disimpan dalam ekstensi .html dan mengandung tag-tag yang memerintahkan web browser untuk mengeksekusi perintah-perintah yang dispesifikasikan.

Struktur Dasar Dokumen HTML

<html>
<head>
<title> Judul Dokumen HTML</title>
</head>
<body>
Tempat penulisan tag-tag HTML
</body>
</html>

Penjelasan dari struktur dasar HTML

a. Tag, teks khusus (markup) yang diapit tanda “<” dan “>”, ditulis secara berpasangan yang terdiri dari tag pembuka “<tag HTML>” dan tag penutup “</tag HTML>”.

b. Element, terdiri dari tag pembuka, isi dan tag penutup, contoh

<tag pembuka>
isi
</tag penutup>

Perlu diperhatikan penulisan element haruslah berpasangan dan tidak boleh tumpang tindih, tag pertama ditutup tarakhir sekali , tag kedua ditutup sebelum menutup tag pertama dan begitu seterusnya.

c. Attribute mendefenisikan element dari HTML, yang terdiri atas nama dan nilai yang diapit tanda “ ”

<tag html>
nama-attr=”nilai-attr”
nama-attr=”nilai-attr”
……………..
>
……………..

</tag html>

d. Element HTML untuk menyatakan dokumen yang digunakan ditulis dengan bahasa HTML

<html>
……….
</html>

e. Element Head merupakan kepala dari dokumen HTML. Head biasanya juga memuat tag META yang berguna untuk menentukan informasi tertentu mengenai dokumen HTML, biasanya menyangkut author name, keywords dan lainnya pada META.

<title>
………
</title>

f. Element Body menampilkan isi dokumen HTML, terletak dibawah tag head dan memiliki attribute-attribut yang spesifikasi khususnya pada warna dan latar belakang dokumen HTML

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

Attribute text untuk member warna pada text, bgcolor memberikan warna pada background dokumen, background menginputkan gambar pada dokumen HTML, link memberikan warna atau tampilan pada link, alink memberikan warna pada link yang sedang aktif, vlink untuk memberikan warna pada link yang telah dikunjungi.

Waduh pernah ngerasain demam tapi ujian juga??? gw kena nee…, awalnya c gw kira cuma flu karena perubahan musim saja, e… gak taunya malah keterusan. Dua hari sebelum ujian, gw kena radang kerongkongan (cie sok keren bahasanya, aslinya kerongkongan terasa kering aza ditambah batuk2), tiba-tiba malam minggux, suhu badan gw ditambah pusing dan ingusan (wlw ingusan gw bukan anak ingusan :(|) ).

Action, Senin (may 5,200 seperti jadwal yang sudah disepakati (entah sapa yg nyepakati???), pagi ni kepala serasa ketusuk-tusuk ditambah hidung memiliki kaki (ingus,coy) gw musti lakuin sesuatu. Ya gw telpon teman (bukan yang seperti yang loe bayangin coy) bwt nolongin minta izin wlw gw harus ikut ujian ditempat paling mengerikan sekaligus menegangkan dan yang terpenting adalah bukan tempat yang tempat yang tepat untuk ujian, yaitu ruang khusus tempat ujian susulan dilakukan. Gw telpon tuh bu dosen, teet….teet….teet….. yee gak nyambung,coba lagi. Ok sekarang nyambung gw minta izin bwt hari ni buk bisa gak???begitulah kira2 proposal yang diajukan,wait a minute menunggu jawaban dari bu”maaf saudara sevli024(lho k0 minta maaf, bukan salah bu k0) ujian susulan seperti yang anda minta tidak bisa saya kabulkan. Dikarenakan saya akan melakukan study ke wilayah “A”. Karena itulah saya mewajibkan anda untuk memaksakan diri untuk ikut ujian hari ini, demikian terima kasih”,bip…bip….. Lho gw sakit bukan dibwt2 buk bukan jalan2.

Demikianlah pagi yang suram dengan suhu yang panas, jadilah saya pergi ujian dengan hati penuh luka(cie…kyk telenovela za). Pas nyampe yang didapati malah kabar burung bangke alias kabar buruk, menurut komisi tinggi kelas gw, bu xxxx gak dapat hadir dikarenakan pergi study ke wilayah “A”. Please d buk, gw setengah mati kesini loenya malah gak hadir.

Gak pa2 c, masih ada kuliah kedua (masih ujian jg c) tapi gak pa2 gw udah master dibidang ni (bukan nyombong tapi carmuk alias cari muka doang).Tapi gw masih sedikit kecewa atas kebijakan buk XXXX. Apes gw coy

Item menu “Statusku” pada tombol Messenger menampilkan status pesan yang saat ini ditampilkan pada kontak anda pada Yahoo! Messenger, dan memungkinkan anda untuk mengubahnya dengan mudah. Untuk mengubah status pesan anda:

1. Klik”Messenger” pada toolbar anda.
2. Klik “Statusku”.
3. Pilih Status yang anda ingin gunakan (Sibuk, Tidak Terlihat, dan seterusnya.).

Setiap status pesan yang telah anda buat pada Yahoo! Messenger ditampilkan di bawah daftar status pesan pada toolbar. Bagaimanapun, jika anda ingin menambahkan sebuah status pesan baru, anda harus menggunakan Yahoo! Messenger untuk melakukannya.

Jika anda tidak masuk ke Yahoo! Messenger, anda dapat dengan cepat masuk dengan mengklik link “Masuk Ke Messenger” di bawah item menu “Status Messenger: Offline”.

Tombol Yahoo! Messenger memerlukan Yahoo! Toolbar 6.2 Internet Explorer atau yang lebih baru, dan Yahoo! Messenger 7.0 atau yang lebih baru. Untuk memeriksa versi toolbar anda, pilih “Toolbar Mengenai Yahoo!” dari menu Pensil. Untuk memeriksa versi dari klien Yahoo! Messenger, pilih “Mengenai Yahoo! Messenger” dari menu Bantuan.

Jika anda memiliki Yahoo! Toolbar 6.2 Internet Explorer dan Yahoo! Messenger terinstalasi, tapi tidak memiliki tombol Messenger pada toolbar, anda dapat menambahkannya ke Yahoo! Toolbar anda sekarang (anda harus masuk).

Pengen diketahui sedang online sekarang atau tidak pada yahoo messenger???Ada baiknya memakai status online pada website atau blog anda.

Asalkan punya account YM, tinggal pasang script dibawah untuk menampilkannya

Berikut status beberapa scriptnya :

ukuran kecil:

<img border=0 src="http://opi.yahoo.com/online?u=yahoo_id_anda&m=g&t=0" />

- ukuran sedang:

<img border=0 src="http://opi.yahoo.com/online?u=yahoo_id_anda&m=g&t=1" />

-ukuran besar:

<img border=0 src="http://opi.yahoo.com/online?u=yahoo_id_anda&m=g&t=2" />

atau beberapa pilihan lainnya :

<a href=”ymsgr:sendIM?ID-YM-KAMU”><img src=”http://opi.yahoo.com/online?u=ID-YM-KAMU&m=g&t=1″ border=”0″ width=”64″ height=”16″ alt=”ID-YM-KAMU” /></a>

<a href=”ymsgr:sendIM?ID-YM-KAMU”><img src=”http://opi.yahoo.com/online?u=ID-YM-KAMU&m=g&t=2″ /></a>

<a href=”‘http://edit.yahoo.com/config/send_webmesg?.target=” src=”pg’” title=”‘ID-YM-KAMU’”><img alt=”‘ID-YM-KAMU’” src=”‘http://opi.yahoo.com/online?u=” style=”‘vertical-align:middle’/” /></a>

atau seperti ini

<a href=”ymsgr:sendIM?ID-YM-KAMU”> <img src=”http://osi.danvic.co.uk/yahoo/ID-YM-KAMU/onurl=www.danvic.co.uk/images/83/yahooonline.gif/offurl=www.danvic.co.uk/images/83/yahoooffline.gif/unknownurl=www.danvic.co.uk/images/83/yahoounknown.gif” align=”absmiddle” border=”0″ alt=”YAHOO Online Status Indicator” onerror=”this.onerror=null;this.src=’http://www.danvic.co.uk/images/83/yahoounknown.gif’;” /></a>

Agar dapat menjalankan website ataupun engine blog (engine website seperti joomla,xxxxxxx dan engine blog seperti
wordpress) pada pc standalone, anda haruslah memiliki komponen-komponen yang dibutuhkan joomla ataupun wordpress,
joomla ataupun wordpress dapat berjalan secara lokal pada webserver apache, dukungan komponen scripting PHP, dan
MySQL sebagai databasenya.

Instalasi secara lokal haruslah memperhatikan “operating system” yang digunakan, apakah itu windows ataukah linux.
Untuk Windows, anda bisa mendownload satu per satu komponen-komponen yang diperlukan dari masing-masing website
vendornya. Seperti www.apache.org untuk mendapatkan program apache, www.php.net untuk mendapatkan program php
kemudian ke website www.MySQL.com untuk mendownload program MySQL setelah lengkap anda haruslah menginstalnya satu
persatu ke komputer yang akan digunakan,pekerjaan belumlah selesai sampai disini karena agar dapat menggunakannya
anda haruslah mengintegrasikan mereka satu persatu mulai dari apache dengan php kemudian kedua program itu dengan
MySQL. Tidaklah mudah untuk mengintegrasikan ketiga program tersebut. Akan muncul pertanyaan,”Apakah ada software
yang dapat mengintegrasikan ketiga software ini dengan mudah???”.

Tentu saja ada, langkah yang termudah dalam menginstal joomla pada windows adalah menggunakan WAMP Server (Windows,
Apache,MySQL dan PHP) yang bisa didownload dari http://www.wampserver.com/en/ atau menggunakan XAMPP. Kedua software
ini menginstalkan semua komponen yang dibutuhkan, mulai dari Apache, MySQL dan PHP sehingga masalah integritas telah
teratasi.Oh ya, pada Linux sebenarnya tidak perlu instalasi apache karena webserver apache telah terintegrasi
didalamnya,akan tetapi untuk menyingkronkan ketiga software tersebut dengan mudah dapat menggunakan software LAMP (
Linux, Apache, MySQL dan PHP)

Langkah-langkah instalasi, menggunakan WAMP Server
1. download WAMP Server dari websitenya, kemudian lakukan double-Klik untuk mengeksekusi file Setup.
2. Pilih “Next”, untuk melanjutkan ke langkah berikutnya.
3. Pilih “Accept th agreement” lalu tekan “Next”.
4. Klik “Browse” untuk menentukan direktori instalsi WAMP Server (defaultnya c:\wamp ) kemudian klik “Next”
5. Pilihlah tambahan sortcut yang akan diinstalkan (quick lauch atau desktop icon), kemudian tekan “Next”.
6. Tekan tombol Install untuk memulai instalasi
7. Setelah loading instalasi selesai akan ada validasi browser yang akan digunakan default, pilih dan tekan OK
8. Isilah php parameter, sebagai akhir instalasi WAMP Server.Klik “Next” dan “Finish”

Hal pertama yang dilakukan untuk mengkonfigurasi router adalah loggin ke router tersebut
untuk loggin terlebih dahulu tekan “Enter” untuk masuk ke user exec mode.
Pada Prompt Router> ketikkan “enable” atau “en” kemudian tekan “Enter untuk masuk ke
previllege mode
Pada previlege mode ketikkan “config t” atau “configure terminal” untuk mulai meng
konfigurasi router
Langkah pertama setelah masuk ke terminal adalah mengganti hostname, ketik “hostname
[nama_baru]“. Perhatikanlah nama router langsung berubah selesai anda menekan Enter
Router>enable
Router#config t
Enter configuration commands, One per line. End with CNTL/Z.
Router(config)#hostname R0
Kemudian menambah alamat IP ke interface, dengan perintah ip address
Konfigurasi interface f0/0
R0(config)#interface f0/0
R0(config)#ip address 192.168.10.1 255.255.255.0
R0(config)#no shutdown
Konfigurasi interface s0/0
R0(config)#int s1/0
R0(config)#ip address 192.168.20.1 255.255.255.0
R0(config)#no shut
Langkah selanjutnya adalah menambah routing statis pada sebuah router
ip route [dest_network] [mask] [next_hop]
ip route Perintah ini digunakan untuk menciptakan route statis
dest_network Network yang ditempatkan di routing table
mask Subnet mask yang digunakan di network
next_hop Alamat dari router berikutnya
R0(config)#ip route 192.168.30.0 255.255.255.0 192.168.20.2
Simpan konfigurasi:
R0#copy runningconfig startupconfig
Kemudian keluar dengan perintah exit ataupun Ctrl+z

Jika suka atau pernah mengikuti mailing list (milis), anda pastilah mengenal YahooGroups yang merupakan menyedia layanan milis populer. Akan tetapi masih ada juga inet-inet yang belum paham atau belum mengerti cara-cara menggunakan fasilitas dari milis yang memiliki rumus nama nama_groups@yahoo.com, dan untuk berlanggan pada salah satu milis anda cukup mengirim email ke alamat tersebut dengan cara nama_groups-subscribe@yahoo.com sedangkan untuk berhenti berlangganan gunakan nama_groups-unsubscribe@yahoo.com, sedangkan untuk fasilitas yang lain misalkan ingin menerima satu mail saja dalam satu hari gunakan nama_groups-digest@yahoo.com, dan gunakan nama_groups-nomail@yahoo.com agar tidak menerima mail dari milis tersebut tetapi tetap berlangganan dan untuk membuat kedua pilihan tersebut kembali ke settingan default gunakan nama_groups-normal@yahoo.com. Dan yang terakhir gunakan nama_groups-owner@yahoo.com untuk menghubungi adminnya.

nb : semua teknik diatas cukup dengan mengirimkan mail kosong saja untuk memamfaatkannya kecuali menghubungi owner milis kirimkan mail berisi pesan yang akan disampaikan.

Pernah baca buku donal bebek,berarti kenal pamannya yang kikir bernama gober nah paman google mah beda apapun dikasih tau, pendek kata paman google bisa ditanyain apa saja deh mulai dari hal-hal berbau mistis sampai berbau amis. Pernah bingung nyari-nyari data tapi yang tampil musti diseleksi dulu karena link-link yang ditampilkan gak mengena banget. Biar gak kesulitan lagi nih ada beberapa trik :

1. gunakan “filetype” untuk mencari berdasarkan tipe file yang akan dicari. misalkan :+ilmu+komputer filetype:pdf
2. mencari informasi berdasarkan judul pada situs-situs di internet gunakan “tittle”
3. mencari kata yang lebih dari dua kata agar tetap satu gunakan tanda ” “. misalkan mencari kata ilmu komputer, agar tidak terpisah gunakan ” ” menjadi “ilmu komputer”.
4. menggunakan host untuk mencari host yang khusus seperti milik pemerintah, gunakan perintah informasi host:go.id
5. perintah java inurl:ilmukomputer.com maka search engine akan menampilkan seluruh artikel yang
   mengandung kata java pada subdomain ilmu komputer. Dan pada google juga mengenal kata
   allinurl tetapi pencarian ini hanya terbatas pada subdirectory, Sedangkan  inurl lebih dalam pencariannya tidah hanya terbatas pada subdirectory.

Begitulah sedikit dari saya, asal tau saja walaupun hal tersebut bisa mempermudah tetap saja anda harus mempersiapkan diri untuk mencari informasi apa yang anda butuhkan biar biaya internetnya menjadi lebih murah.

Pengen punya website sendir atau blog sendiri dengan hosting sendiri, kenapa tidak??? Jika tidak melanggar hukum bukankah itu sah-sah saja. Melalui postingan ini saya mencoba memaparkan langkah-langkah memakai hosting gratis pada www.000webhost.com .

1. Buka www.000webhost.com
2. Klik menu ORDER NOW
3. Isi kolom-kolom pada menu ORDER NOW.
4. Setelah diisi semua, ceklist tombol I agree to Terms of Service. Kemudian klik tombol Continue.
5. Setelah muncul menu Registration is complete klik tombol Setup Account.
6. Perhatikan catatan pada bagian : Important. Yang artinya : Setelah Anda klik Setup Account. Jangan tutup halaman browser kosong baru yang muncul selama 2-3 menit. Ini berguna untuk mengaktifkan account yang baru dibuat.
7. Jika setelah 2-3 menit tidak terjadi proses apapun. Cek email Anda, kemudian klik link “http://www.000webhost.com/include/confirm.php?chash=…………….. “ (titik-titik ini berbeda-beda antara satu account dengan account yang lainnya)
8. Cek juga inbox email berikutnya
9. Setelah berhasil mengaktifkan account, akan muncul menu Welcome To Members Area. Ingat-ingat dan catat baik-baik informasi yang ada, jangan sampai catatan ini hilang.
10. Coba buka website Anda dengan alamat http://alamatAnda.890m.com
11. Untuk melakukan pembuatan web site, salah satunya menggunakan fasilitas fantastico ttp://alamatAnda.890m.com/cpanel
Isikan user dan password Anda sesuai dengan data yang telah di emailkan.
12. Sekarang kita coba menginstall Blog menggunakan free script milik WordPress (atau bisa juga joomla tergantung yang diinginkan).
13. Lihat menu Software / Service pada Control Panel, kemudian klik pada Site Software.
14. Pada halaman cPaddon Script, klik WordPress pada sub menu Blogs