Septa Site

Pascal [Bahasa Pemrograman]

<div style="text-align: justify;">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhXrHEZuLEBDMqX3UD3ECxLJd9PFLUNlmu9j3h6TMaCOlY4h5mQTfQKHWPzg9OhHUlkXKdfF5f0827WGL_qCZJM3hgnM0g9yg39kcjU9CVERrXUNQwh4PI-J_KhV6gM-Roe5TZ-u6SmddQT/s320/pascal.jpg" /><span style="font-family: Arial, Helvetica, sans-serif;"><b>SeptaSite - </b>Pada pos kali ini akan dibahas mengenai salah satu bahasa pemrograman yaitu <b>Pascal. </b>Nah nanti <b>SeptaSite</b> akan update berkala tentang bahasa pemrograman. Untuk pos sekarang akan dibahas pengertian pascal.</span></div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
<span style="font-family: Arial, Helvetica, sans-serif;">Sebelum masuk ke belajar Pascal disini saya menyarankan untuk mempunyai programnya terlebih dahulu. Sebenarnya ada beberapa program yang bisa digunakan, seperti <b>Turbo Pascal, Free Pascal, Dev-Pascal. </b>Tapi disini saya lebih menyarankan untuk menggunakan <b>Dev-Pascal</b>. Jadi silahkan cari terlebih dahulu Dev-Pascalnya</span></div>
<div style="text-align: justify;">
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div style="text-align: justify;">
<span style="font-family: Arial, Helvetica, sans-serif;"><b style="background-color: white; color: #252525; line-height: 22.4px;">Pascal</b><span style="background-color: white; color: #252525; line-height: 22.4px;"> adalah </span><a href="https://id.wikipedia.org/wiki/Bahasa_pemrograman" style="background: none rgb(255, 255, 255); color: #0b0080; line-height: 22.4px; text-decoration: none;" title="Bahasa pemrograman">bahasa pemrograman</a><span style="background-color: white; color: #252525; line-height: 22.4px;"> yang pertama kali di buat oleh Profesor </span><a href="https://id.wikipedia.org/wiki/Niklaus_Wirth" style="background: none rgb(255, 255, 255); color: #0b0080; line-height: 22.4px; text-decoration: none;" title="Niklaus Wirth">Niklaus Wirth</a><span style="background-color: white; color: #252525; line-height: 22.4px;">, seorang anggota International Federation of Information Processing (IFIP) pada tahun 1971. Dengan mengambil nama dari </span><a href="https://id.wikipedia.org/wiki/Matematikawan" style="background: none rgb(255, 255, 255); color: #0b0080; line-height: 22.4px; text-decoration: none;" title="Matematikawan">matematikawan</a><span style="background-color: white; color: #252525; line-height: 22.4px;"> </span><a href="https://id.wikipedia.org/wiki/Perancis" style="background: none rgb(255, 255, 255); color: #0b0080; line-height: 22.4px; text-decoration: none;" title="Perancis">Perancis</a><span style="background-color: white; color: #252525; line-height: 22.4px;">, </span><a href="https://id.wikipedia.org/wiki/Blaise_Pascal" style="background: none rgb(255, 255, 255); color: #0b0080; line-height: 22.4px; text-decoration: none;" title="Blaise Pascal">Blaise Pascal</a><span style="background-color: white; color: #252525; line-height: 22.4px;">, yang pertama kali menciptakan mesin penghitung, Profesor Niklaus Wirth membuat bahasa Pascal ini sebagai alat bantu untuk mengajarkan konsep pemrograman </span><a href="https://id.wikipedia.org/wiki/Komputer" style="background: none rgb(255, 255, 255); color: #0b0080; line-height: 22.4px; text-decoration: none;" title="Komputer">komputer</a><span style="background-color: white; color: #252525; line-height: 22.4px;"> kepada mahasiswanya. Selain itu, Profesor Niklaus Wirth membuat Pascal juga untuk melengkapi kekurangan-kekurangan bahasa pemrograman yang ada pada saat itu.</span></span></div>
<div style="text-align: center;">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjwzlVbqrXh8m4ck_hxBZqQpXzKW3UJAONiq9VcKxT185O5-md-RfE4zNVR3WId0rymi9jQ7WGM56v1tePuaWEZSsSHoYLUb4E-2LhzFIbhdP0wEGM9J7vYvdYqOuIuzqz7Fl9nuLoB1kPF/s1600/turbo_pascal.png" /></div>
<div style="text-align: justify;">
<span style="font-family: Arial, Helvetica, sans-serif;"><span style="background-color: white; color: #252525; line-height: 22.4px;"><br /></span></span></div>
<div style="text-align: center;">
<span style="color: #252525; font-family: Arial, Helvetica, sans-serif;"><span style="background-color: white; line-height: 22.4px;"><b>Kelebihan Bahasa Pascal</b></span></span></div>
<ul style="background-color: white; color: #252525; line-height: 22.4px; list-style-image: url(https://upload.wikimedia.org/wikipedia/en/1/18/Monobook-bullet.png); margin: 0.3em 0px 0px 1.6em; padding: 0px;">
<li style="margin-bottom: 0.1em; text-align: justify;"><span style="font-family: Arial, Helvetica, sans-serif;"><b>Tipe Data Standar</b>, tipe-tipe data standar yang telah tersedia pada kebanyakan bahasa pemrograman. Pascal memiliki <a class="new" href="https://id.wikipedia.org/w/index.php?title=Tipe_data&action=edit&redlink=1" style="background: none; color: #a55858; text-decoration: none;" title="Tipe data (halaman belum tersedia)">tipe data</a> standar: <i><a class="mw-redirect" href="https://id.wikipedia.org/wiki/Boolean" style="background: none; color: #0b0080; text-decoration: none;" title="Boolean">boolean</a></i>, <i><a class="mw-redirect" href="https://id.wikipedia.org/wiki/Integer" style="background: none; color: #0b0080; text-decoration: none;" title="Integer">integer</a></i>, <i><a href="https://id.wikipedia.org/wiki/Real" style="background: none; color: #0b0080; text-decoration: none;" title="Real">real</a></i>, <i><a href="https://id.wikipedia.org/wiki/Char" style="background: none; color: #0b0080; text-decoration: none;" title="Char">char</a></i>, <i><a href="https://id.wikipedia.org/wiki/String" style="background: none; color: #0b0080; text-decoration: none;" title="String">string</a></i>,</span></li>
<li style="margin-bottom: 0.1em; text-align: justify;"><span style="font-family: Arial, Helvetica, sans-serif;"><b>User defined Data Types</b>, programmer dapat membuat tipe data lain yang diturunkan dari tipe data standar.</span></li>
<li style="margin-bottom: 0.1em; text-align: justify;"><span style="font-family: Arial, Helvetica, sans-serif;"><b>Strongly-typed</b>, programmer harus menentukan tipe data dari suatu variabel, dan variabel tersebut tidak dapat dipergunakan untuk menyimpan tipe data selain dari format yang ditentukan.</span></li>
<li style="margin-bottom: 0.1em; text-align: justify;"><span style="font-family: Arial, Helvetica, sans-serif;"><b>Terstruktur</b>, memiliki sintaks yang memungkinkan penulisan program dipecah menjadi fungsi-fungsi kecil (<i>procedure</i> dan <i>function</i>) yang dapat dipergunakan berulang-ulang.</span></li>
<li style="margin-bottom: 0.1em; text-align: justify;"><span style="font-family: Arial, Helvetica, sans-serif;"><b>Sederhana dan Ekspresif</b>, memiliki struktur yang sederhana dan sangat mendekati bahasa manusia (bahasa Inggris) sehingga mudah dipelajari dan dipahami.</span></li>
</ul>
<div style="background-color: white; color: #252525; line-height: 22.4px; margin-bottom: 0.5em; margin-top: 0.5em; text-align: justify;">
<span style="font-family: Arial, Helvetica, sans-serif;">Bahasa PASCAL juga merupakan bahasa yang digunakan sebagai standar bahasa pemrograman bagi tim nasional Olimpiade Komputer Indonesia (<a class="mw-redirect" href="https://id.wikipedia.org/wiki/TOKI" style="background-attachment: initial; background-clip: initial; background-color: initial; background-image: none; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; color: #0b0080; text-decoration: none;" title="TOKI">TOKI</a>). Selain itu, Bahasa PASCAL masih digunakan dalam IOI (<i>International Olympiad in Informatics</i>).</span></div>
<div style="background-color: white; color: #252525; line-height: 22.4px; margin-bottom: 0.5em; margin-top: 0.5em; text-align: justify;">
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div style="background-color: white; color: #252525; line-height: 22.4px; margin-bottom: 0.5em; margin-top: 0.5em; text-align: justify;">
<span style="font-family: Arial, Helvetica, sans-serif;"><b>Tipe Data yang digunakan pada Pascal</b></span></div>
<table class="wikitable" style="background: rgb(249, 249, 249); border-collapse: collapse; border: 1px solid rgb(170, 170, 170); color: black; font-family: sans-serif; font-size: 14px; line-height: 22.4px; margin: 1em 1em 1em 0px; text-align: justify;"><tbody>
<tr><th style="background: rgb(242, 242, 242); border: 1px solid rgb(170, 170, 170); padding: 0.2em 0.4em; text-align: center;">Tipe Data</th><th style="background: rgb(242, 242, 242); border: 1px solid rgb(170, 170, 170); padding: 0.2em 0.4em; text-align: center;">Deskripsi (range variabel)</th></tr>
<tr><td style="border: 1px solid rgb(170, 170, 170); padding: 0.2em 0.4em;"><a class="mw-redirect" href="https://id.wikipedia.org/wiki/Byte" style="background: none; color: #0b0080; text-decoration: none;" title="Byte">Byte</a></td><td style="border: 1px solid rgb(170, 170, 170); padding: 0.2em 0.4em;">angka dari 0 sampai 255</td></tr>
<tr><td style="border: 1px solid rgb(170, 170, 170); padding: 0.2em 0.4em;"><a class="mw-redirect" href="https://id.wikipedia.org/wiki/Integer" style="background: none; color: #0b0080; text-decoration: none;" title="Integer">Integer</a></td><td style="border: 1px solid rgb(170, 170, 170); padding: 0.2em 0.4em;">angka dari -32768 sampai 32767</td></tr>
<tr><td style="border: 1px solid rgb(170, 170, 170); padding: 0.2em 0.4em;"><a href="https://id.wikipedia.org/wiki/Kategori:Tipe_data" style="background: none; color: #0b0080; text-decoration: none;" title="Kategori:Tipe data">Real</a></td><td style="border: 1px solid rgb(170, 170, 170); padding: 0.2em 0.4em;">semua nilai pecahan dari 1E-38 sampai 1E+38</td></tr>
<tr><td style="border: 1px solid rgb(170, 170, 170); padding: 0.2em 0.4em;"><a class="mw-redirect" href="https://id.wikipedia.org/wiki/Boolean" style="background: none; color: #0b0080; text-decoration: none;" title="Boolean">Boolean</a></td><td style="border: 1px solid rgb(170, 170, 170); padding: 0.2em 0.4em;">nilai TRUE atau FALSE</td></tr>
<tr><td style="border: 1px solid rgb(170, 170, 170); padding: 0.2em 0.4em;"><a href="https://id.wikipedia.org/wiki/Char" style="background: none; color: #0b0080; text-decoration: none;" title="Char">Char</a></td><td style="border: 1px solid rgb(170, 170, 170); padding: 0.2em 0.4em;">semua karakter dari tabel ASCII</td></tr>
<tr><td style="border: 1px solid rgb(170, 170, 170); padding: 0.2em 0.4em;"><a href="https://id.wikipedia.org/wiki/String" style="background: none; color: #0b0080; text-decoration: none;" title="String">String</a></td><td style="border: 1px solid rgb(170, 170, 170); padding: 0.2em 0.4em;">semua huruf, spasi, frasa<br /></td></tr>
</tbody></table>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: center;">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibKZ0wNoY_MnN0ePs7pEA7-VZeJnAwZEvHx770f0yqi16S_nQMvWGkXbSJZi6rCWbqj-WzcVQGl0Cb-CzQgu28zPmMKGQ1O_y8mGBMf_3VDyMx_ZqKNWNbQiGwq2qKHDtIQO32jhg5XrA/s1600/struktur+data.png" /></div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
<span style="font-family: Arial, Helvetica, sans-serif;"><b>Perlukah Belajar Pascal ?</b></span></div>
<div>
<div style="background-color: white; border: 0px; box-sizing: border-box; color: #272727; font-stretch: inherit; line-height: 27px; margin-bottom: 20px; padding: 0px; text-align: justify; vertical-align: baseline;">
<span style="font-family: Arial, Helvetica, sans-serif;">Jika anda melihat lowongan kerja programmer saat ini, nyaris tidak ada yang membutuhkan keahlian bahasa pascal, jadi untuk apa mempelajari pascal?</span></div>
<div style="background-color: white; border: 0px; box-sizing: border-box; color: #272727; font-stretch: inherit; line-height: 27px; margin-bottom: 20px; padding: 0px; text-align: justify; vertical-align: baseline;">
<span style="font-family: Arial, Helvetica, sans-serif;">Karena berbagai alasan dan sejarah yang panjang, saat ini Pascal ‘kalah bersaing’ dengan bahasa pemrograman lain, seperti <strong style="border: 0px; box-sizing: border-box; font-stretch: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">C, C++, Java</strong> bahkan bahasa <strong style="border: 0px; box-sizing: border-box; font-stretch: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">BASIC</strong> (melalui <strong style="border: 0px; box-sizing: border-box; font-stretch: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">Microsoft Visual Basic</strong>). Ini terjadi bukan karena bahasa Pascal yang tidak ‘bagus’, akan tetapi lebih karena sisi marketing dan kurangnya dukungan Industri.</span></div>
<div style="background-color: white; border: 0px; box-sizing: border-box; color: #272727; font-stretch: inherit; line-height: 27px; margin-bottom: 20px; padding: 0px; text-align: justify; vertical-align: baseline;">
<span style="font-family: Arial, Helvetica, sans-serif;">Sebagai contoh, banyak kalangan yang menganggap Pascal lebih bagus dan lebih terstruktur dibandingkan dengan BASIC, namun BASIC didukung oleh perusahaan sekelas Microsoft dengan Microsoft Visual Basic, sehingga lebih populer dibandingkan <strong style="border: 0px; box-sizing: border-box; font-stretch: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">Borland Delphi</strong> (aplikasi sejenis Visual Basic yang menggunakan bahasa Pascal).</span></div>
<div style="background-color: white; border: 0px; box-sizing: border-box; color: #272727; font-stretch: inherit; line-height: 27px; margin-bottom: 20px; padding: 0px; text-align: justify; vertical-align: baseline;">
<span style="font-family: Arial, Helvetica, sans-serif;">Walaupun tidak sepopuler bahasa C,C++ atau Java, saat ini Pascal masih banyak digunakan sebagai bahasa pemrograman pengantar di sekolah dan universitas.</span></div>
<div style="background-color: white; border: 0px; box-sizing: border-box; color: #272727; font-stretch: inherit; line-height: 27px; margin-bottom: 20px; padding: 0px; text-align: justify; vertical-align: baseline;">
<span style="font-family: Arial, Helvetica, sans-serif;">Pascal adalah untuk anda yang ingin mempelajari algoritma dan pemrograman dari dasar, atau siswa SMA/SMK yang ingin mengikuti olimpiade komputer. Pascal juga cocok bagi siswa SMA yang berencana mengambil jurusan <em style="border: 0px; box-sizing: border-box; font-stretch: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">Ilmu Komputer / Teknik Informatika</em> dan ingin ‘curi start’ berkenalan dengan bahasa pemrograman.</span></div>
<div style="background-color: white; border: 0px; box-sizing: border-box; color: #272727; font-stretch: inherit; line-height: 27px; margin-bottom: 20px; padding: 0px; text-align: justify; vertical-align: baseline;">
<span style="font-family: Arial, Helvetica, sans-serif;">Jika anda sudah paham garis besar algoritma dan ingin menguasai bahasa ‘dunia kerja’, Pascal mungkin tidak terlalu cocok. Anda bisa langsung mempelajari C++, C#, Java, Python, atau bahasa pemograman modern lainnya.</span></div>
<div style="background-color: white; border: 0px; box-sizing: border-box; color: #272727; font-stretch: inherit; line-height: 27px; margin-bottom: 20px; padding: 0px; text-align: justify; vertical-align: baseline;">
<span style="font-family: Arial, Helvetica, sans-serif;">Sebagai penutup, saat ini juga tersedia aplikasi <strong style="border-image-outset: initial; border-image-repeat: initial; border-image-slice: initial; border-image-source: initial; border-image-width: initial; border: 0px; box-sizing: border-box; font-stretch: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">Lazarus</strong> (<a href="http://www.lazarus-ide.org/" style="background-color: transparent; border-image-outset: initial; border-image-repeat: initial; border-image-slice: initial; border-image-source: initial; border-image-width: initial; border: 0px; box-sizing: border-box; color: #2482c1; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; text-decoration: none; vertical-align: baseline;">www.lazarus-ide.org</a>) yang menyediakan fitur mirip Microsoft Visual Basic dan Borland Delphi untuk membuat aplikasi Windows dengan cepat. Aplikasi ini bisa digunakan dengan gratis, sehingga bahasa pascal yang anda pelajari masih bisa digunakan untuk membuat proyek ‘real world’.</span></div>
</div>

