School of Information Systems

Pengertian dan Fungsi Tag Hypertext Markup Language

Hypertext Markup Language adalah merupakan sebuah markup language  yang biasa digunakan untuk membuat halaman web, biasanya output adalah berbagai informasi yang terdapat di dalam sebuah web di internet, dan biasanya  format yang digunakan hypertext sederhana ditulis dalam berkas format ASCII agar dapat menampilkan output yang terintegrasi.

Penggunaan HTML mirip dengan menulis dokumen secara biasa, yang membedakan adalah di dalam penulisan HTML ditandai oleh tertentu yang mempunyai fungsi berbeda satu dengan yang lain. Berikut adalah beberapa contoh dan fungsi yang biasa digunakan di dalam HTML :

Nama Fungsi
Berfungsi untuk menentukan tipe dokumen
Berfungsi untuk membuat / memulai pembuatan sebuah dokumen HTML
</td> <td width="301">Berfungsi untuk membuat judul sebuah halaman HTML</td> </tr> <tr> <td width="301"><head></td> <td width="301">Berfungsi untuk membuat informasi tentang dokumen</td> </tr> <tr> <td width="301"><meta></td> <td width="301">Berfungsi untuk membuat metadata tentang dokumen HTML</td> </tr> <tr> <td width="301"><body></td> <td width="301">Berfungsi untuk membuat isi dari sebuah halaman HTML</td> </tr> <tr> <td width="301"> <h1> to </p> <h6></td> <td width="301">Berfungsi untuk membuat membuat heading</td> </tr> <tr> <td width="301"> </td> <td width="301">Berfungsi untuk membuat paragraph</td> </tr> <tr> <td width="301"></td> <td width="301">Berfungsi untuk membuat break</td> </tr> <tr> <td width="301"> <hr> </td> <td width="301">Berfungsi untuk memisahkan paragraph yang satu dengan yang lain</td> </tr> <tr> <td width="301"><!-- .. --></td> <td width="301">Berfungsi untuk membuat komentar</td> </tr> <tr> <td width="301"> <form></td> <td width="301">Berfungsi untuk membuat form di dalam HTML</td> </tr> <tr> <td width="301"><input></td> <td width="301">Berfungsi untuk membuat control input</td> </tr> <tr> <td width="301"> <section></td> <td width="301">Berfungsi untuk membuat bagian dalam file</td> </tr> <tr> <td width="301"></td> <td width="301"></td> </tr> <tr> <td width="301"><textarea></td> <td width="301">Berfungsi untuk membuat area text dalam multibaris</td> </tr> <tr> <td width="301"><button></td> <td width="301">Berfungsi untuk membuat tombol yang dapat ditekan</td> </tr> <tr> <td width="301"><select></td> <td width="301">Berfungsi untuk membuat <em>drop-down</em> menu</td> </tr> <tr> <td width="301"><optgroup></td> <td width="301">Berfungsi untuk membuat kelompok pilihan yang berada di <em>drop-down </em>menu</td> </tr> <tr> <td width="301"><option></td> <td width="301">Berfungsi untuk memasukan pilihan ke dalam drop-down menu</td> </tr> <tr> <td width="301"><label></td> <td width="301">Berfungsi untuk membuah sebuah label sebuah elemen</td> </tr> <tr> <td width="301"><img></td> <td width="301">Berfungsi untuk membuat sebuah gambar</td> </tr> <tr> <td width="301"> <map></td> <td width="301">Berfungsi untuk membuat gambar peta</td> </tr> <tr> <td width="301"><a></td> <td width="301">Berfungsi untuk membuat hyperlink</td> </tr> <tr> <td width="301"><link></td> <td width="301">Berfungsi untuk membuat hubungan antara dokumen dengan sumber external</td> </tr> <tr> <td width="301"> <table></td> <td width="301">Berfungsi untuk membuat table</td> </tr> <tr> <td width="301"> <caption></td> <td width="301">Berfungsi untuk membuat sebuah caption table</td> </tr> <tr> <td width="301"> <th></td> <td width="301">Berfungsi untuk membuat header sebuah table</td> </tr> <tr> <td width="301"> <tr></td> <td width="301">Berfungsi untuk membuat baris sebuah table</td> </tr> <tr> <td width="301"> <td></td> <td width="301">Berfungsi untuk membuat kolom sebuah table</td> </tr> <tr> <td width="301"> <thead></td> <td width="301">Berfungsi untuk mengelompokan isi header</td> </tr> <tr> <td width="301"> <tbody></td> <td width="301">Berfungsi untuk mengelompokan isi body</td> </tr> <tr> <td width="301"> <tfoot></td> <td width="301">Berfungsi untuk mengelompokan isi footer</td> </tr> <tr> <td width="301"> <col></td> <td width="301">Berfungsi untuk menentukan property untuk setiap kolom dalam elemen</td> </tr> <tr> <td width="301"><colspan></td> <td width="301">Berfungsi untuk menggabungkan 2 kolom table menjadi 1</td> </tr> <tr> <td width="301"><param></td> <td width="301">Berfungsi untuk membuat parameter <em>object</em></td> </tr> <tr> <td width="301"></td> <td width="301"></td> </tr> <tr> <td width="301"><rowspan></td> <td width="301">Berfungsi untuk menggabungkan 2 baris table menjadi 1</td> </tr> <tr> <td width="301"> <style></td> <td width="301">Berfungsi untuk membuat style pada sebuah dokumen</td> </tr> <tr> <td width="301"> <div></td> <td width="301">Berfungsi untuk mengatur tata letak bagian dalam dokumen</td> </tr> <tr> <td width="301"><script></td> <td width="301">Berfungsi untuk membuat script di sisi client</td> </tr> </tbody> </table> <p style="text-align: justify">            <tag> diatas adalah merupakan <tag> yang sering digunakan dalam penulisan HTML, dan masih banyak lagi <tag> lain yang dapat digunakan sesuai dengan kebutuhan <em>user</em>. Adapun yang perlu diperhatikan adalah setelah membuka sebuah <tag> jangan lupa ditutup kembali. Sebagai contoh : </p> <table> … </table> <p>, karena jika tidak ditutup bisa terjadi error yang disebabkan oleh <tag> bertabrakan fungsi dengan <tag> yang lain.</p> <p>Source:</p> <ol> <li><a href="https://id.wikipedia.org/wiki/HTML">https://id.wikipedia.org/wiki/HTML</a></li> <li><a href="https://gilacoding.com/read/tag-tag-pada-html-beserta-fungsinya">https://gilacoding.com/read/tag-tag-pada-html-beserta-fungsinya</a></li> </ol> </div> <div id="content-pages"></div> <ul id="post-tags"> <li class="the-tag"><a href="https://sis.binus.ac.id/tag/asisten/">asisten</a></li><li class="the-tag"><a href="https://sis.binus.ac.id/tag/bina-nusantara/">Bina Nusantara</a></li><li class="the-tag"><a href="https://sis.binus.ac.id/tag/binus/">Binus</a></li><li class="the-tag"><a href="https://sis.binus.ac.id/tag/binusian/">binusian</a></li><li class="the-tag"><a href="https://sis.binus.ac.id/tag/fulltime-assistant/">fulltime assistant</a></li><li class="the-tag"><a href="https://sis.binus.ac.id/tag/greater-nusantara/">greater nusantara</a></li><li class="the-tag"><a href="https://sis.binus.ac.id/tag/greaternusantara/">greaternusantara</a></li><li class="the-tag"><a href="https://sis.binus.ac.id/tag/information-system/">Information System</a></li><li class="the-tag"><a href="https://sis.binus.ac.id/tag/information-system-laboratory/">information system laboratory</a></li><li class="the-tag"><a href="https://sis.binus.ac.id/tag/information-technology/">information technology</a></li><li class="the-tag"><a href="https://sis.binus.ac.id/tag/islab/">islab</a></li><li class="the-tag"><a href="https://sis.binus.ac.id/tag/it/">IT</a></li><li class="the-tag"><a href="https://sis.binus.ac.id/tag/lab-sisfo/">Lab Sisfo</a></li><li class="the-tag"><a href="https://sis.binus.ac.id/tag/parttime-assistant/">parttime assistant</a></li><li class="the-tag"><a href="https://sis.binus.ac.id/tag/school-of-information-system/">school of information system</a></li><li class="the-tag"><a href="https://sis.binus.ac.id/tag/sis-sis/">SIS SIS</a></li><li class="the-tag"><a href="https://sis.binus.ac.id/tag/sistem-informasi/">Sistem Informasi</a></li><li class="the-tag"><a href="https://sis.binus.ac.id/tag/teknik-informatik/">teknik informatik</a></li><li class="the-tag"><a href="https://sis.binus.ac.id/tag/teknologi-informasi/">teknologi informasi</a></li><li class="the-tag"><a href="https://sis.binus.ac.id/tag/teknologi-teknologi/">teknologi teknologi</a></li><li class="the-tag"><a href="https://sis.binus.ac.id/tag/ti/">TI</a></li> </ul> <div id="post-author"> <div class="image-box square box-100 author-pic"> <img src="https://sis.binus.ac.id/wp-content/themes/binus-2014-58-core/images/default/avatar.jpg" alt=""> </div> <span class="author-name"> Jeffrey Arief Mulyono </span> </div> <!-- <p id="content-date"> Last updated : <time datetime="2021-10-27 09:10">March 31, 2020 00:00</time> </p> --> <div class="sharer-items clear the-640"> <span class="share-title">Share to your friends</span> <ul class="the-sharer-items clear"> <li class="the-sharer-item item-whatsapp"><a href="https://wa.me/?text=Pengertian+dan+Fungsi+Tag+Hypertext+Markup+Language+-+https%3A%2F%2Fsis.binus.ac.id%2F2020%2F03%2F31%2Fpengertian-dan-fungsi-tag-hypertext-markup-language%2F"><span class="svgcon-socmed-wa svg sharer-item-svg" data-grunticon-embed></span></a></li><li class="the-sharer-item item-facebook"><a href="https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fsis.binus.ac.id%2F2020%2F03%2F31%2Fpengertian-dan-fungsi-tag-hypertext-markup-language%2F"><span class="svgcon-socmed-fb svg sharer-item-svg" data-grunticon-embed></span></a></li><li class="the-sharer-item item-twitter"><a href="https://twitter.com/intent/tweet?url=https%3A%2F%2Fsis.binus.ac.id%2F2020%2F03%2F31%2Fpengertian-dan-fungsi-tag-hypertext-markup-language%2F"><span class="svgcon-socmed-tw svg sharer-item-svg" data-grunticon-embed></span></a></li> </ul> </div> </div> <ol id='the-comments'><script type="text/javascript">window.BinusCommentConfig = {"require_name_email":"1","comment_registration":"0","close_comments_for_old_posts":"0","close_comments_days_old":"14","show_comments_cookies_opt_in":"1","thread_comments":"1","thread_comments_depth":"5","page_comments":"0","comment_order":"asc","comment_moderation":"0","comment_whitelist":"1"}</script></ol><div id="comment-form"> <form class="binus-comment-body as-form" action="https://sis.binus.ac.id/wp-comments-post.php" method="post"> <div class="table-layout"> <div class="comment-vcard table-cell auto-width"> <span class="image-box box-50"> </span> </div> <div class="comment-inside table-cell"> <header class="comment-meta commentmetadata"> <div class="commenter-input-field"> <div class="row"> <div class="col-xs-6"> <input type="text" name="author" value="" placeholder="Your Name"> </div> <div class="col-xs-6"> <input type="email" name="email" value="" placeholder="Your Email"> </div> </div> <div class="comment-form-cookies-consent"> <label class="meta-text"> <input class="wp-comment-cookies-consent" name="wp-comment-cookies-consent" type="checkbox" value="yes"/> Save my name, email, and website in this browser for the next time I comment. </label> </div> </div> </header> <textarea name="comment" id="" cols="30" rows="10" class="wp-content comment-content" placeholder="Your Comment.."></textarea> <div class="text-right"> <a href="#" class="cancel-reply-comment btn btn-primary btn-reverse">Cancel Reply</a> <input type="submit" class="btn btn-primary" value="Send"> </div> </div> </div> <input type='hidden' name='comment_post_ID' value='25379' id='comment_post_ID' /> <input type='hidden' name='comment_parent' id='comment_parent' value='0' /> <p style="display: none;"><input type="hidden" id="akismet_comment_nonce" name="akismet_comment_nonce" value="f2236cd09d" /></p><input type="hidden" id="ak_js" name="ak_js" value="234"/><textarea name="ak_hp_textarea" cols="45" rows="8" maxlength="100" style="display: none !important;"></textarea> </form> </div> <script id="commenter-input-field-template" type="text/html"> <div class="commenter-input-field"> <div class="row"> <div class="col-xs-6"> <input type="text" name="author" value="" placeholder="Your Name"> </div> <div class="col-xs-6"> <input type="email" name="email" value="" placeholder="Your Email"> </div> </div> <div class="comment-form-cookies-consent"> <label class="meta-text"> <input class="wp-comment-cookies-consent" name="wp-comment-cookies-consent" type="checkbox" value="yes"/> Save my name, email, and website in this browser for the next time I comment. </label> </div> </div> </script> </article> </div> </div> <footer id="footer"> <div class="generic-container always-padded no-vertical-padding " id="footer-wrapper"> <div class="container"> <div class="row"> <div class="col-xs-12 col-md-8" id="footer-web-identity"> <h2 class="web-title">School of Information Systems</h2> <div id="footer-web-address"> <div class="wp-content"> </div> </div> </div> <div class="col-xs-12 col-md-4" id="footer-social-media"> <ul id="web-socmeds" class="clear"> <li class="socmed-item socmed-fb"><a class="the-icon" href="http://fb.me/schoolisbinus"><span class="svgcon-ic-fb svg " data-grunticon-embed></span></a></li><li class="socmed-item socmed-ig"><a class="the-icon" href="https://www.instagram.com/schoolisbinus/"><span class="svgcon-ic-ig svg " data-grunticon-embed></span></a></li><li class="socmed-item socmed-youtube"><a class="the-icon" href="https://www.youtube.com/c/SISBINUSID"><span class="svgcon-ic-youtube svg " data-grunticon-embed></span></a></li><li class="socmed-item socmed-line"><a class="the-icon" href="@schoolisbinus"><span class="svgcon-ic-line svg " data-grunticon-embed></span></a></li><li class="socmed-item socmed-mail"><a class="the-icon" href="http://schoolisbinus@binus.ac.id"><span class="svgcon-ic-mail svg " data-grunticon-embed></span></a></li> </ul> </div> </div> <div class="company-name"> </div> <p class="copyright"> Copyright © BINUS Higher Education. All rights reserved </p> </div> </div></footer> </div> <script type="text/html" id="popup-close-template"> <div class="popup-close--element" data-fancybox-close> <span class="svgcon-circle-cross svg icon" data-grunticon-embed></span> <span class="text">close</span> </div> </script> <!--[if lt IE 9]> <div id="internet-explorer-warning"> <img src="https://sis.binus.ac.id/wp-content/themes/binus-2017-145-core/images/static/univ/white-logo.png" alt="" id="ie-logo"> <h1>Your browser is not fully compatible with the features of our website.</h1> <div class="information"> To get the best possible experience using our site we recommend that you upgrade to a newer version of internet explorer or choose another popular web browsers. Our recommendation browsers are Chrome, Firefox, Safari, and Opera. </div> </div> <style> #internet-explorer-warning{display:block !important;background-repeat:repeat !important;} body{overflow:hidden;} </style> <![endif]--> <style> #internet-explorer-warning{ position: fixed; left: 0;right: 0;top: 0; bottom: 0; background-color: $brand-primary; background-image: url('https://sis.binus.ac.id/wp-content/themes/binus-2017-145-core/images/static/internet-explorer-warning-bg.jpg'); background-repeat: repeat; background-size: cover; z-index: 999999999; color: #fff; text-align: center; padding: 100px 15px; display: none; } #internet-explorer-warning h1{ color: inherit; font-size: 27px;line-height: 1em; margin:72px auto 16px; max-width: 850px; } #internet-explorer-warning .information{ max-width: 850px; font-size: 14px; margin: 0 auto; } .no-flexbox #internet-explorer-warning{display: block}} .no-flexbox body{overflow :hidden} </style> <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-TQSS9S" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript> <div id="glance-control-iframe"></div><script type='text/javascript' src='https://sis.binus.ac.id/wp-content/themes/binus-2017-145-core/compiled/binus-2021-250-sis/js/is_single/script.js?ver=1.0' id='binus-js'></script> <script type='text/javascript' src='https://sis.binus.ac.id/wp-content/plugins/dmd-gtm-tracker/dist/single.js?ver=1.0.1' id='dmdgtmuniversal-inside-js'></script> <script type='text/javascript' src='https://sis.binus.ac.id/wp-content/plugins/contact-form-7/includes/js/jquery.form.min.js?ver=3.51.0-2014.06.20' id='jquery-form-js'></script> <script type='text/javascript' id='contact-form-7-js-extra'> /* <![CDATA[ */ var _wpcf7 = {"loaderUrl":"https:\/\/sis.binus.ac.id\/wp-content\/plugins\/contact-form-7\/images\/ajax-loader.gif","sending":"Sending ..."}; /* ]]> */ </script> <script async type='text/javascript' src='https://sis.binus.ac.id/wp-content/plugins/contact-form-7/includes/js/scripts.js?ver=4.0.2' id='contact-form-7-js'></script> <script async type='text/javascript' src='https://sis.binus.ac.id/wp-includes/js/wp-embed.min.js?ver=5.8' id='wp-embed-js'></script> <script async="async" type='text/javascript' src='https://sis.binus.ac.id/wp-content/plugins/akismet/_inc/form.js?ver=4.1.8' id='akismet-form-js'></script> </body> </html>