Hyper Text Markup Language (HTML)
OUTLINE HTML (Hyper Text Markup Language) CSS (Cascading Style Sheets) Javascript Mampu menggabungkan HTML, CSS, Javascript
What is the Internet? The Internet is a worldwide collection of computer networks, cooperating with each other to exchange data using a common software standard. Network is simply computers wired or connected together in a way that lets them share data, resources, devices, etc. World Wide Web (WWW) is a protocol that can be used for communication on the Internet. The term that describes the way in which Web transfers information is called the Hypertext Transfer Protocol (HTTP). Clients are users of the Internet. A Web Server is a 24 hours, 7 days a week communication application that waits for requests by clients using Web browsers.
INTRODUCTION HTML Uses tags to identify elements of a page. Hypertext means it allows creation of links to another document, or website. HTML is a document-layout and hyperlink-specification language. It defines the syntax and placement of special, embedded directions that aren't displayed by the browser, but tell it how to display the contents of the document, including text, images, and other support media. It is important to notice that HTML is not a word processing tool; it is a means of describing the structure of documents. Although HTML includes features that are related to page layout (frames, tables, etc), you should keep in mind that HTML meant to reflect document structure more than appearance.
Editing HTML HTML is edited using text editors such as Notepad or WordPad. In addition, there are special software programs such as HTML-Kit and Microsoft’s Visual InterDev HTML files are saved with a “.htm” or “.html” extension.
STRUCTURE OF A HTML DOCUMENT Result
Structure Tag Tag Nama :Keterangan <HTML>…</HTML> HTML : tag pembuka dan penutup dokumen HTML. Tag ini memberitahukan kepada browser bahwa isi file tersebut adalah dokumen HTML. <HEAD>…</HEAD> Header : Informasi yang Anda tambahkan ke tag ini tidak akan ditampilkan di layar browser, tetapi akan digunakan sebagai indeks oleh search engine (www.google.com dsb). Tag <HEAD>…</HEAD> ditulis setelah tag <HTML> dan sebelum tag <BODY>. <BODY>…</BODY> Body : merupakan tubuh utama dari dokumen HTML dimana tag-tag yang berada di dalamnya akan ditampilkan hasilnya di layar browser.
Atribut HTML
Atribut-atribut <BODY> ALINK Menentukan warna link yang sedang aktif BACKGROUND Menentukan gambar yang akan digunakan sebagai latar belakang dokumen HTML. BGCOLOR Menentukan warna latar belakang dokumen BGPROPERTIES=FIXED Gambar latar belakang tidak akan digulung LEFTMARGIN Menentukan batas kiri dokumen LINK Menentukan warna link dalam dokumen TEXT Menentukan warna tulisan yang ditampilkan TOPMARGIN Menentukan batas atas dokumen VLINK Menentukan warna link yang sudah pernah diklik/dikunjungi <!--…--> Comment : Tag ini digunakan untuk menuliskan pesan atau komentar dalam dokumen HTML yang tidak akan ditampilkan di layar browser
Atribut-atribut <META> Descriptive Tag Tag Nama : Keterangan <TITLE>…</TITLE> Title : tag ini akan menampilkan judul dokumen Anda pada Title bar layar browser <META>…</META> Meta : Search engine dapat menggunakan meta tag untuk mencari dan mengindeks web page. Anda juga dapat menggunakan tag ini untuk menjelaskan software yang digunakan untuk menghasilkan dokumen HTML atau meyediakan informasi-informasi khusus. Atribut-atribut <META> Name Atribut yang digunakan untuk memberitahukan kepada program-program yang membaca web page tentang kegunaan/tujuan dari meta tag tersebut. Name dapat berisi “author”, “description” atau ketentuan lainnya. Content Content ditulis setelah atribut Name dan berisi teks yang berkaitan dengan meta tag tersebut <HEAD> <META NAME=”description” CONTENT=”Puisi Cinta”></META></HEAD>
Formatting Tag Tag Nama: Keterangan <B>…</B> Bold : tag ini akan membuat tebal teks yang berada di dalam tag ini. <BR> Break : tag ini digunakan untuk pindah baris <CENTER>…</CENTER> Center : tag ini akan menengahkan teks di tengah-tengah layar browser <H1>…</H1> s/d <H6>…</H6> Heading : H1 akan membuat teks judul dengan huruf terbesar dan H6 membuat teks judul terkecil <HR> Horizontal rule : tag ini akan membuat garis horizontal. Sering digunakan untuk memisahkan bagian-bagian yang berbeda dalam satu page Contoh : <HR size=2 width=40%> <I>…</I> Italic : Menampilkan teks dalam bentuk huruf miring <P> Paragraph : Tag ini akan membentuk sebuah paragraph dari teks, dengan memberikan spasi diantara paragraph. Tag ini tidak membutuhkan tag penutup. <STRONG>…</STRONG> Strong : menampilkan teks dalam huruf tebal <U>…</U> Underline : menampilkan teks dalam huruf bergaris bawah. Berhati-hatilah dalam menggunakan tag ini. Karena link juga bergaris bawah, ini akan membingungkan pembaca web page Anda.
Headings
Paragraph
FIRST PRACTICE <html> <head> <title>Belajar Text untuk Website</title> </head> <body> <h1 align="center"><b>International Undergraduate Program</b></h1> <hr /> <p> In the globalization era, efforts are needed in order to increase human resource competitiveness. The present and future quality of human resources are hoped to be more competitive so as to cope global demand. The role of higher education is strategically needed in the context of increasing the quality of human resource. As a result, the needs to execute excellent quality of higher education have become important, in respect of producing global competitive graduates.</p> </body> </html>
SECOND PRACTICE
RESULT
THIRD PRACTICE
RESULT