Pascal [Bahasa Pemrograman]

SeptaSite - Pada pos kali ini akan dibahas mengenai salah satu bahasa pemrograman yaitu Pascal. Nah nanti SeptaSite akan update berkala tentang bahasa pemrograman. Untuk pos sekarang akan dibahas pengertian pascal. Sebelum masuk ke belajar Pascal disini saya menyarankan untuk mempunyai programnya t…

25Nov2015

Belajar Membuat Website dengan HTML [Bagian 3] | Tag-Tag pada HTML

<div>
<span style="font-family: inherit;"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6205PzakU2eH6DIX35G3DcDOIz2_3F5nGDcnnrcac01nE2n6PWLGqZdCIP6oofzXUDYZaFGtf_irS0-GApNQA-_DnFOBkWaXb8UQSWQzoXiONZjg2yeD_P4irBsrNo0tjp1-dhAZk1e4/s1600/list-html.png" /><span style="color: #333333; font-family: "source sans pro" , sans-serif;"><span style="line-height: 24px;"><b><a href="http://septaa-site.blogspot.com/" target="_blank">SeptaSite</a> - </b>Pada pos sebelumnya sudah dijelaskan tentang <a href="http://septa-site.blogspot.co.id/2015/11/dasar-dasar-html.html" target="_blank">Dasar-dasar HTML</a>. Ok, pada pos sekarang kita masuk ke bagian 3 dari Belajar Membuat Website dengan HTML, untuk pos sekarang kita akan membahas Tag-Tag pada HTML.</span></span><span style="color: #333333; font-family: "source sans pro" , sans-serif; line-height: 24px;"> </span></span></div>
<br />
<ul style="background-color: white; color: #222222; font-family: 'Source Sans Pro', sans-serif; font-size: 16px; line-height: 24px;">
<li style="color: #333333;"><span style="font-family: inherit;"><b><html> </b>= Tempatnya seluruh elemen HTML atau mendefinisikan dokumen HTML.</span></li>
</ul>
<ul style="background-color: white; color: #222222; font-family: 'Source Sans Pro', sans-serif; font-size: 16px; line-height: 24px;">
<li style="color: #333333;"><span style="font-family: inherit;"><b><head> </b>= Tempat diletakkannya sumber daya website seperti CSS, Javacript, Title.</span></li>
</ul>
<ul style="background-color: white; color: #222222; font-family: 'Source Sans Pro', sans-serif; font-size: 16px; line-height: 24px;">
<li style="color: #333333;"><span style="font-family: inherit;"><b><title></b> = Elemen text dari judul halaman HTML, yang akan ditampilkan pada tab browser.</span></li>
</ul>
<ul style="background-color: white; color: #222222; font-family: 'Source Sans Pro', sans-serif; font-size: 16px; line-height: 24px;">
<li style="color: #333333;"><span style="font-family: inherit;"><b style="text-align: justify;"><style> = </b><span style="text-align: justify;">T</span><span style="text-align: justify;">empat diletakkannya gaya atau style (CSS) untuk memperindah tampilan halaman HTML / website.</span></span></li>
</ul>
<ul style="background-color: white; color: #222222; font-family: 'Source Sans Pro', sans-serif; font-size: 16px; line-height: 24px;">
<li style="color: #333333;"><span style="font-family: inherit; text-align: justify;"><b><script> </b>= Tempat diletakkanya Javascript.</span></li>
</ul>
<ul style="background-color: white; color: #222222; font-family: 'Source Sans Pro', sans-serif; font-size: 16px; line-height: 24px;">
<li style="color: #333333;"><span style="font-family: inherit;"><b><body> </b>= Tempat seluruh elemen HTML yang akan ditampilkan pada browser.</span></li>
</ul>
<ul style="background-color: white; color: #222222; font-family: 'Source Sans Pro', sans-serif; font-size: 16px; line-height: 24px;">
<li style="color: #333333;"><span style="font-family: inherit;"><b></b> = Sebagai elemen pembungkus keterangan yang ada pada dokumen HTML, elemen ini tidak berpengaruh pada tampilan website. Contoh : "<b><span style="font-family: "trebuchet ms" , sans-serif;">".</span></b></span></li>
</ul>
<ul style="background-color: white; color: #222222; font-family: 'Source Sans Pro', sans-serif; font-size: 16px; line-height: 24px;">
<li style="color: #333333;"><span style="font-family: inherit;"><b><p> </b>= Elemen yang mendefenisikan suatu paragraf/ alinea.</span></li>
</ul>
<ul style="background-color: white; color: #222222; font-family: 'Source Sans Pro', sans-serif; font-size: 16px; line-height: 24px;">
<li style="color: #333333;"><span style="font-family: inherit;"><b><div> </b>= Suatu elemen pembungkus elemen HTML yang lain, yang tidak memiliki arti khusus, namun sering digunakan sebagai elemen yang berdiri sendiri, karena elemen tersebut akan membuat garis baru dari elemen sebelumnya, dan sesudahnya yang didapatkan dari <b>style </b>bawaan <b><div> </b>yakni "<b>display:block</b>". Sama halnya dengan <b><p> </b>, namun pada <b><p></b> terdapat margin, sedangkan pada <b><div> </b>tidak.</span></li>
</ul>
<ul style="background-color: white; color: #222222; font-family: 'Source Sans Pro', sans-serif; font-size: 16px; line-height: 24px;">
<li style="color: #333333;"><span style="font-family: inherit;"><b><span></b> = Suatu elemen pembungkus elemen HTML yang lain, sama fungsinya dengan <b><div></b> namun tidak memberikan pengaruh apapun pada elemen yang ada didalamnya, karena tidak memiliki style bawaan. </span></li>
</ul>
<ul style="background-color: white; color: #222222; font-family: 'Source Sans Pro', sans-serif; font-size: 16px; line-height: 24px;">
<li style="color: #333333;"><span style="font-family: inherit;"><b><img></b> = Elemen pemanggil atau penampil gambar. Contoh : <b><span style="font-family: "trebuchet ms" , sans-serif;">"<img src="Alamatgambar" />"</span></b> . Elemen <b><img></b> tidak memerlukan tag penutup, melainkan langsung ditutup pada akhir tag pembukanya saja />. src=" " disini mendefinisikan source atau sumber gambar (Alamat Gambar).</span></li>
</ul>
<ul style="background-color: white; color: #222222; font-family: 'Source Sans Pro', sans-serif; font-size: 16px; line-height: 24px;">
<li style="color: #333333;"><span style="font-family: inherit;"><b><input></b> = Mendefinisikan elemen input</span></li>
</ul>
<ul style="background-color: white; color: #222222; font-family: 'Source Sans Pro', sans-serif; font-size: 16px; line-height: 24px;">
<li style="color: #333333;"><span style="font-family: inherit;"><b><i> atau <em></b> = Membuat text / huruf miring (<i>Italic</i>)</span></li>
</ul>
<ul style="background-color: white; color: #222222; font-family: 'Source Sans Pro', sans-serif; font-size: 16px; line-height: 24px;">
<li style="color: #333333;"><span style="font-family: inherit;"><b><b></b> = Membuat text / huruf tebal (<b>Bold</b>)</span></li>
</ul>
<ul style="background-color: white; color: #222222; font-family: 'Source Sans Pro', sans-serif; font-size: 16px; line-height: 24px;">
<li style="color: #333333;"><span style="font-family: inherit;"><b><u></b> = Membuat text / huruf bergaris bawah (<u>Underline</u>)</span></li>
</ul>
<ul style="background-color: white; color: #222222; font-family: 'Source Sans Pro', sans-serif; font-size: 16px; line-height: 24px;">
<li style="color: #333333;"><span style="font-family: inherit;"><b><h1> s/d <h6></b> = Header text atau text kepala untuk judul ataupun sub judul.</span></li>
</ul>
<ul style="background-color: white; color: #222222; font-family: 'Source Sans Pro', sans-serif; font-size: 16px; line-height: 24px;">
<li style="color: #333333;"><span style="font-family: inherit;"><b><br /></b> = Sebagai baris baru/ enter.</span></li>
</ul>
<ul style="background-color: white; color: #222222; font-family: 'Source Sans Pro', sans-serif; font-size: 16px; line-height: 24px;">
<li style="color: #333333;"><span style="font-family: inherit;"><b><ul> </b>= Untuk membuat list tidak berurutan atau list dengan bullet hitam (<b>Unordered List</b>). Penggunaan <b><ul> </b>diperuntukkan sebagai parent (Induk elemen) dari elemen <b><li></b>. Contoh : "<span style="font-family: "trebuchet ms" , sans-serif;"><b><ul><li>List ke-1</li></ul>"</b></span></span></li>
</ul>
<ul style="background-color: white; color: #222222; font-family: 'Source Sans Pro', sans-serif; font-size: 16px; line-height: 24px;">
<li style="color: #333333;"><span style="font-family: inherit;"><b><ol></b> = Untuk membuat list berurutan dengan angka (Ordered List). Sama fungsinya dengan <b><ul></b></span></li>
</ul>
<ul style="background-color: white; color: #222222; font-family: 'Source Sans Pro', sans-serif; font-size: 16px; line-height: 24px;">
<li style="color: #333333;"><span style="font-family: inherit;"><b><li></b> = Elemen list atau daftar.</span></li>
</ul>
<ul style="background-color: white; color: #222222; font-family: 'Source Sans Pro', sans-serif; font-size: 16px; line-height: 24px;">
<li style="color: #333333;"><span style="font-family: inherit;"><b><a> </b>= Elemen untuk diletakkannya suatu link/ alamat website diluar dari halaman HTML itu sendiri. Contoh : <span style="font-family: "trebuchet ms" , sans-serif;">"<b><a href="https://www.google.co.id/" > Google </a>"</b></span>. Contoh tersebut akan menampilkan text "<b>Google</b>" saja namun terdapat link/ alamat yang dapat di klik pada text tersebut, yakni yang ada pada property <a <b>href="<u>Tempatlink</u>"</b>>.</span></li>
</ul>
<ul style="background-color: white; color: #222222; font-family: 'Source Sans Pro', sans-serif; font-size: 16px; line-height: 24px;">
<li style="color: #333333;"><span style="font-family: inherit;"><b><table></b> = Elemen tabel.</span></li>
</ul>
<ul style="background-color: white; color: #222222; font-family: 'Source Sans Pro', sans-serif; font-size: 16px; line-height: 24px;">
<li style="color: #333333;"><span style="font-family: inherit;"><b><th></b> = Table header, baris kepala tabel.</span></li>
</ul>
<ul style="background-color: white; color: #222222; font-family: 'Source Sans Pro', sans-serif; font-size: 16px; line-height: 24px;">
<li style="color: #333333;"><span style="font-family: inherit;"><b><tr> </b>= Table row atau baris tabel.</span></li>
</ul>
<ul style="background-color: white; color: #222222; font-family: 'Source Sans Pro', sans-serif; font-size: 16px; line-height: 24px;">
<li style="color: #333333;"><span style="font-family: inherit;"><b><td></b> = Table data atau kolom tabel.</span></li>
</ul>
<ul style="background-color: white; color: #222222; font-family: 'Source Sans Pro', sans-serif; font-size: 16px; line-height: 24px;">
<li style="color: #333333;"><span style="font-family: inherit;"><b><marquee></b> = Membuat text / huruf berjalan.</span></li>
</ul>
<br />
<div>
<span style="color: #333333; font-family: "source sans pro" , sans-serif;"><span style="font-family: inherit; line-height: 24px;">Pada pos selanjutnya akan dibahas penggunaan dari tag-tag yang sudah dijelaskan jadi</span></span></div>
<div>
<span style="color: #333333; font-family: "source sans pro" , sans-serif;"><span style="font-family: inherit; line-height: 24px;"><br /></span></span></div>
<div>
<div class="separator" style="background-color: #fafafa; clear: both; color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 11px; line-height: 17.6px; text-align: center;">
<span style="background-color: white; font-family: inherit;">Tutorial Belajar HTML di SeptaSite :</span></div>
<div class="separator" style="background-color: #fafafa; clear: both; color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 11px; line-height: 17.6px;">
<span style="background-color: white; font-family: inherit;">Bagian 1 : <a href="http://septa-site.blogspot.co.id/2015/11/hypertext-markup-language.html" style="color: #999999; text-decoration: none;" target="_blank">Belajar Membuat Website dengan HTML [Bagian 1] | HyperText Markup Language</a></span></div>
<div class="separator" style="background-color: #fafafa; clear: both; color: #333333; font-family: Verdana, Geneva, sans-serif; font-size: 11px; line-height: 17.6px;">
<span style="background-color: white; font-family: inherit;">Bagian 2 : <a href="http://septa-site.blogspot.com/2015/11/dasar-dasar-html.html" style="color: #999999; text-decoration: none;" target="_blank">Belajar Membuat Website dengan HTML [Bagian 2] | Dasar-Dasar HTML</a></span></div>
</div>
<div>
<span style="font-family: inherit;"><br /></span></div>
<br />

