Shadi Shadi

Diamond

Modul 1: Praktikum Pemrograman Web-HTML

6 Komentar

Belajar web yuk, aku juga baru belajar dan mencoba menganalisis soal-soal yang diberikan dosen untuk praktikum. Berikut adalah sintak-sintak yang digunakan untuk membuat sebuah halaman web.

1—<html>

2— <head>

3— <title>

4— Title/Judul Jendela Halaman Web

5— </title>

6— <body>

7— <h1>Contoh Judul Paragraf</h1>

8— <p>Contoh Paragraf Pertama</p>

9— <p>Contoh Paragraf Kedua</p>

10– </body>

11–</html>

  1. Pada baris satu adalah baris sebagai awal perintah HTML, perintah ini merupakan perintah pembuka dan untuk penutupnya terdapat pada baris 11 yang ditandai oleh garis miring didalam kurung.
  2. Baris kedua adalah merupakan bagian dari perintah HTML yang memiliki fungsi bahwa di dalam bagian ini merupakan bagian kepala atau merupakan bagian atas dari halaman HTML.
  3. Untuk baris ke-tiga, baris ini adalah baris yang digunakan untuk menuliskan judul dari halam yang akan tampil pada bagian paling atas pada browser:
  4. Baris ini memiliki pasangan pada baris ke lima yang digunakan untuk menutup bahwa bagian dari judul hanya samapai pada baris ke lima, dan judul yang ditampilkan adalah tulisan yang diapit oleh perintah pada baris ke tiga dan ke lima
  5. Untuk baris ke enam, baris ini adalah baris yang berisi apa yang akan ditampilkan pada browser, apakah sebuah teks atau sebuah gambar. Perintah yang digunakan adalah perintah <body> yang berhubungan dengan perintah pada baris ke 10 yang merupakan penutup bagian dari <body>.
  6. Untuk baris ke-7 tulisan “Contoh Judul Paragraf” diapit oleh <H1></H1> hal tersebut berarti tulisan tersebut menjadi sebuah heading dari teks yang memiliki besar huruf tertentu, selain <h1>, masih ada <H> lainya samapai <h6> dengan tingkat kebesar huruf semakin kecil dibanding <h1>.
  7. Untuk baris 8 dan 9 dikenai <P> yang berabrti teks tersebut merupakan sebuah paragraph baru.


<html>

<head>

<title>

Title/Judul Jendela Halaman Web

</title>

<body>

<body bgcolor=”black”>

<font color=”white”>

<h1>Contoh Judul Paragraf</h1>

<p>Contoh Paragraf Pertama</p>

<p>Contoh Paragraf Kedua</p>

<h2> Tekanan-tekanan hidup</h2>

<p>Perubahan situasi dan kondisi krisis global saat ini, membawa perasaan banyak jiwa menjadi gundah, khawatir, takut, emosi tinggi, dan tidak sedikit yang menjadi kebingungan akan kelanjutan kehidupannya di masa depan.Banyak orang yang kemudian sulit menggambarkan perasaan yang sesungguhnya sedang dialaminya, sehingga hanya semakin menambah banyaknya pribadi yang mengalami tekanan-tekanan dalam hidupnya.

Namun, tidak sedikit pribadi yang mengalami perubahan dari tidak serius menjadi lebih serius dalam bekerja, lebih rajin dalam berjuang menjalankan usaha dan bisnis.

Sebetulnya, ada dua pola tekanan – yang satu demikian cantiknya sehingga tidak dirasakan sebagai tekanan; dan yang satu lagi demikian menyiksanya sehingga merenggut seseorang keluar dari kenyamanan rumah tangganya dan menjadikan jalanan sebagai tempat tinggalnya.

Berikut adalah beberapa tekanan yang mungkin sedang menghimpit kita dari kebebasan yang semestinya, yang disarikan dari pointers Mario Teguh Morning Talk – Under Pressure :

</p><br>

<h3>Tekanan Persepsi</h3>

