Newbie: Januari 2017

Minggu, 22 Januari 2017

Tutorial HTML Dasar

Tugas 1 Buatlah sebuah web dengan menggunakan rincian berikut:

Title: Tugas 1 - <NIM>
Memiliki judul dengan font lebih besar dari isi. Judul bebas, dibuat terdiri dari 2 baris (gunakan element br)
Memiliki 2 paragraf tulisan tentang pengalaman di Fasilkom UNSRI (gunakan element p)
Memiliki sebuah gambar (gunakan img).
Buat 2 bagian di gambar yang jika di-klik akan membuka situs tertentu pada halaman baru (gunakan usemap)
Memilki garis
Tuliskan paragraf yang menjelaskan tentang jenis-jenis HTML Entities
Tuliskan paragraf yang menjelaskan tentang Jenis-jenis HTML Symbol
Tuliskan paragraf yang menjelaskan tentang Jenis-jenis HTML charset
Buatlah sebuah pantun bebas dengan 4 bait (gunakan element pre. jangan gunakan element br)

Tutorialnya :

1. Pertama tuliskan Tugas 1 - <NIM> di dalam bagian Title

2. Kemudian untuk membuat judul yang terdiri dari dua baris tuliskan dua pasang elemen <h1>

3. Lalu gunakan elemen <p> untuk membuat paragraf tulisan

4. Selanjutnya untuk menambahkan gambar masukkan kode: <img src="alamat gambar" />

5. Untuk membuat 2 bagian di gambar jika di klik akan membuka situs tertentu pada halaman baru masukkan kode: <img src="alamat gambar" width="lebar gambar" height="tinggi gambar" usemap="nama usemap"> dan untuk Tag areanya: <area shape="rect" coords=”titik koordinatnya″ href="alamat gambar" target="_blank">

6. Tag untuk membuat garis tuliskan <hr width=100% align=center size=1% color=”warna garis”>

7. Untuk membuat paragraf yang menjelaskan tentang HTML Entities,Symbol dan Charset tutorialnya sama dengan nomor 3

8. Terakhir untuk membuat pantun caranya "hampir sama" dengan nomor 3. Elemen <p> tinggal diganti dengan elemen <pre>

Jumat, 20 Januari 2017

Cara Membuat Web Dengan Menggunakan HTML Style & Formatting

Assalamualaikum.Wr.Wb
Di post kali ini saya akan menjelaskan Cara membuat Web Dengan Menggunakan HTML Style & Formatting. Pada tutorial ini saya menggunakan aplikasi Notepad++. Jika belum punya aplikasinya bisa download dari http://notepad-plus-plus.org/download/.

1. Pertama silahkan buka text editor (Notepad++), lalu ketikkan kode struktur dasarnya berikut ini:

2. Kemudian masukkan kode: <body style="background-color: warna"> untuk merubah warna background. Disini saya menggunakan warna orange.

3. Selanjutnya untuk membuat judul tulisan berwarna tertentu dengan kode warna HEX dan meletakkannya ditengah masukkan kode: <center><h2 style="kode HEX"> Tempat Makan Favorit di Palembang dan Sekitarnya </h2></center>. Disini saya menggunakan kode #000000. Untuk mengetahui kode warna lain HEX bisa dilihat Disini

4. Lalu untuk mengubah font dari sebuah paragraf tulisan masukkan kode <p><font face="Nama Font">  </p>. Disini saya menggunakan Font Balker. Jika ingin mengganti jenis font lain bisa lihat Disini

5. Untuk membuat huruf kapital pertama setiap kalimat dengan Font berukuran yang lebih besar masukkan kode: <style>.first {font-size: ukuran px;}</style> dan <span class="first">Huruf Kapital</span>. Disini saya menggunakan ukuran 30px.

6. Terakhir letakkan elemen <b>,<em>,<i>,<small>,<strong>,<sub>,<sup>,<ins>,<del>,<mark> di tempat yang kita inginkan seperti dibawah ini.

Note:
<b> Defines bold text
<strong> Defines important text
<em> Defines emphasized text
<i> Defines italic text
<small> Defines smaller text
<sub> Defines subscripted text
<sup> Defines superscripted text
<ins> Defines inserted text
<del> Defines deleted text
<mark> Defines marked/highlighted text

7. Dan tampilan akhirnya akan terlihat seperti ini.

Demikianlah tutorial newbie dari saya. Semoga Bermanfaat ^_^
Wassalamualikum Wr.Wb