Belajar Membuat Website dengan HTML [Bagian 3] | Tag-Tag pada HTML

SeptaSite - Pada pos sebelumnya sudah dijelaskan tentang Dasar-dasar HTML. Ok, pada pos sekarang kita masuk ke bagian 3 dari Belajar Membuat Website dengan HTML, untuk pos sekarang kita akan membahas Tag-Tag pada HTML. = Tempatnya seluruh elemen HTML atau mendefinisikan dokumen HTML. = Tempat di…

25Nov2015

Belajar Membuat Website dengan HTML [Bagian 2] | Dasar-Dasar HTML

<div style="text-align: justify;">
<img src="https://encrypted-tbn1.gstatic.com/images?q=tbn:ANd9GcQ5REZAqYtqJLES0-ZSlXblZRFAQjtL2UjdYXjeHWzQKgIzXXau" /><b><a href="http://septa-site.blogspot.co.id/" target="_blank">SeptaSites</a></b> - <i>Yo what's up, what's down </i>:v. Ok kali ini SS sesuai janji akan membahas dasar-dasar HTML yang sudah disinggung pada pos sebelumnya. Jadi, sebelum memulai web programming kita harus punya dulu yang namanya <b>Program Editor HTML </b>/ Software nya.</div>
<div style="text-align: center;">
<br /></div>
<div style="text-align: center;">
Program Editor HTML</div>
<div style="text-align: left;">
</div>
<ul>
<li>Editor yang digunakan untuk mengetik, mengedit atau menyimpan dokumen HTML</li>
<li>Editor untuk mendesain suatu web dibagi 2, yaitu :</li>
<ul>
<li>Yang Bersifat Text Murni : Notepad dan UltraEdit</li>
<li>Yang WYSIWYG (Graphic) : Netscape dan Front Page.</li>
</ul>
</ul>
<div>
<div style="text-align: justify;">
Di HTML juga ada yang dinamakan <i>Elemen,</i> suatu dokumen HTML setidak-tidanya mempunyai elemen-elemen seperti dibawah ini :</div>
</div>
<div>
<br />
<blockquote class="tr_bq">
<div>
<span style="font-family: Courier New, Courier, monospace;"><html></span></div>
<div>
<span style="font-family: Courier New, Courier, monospace;"><head></span></div>
<div>
<span style="font-family: Courier New, Courier, monospace;"><title><i> <span style="color: red;">Judul Dokumen</span> </i></title></span></div>
<div>
<span style="font-family: Courier New, Courier, monospace;"></head></span></div>
<div>
<span style="font-family: Courier New, Courier, monospace;"><body></span></div>
<div>
<span style="font-family: Courier New, Courier, monospace;">    <span style="color: red;"><i>Data-data / Content / Isi yang ingin ditampilkan</i></span></span></div>
<div>
<span style="font-family: Courier New, Courier, monospace;"></body></span></div>
<div>
<span style="font-family: Courier New, Courier, monospace;"></html></span></div>
</blockquote>
<br />
<br />
Untuk memperjelas masalah ini, kita akan mencoba membuat suatu website yang sangat sederhana<br />
<b>Pertama : </b>Buka <i>Notepad / Notepad++ / UltraEdit</i> (Disini SS Memakai Notepad++)<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiU1m91AtmAh4RE9fdWq420_mQPQUqnyxl_U8s3p7rMsD0FZogqWo4Q6ZuzdXiOW0U3D6o63M9ESaTH5_SVQObzJEUjHr-9MRzZ5_fa0o_2VcBP0sCPd_VwOtITCpF8OmeY6gHJ1hmp20Q/s1600/Tampilan1.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="170" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiU1m91AtmAh4RE9fdWq420_mQPQUqnyxl_U8s3p7rMsD0FZogqWo4Q6ZuzdXiOW0U3D6o63M9ESaTH5_SVQObzJEUjHr-9MRzZ5_fa0o_2VcBP0sCPd_VwOtITCpF8OmeY6gHJ1hmp20Q/s320/Tampilan1.jpg" width="320" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
(Gambar 1 : Tampilan Notepad++)</div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
 <b>Kedua :  </b>Ketik Kode Pada Gambar Dibawah Ini<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiyy5aPCRpJyutKBaL8XfCOi896qduA9tNiTEnf1JUrys1d17nqeZ_SVoKkUapDOpNmjkxZCnfLJYzSlmch4IZghhkbbcIBLtCulJI1rlnB1uUnPX_FTEbHw3Qjr2mmcq9YRSf5HE9HxY8/s1600/Tampilan2.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="170" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiyy5aPCRpJyutKBaL8XfCOi896qduA9tNiTEnf1JUrys1d17nqeZ_SVoKkUapDOpNmjkxZCnfLJYzSlmch4IZghhkbbcIBLtCulJI1rlnB1uUnPX_FTEbHw3Qjr2mmcq9YRSf5HE9HxY8/s320/Tampilan2.jpg" width="320" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