<p> Pelajaran dan tuntunan itu tampil dan ada se-nyata batu yang tergigit dalam kunyahan nasi, dan tidak untuk dipersepsikan selain sebagai yang telah terbuktikan.Tetapi persepsi kita – cara pandang yang dihasilkan oleh pendapat dan pengertian kita, sering membuat kita menerapkan pendekatan pada hidup, yang membuat kita berpacu kencang terbentur-bentur di jalan-jalan lingkar yang rumit, hanya untuk dipaksa masuk kembali ke jalan yang paling mendekatkan.

Dalam kondisi seperti saat ini, banyak di antara kita yang memajukan persepsi masing-masing yang pada akhirnya menjadi sebuah ajang peperangan yang saling menjelekkan persepsi orang lain. </p>

<h3>Tekanan Kebutuhan</h3>

<p>Bila seseorang bisa sampai pada keadaan di mana dia tidak dapat memenuhi kebutuhan dasarnya, pasti ada hal-hal yang harus diperbaiki pada persepsi-persepsi, keputusan-keputusan, dan cara-caranya.

Karena, kita sering membutuhkan yang tidak kita butuhkan, dan dengan keyakinan yang tidak mengerti, menafikan yang paling kita butuhkan.

Dalam suasana krisis global seperti ini, banyak orang yang merasa berada dalam tekanan kebutuhan yang terjadi sebagai akibat tidak tegasnya terhadap pilihan-pilihan keputusan yang baik.<p>

<h3>Tekanan Keinginan</h3>

<p>Ada anggapan bahwa semakin banyak keinginan kita, akan semakin tinggi tingkat tekanan hidup kita. Itu tidak sepenuhnya benar.

Karena tidak semua keinginan memberikan beban yang berat.

Hanya keinginan-keinginan yang tidak didasari oleh nilai-nilai yang baik, yang akan menghasilkan pemaksaan-pemaksaan diri yang berat.

Dalam perasaan dan kondisi yang menghimpit ini, kita sering meminta kepada Beliau Yang Maha Memiliki agar memenuhi seluruh keinginan kita dengan cara-cara yang tidak mendekatkan kita bagi terbagikannya izin dari-Nya untuk memenuhi.<p>

<a href=”latihan2.html”#atas>Kembali Ke Atas</a>

</font>

</body>

</html>

<!–

  1. <html> dan </html> merupakan perintah yang menyatakan bahwa bagian ini adalah web HTML dan didalamnya terdapat perintah-perintah lain.
  2. Untuk teks yang diapit oleh <title> dan </title> merupakan udul dari halaman web yang akan tampak di atas browser.
  3. Bagian yang diapit <body> dan </body> merupakan bagian yang berisi perintah atau teks yang akan ditampilkan pada halaman web.
  4. <body bgcolor=”black”> digunakan untuk memberikan warna pada halaman web berupa warna hitam.
  5. <font color=”white”> digunakan untuk memberikan warna dari tulisan berupa warna putih.
  6. tulisan “Contoh Judul Paragraf” diapit oleh <H1></H1> hal tersebut berarti tulisan tersebut menjadi sebuah heading dari teks yang memiliki besar huruf tertentu, selain <h1>, masih ada <H1> lainya samapai <h6> dengan tingkat kebesar huruf semakin kecil dibanding <h1>.
  7. Untuk setiap kalimat yang diapit oleh <p> dan </p> hal ini berarti kalimat-kalimat tersebut dalam satu paragraph.
  8. <a href=”latihan2.html”#atas>Kembali Ke Atas</a> digunakan untuk link, hal ini jika ditampilkan dalam browser dan diklik maka akan memberikan hasil browser akan menampilkan header atau teks paling atas dari halaman.


<html>

<head><Title>Daftar menu</title></HEAD>

<body>

<h1>Menu Hari Ini</h1>

<h3>1. Coffe</h3>

<a href=”Coffe.html”>

<img src=”C:\Documents and Settings\Administrator\My Documents\web1\Coffe-email-Stock%20Photo.jpg” HEIGH=”100″ WIDTH=”100″></a>

<h3>2.Tea</h3>

<a href=”tea.html”>

