Solusi Informatika Qta

Wednesday, December 3, 2014

Heading Menggunakan HTML

Heading adalah perlengkapan SEO sederhana yang berfungsi untuk menyusun level-level heading dan subheading pada website.

Fungsi dari Heading Adalah Untuk menunjukkan informasi yang penting, dan membuat pengguna dapat menyortir halaman dengan cepat untuk menemukan informasi yang mereka cari

Header mempunyai 6 tingkatan dan dimulai dari H1 hingga H6. H1 yaitu header yang paling besar dan H6 header yang paling kecil.

1. Fungsi Tag Heading <h1> : Fungsi tag ini digunakan pada nama blog (jika berada pada homepage) dan berubah menjadi <h2> pada halaman posting.

2. Fungsi Tag Heading <h2> : Fungsi tag ini digunakan pada judul artikel blog (jika berada pada homepage> dan berubah menjadi <h1> pada halaman posting.

3. Fungsi Tag Heading <h3> : Fungsi tag ini digunakan pada sub-judul atau penjelasan dari judul posting, bisa juga digunakan pada judul widget.

4. Fungsi Tag Heading <h4> : Fungsi tag ini biasanya digunakan untuk judul "Artikel Terkait", "0 Komentar" atau bisa juga digunakan pada judul widget.

5. Fungsi Tag Heading <h5> : Fungsi tag ini digunakan untuk nama komentator atau nama pemberi komentar.

Contoh Scriptnya adalah sebagai berikut :

<!DOCTYPE html>

<html>
<head>
<title>heading</title>
</head>
<body>
<h1>JudulUtama</h1>
<h2>Judul Utama2</h2>

<h3>Judul Utama3</h3>

<h4>Judul Utama4</h4>

<h5>Judul Utama5</h5>

<h6>Judul Utama6</h6>

</body>
</html>

Maka Hasilnya akan Muncul seperti pada tampilan gambar Disamping ..

mudah bukan ??? :) selamat mencoba :)

:) Semoga Sukses!!!

Saturday, November 29, 2014

Artikel ini menyediakan tentang kode background HTML dan kode untuk pengaturan properti background (latar belakang) dari elemen HTML.

Contoh berikut menggunakan Cascading Style Sheets (CSS). CSS merupakan cara yang terbaik untuk menetapkan sifat latar belakang dalam HTML Anda. Ini lebih fleksibel daripada metode HTML yang usang. Menggunakan CSS, Anda dapat mengatur properti latar belakang dari setiap elemen HTML. Ditambah Anda dapat melakukan hal-hal seperti menentukan posisi gambar, apakah harus mengulang, bagaimana harus mengulangi dll.

Anda dapat mengatur warna latar belakang dari setiap elemen HTML menggunakan properti background-color. Anda dapat memilih warna latar belakang dengan kode warna HTML.

Cara Membuat Background HTML
Untuk mengatur properti latar belakang (background) untuk seluruh halaman, dapat menerapkan properti untuk elemen body.
Contohnya seperti ini

<html>

<head>

<title>Judul</title>

</head>

<body bgcolor="black">

Isi halaman

</body>

</html>

Tetapi jika menggunakan CSS, contoh kodenya seperti berikut.

<html>

<head>

<title>Judul</title>

<style type="text/css">

body { background-color:black; }

</style>

</head>

<body>

Isi halaman

</body>

</html>

Maka suatu halaman yang menggunakan salah satu kode di atas baik yang menggunakan metode HTML maupun CSS akan memiliki warna latar belakang hitam.

Membuat Background Gambar
Kodenya seperti berikut

<html>

<head>

<title>Judul</title>

<style type="text/css">