(Gambar 2 : Kode)</div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: left;">
<b>Ketiga : </b>Simpan file yang telah dibuat</div>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgN-XpcDdxN93auWuGBZYQVmc2LnAcZhyphenhyphenfczjhROmBuzBx3_C-0-_CVSQJ_jdS-CnzkcQzOTUD84EdlP_rN0rccNU79iP9x1wkeTVjCZRU3vhH4giY4g761whs5qIqp4wIhrjM35z7BKSI/s1600/Tampilan3.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="170" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgN-XpcDdxN93auWuGBZYQVmc2LnAcZhyphenhyphenfczjhROmBuzBx3_C-0-_CVSQJ_jdS-CnzkcQzOTUD84EdlP_rN0rccNU79iP9x1wkeTVjCZRU3vhH4giY4g761whs5qIqp4wIhrjM35z7BKSI/s320/Tampilan3.jpg" width="320" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
(Gambar 3 : Save)</div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: left;">
<b>Keempat : </b>Simpat dengan format .html</div>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj99v6_pZMOtpiwW0jh6zsbLkNqxIKlzJ3P0PlVg3g-xxIZ8SasS_v5LP6Mq4fhsZPWlTHm3HYveETZXNVg9jdGaBL5gO8S_4RaiZJu8bRan9neGvI1Gzq7e5pTUwEZYVbE8IYmPSO3Xwk/s1600/Tampilan4.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="170" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj99v6_pZMOtpiwW0jh6zsbLkNqxIKlzJ3P0PlVg3g-xxIZ8SasS_v5LP6Mq4fhsZPWlTHm3HYveETZXNVg9jdGaBL5gO8S_4RaiZJu8bRan9neGvI1Gzq7e5pTUwEZYVbE8IYmPSO3Xwk/s320/Tampilan4.jpg" width="320" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
(Gambar 4 : format .html)</div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: left;">
<b>Kelima </b>: Run dengan menggunakan browser</div>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjvKVSk6ySEH-aUWYRu1ElHHXpesX5vHZ3HiOzLJ6OFX2g1ZFKzCxW6deD94eF0bYIW8lquf6e4w2rmeG-yieF-OBgHtLdN84MXr8zmKdPqgqsYEVJelQA8UvVqZln8QsWqbKxcuQeV-To/s1600/Tampilan5.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="170" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjvKVSk6ySEH-aUWYRu1ElHHXpesX5vHZ3HiOzLJ6OFX2g1ZFKzCxW6deD94eF0bYIW8lquf6e4w2rmeG-yieF-OBgHtLdN84MXr8zmKdPqgqsYEVJelQA8UvVqZln8QsWqbKxcuQeV-To/s320/Tampilan5.jpg" width="320" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
(Gambar 5 : Run)</div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: left;">
<b>Keenam : </b>Tampilan Website dengan kode yang sudah dibuat</div>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh2hnTnkoj4OYakPCmalDHMs8R-C61IzpegchAYPfbNbxH8J84_9pW9_2agiV-8bY6fkyrOeLK6hGF2hHFtTuCnnqD4ZW9jg-19j4OlXHhZprOuEO9jEFoQD8JgGXWG6QggkqGtGro4Y8Y/s1600/Tampilan6.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="170" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh2hnTnkoj4OYakPCmalDHMs8R-C61IzpegchAYPfbNbxH8J84_9pW9_2agiV-8bY6fkyrOeLK6hGF2hHFtTuCnnqD4ZW9jg-19j4OlXHhZprOuEO9jEFoQD8JgGXWG6QggkqGtGro4Y8Y/s320/Tampilan6.jpg" width="320" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
(Gambar 6 : Tampilan Website)</div>
<div class="separator" style="clear: both; text-align: left;">
Itulah website paling sederhana :v . Untuk Bagian selanjutnya akan dibahas <b>Elemen Teks</b>.</div>
<div class="separator" style="clear: both; text-align: left;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
Tutorial Belajar HTML di SeptaSite :</div>
<div class="separator" style="clear: both; text-align: left;">
Bagian 1 : <a href="http://septa-site.blogspot.co.id/2015/11/hypertext-markup-language.html" target="_blank">Belajar Membuat Website dengan HTML [Bagian 1] | HyperText Markup Language </a></div>
<div class="separator" style="clear: both; text-align: left;">
Bagian 2 : <a href="http://septa-site.blogspot.com/2015/11/dasar-dasar-html.html" target="_blank">Belajar Membuat Website dengan HTML [Bagian 2] | Dasar-Dasar HTML </a></div>
<br />
<br />
<blockquote class="tr_bq">
<div>
</div>
</blockquote>
</div>
<div>
<br /></div>
<div>
<br /></div>
<div>
<br /></div>
<div>
<br /></div>
<div>
<br /></div>
<br />
<br />