<img src=”C:\Documents and Settings\Administrator\My Documents\web1\tea-cups.jpg” HEIGH=”100″ WIDTH=”100″></a>

<ul>

<ul>

<li>Black Tea

<li>Green Tea

<ul>

<li>China

<li>Africa

</ul>

</ul></ul>

<h3>3.Milk</h3>

<a href=”milk.html”>

<img src=”C:\Documents and Settings\Administrator\My Documents\web1\PaperMilk.jpg” HEIGH=”100″ WIDTH=”100″></a>

</body></HTMl>

  1. <html> dan </html> merupakan bagian awal dan ahir dari perintah web HTML yang akan ditampilkan di dalam browser.
  2. <head><Title>Daftar menu</title></HEAD> merupakan bagian yang akan menjadi judul dari halaman dan akan tampil di bagian paling atas browser.
  3. <body> dan </body> merupakan bagian yang berisi perintah-perintah yang akan menampilkan isi dari halaman web.
  4. <h1>Menu Hari Ini</h1> merupakan heading dari teks, heading <h1> adalah heading yang memiliki besaran huruf paling besar.
  5. <h3>1. Coffe</h3> merupakan heading dari teks dan memiliki besar font lebih kecil dari heading sebelumnya karena menggunakan heading <h3>.
  6. <a href=”Coffe.html”><img src=”C:\Documents and Settings\Administrator\My Documents\web1\Coffe-email-Stock%20Photo.jpg” HEIGH=”100″ WIDTH=”100″></a> merupakan link berupa gambar, link ini nantinya jika di dalam browser bila dilakukan klik akan menuju sebuha halaman dalam hal ini adalah halaman Coffe.html dan dengan gambar yang menjadi link adalah gambar yang dipanggil melalui perintah <img src=…>.
  7. <h3>2.Tea</h3> merupakan heading dengan besar huruf lebih kecil dari heading pertama dan sama dengan heading Coffe.
  8. <a href=”tea.html”> <img src=”C:\Documents and Settings\Administrator\My Documents\web1\tea-cups.jpg” HEIGH=”100″ WIDTH=”100″></a> merupakan link berupa gambar, link ini akan menuju halaman tea.html dan hal tersebut dapat dilihat dari perintah <a href=”tea.html”>,gambar yang akan ditampilkan berupa gambar berukuran 100×100.
  9. <ul> digunakan untuk menampilkan daftar tidak bernomor.
  10. <li>Black Tea digunakan untuk menampilkan daftar berupa Balck Tea dan akan muncul symbol linkaran tanpa arsiran didalamnya, hal tersebtu berbeda jika <ul> di awal hanya dibuat satu, maka pada list Black Tea yang akan digunakan adalah bulatan dengan arsiran.
  11. 11. <h3>3.Milk</h3> digunakan untuk membuat heading.
  12. 12. <a href=”milk.html”> <img src=”C:\Documents and Settings\Administrator\My Documents\web1\PaperMilk.jpg” HEIGH=”100″ WIDTH=”100″></a> digunakan untuk membuat link berupa gambar yang akan menuju milk.html jika gambar pada browser di lakukan clik.

About these ads

Author: Hadi Sasongko

.

6 thoughts on “Modul 1: Praktikum Pemrograman Web-HTML

  1. slam knl aku ahli di bidang pemrograman web

  2. kunjungan malam…. nice tutorial salam kenal dari newbie blogger solo

  3. bagaimana cara mengupload html saya ke internet ?

    • em, aku lum pernah sih…tapi beberapa teman yang udah pernah coba katanya harus beli domain atau alamat (.com, .co.id) atau gak cari yang gratisan (sayang lupa beberapa alamat yang menyediakan domain gratis) kalau sudah dari sana ada petunjuknya…

Berikan Balasan

Isikan data di bawah atau klik salah satu ikon untuk log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Logout / Ubah )

Twitter picture

You are commenting using your Twitter account. Logout / Ubah )

Facebook photo

You are commenting using your Facebook account. Logout / Ubah )

Google+ photo

You are commenting using your Google+ account. Logout / Ubah )

Connecting to %s

Ikuti

Get every new post delivered to your Inbox.