body {

background-color:black;

background-image:url(URLGAMBAR);

</style>

</head>

<body>

Isi halaman

</body>

</html>

HTML Formatting Elements

In the previous chapter, you learned about HTML formatting elements.
Formatting elements are special HTML elements with a special meaning.
Formatting elements were designed to display special types of text, like important text, emphasized text, subscripts, and superscripts.

HTML Styling

HTML styling has nothing to do with formatting elements.
Styling is about changing or adding the style of existing HTML elements.
Every HTML element has a default style (background color is white, text color is black ...)
Changing the default style of an HTML element, can be done with the style attribute.

Example

<body style="background-color:lightgrey">

<h1>This is a heading</h1>

<p>This is a paragraph.</p>

</body>

Friday, November 28, 2014

Bullet and Numbering Bertingkat

Sebelumnya saya ucapkan selamat datang di blog jual rebana marawis ini, kali ini saya akan menulis tentang Bagaimana Cara Membuat Bullets dengan Numbering Tag HTML pada Posting Blog.
Dalam sebuah karya tulis atau tulisan seringkali kita jumpai daftar item (list), baik berupa penomoran (numbering) maupun bullet yang berfungsi untuk memberikan label atau urutan agar tulisan tersebut terstruktur dengan rapi sehingga dapat dipahami dengan mudah oleh para pembacanya.

Sebenarnya pada post editor blog sudah tersedia fasilitas untuk membuat list baik numbering maupun bullet, untuk blogspot sendiri fasilitas ini terdapat pada mode "Tulis" atau "Compose" yaitu berupa icon, dan penggunaannya cukup dengan meng klik icon tersebut. namun penggunaan fasilitas ini dirasa kurang praktis dan kurang memadai, terutama karena kurangnya variasi type numbering maupun bullet, juga pada saat kita hendak menggunakan list yang bertingkat.

HTML mendukung beberapa format list, baik numbering List dan bullets List.

Membuat Bullet and Numbering dengan HTML

Sebenarnya Cara Membuat Bullet and Numbering dengan HTML tidaklah sulit tapi hanya butuh ketelitian.
kali ini saya hanya sedekar ingin berbagi pengetahuan tentang format bullet and numbering dengan HTML. Kalau temen-temen sering ngetik di Microsoft Word pasti sudah pernah menggunakan bullet and numbering. Itu loh… yang berfungsi untuk memberikan label urutan kepada suatu list. Misalnya urutan 1, 2, 3, 4, atau mungkin a, b, c, d, atau bisa juga berupa simbol.

Sebenernya di hampir semua blog sudah tersedia fasilitas penambahan bullet and numbering secara mudah dengan meng-klik iconnya saja, tapi bagi temen-temen yang lebih senang dengan tantangan atau mungkin ingin lebih berkreasi dengan bullet and numbering, bisa melalui HTML.

Contohnya:
1. ini bentuk numbering satu
2. numbering lagi
3. numbering lagi yach…
4. ini yang terakhir

Sejauh yang saya ketahui, untuk membuat bullet and numbering ini bisa langsung melalui HTML, atau bisa juga melalui CSS (Cascading Style Sheet). Namun kali ini saya hanya berbagi cara pembuatan melalui HTML saja, sedangkan via CSS lain kali aja yach… he he he…
Untuk tutorial ini bisa anda coba membuatnya di notepad, atau langsung di blog juga bisa.
Tentukan bentuk bullet/numbering yang anda inginkan. Jika ingin berupa number/nomor, seperti 1, 2, 3, 4, dst, maka kode yang Anda gunakan adalah:

<ol>
<li>ini bentuk numbering satu</li>
<li>numbering lagi</li>
<li>numbering lagi yach...</li>
<li>ini yang terakhir</li>
</ol>

Hasil yang terlihat akan seperti ini:
1. ini bentuk numbering satu
2. numbering lagi
3. numbering lagi yach…
4. ini yang terakhir

Yang menentukan list tersebut berupa number adalah code <ol> dan </ol>.
Sedangkan bila Anda ingin membuat list berupa bullet (simbol), maka code yang bisa Anda gunakan adalah:

<ul>
<li>ini bullet satu</li>
<li>ini bullet lagi</li>
<li>yang ini juga bullet</li>
</ul>

Sehingga hasilnya menjadi
• ini bullet satu
• ini bullet lagi
• yang ini juga bullet

Perbedaan bullet and numbering hanya pada tag pertama dan terakhir saja. Jika ingin membuat list berupa number, maka tag yang anda gunakan adalah OL. Sementara jika anda ingin membuat lists berupa icon simbol atau gambar, maka gunakan tag UL.

Saturday, November 22, 2014

Mengenal HTML

HTML 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

Sedangkan Web browser adalah sebuah progam yang dapat menterjemahkan kode perintah dari dokumen HTML tersebut sehingga dapat kita lihat, baca dan dengar.

Dalam HTML tag merupakan code sekaligus perintah dimana kita dapat mengatur tampilan yang kita inginkan. Tag pada HTML selalu diawali dengan <x> dan ditutup dengan </x> dimana x adalah perintah dari apa yang kita inginkan.

Contoh :

<html>
<head>
<title>Judul Halaman/Caption</title>
</head>
<body>
Isi web/konten
</body>
</html>