Belajar Membuat Website dengan HTML [Bagian 2] | Dasar-Dasar HTML

SeptaSites - Yo what's up, what's down :v. Ok kali ini SS sesuai janji akan membahas dasar-dasar HTML yang sudah disinggung pada pos sebelumnya. Jadi, sebelum memulai web programming kita harus punya dulu yang namanya Program Editor HTML / Software nya. Program Editor HTML Editor yang digunakan unt…

24Nov2015

Belajar Membuat Website Dengan HTML [Bagian 1] | Pengenalan HyperText Markup Language

<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
<img height="200" src="https://lh4.ggpht.com/ZeZHGmUev-39aVw0mCfE6tTy1aYKHA742gZFjA6F3M34m928cyt-UpLQLEXx5CY4feY=w300" width="200" /><b><a href="http://septa-site.blogspot.co.id/" target="_blank">SeptaSite</a>-</b><i> HyperText Markup Language </i>(HTML) adalah bahasa yang digunakan untuk menulis sebuah halaman web. HTML merupakan pengembangan dari standar pemformatan dokumen teks, yaitu <i>Standard Generalized Markup Language (</i>SGML).  HTML pada dasarnya merupakan dokumen ASCII atau teks biasa, yang dirancang untuk tidak tergantung pada suatu sistem operasi tertentu.</div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
HTML dibuat oleh Tim Berners-Lee ketika masih bekerja untuk CERN, dan dipopulerkan perrtama kali oleh Browser Mosaic. Selama awal tahun 1990, HTML mengalami perkembangan yang sangat pesat. Setiap pengembangan HTML, pasti akan menambahkan kemampuan dan fasilitas yang lebih baik dari versi sebelumnya.</div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
Kali ini <a href="http://septa-site.blogspot.co.id/" target="_blank">SeptaSite</a> akan mulai membahas mengenai bahasa <i>markup </i>atau <i>markup language</i>. Kegunaan bahasa ini adalah untuk memanipulasi browser sehingga dapat menampilkan informasi yang dapat dibaca oleh pengguna komputer. Stay tune disini aja :v<br />
<br />
<br />
<div style="text-align: center;">
Tutorial Membuat Website at SeptaSite :</div>
<div class="separator" style="clear: both; text-align: left;">
Bagian 1 : <a href="http://septa-site.blogspot.co.id/2015/11/hypertext-markup-language.html" target="_blank">Belajar Membuat Website dengan HTML [Bagian 1] | HyperText Markup Language</a></div>
<div class="separator" style="clear: both; text-align: left;">
Bagian 2 : <a href="http://septa-site.blogspot.com/2015/11/dasar-dasar-html.html" target="_blank">Belajar Membuat Website dengan HTML [Bagian 2] | Dasar-Dasar HTML</a></div>
<div>
<br /></div>
</div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
<br /></div>

Belajar Membuat Website Dengan HTML [Bagian 1] | Pengenalan HyperText Markup Language

SeptaSite- HyperText Markup Language (HTML) adalah bahasa yang digunakan untuk menulis sebuah halaman web. HTML merupakan pengembangan dari standar pemformatan dokumen teks, yaitu Standard Generalized Markup Language (SGML). HTML pada dasarnya merupakan dokumen ASCII atau teks biasa, yang dirancan…

24Nov2015

Septa Site

Pages

Pascal [Bahasa Pemrograman]

Belajar Membuat Website dengan HTML [Bagian 3] | Tag-Tag pada HTML

Belajar Membuat Website dengan HTML [Bagian 2] | Dasar-Dasar HTML

Belajar Membuat Website Dengan HTML [Bagian 1] | Pengenalan HyperText Markup Language

Popular

Blog Archive