Titis Widowati (Patbhe)] Page 1
|
|
|
- Sonny Yuwono
- 7 tahun lalu
- Tontonan:
Transkripsi
1 Struktur dasar HTML HTML (Hypert Text Markup Language) merupakan bahasa pemrograman yang digunakan dalam pembuatan halaman web. Dalam penggunaannya sebagian besar kode HTML tersebut harus terletak di antara tag kontainer. Yaitu diawali dengan <namatag> dan diakhiri dengan </namatag> (terdapat tanda "/"). Sebuah halaman web minimal mempunyai empat buat tag, yaitu : <HTML> Sebagai tanda awal dokumen HTML. <HEAD> Sebagai informasi page header. Di dalam tag ini kita bisa meletakkan tagtag TITLE, BASE, ISINDEX, LINK, SCRIPT, STYLE & META. <TITLE> Sebagai titel atau judul halaman. Kalimat yang terletak di dalam tag ini akan muncul pada bagian paling atas browser Anda (pada title bar). <TITLE>Tips HTML -- <BODY> Di dalam tag ini bisa diletakkan berbagai page attribute seperti warna latar belakang, warna teks, warna link, warna visited link, warna active link dan lain-lain. Atribut : BGCOLOR, BACKGROUND, TEXT, LINK, VLINK, ALINK, LEFTMARGIN & TOPMARGIN. <BODY bgcolor="#000000" background="images/pcb.gif" text="#ffffff" link="#ff0000" vlink="ffff00" alink="#0000ff"> Sebuah contoh sederhana dokumen HTML : <HTML> <HEAD> <TITLE>Halaman pembuka </TITLE> </HEAD> <BODY bgcolor="#ffffff" background="images/gambar1.gif" text="#ff0000"> Letakkan text, images, dan link Anda di sini </BODY> </HTML> Titis Widowati (Patbhe)] Page 1
2 Pengaturan Teks Untuk mendapatkan halaman web yang baik Anda harus melakukan pengaturan terhadap teks seperti memilih jenis dan ukuran huruf, perataan, dll. Tag-tag di bawah ini yang biasa digunakan dalam pengaturan teks : Headers: <Hn>..</Hn> Digunakan untuk mengatur ukuran huruf pada header. "n" mempunyai nilai antara 1-6 atau antara <H1> sampai <H6>, dengan <H1> merupakan ukuran terbesar dan <H6> merupakan ukuran terkecil. <H2>Tutorial Html</H2> Hasilnya akan terlihat seperti : Tutorial Html Paragraph Baru: <P> Digunakan untuk pindah alinea atau paragraf. Tag ini bisa diberi akhiran </P> tapi juga bisa tidak diberi. Line Break: <BR> Digunakan untuk pindah ke baris baru. No Line Break: <NOBR> Bila digunakan tag ini maka teks yang panjang tidak secara otomatis pindah baris bawahnya bila baris pertama sudah terlalu panjang. Font <FONT> Untuk mendefinisikan berbagai attribut FONT, yaitu : SIZE, FACE, COLOR. SIZE: Ukuran font yang digunakan, berkisar antara 1-7 dengan 1 merupakan ukuran terkecil dan 7 merupakan ukuran terbesar. FACE: Jenis atau nama font. Anda bisa memilih maksimal 3 jenis font yang masingmasing dipisahkan oleh koma. Bila terdapat spasi yang terletak pada nama font maka harus digunakan tanda garis bawah ( _ ). Dalam memilih jenis font ini harus dipertimbangkan apakah font yang kita gunakan pada halaman web kita nantinya akan terdapat pada komputer pengguna yang lain (pengakses web kita). Pendeknya kita tidak usah menggunakan font-font yang bentuknya aneh-aneh, gunakan saja font standar. Tapi bila Anda ingin menggunakan font yang sedikit "aneh" Anda bisa menggunakan graphic. COLOR: Warna font, didefinisikan dengan menggunakan nilai RGB/HEX atau bisa juga langsung menggunakan nama warna (red misalnya). <FONT SIZE=4 FACE="Verdana, Arial, Helvetica" COLOR="#FF0000">Contoh teks yang berwarna merah</font> Titis Widowati (Patbhe)] Page 2
3 Hasilnya akan terlihat seperti : Contoh teks yang berwarna merah Contoh lainnya : <FONT SIZE=2 FACE="Times_New_Roman" COLOR="#0066CC"> Base Font: <BASEFONT> Digunakan untuk mendefinisikan "default text". Attribut sama dengan attribut FONT. Tag FONT akan mengoverwrite setting pada BASEFONT. <BASEFONT SIZE=2 FACE="Arial,Helvetica" COLOR="#FF0000"> Selain tag dan atribut di atas, masih terdapat lagi tag-tag yang berhubungan dengan pengaturan teks, yaitu : Perhatian : Semua tag di bawah ini membutuhkan tap penutup. <B> Bold text <I> Italic text <U> Underscore <TT> Typewriter <S> Strikeout - draws a line through the text <PRE> Preformatted Text <DFN> Definition <BLINK> Text berkedip (lebih baik jangan digunakan) <STRONG> Strong <ADDRESS> Italic <CITE> Digunakan untuk quoting text <CODE> Monospaced font (digunakan bila Anda ingin meletakkan (memperlihatkan) kode HTML pada dokumen HTML Anda) <SAMP> Monospaced font (digunakan bila Anda ingin meletakkan (memperlihatkan) kode HTML pada dokumen HTML Anda) <KBD> Monospaced font (digunakan bila Anda ingin meletakkan (memperlihatkan) kode HTML pada dokumen HTML Anda) <BIG> Ukuran teks akan lebih besar satu ukuran <SMALL> Ukuran teks akan lebih kecil satu ukuran <SUP> Membuat teks superscript <SUB> membuat teks sub script <ABBREV> Abbreviations <ACRONYM> Untuk akronim <PERSON> Digunakan untuk indexing <Q> Membuat short inline quotation <VAR> Membuat variable name, selalu dalam italics. Titis Widowati (Patbhe)] Page 3
4 Lists Terdapat tiga tipe list yang dapat digunakan, yaitu : Unordered Lists: <UL> Untuk membuat daftar item dengan tanda bullet. List entries didefinisikan dengan tag <LI>. <UL> <LI> Item nomer 1 <LI> Item nomer 2 <LI> Item nomer 3 </UL> Hasil dari kode di atas adalah: Item nomer 1 Item nomer 2 Item nomer 3 Dengan atribut TYPE Anda dapat mendefinisikan bentuk disc, circle atau square bullet point. <UL COMPACT TYPE=square> Ordered Lists: <OL> Juga digunakan untuk membuat daftar item, dengan tiap item dapat menggunakan angka arab atau romawi. List entries juga didefinisikan dengan <LI> tag. <OL TYPE=I> <LI> Item nomer 1 <LI> Item nomer 2 <LI> Item nomer 3 </OL> Hasil dari kode di atas adalah : 1. Item nomer 1 2. Item nomerr 2 3. Item nomerr 3 Untuk TYPE Anda dapat juga menggunakan : 1- Default numbers, 1, 2, 3, etc. A- Huruf besar. A, B, C, etc. a- Huruf kecil. a, b, c, etc. Titis Widowati (Patbhe)] Page 4
5 I- Romawi huruf besar. I, II, III, etc. i- Romawi huruf kecil, i, ii, iii, etc. Definition Lists: <DL> <DL> <DT> Item pertama. <DD> Penjelasan tentang item pertama. <DT> Item kedua. <DD> Penjelasan tentang item kedua </DL> Hasil dari kode di atas adalah : Item pertama. Penjelasan tentang item pertama. Item kedua. Penjelasan tentang item kedua Images Images : Digunakan untuk menampilkan image atau animasi gif pada halaman web Anda. Atribut : alt, align=(center, left, right), hspave, vspace, border, width & height <IMG SRC="logo.gif" alt="ini adalah logo halaman pembuka" width=200 height=100> <IMG SRC="logo.gif" hspace=10 vspace=5 align=right border=2> Links : Digunakan untuk membuat link ke halaman lain. Tulisan yang terletak antara <A> dan </A> akan terdapat garis bawah. <A HREF="halaman2.html">Klik di sini</a> Untuk membuat link ke halaman lain. <A HREF="mailto:webmaster@klik-kanan.com">Klik di sini</a> Untuk membuat link pada alamat . <A HREF="#aplikasi">Klik di sini</a> Untuk membuat link ke bagian lain pada halaman yang sama. <A HREF="halamanlain.html#aplikasi">Klik di sini</a> Untuk membuat link kebagian lain pada halaman yang berbeda. Titis Widowati (Patbhe)] Page 5
6 <A HREF="halaman2.html"><IMG SRC="gambar.gif"></A> Untuk membuat link dengan menggunakan gambar. Tabel Tabel sangat penting artinya dalam desain web. Karena dengan menggunakan tag table Anda dapat membuat halaman web "terbagi" pada beberapa kolom atau baris. Contohnya seperti pada halaman web yang sedang Anda baca ini. Terdapat tiga tag atau elemen utama yang digunakan dalam pembuatan table : <TABLE>, <TR>, dan <TD>. Yang perlu diingat adalah bahwa tab <TR> dan <TD> harus terletak di antara tag <TABLE> dan </TABLE> <TABLE> Terdiri dari atribut : align - perataan : rata kiri (left), tengah (center) atau kanan (right). bgcolor - warna latar belakang (background) dari tabel. border - ukuran lebar border tabel (dalam pixel). cellpadding - jarak antara isi cell dengan batas cell (dalam pixel). cellspacing - jarak antar cell (dalam pixel). width - ukuran tabel dalam pixel atau percent. <TABLE align="center" bgcolor="#0000ff" border="2" cellpadding="5" cellspacing="2" width="90%"> <TR> Tag ini digunakan untuk membuat baris baru (pada tabel). Terdiri dari atribut: align - perataan : rata kiri (left), tengah (center) atau kanan (right). bgcolor - warna latar belakang dari baris. valign - perataan vertikal : top, middle atau bottom. <TR align="right" bgcolor="#0000ff" valign=top> <TD> Tag ini digunakan untuk membuat kolom baru pada tabel. align - perataan background - image yang digunakan sebagai latar belakang dari kolom. bgcolor - warna latar belakang colspan - lihat gambar contoh height - ukuran tinggi cell dalam pixels. nowrap - membuat supaya isi dari kolom tetap berada pada satu baris. rowspan - lihat gambar contoh valign - perataan vertikal :top, middle atau bottom. width - ukuran kolom dalam pixel atau percen. Titis Widowati (Patbhe)] Page 6
7 <TD align="right" background="back.gif" bgcolor="#0000ff" colspan="3" height="200" nowrap rowspan="2" valign="bottom" width="300"> <table width="100" border="1" cellspacing="2" cellpadding="2"> <tr> <td bgcolor="#0000ff"> </td> <td bgcolor="#ffff66"> </td> <td rowspan="2" bgcolor="#ff3366"> </td> </tr> <tr> <td colspan="2" bgcolor="#33cc66"> </td> </tr> <tr> <td colspan="3" bgcolor="#ffcc99"> </td> </tr> </table> Tables Tutorial <table width="100" border="0" cellspacing="0" cellpadding="0"> <tr> <td bgcolor="#0000ff"> </td> <td bgcolor="#ffff66"> </td> <td rowspan="2" bgcolor="#ff3366"> </td> </tr> <tr> <td colspan="2" bgcolor="#33cc66"> </td> </tr> <tr> <td colspan="3" bgcolor="#ffcc99"> </td> </tr> </table> Let's begin with a simple and common use for tables: an office phone list. Suppose we have four people whose names we want on the list. The data could be arranged in a table like this: <TABLE> <TR> <TD>Raha Mutisya</TD> <TD>1493</TD> </TR> <TR> <TD>Shalom Buraka</TD> <TD>3829</TD> </TR> <TR> <TD>Hallie Curry</TD> <TD>8372</TD> </TR> <TR> <TD>Shari Silberglitt</TD> <TD>4827</TD> </TR> </TABLE> Which gives us this table: Raha Mutisya 1493 Shalom Buraka 3829 Hallie Curry 8372 Shari Silberglitt 4827 This table uses the basic three tags all tables must have: <TABLE...> Titis Widowati (Patbhe)] Page 7
8 <TABLE...> creates the table. Most of the overall properties of the table are defined here, such as if it has borders and what is the table's background color. <TR...> <TR...> (Table Row) defines each row of the table. <TD...> <TD...> (Table Data) defines each cell of the table. The first modification we'll make to this little table is to add borders. Borders will help us see how the table is laid out. It's a good idea when designing a table to add borders during the time you design the table, even if you remove them before making the table public. <TABLE BORDER=2> <TR> <TD>Raha Mutisya</TD> <TD>1493</TD> </TR> <TR> <TD>Shalom Buraka</TD> <TD>3829</TD> </TR> <TR> <TD>Hallie Curry</TD> <TD>8372</TD> </TR> <TR> <TD>Shari Silberglitt</TD> <TD>4827</TD> </TR> </TABLE> which gives us Raha Mutisya 1493 Shalom Buraka 3829 Hallie Curry 8372 Shari Silberglitt 4827 CELLPADDING and CELLSPACING By default, table cells tend to be squeezed close to each other. To give your table cells a little more breathing room, use CELLPADDING and CELLSPACING. CELLSPACING controls the space between table cells. Although there is no official default, browsers usually use a default of 2. <TABLE BORDER> <TABLE BORDER CELLSPACING=2> <TABLE BORDER CELLSPACING=10> peaches cherries walnuts almonds peaches cherries walnuts almonds peaches cherries walnuts almonds CELLPADDING sets the amount of space between the contents of the cell and the cell wall. The default is 1. CELLPADDING is usually more effective than CELLSPACING for spreading Titis Widowati (Patbhe)] Page 8
9 out the contents of the table. <TABLE BORDER> <TABLE BORDER CELLPADDING=1> <TABLE BORDER CELLPADDING=10> peaches cherries walnuts almonds peaches cherries walnuts almonds peaches walnuts cherries almonds COLSPAN and ROWSPAN Table cells can span across more than one column or row. The attributes COLSPAN ("how many across") and ROWSPAN ("how many down") indicate how many columns or rows a cell should take up. For example, we might want to create header cells for each department in our table of names and phone numbers. In this table, the header cells in the first and fifth rows span across two columns to indicate the department for each group of names. <TABLE BORDER=2 CELLPADDING=4> <TR> <TH COLSPAN=2>Production</TH> </TR> <TR> <TD>Raha Mutisya</TD> <TD>1493</TD> </TR> <TR> <TD>Shalom Buraka</TD> <TD>3829</TD> </TR> <TR> <TD>Brandy Davis</TD> <TD>0283</TD> </TR> <TR> <TH COLSPAN=2>Sales</TH> </TR> <TR> <TD>Claire Horne</TD> <TD>4827</TD> </TR> <TR> <TD>Bruce Eckel</TD> <TD>7246</TD> </TR> <TR> <TD>Danny Zeman</TD> <TD>5689</TD> </TR> </TABLE> which gives us: Production Raha Mutisya 1493 Shalom Buraka 3829 Brandy Davis 0283 Sales Claire Horne 4827 Bruce Eckel 7246 Danny Zeman 5689 Titis Widowati (Patbhe)] Page 9
10 It often happens with multiple-column cells that a little color helps to set off the headers, giving the table a more visually organized look. Let's add some color to the headers using BGCOLOR. <TABLE BORDER=2 CELLPADDING=4> <TR> <TH COLSPAN=2 BGCOLOR="#99CCFF">Production</TH> </TR> <TR> <TD>Raha Mutisya</TD> <TD>1493</TD> </TR> <TR> <TD>Shalom Buraka</TD> <TD>3829</TD> </TR> <TR> <TD>Brandy Davis</TD> <TD>0283</TD> </TR> <TR> <TH COLSPAN=2 BGCOLOR="#99CCFF">Sales</TH> </TR> <TR> <TD>Claire Horne</TD> <TD>4827</TD> </TR> <TR> <TD>Bruce Eckel</TD> <TD>7246</TD> </TR> <TR> <TD>Danny Zeman</TD> <TD>5689</TD> </TR> </TABLE> which gives this table: Production Raha Mutisya 1493 Shalom Buraka 3829 Brandy Davis 0283 Sales Claire Horne 4827 Bruce Eckel 7246 Danny Zeman 5689 ROWSPAN sets how many rows a cell spans. ROWSPAN can get a little confusing because it requires you to think through how the cell affects the rows after the row it starts in. It's particularly useful in this situation to add borders to the table during the design process, even if the table won't ultimately use borders. This table code creates two header cells which span three rows each: <TABLE BORDER=2 CELLPADDING=4> <TR> <TH ROWSPAN=3 BGCOLOR="#99CCFF">Production</TH> <TD>Raha Mutisya</TD> <TD>1493</TD> </TR> <TR> <TD>Shalom Buraka</TD> <TD>3829</TD> </TR> <TR> <TD>Brandy Davis</TD> <TD>0283</TD> </TR> <TR> Titis Widowati (Patbhe)] Page 10
11 <TH ROWSPAN=3 BGCOLOR="#99CCFF">Sales</TH> <TD>Claire Horne</TD> <TD>4827</TD> </TR> <TR> <TD>Bruce Eckel</TD> <TD>7246</TD> </TR> <TR> <TD>Danny Zeman</TD> <TD>5689</TD> </TR> </TABLE> which creates Raha Mutisya 1493 Production Shalom Buraka 3829 Brandy Davis 0283 Claire Horne 4827 Sales Bruce Eckel 7246 Danny Zeman 5689 Note that in the two rows after each header, the first cell in the row ends up in the second column because the first column is taken up by the multi-column cell. Titis Widowati (Patbhe)] Page 11
12 frames 1 <FRAMESET cols="*,140"> <FRAME SRC="homepage.htm" NAME="Frame1"> <FRAME SRC="menu.htm" NAME="Frame2"> 2 <FRAMESET cols="100,*"> <FRAME SRC="homepage.htm" NAME="Frame1"> <FRAME SRC="menu.htm" NAME="Frame2"> 3 <FRAMESET rows="100,*"> <FRAME SRC="homepage.htm" NAME="Frame1"> <FRAME SRC="menu.htm" NAME="Frame2"> 4 <FRAMESET rows="*,60"> <FRAME SRC="homepage.htm" NAME="Frame1"> <FRAME SRC="menu.htm" NAME="Frame2"> 5 <FRAMESET rows="*,60"> <FRAME SRC="homepage.htm" NAME="Frame1"> <FRAMESET cols="50%,50%"> <FRAME SRC="menu.htm" NAME="Frame2"> <FRAME SRC="menu2.htm" NAME="Frame3"> 6 <FRAMESET cols="*,50%"> <FRAME SRC="homepage.htm" NAME="Frame1"> <FRAMESET rows="15%,15%,70%"> <FRAME SRC="menu.htm" NAME="Frame2"> <FRAME SRC="menu2.htm" NAME="Frame3"> <FRAME SRC="menu3.htm" NAME="Frame4"> 7 <FRAMESET cols="50%,50%"> <FRAMESET rows="50%,50%"> <FRAME SRC="homepage.htm" NAME="Frame1"> <FRAME SRC="homepage2.htm" NAME="Frame2"> <FRAMESET rows="50%,50%"> <FRAME SRC="menu.htm" NAME="Frame3"> <FRAME SRC="menu2.htm" NAME="Frame4"> 8 <FRAMESET rows="15%,70%,15%"> <FRAME SRC="homepage.htm" NAME="Frame1"> <FRAMESET cols="15%,70%,15%"> <FRAME SRC="menu.htm" NAME="Frame2"> <FRAME SRC="menu2.htm" NAME="Frame3"> <FRAME SRC="menu3.htm" NAME="Frame4"> <FRAME SRC="homepage.htm" NAME="BIG"> Kumpulan Tag HTML Titis Widowati (Patbhe)] Page 12
13 <!-- --> Memberi komentar atau keterangan. Kalimat yang terletak pada tag kontiner ini tidak akan terlihat pada browser <a href> Membuat link ke halaman lain atau ke bagian lain dari halaman tersebut <a name> Membuat nama bagian yang didefinisikan pada link pada halaman yang sama <applet> <area> <b> <basefont> <bgsound> <big> <blink> <body> <br> <caption> <center> <comment> <dd> <div> <embed> <fn> <font> <form> <frame> <frameset> <h1>... <h6> <head> <hr> <html> <i> <img> <input> <li> <map> <marquee> <nobr> <noframes> <ol> <p> <pre> <script> <table> Sebagai awal dari Java applets Mendefinisikan daerah yang dapat diklik (link) pada image map Membuat teks tebal Membuat atribut teks default seperti jenis, ukuran dan warna font Memberi (suara latar) background sound pada halaman web Memperbesar ukuran teks sebesar satu point dari defaultnya Membuat teks berkedip Tag awal untuk melakukan berbagai pengaturan terhadap text, warna link & visited link Pindah baris Membuat caption pada tabel Untuk perataan tengah terhadap teks atau gambar Meletakkan komentar pada halaman web tidak tidak akan nampak pada browser Indents teks Represents different sections of text. Menambahkan sound or file avi ke halaman web Seperti tag <a name> Mengganti jenis, ukuran, warna huruf yang akan digunakan utk teks Mendefinisikan input form Mendefinisikan frame Mendefinisikan attribut halaman yang akan menggunakan frame Ukuran font Mendefinisikan head document. Membuat garis horizontal Bararti dokumen html Membuat teks miring Image, imagemap atau an animation Mendefinisikan input field pada form Membuat bullet point atau baris baru pada list (berpasangan dengan tag <dir>, <menu>, <ol> and <ul> ) Mendefinisikan client-side map Membuat scrolling teks (teks berjalan) - hanya pada MS IE Mencegah ganti baris pada teks atau images Jika browser user tidak mendukung frame Mendefinisikan awal dan akhir list Ganti paragraf Membuat teks dengan ukuran huruf yg sama Mendefinisikan awal script Membuat tabel Titis Widowati (Patbhe)] Page 13
14 <td> <title> <tr> <u> Kolom pada tabel Mendefinisikan title Baris pada tabel Membuat teks bergaris bawah Kode untuk karakter khusus Simbol Karakter yg ditampilkan " " & & < < > > Œ Œ œ œ Š Š š š Ÿ Ÿ ˆ ˆ Ŕ ŕ Ř ř Ŗ ŗ Titis Widowati (Patbhe)] Page 14
15 WITH ENGGLIS Frames Tutorial Let's look at a basic example of how frames work: The frameset file is the file you point your browser to. The frameset file uses <FRAMESET...> and <FRAME...> to tell the browser to go get more files to put on the page. The browser goes out again and retrieves the files which will appear on the page. Titis Widowati (Patbhe)] Page 15
16 The browser puts all the files on one page in separate rectangles ("frames"). The user never sees anything from the original frameset file. Think of frames as creating a "table of documents" on the page. Like a table, a group of frames has rows and columns. Each cell of the table contains a document which is stored in a separate file. <FRAMESET...> defines the beginning and end of the table, and how many rows and columns that table will have. <FRAME...> defines what will go into each cell ("frame") of the table. Let's look in more detail at the example above. The entire contents of basicframeset.html (the frameset file) look like this: This code... creates this page (here's the real thing) <HTML> <HEAD> <TITLE>A Basic Example of Frames</TITLE> </HEAD> <FRAMESET ROWS="75%, *" COLS="*, 40%"> <FRAME SRC="framea.html"> <FRAME SRC="frameb.html"> <FRAME SRC="framec.html"> <FRAME SRC="framed.html"> <NOFRAMES> <H1>No Frames? No Problem!</H1> Take a look at our <A HREF="basic.noframes.html">n o-frames</a> version. </NOFRAMES> Titis Widowati (Patbhe)] Page 16
17 </HTML> Here's a line-by-line explanation of each piece of code for the frames: <FRAMESET Start the "table of documents". ROWS="75%, *" The table should have two rows. The first row should take up 75% of the height of the page, the second should take up the rest. COLS="*, 40%"> The table should also have two columns. The second column should take up 40% of the width of the page, the first column should take up the rest. <FRAME SRC="framea.html"> <FRAME SRC="frameb.html"> <FRAME SRC="framec.html"> <FRAME SRC="framed.html"> Put the four files into the frames. <NOFRAMES>... </NOFRAMES> Every framed page should have a no-frames alternative. The <NOFRAMES> content should go inside the outermost <FRAMESET...> tag, usually just before the last. The most efficicent method for no-frames content is to link to a page which is specifically designed for no-frames. End the frameset. There are several other aspects of frames to note from this example: <FRAMESET...> is used instead of the <BODY...> tag. The frameset file has no content which appears on the page, so it has no need for <BODY...>, which designates the content of the page. In fact, if you use <BODY...> (except inside <NOFRAMES>), the frames will not appear. Tags in <HEAD>, including <TITLE>, still have their intended effects. Rows and columns are described by a list of widths or heights. For example COLS="25%, *, 40%" says that there will be three columns. The first column takes up 25% of the width of the page, the third column takes up 40% of the width of the page, and the asterisk ("*") means "whatever is left over". See COLS and ROWS for more details. You do not explicitly designate the start and ending of each row. The browser keeps adding frames until it reaches the number designated by COLS, then starts another row. Titis Widowati (Patbhe)] Page 17
18 Nested Framesets Let's move now to a more real world example, and a few more techniques for using frames. One of the most popular uses for frames is the "title bar and side menu" method. We'll use as an example a page of recipes, pictured at right. The title of the page, "Great Recipes" stays stationary in a frame at top, a contents list is on the left, and the recipes themselves are in the large box on the right. As you click on the name of a recipe in the contents list, that recipe appears on the right. Go ahead and try out the real page. (We're sorry if these recipes make you hungry. They did us. These recipes come from the wonderful vegetarian recipe site Veggies Unite!.) Remember that a frameset is like a "table of documents" with rows and columns. The recipes page, however, has one column on top, but two on bottom. This is done by nesting framesets, putting one frameset inside another. Here's the code for the frameset file for the recipes page: <HTML> <HEAD> <TITLE>Great Recipes</TITLE> </HEAD> <FRAMESET ROWS="15%,*"> <FRAME SRC="recipetitlebar.html" NAME=TITLE SCROLLING=NO> <FRAMESET COLS="20%,*"> <FRAME SRC="recipesidebar.html" NAME=SIDEBAR> <FRAME SRC="recipes.html" NAME=RECIPES> <NOFRAMES> <H1>Great Recipes</H1> No frames? No Problem! Take a look at our <A HREF="recipes.html">no-frames</A> version. </NOFRAMES> </HTML> Titis Widowati (Patbhe)] Page 18
19 The first <FRAMESET...> tag says "this frameset will have two rows" (and, implicitly, only one column, since COLS was left out). The first <FRAME...> tag puts a document in the first frame. The second frame is filled in not by a document but by another frameset. The second <FRAMESET...> is creating a "table within a table", or, to be more correct, a frameset within a frameset. Targeting Frames Each frame is given a name using <FRAME NAME="...">. These names uniquely identify each frame. Using these names, links in other frames can tell the browser which frame the link targets. For example, this code creates a framed page, naming the frames TITLE, SIDEBAR, and MAIN: <FRAMESET ROWS="15%,*"> <FRAME SRC="tfetitle.html" NAME=TITLE SCROLLING=NO MARGINHEIGHT=1> <FRAMESET COLS="20%,*"> <FRAME SRC="tfesidebar.html" NAME=SIDEBAR> <FRAME SRC="tfemain.html" NAME=MAIN> <NOFRAMES>NOFRAMES stuff </NOFRAMES> frameset within frameset To target one of these frames, the link should have a TARGET attribute set to the name of the frame where the linked page should appear. So, for example, this code creates a link to tfetacos.html and targets that link to the MAIN frame: this code produces this <A HREF="tfetacos.html" TARGET=MAIN>my link</a> the link in this pag Titis Widowati (Patbhe)] Page 19
20 Targeting the Whole Window Eventually in a framed site you want to "break out"... link to a page and have that page take over the entire window. To create this sort of link, we add TARGET="_top" to the <A...> tag: this code produces this <A HREF="wwtarget.html" TARGET="_top"> the link in this page In the previous example we used TARGET to refer to a frame we had named MAIN. In this example, however, we refer to a frame we never named: "_top". We can do this because the outermost frame (that is, the entire window) is already named "_top". "_top" is a reserved name which is automatically given to the entire window. So when we say TARGET="_top", we are saying "put the new web page in the entire window". Note that "_top" needs to be in all lower-case, it should have quotes around it, and don't forget the underscore ("_"). No matter what the other frames are named, the entire window is always named "_top" Forms Tutorial Let's look at a very simple form: this code <FORM ACTION="/cgi-bin/mycgi.pl"> favorite color: <INPUT NAME="color"> </FORM> produces this favorite color: This form has all the required elements for a form: <FORM ACTION="/cgi-bin/mycgi.pl"> Titis Widowati (Patbhe)] Page 20
21 Start the form here. The ACTION attribute, which is required with every <FORM...> tag, is used with CGI, discussed below. <INPUT NAME="color"> Data entry field. <INPUT...> creates most types of form fields, but <TEXTAREA...> and <SELECT...> also create certain types. </FORM> End the form here. Of course, this form doesn't do much. You can type something into the one field, but that's it, nothing happens from there. In the next section, we expand the form a little. Forms and CGI The original and still most popular use for forms is in conjunction with CGI (Common Gateway Interface). In the CGI way of doing things, the data the user enters is sent to the web server, where a program processes the data and returns the results. In other words, all the data is processed on the server, not in the web browser. Let's expand our earlier example to show how to incorporate CGI: <FORM ACTION="/cgi-bin/mycgi.pl"> favorite color: <INPUT name="favecolor"> <INPUT TYPE=SUBMIT VALUE="Submit"> </FORM> which gives us favorite color: Submit Here's what the new pieces mean: <FORM ACTION="/cgi-bin/mycgi.pl"> ACTION tells the browser where to send the data for processing (more on that shortly). ACTION is required with every form, even forms that don't use CGI. <INPUT name="favecolor"> We've added the NAME attribute. NAME identifies each field, "names" it so it can be referred to later. <INPUT TYPE=SUBMIT VALUE="Submit"> This <INPUT...> tag creates the "submit" button, which the user presses to send the form to the web server. That's the basic set up for a CGI form, but what happens after the user presses Submit? Consider, for example, this simple form: Join our mailing list Titis Widowati (Patbhe)] Page 21
22 Name: Submit Here's the chain of events when the user hits "Submit": 1. When the user presses Submit, the browser sends the form data to the web server. 2. The web server launches the CGI program which was written to process this form. 3. The CGI program does whatever it does with the data. The program might consult a database, perform calculations on the data, use the data to add the user to a mailing list, whatever the programmer wants it to do. Whatever else the program does, it generates a web page using HTML so the user can see the results of submitting the form. 4. The CGI program passes the HTML back to the web server. 5. The web server passes the HTML back to the browser. So there are three pieces to the CGI process: the form on your web page, the web server, and the CGI program. This guide deals with the first part: how to use HTML to make a form. Your web administrator handles the web server, and for a good guide on how to write CGIs, we recommend James Marshall's excellent (and short) CGI Made Really Easy. NOTE: If you want to get started writing HTML forms but don't have a CGI set up yet, you can use our publicly available CGI at../cgi-bin/mycgi.pl. This CGI will produce a web page of all the fields sent to it, so you can see if the forms work the way you intended. Most of the forms on the rest of this page will use this CGI. Titis Widowati (Patbhe)] Page 22
23 Technically speaking there is no such thing as "a CGI". "CGI" is a standard protocol, not an actual implementation. However, it has become common to refer to a program which uses the CGI standard as "a CGI", and we will follow that custom here. One of the reasons CGI is so popular is that the CGI program can be written in just about any programming language: C, C++, Perl (the most popular language for CGI), Visual Basic, etc. CGI was designed to allow great flexibility in processing the form data, while still allowing the results to be returned as HTML (or other formats, but HTML is the most popular). Titis Widowati (Patbhe)] Page 23
Pengaturan Teks. Contoh : <H2>Tutorial Html</H2> Hasilnya akan terlihat seperti : Tutorial Html
Struktur dasar HTML HTML (Hypert Text Markup Language) merupakan bahasa pemrograman yang digunakan dalam pembuatan halaman web. Dalam penggunaannya sebagian besar kode HTML tersebut harus terletak di antara
Struktur dasar HTML BGCOLOR, BACKGROUND, TEXT, LINK, VLINK, ALINK, LEFTMARGIN & TOPMARGIN.
Struktur dasar HTML HTML (Hypert Text Markup Language) merupakan bahasa pemrograman yang digunakan dalam pembuatan halaman web. Dalam penggunaannya sebagian besar kode HTML tersebut harus terletak di antara
DASAR HTML UNTUK PEMULA
DASAR HTML UNTUK PEMULA Dian Propa, dianpropa@gmail.com HTML atau Hypertext Markup Language merupakan protokol yang digunakan untuk mentransfer data atau document dari web server ke browser, seperti Internet
HyperText Markup Language (HTML) adalah sebuah bahasa markup yang digunakan untuk membuat sebuah halaman web dan menampilkan berbagai informasi di
HyperText Markup Language (HTML) adalah sebuah bahasa markup yang digunakan untuk membuat sebuah halaman web dan menampilkan berbagai informasi di dalam sebuah browser Internet. Bermula dari sebuah bahasa
Struktur dasar HTML. Tutorial Belajar Dasar-dasar HTML: Hypertext Markup Language
Hyper Text Markup Language (HTML) merupakan protokol yang digunakan untuk mentransfer data atau document dari web server ke browser kita (Internet Explorer, Netscape Navigator, NeoPlanet, dll). Nah, HTML
STRUKTUR DASAR HTML. Okeh di sini kita serius deh wkwkwkwk upz kan saya bilang mau serius ok! ok!
STRUKTUR DASAR HTML Okeh di sini kita serius deh wkwkwkwk upz kan saya bilang mau serius ok! ok! mari sekarang kita libas semua ilmu yang ada prettttt semoga bermanfaat Ini dia sebuah bahasa pemograman
<HEAD> Sebagai informasi page header. Di dalam tag ini kita bisa meletakkan tag-tag TITLE, BASE, ISINDEX, LINK, SCRIPT, STYLE & META.
Pendahuluan Sebelum kita melangkah lebih jauh ada baiknya Anda tahu apa itu HTML. HTML atau Hypertext Markup Language merupakan protokol yang digunakan untuk mentransfer data atau document dari web server
Edisi UNIVERSITAS NEGERI SEMARANG. Badan Pengembangan Teknologi Informasi dan Komunikasi. Modul Pelatihan H T M L
Edisi 1 UNIVERSITAS NEGERI SEMARANG Badan Pengembangan Teknologi Informasi dan Komunikasi Modul Pelatihan H T M L U N I V E R S I T A S N E G E R I S E M A R A N G Modul Pelatihan HTML Akhmad Munawar http://about.me/akhmad.munawar
BUKU PANDUAN WEB DESIGN
BUKU PANDUAN WEB DESIGN DAFTAR ISI 1. PENDAHULUAN... 1 2. KUMPULAN TAG HTML... 2 3. STRUKTUR DASAR HTML... 3 4. MEMBUAT DOKUMEN HTML... 4 5. RANCANGAN STRUKTURAL TEXT... 5 6. LATAR BELAKANG DAN WARNA...
HTML (HYPERTEXT MARKUP LANGUAGE)
HTML (HYPERTEXT MARKUP LANGUAGE) HTML merupakan Script dimana kita bisa menampilkan informasi dan daya kreasi kita lewat internet. HTML sendiri terdiri dari tag-tag yang fungsinya untuk membuat dokumen
Syntax HTML. Biasanya digunakan untuk menulis komentar, tidak akan timbul dihalaman web.
Syntax HTML Pada tulisan Saya kali ini, Saya memberikannya beserta contoh kode dan gambar, ada beberapa yang Saya tidak beri kode dan gambar, kode, dan gambar sekalipun karena beberapa alasan : Kurangnya
Pemrograman Basis Data Berbasis Web
Pemrograman Basis Data Berbasis Web Pertemuan Ke-3 (HTML) Oleh: Noor Ifada S1 Teknik Informatika - Unijoyo 1 HTML singkatan dari HyperText Markup Language menentukan tampilan suatu teks dan tingkat kepentingan
Pemrograman Basis Data Berbasis Web
Pemrograman Basis Data Berbasis Web Pertemuan Ke-2 (HTML) Noor Ifada noor.ifada@if.trunojoyo.ac.id S1 Teknik Informatika - Unijoyo 1 Sub Pokok Bahasan HTML? Istilah-istilah dalam HTML Tag Utama dalam struktur
HTML (Hypertext Markup Language)
1 HTML (Hypertext Markup Language) HTML atau Hypertext Markup Language merupakan salah satu format yang digunakan dalam pembuatan dokumen (web page) dan aplikasi yang berjalan di halaman web. Dokumen HTML
Pemrograman Basis Data Berbasis Web
Pemrograman Basis Data Berbasis Web Pertemuan Ke-2 (HTML) Noor Ifada S1 Teknik Informatika - Unijoyo 1 Sub Pokok Bahasan HTML? Istilah-istilah dalam HTML Tag Utama dalam struktur dokumen HTML Contoh HTML
Pemrograman Internet by Susiana Sari, S.Kom
1 Muara Teweh, 01 April 2009 Susiana Sari, S.Kom Manajemen Informatika Politeknik Muara Teweh STRUKTUR DASAR HTML : sebagai tanda awal dokumen : sebagai informasi page header : sebagai
Web Programming HTML
Web Programming HTML Element HTML Basic Tag HTML Format HTML Entiti HTML Links HTML Frame HTML Table HTML List HTML Form HTML Image HTML Background HTML Outline Element HTML Basic Tag HTML Format HTML
MODUL II MEMBUAT DAFTAR ITEM, MEMBUAT LINK, MEMBUAT TABEL
MODUL II MEMBUAT DAFTAR ITEM, MEMBUAT LINK, MEMBUAT TABEL A. MAKSUD DAN TUJUAN 1. MAKSUD a. Merapikan teks yang berupa daftar (list) dan table dengan tag HTML b. Membuat halaman web terhubung dengan halaman
HTML. ( HyperText Markup Language) Pertemuan 2 Oleh : Nufan Balafif. Mata Kuliah : Pemrograman Berbasis Web
HTML ( HyperText Markup Language) Mata Kuliah : Pemrograman Berbasis Web Pertemuan 2 Oleh : Nufan Balafif html (hypertext markup language) Adalah bahasa pemrograman Web (client) yang dikhususkan untuk
Materi. I. Pengenalan HTML II. Basic Tag HTML III. Table IV. Image
Pengenalan HTML Materi I. Pengenalan HTML II. Basic Tag HTML III. Table IV. Image I. Pengenalan HTML WWW HTML Browser dan Editor I. PENGENALAN HTML World Wide Web Internet merupakan jaringan global yang
PEMROGRAMAN WEB 1 (PART 2) Berbagai macam Tag HTML. Rio Andriyat Krisdiawan, M.Kom
PEMROGRAMAN WEB 1 Berbagai macam Tag HTML (PART 2) Rio Andriyat Krisdiawan, M.Kom Tag Subscript dan SuperScript Subscript biasanya digunakan untuk Menurunkan posisi karakter atau lebih rendah dari teks
FORMAT TEXT. Tag Attribut Value Keterangan. RGB(red,green,blue) Kode Warna. Memberikan warna terhadap background web mengatur posisi text rata kiri
FORMAT TEXT Tag Attribut Value Keterangan Body P (Paragraf) H (Heading) ol (Order List) ul (UnOrder List) Font marquee align RGB(red,green,blue) Kode Warna justify Memberikan warna terhadap background
HTML (HyperText Markup Language)
HTML (HyperText Markup Language) IMS HTML HyperText Markup Language adalah sebuah bahasa markah yang digunakan untuk membuat sebuah halaman web, menampilkan berbagai informasi di dalam sebuah penjelajah
Bahasa yang digunakan untuk menampilkan informasi pd halaman web. bahasa ini menggunakan tanda (markup) untuk menandai perintahperintahnya
Pertemuan 2 1 Bahasa yang digunakan untuk menampilkan informasi pd halaman web. bahasa ini menggunakan tanda (markup) untuk menandai perintahperintahnya menentukan tampilan suatu teks dan tingkat kepentingan
HTML : Apa itu? HTML = Hyper Text Markup Language. HTML adalah dokumen text yang bisa dibaca untuk dipublikasikan di World Wide Web (WWW)
MK MK Desain Desain Grafis Grafis Web Web 2002/2003 2002/2003 by by Ido Ido Priyana Priyana Hadi Hadi :: HTML : Apa itu? HTML = Hyper Text Markup Language HTML adalah dokumen text yang bisa dibaca untuk
1. Agar bagian yang ditunjuk anak panah bisa ditampilkan pada browser, perintah yang digunakan adalah.
A SOAL PILIHAN GANDA 1 Agar bagian yang ditunjuk anak panah bisa ditampilkan pada browser, perintah yang digunakan adalah A ikan Badut (Clownfish) B ikan Badut (Clownfish) C
Pemrograman Web. HTML Lanjut. Indrato, S.Kom List. Ordered Lists (OL) Ordered List (OL) Ordered List (OL) PemrogramanWeb.
Pemrograman Web Indrato, S.Kom indra.ndr7@gmail.com HTML Lanjut Page 2 List Digunakan untuk membuat daftar, terdiriatas: Ordered List (Numbering) Unordered List (Bullet) Definition List Ordered Lists (OL)
Tampilan di website (Tidak Tampil karena hanya memberi informasi bagi pembuat )
MEMBUAT WEBSITE DENGAN HTML Dibuat oleh : Dea Arri Rajasa, SE., S.Kom HTML (Hyper Text Markup Language) STRUKTUR HTML Judul Website ditulis disini Kode kode HTML
MODUL HTML 2015 MODUL I PENDAHULUAN
MODUL I PENDAHULUAN HTML merupakan singkatan dari Hyper Text Markup Language adalah script untuk menyusun dokumen-dokumen Web. Dokumen HTML disimpan dalam format teks reguler dan mengandung tag-tag yang
Pertemuan IV. Semester 1
Tables dan Forms Pertemuan IV Pemrograman Web Dasar Semester 1 Tabel HTML Tag digunakan untuk mengawali sebuah tabel. Di dalam elemen table, terdapat tag (table rows) dan tag (table
HTML Dasar Pertemuan - 2
HTML Dasar Pertemuan - 2 Semester Ganjil 2009/2010 HTML? Sebuah bahasa markup yang digunakan untuk membuat sebuah halaman web dan menampilkan berbagai informasi di dalam sebuah browser. HTML berupa kode
- Ordered List : list yang menggunakan nomor berdasarkan urutan (numbering)
PEMROGRAMAN WEB 04 Table Andi WRE List 3 macam List : - Ordered List : list yang menggunakan nomor berdasarkan urutan (numbering) - Unordered List : list yang tidak berurut dan menggunakan bullet (bullets)
1. Pengenalan HTML. 2. Tag Dasar HTML
1. Pengenalan HTML 1.1. Sejarah Singkat HTML HTML dibuat oleh Tim Bernels-Lee seorang ahli Fisika ketika masih bekerja untuk CERN (organisasi Eropa untuk riset nuklir) dan dipopulerkan pertama kali oleh
P - 5 Bab 4 : HTML (Hypertext Markup Language)
P - 5 Bab 4 : HTML (Hypertext Markup Language) 4.1 Tujuan Mengerti konsep dasar, struktur, gaya penulisan, sound & background sound, hyperlink serta images, table, form & frame HTML. 4.2 Materi 1. Konsep
4. Berikut ini termasuk tag tag yang biasanya diletakkan di dalam kelompok tag Body, kecuali. a. bgcolor c. link b. font d. meta
LATIHAN SOAL HTML DASAR 1 1. Singkatan HTML adalah. a. Hyper Text Markup Language b. Hygher Text Markup Language c. Hyper Terminal Markup Language d. Hyper Text Make Language 2. Dibawah ini merupakan tag
IDA NOOR RAHMA / A
IDA NOOR RAHMA 09018017 / A Aligning Web Page Content Visually with Visible Table Borders When you use a table to align graphics and text, you create an organized layout to the page, help the visitor s
<table> : Tag ini merupakan inti dari perintah untuk membuat. </table> : Tag ini merupakan penutup dari perintah untuk membuat
: Tag ini merupakan inti dari perintah untuk membuat tabel pada dokumen HTML : Tag ini merupakan penutup dari perintah untuk membuat tabel pada dokumen HTML : Tag ini digunakan untuk membuat
Soal Remedial Prakarya-1
Soal Remedial Prakarya-1 Kerjakan soal ini, dengan memilih salah satu jawaban yang benar. Perhatikan petunjuk: a. Pilihan jawaban yang benar dengan cara memblok pada soal tersebut. b. Dan kirim soal dan
HTML Dasar & Layouting (tag, elemen, atribut, link, frame, table) Pengembangan Web (IT133) Ramos Somya, S.Kom., M.Cs.
HTML Dasar & Layouting (tag, elemen, atribut, link, frame, table) Pengembangan Web (IT133) Ramos Somya, S.Kom., M.Cs. HTML HyperText Markup Language HTML bahasa pemrograman HTML markup language Digunakan
Iankee.mualdo@gmail.com PENGENALAN WEBSITE HTML CSS Mengenal CMS ( Content Management System) Iankee.mualdo@gmail.com PENGENALAN WEBSITE HTML CSS Mengenal CMS ( Content Management System) Iankee.mualdo@gmail.com
SOAL PRODUKTIF KEJURUAN KELAS X MULTIMEDIA
SOAL PRODUKTIF KEJURUAN KELAS X MULTIMEDIA 1. HTML adalah kepanjangan dari. A. Hyper Text Multiple Language B. Hiper Text Multiple Language C. Hipo Text Multiple Language D. Hyper Text Multiple Land E.
ADDING RTGS BENEFICIARY FOR CHECKER MAKER SYSTEM
ADDING RTGS BENEFICIARY FOR CHECKER MAKER SYSTEM Jika anda menggunakan checker maker maka akan ada satu petugas maker yang akan membuat data entry dan satu petugas checker yang akan melakukan autorisasi
BAB I PERKENALAN HTML
BAB I PERKENALAN HTML A. PENDAHULUAN Hypertext Markup Language (HTML) sebuah bahasa markup atau tanda yang digunakan untuk membuat sebuah halaman website, HTML merupakan berupa kode-kode tag yang menginstruksikan
KOMPUTER APLIKASI IT (Information Technology)
KOMPUTER APLIKASI IT (Information Technology) 2 SKS Semester 1 S1 Sistem Informasi Nizar Rabbi Radliya nizar.radliya@yahoo.com Pertemuan 5 Universitas Komputer Indonesia 2014 Tabel pada HTML Tabel pada
BAB 1 PENGENALAN HTML
1 BAB 1 PENGENALAN HTML HyperText Markup Language (HTML) merupakan bahasa standar yang digunakan untuk membuat sebuah tampilan halaman website. Sesuai dengan namanya yaitu HyperText Markup Language (HTML)
KONSEP DASAR HTML. HTML ( HyperText Mark up Language )
KONSEP DASAR HTML HTML ( HyperText Mark up Language ) hypertext adalah kata yang dapat menunjukkan hubungan suatu naskah dokumen dengan naskahnaskah lainnya markup menunjukkan bahwa pada file HTML berisi
STMIK DIKTAT SINGKAT MACROMEDIA DREAMWEAVER 8 SEKOLAH TINGGI MANAJEMEN INFORMATIKA DAN KOMPUTER TASIKMALAYA.
STMIK SEKOLAH TINGGI MANAJEMEN INFORMATIKA DAN KOMPUTER TASIKMALAYA DIKTAT SINGKAT MACROMEDIA DREAMWEAVER 8 PENDAHULUAN Dreamweaver adalah sebuah program website editor yang berfungsi untuk membuat dan
Pemrograman Web I (HTML Lanjut) Oleh: Devie Rosa Anamisa
Pemrograman Web I (HTML Lanjut) Oleh: Devie Rosa Anamisa Tujuan Kuliah Mampu Menjelaskan mengenai: format teks Table Frame Form Hyperlink pada HTML Lanjut Format Teks Ada beberapa fasilitas tag yang dapat
SUSUNAN DASAR HTML, JAVASCRIPT DAN VBSCRIPT
SUSUNAN DASAR HTML, JAVASCRIPT DAN VBSCRIPT 1. HTML 1.1. Susunan Dasar HTML Judul disini Program disini 1.2. Contoh Halaman Pertama Teks dengan Heading 1 Teks
Materi 5 Komputer Aplikasi IT (KAIT) 2 SKS Semester 1 S1 Sistem Informasi UNIKOM 2014 Nizar Rabbi Radliya
Materi 5 Komputer Aplikasi IT (KAIT) 2 SKS Semester 1 S1 Sistem Informasi UNIKOM 2014 Nizar Rabbi Radliya nizar.radliya@yahoo.com Nama Mahasiswa NIM Kelas Kompetensi Dasar Menciptakan dokumen HTML dengan
HTML. Hypertext Markup Language. Pemrograman Web 1. Genap
HTML Hypertext Markup Language Pemrograman Web 1 Genap 2009 2010 HTML HTML? Sebuah bahasa markup yang digunakan untuk membuat sebuah halaman web dan menampilkan berbagai informasi di dalam sebuah browser.
Pemrograman Lanjut. Interface
Pemrograman Lanjut Interface PTIIK - 2014 2 Objectives Interfaces Defining an Interface How a class implements an interface Public interfaces Implementing multiple interfaces Extending an interface 3 Introduction
1. Teori MODUL 1 HTML. Tujuan: Mampu menjelaskan pengertian HTML,Struktur Dasar, Tag Tag HTML, dan mampu membuat aplikasi dengan menggunakan tag HTML
MODUL 1 HTML Tujuan: Mampu menjelaskan pengertian HTML,Struktur Dasar, Tag Tag HTML, dan mampu membuat aplikasi dengan menggunakan tag HTML Tugas Pendahuluan 1. Apakah yang anda ketahui tentang World Wide
Bab 1. HTML (Hypertext Markup Language) A. World Wide Web
Bab 1 HTML (Hypertext Markup Language) A. World Wide Web Internet merupakan jaringan global yang menghubungkan suatu network dengan network lainnya di seluruh dunia, TCP/ IP menjadi protocol penghubung
Dasar-dasar Web dan HTML Minggu I. Pemrograman Web - Rosa Ariani Sukamto
Dasar-dasar Web dan HTML Minggu I Pemrograman Web - Rosa Ariani Sukamto Email: rosa_if_itb_01@yahoo.com Ngapain Sih? Ya Belajar Membuat website dengan HTML dan PHP Layanan-layanan Internet layanan informasi
PENGANTAR KOMPUTER DAN TI 2C PERTEMUAN 5
PENGANTAR KOMPUTER DAN TI PERTEMUAN 5 Struktur dokumen HTML Homepage Kepala Judul Homepage Tubuh Isi Teks Isi Tabel. Isi Audio, Video, dll.
HTML Dasar. PERTEMUAN 1 Tujuan: 1. Siswa dapat memahami dan mengenal perintah-perintah dasar HTML 2. Siswa dapat membuat tabel dan pengaturannya
HTML Dasar Tujuan: Siswa dapat membuat desain situs menggunakan pemrograman web PERTEMUAN 1 Tujuan: 1. Siswa dapat memahami dan mengenal perintah-perintah dasar HTML 2. Siswa dapat membuat tabel dan pengaturannya
Pemrograman Web WEEK 03 HTML LANJUT
1 Pemrograman Web WEEK 03 HTML LANJUT 2 Introduction IMAGE HYPERLINK IMAGE MAP DIV & SPAN META 1 HTML Image 3 Menampilkan gambar pada halaman web Tag: (tidak memiliki tag penutup) align Atribut Value
MODUL 1 DASAR-DASAR HTML
MODUL 1 DASAR-DASAR HTML RINGKASAN Dalam praktikum kali ini, Anda akan mempelajari penggunaan dari beberapa tag dasar yang hampir akan selalu digunakan dalam setiap praktikum Anda nantinya. Perhatikan
MODUL I PENGENALAN HTML. a. Mengenalkan kepada mahasiswa mengenai pemrograman WEB dengan menggunakan HTML b. Mengenalkan kode-kode HTML 2.
MODUL I PENGENALAN HTML A. MAKSUD DAN TUJUAN 1. Maksud a. Mengenalkan kepada mahasiswa mengenai pemrograman WEB dengan menggunakan HTML b. Mengenalkan kode-kode HTML 2. Tujuan a. Mahasiswa dapat membuat
Area kerja. Gambar 1. Tampilan awal MS FrontPage
Microsoft FrontPage I. Mengenal Microsoft FrontPage Microsoft FrontPage (MS FrontPage) adalah sebuah program untuk membuat, mendesain, dan mengedit halaman World Wide Web seperti menambahkan text, images,
MODUL PRAKTIKUM APLIKASI IT 1 MODUL V TABEL
MODUL V TABEL 5.1 Tabel Tabel merupakan cara untuk menampilkan informasi dalam bentuk sel yang terdiri atas baris dan kolom. Untuk menampilkan data dalam bentuk table dalam HTML. Disamping itu tabel juga
ANALISIS CAPAIAN OPTIMASI NILAI SUKU BUNGA BANK SENTRAL INDONESIA: SUATU PENGENALAN METODE BARU DALAM MENGANALISIS 47 VARIABEL EKONOMI UNTU
ANALISIS CAPAIAN OPTIMASI NILAI SUKU BUNGA BANK SENTRAL INDONESIA: SUATU PENGENALAN METODE BARU DALAM MENGANALISIS 47 VARIABEL EKONOMI UNTU READ ONLINE AND DOWNLOAD EBOOK : ANALISIS CAPAIAN OPTIMASI NILAI
Pemrograman Web I (HTML) Oleh: Devie Rosa Anamisa
Pemrograman Web I (HTML) Oleh: Devie Rosa Anamisa Tujuan Kuliah Mampu Menjelaskan mengenai: Pengertian struktur dasar tag-tag HTML membuat aplikasi dengan perintah-perintah HTML HTML Hyper Text Markup
PENGANTAR INTERNET & DESAIN WEB
Program Studi Manajemen Informatika Fakultas Bisnis Dan Teknologi Informasi Universitas Teknologi Yogyakarta PENGANTAR INTERNET & DESAIN WEB Ganjil 2012-2013, S.Kom HTML Dasar Bagian 2 Numbered & Indented
MODUL PEMOGRAMAN WEB I STMIK IM BANDUNG MODUL PEMOGRAMAN WEB I. Oleh: CHALIFA CHAZAR. Chalifa Chazar edu.script.id
1 MODUL PEMOGRAMAN WEB I Oleh: CHALIFA CHAZAR 2 Modul 3 HTML Layout Tujuan: Mahasiswa mengenal konsep-konsep dan komponen layout dasar untuk membangun website statis. Pustaka:» HTML dan XML Edisi 2: Betha
KESASTRAAN MELAYU TIONGHOA DAN KEBANGSAAN INDONESIA: JILID 2 FROM KPG (KEPUSTAKAAN POPULER GRAMEDIA)
Read Online and Download Ebook KESASTRAAN MELAYU TIONGHOA DAN KEBANGSAAN INDONESIA: JILID 2 FROM KPG (KEPUSTAKAAN POPULER GRAMEDIA) DOWNLOAD EBOOK : KESASTRAAN MELAYU TIONGHOA DAN KEBANGSAAN Click link
Pengantar HTML. Achmad Fadlil Chusni, S.Kom, M.MT
Pengantar HTML Achmad Fadlil Chusni, S.Kom, M.MT Objectives Setelah menyelesaikan bab ini, anda diharapkan dapat: Memahami konstruksi dasar halaman web. Mengerti tentang WWW Mengerti tag-tag dasar HTML
BAB I PERKENALAN HTML
BAB I PERKENALAN HTML A. PENDAHULUAN Hypertext Markup Language (HTML) sebuah bahasa markup atau tanda yang digunakan untuk membuat sebuah halaman website, HTML merupakan berupa kode-kode tag yang menginstruksikan
HTML. Hipertext Markup Language
HTML Hipertext Markup Language HTML HTML? Sebuah bahasa markup yang digunakan untuk membuat sebuah halaman web dan menampilkan berbagai informasi di dalam sebuah browser. HTML berupa kode - kode tag yang
PENGENALAN HTML - 2. Anda bisa menambahkan beberapa cell (kolom) untuk membuat satu baris cell (kolom).
PENGENALAN HTML - 2 G. Tabel HTML Setting untk membuat perintah tabel terdiri dari : Row : mementukan banyaknya baris yang dimiliki oleh tabel. Columns : menentukan banyaknya kolom yang dimiliki tabel.
PEMBUATAN BAHAN AJAR KIMIA BERBASIS WEB MENGGUNAKAN MICROSOFT FRONTPAGE
PEMBUATAN BAHAN AJAR KIMIA BERBASIS WEB MENGGUNAKAN MICROSOFT FRONTPAGE Oleh: Asyti Febliza I. Mengenal Microsoft FrontPage Microsoft FrontPage (MS FrontPage) adalah sebuah program untuk membuat, mendesain,
1) Gunakan peralatan sesuai dengan fungsinya. 2) Bekerjalah sesuai dengan cara kerja atau petunjuk yang telah ditentukan.
TUJUAN a. Memahami dan mengaplikasikan tag-tag HTML dalam sebuah web. b. Dapat berkreasi dengan tabel, form dan frame untuk membuat sebuah karya web personal. ALAT DAN BAHAN 1) 1 (Satu) unit komputer KESELAMATAN
Macromedia Dreamweaver. Tatik Retno Murniasih, S.Si., M.Pd.
Tatik Retno Murniasih, S.Si., M.Pd. Merupakan software web design yang berguna untuk merancang web dan layout halaman web. Dalam merancang web bisa dilakukan dengan cara mendesain dan memprogram. Untuk
MODUL 1 HTML. (HyperText Mark-Up Language)
MODUL 1 HTML (HyperText Mark-Up Language) Laboratorium Komputer STIMIK PPKIA Pradnya Paramita Malang Pertemuan 1 1.1 Tujuan : 1. Mahasiswa dapat memahami dan mengenai perintah perintah dasar HTML 2. Mahasiswa
6 KERANJANG 7 LANGKAH API (INDONESIAN EDITION) BY LIM TUNG NING
6 KERANJANG 7 LANGKAH API (INDONESIAN EDITION) BY LIM TUNG NING READ ONLINE AND DOWNLOAD EBOOK : 6 KERANJANG 7 LANGKAH API (INDONESIAN EDITION) BY LIM TUNG NING PDF Click button to download this ebook
Easy & Simple - Web Programming: Belajar Pemprograman Website Secara Efektif dan Efisien (Indonesian Edition)
Easy & Simple - Web Programming: Belajar Pemprograman Website Secara Efektif dan Efisien (Indonesian Edition) Rohi Abdulloh Click here if your download doesn"t start automatically Easy & Simple - Web Programming:
MODUL 1 PENGENALAN HTML
MODUL 1 PENGENALAN HTML TUJUAN PRAKTIKUM : 1. Praktikan memahami tentang HTML, CSS, frame dan JS pada HTML serta kegunaannya. 2. Praktikan memahami bagaimana cara membuat web menggunakan HTML, CSS dan
Desain Web. Oleh : Ady Purna Kurniawan, ST., MT.
Desain Web HTML Layout Oleh : Ady Purna Kurniawan, ST., MT. Materi HTML Layout 1. Tabel 2. Frame TABLE Digunakan untuk membuat tabel (kolom dan baris) Diperbolehkan membuat tabel di dalam tabel (nested
1. #**# merupakan karakter yang terdapat pada type data a. text b. password c. radio d. submit e. file jawaban : b
1. #**# merupakan karakter yang terdapat pada type data a. text b. password c. radio d. submit e. file 2. Perintah untuk mengosongkan kolom pada HTML adalah a. tr b. br c. td d.   e. &nsp jawaban :
diinterpretasi bukan untuk tampilan
HTML 1 Mark Up Language Mark Up : informasi tambahan yang ditempatkan pada teks untuk menjelaskan bagaimana teks tersebut diinterpretasi Mark Up ditambahkan bukan untuk tampilan tetapi untuk memberikan
1. HTML DASAR Struktur dokumen HTML(Tag, Element, Attribute), Element HTML, Element HEAD, Element TITLE, Element BODY
--------------------------------------------------------------------------------------------------------- BELAJAR HTML DASAR LENGKAP SINGKAT JELAS PADAT (Disertai Study Kasus) (www.infomugi.blogspot.com)
Prak. E-Bussiness & E-Commerce HTML. (HyperText Markup Language) RAHMADY LIYANTANTO liyantanto.wordpress.com
Prak. E-Bussiness & E-Commerce HTML (HyperText Markup Language) RAHMADY LIYANTANTO liyantanto@gmail.com liyantanto.wordpress.com Pendahuluan HTML adalah sebuah bahasa markup yang digunakan untuk membuat
MODUL 3 HTML. (HyperText Mark-Up Language) Sub : Tabel & Form
MODUL 3 HTML (HyperText Mark-Up Language) Sub : Tabel & Form Laboratorium Komputer STIMIK PPKIA Pradnya Paramita Malang Pertemuan 3 3.1 Tujuan : 1. Mahasiswa dapat memahami dan mengenai perintah perintah
Adapun elemen-elemen yang digunakan untuk membuat suatu tabel adalah :
PERTEMUAN 5 Membuat Tabel Tabel biasanya digunakan untuk menempatkan data secara spreadsheet, tapi untuk desain suatu web, selain untuk menempatkan data, tabel digunakan untuk merapikan teks, ataupun gambar.
XHTML dan Dasar-dasar CSS XHTML
XHTML dan Dasar-dasar CSS Pemrograman Web Rosa Ariani Sukamto Email: rosa_if_itb_01@yahoo.com Blog: http://udinrosa.wordpress.com Website: http://www.gangsir.com XHTML Extensible Hypertext Markup Language
E VA D A E L U M M A H K H O I R, M. A B. P E R T E M U A N 2 A N A
HANDLING TAMU E VA D A E L U M M A H K H O I R, M. A B. P E R T E M U A N 2 A N A CARA PENERIMAAN TAMU Menanyakan nama dan keperluan (RESEPSIONIS) Good Morning. What can I do for you? Good morning, can
Tujuan: Siswa dapat membuat desain situs menggunakan perangkat lunak desain dan pemrograman web
HTML DASAR BAGIAN 1 Oleh: Heribertus Heri Istiyanto Tujuan: Siswa dapat membuat desain situs menggunakan perangkat lunak desain dan pemrograman web Materi: 1. HTML Dasar 2. Desain Layout di Photoshop 3.
PERTEMUAN 1. Kompetensi Dasar : Menjelaskan konsep dasar dan teknologi Webpage
PERTEMUAN 1 Kompetensi Dasar : Menjelaskan konsep dasar dan teknologi Webpage Materi yang akan dibahas : 1. Kegunaan dari dokumen dan audiens 2. Bahasa HTML 3. Struktur dasar penulisan dokumen 4. Site
PENGANTAR HTML. Danang Wahyu Utomo Danang Wahyu Utomo, M.Kom, M.CS
PENGANTAR HTML Danang Wahyu Utomo danang.wu@dsn.dinus.ac.id +6285 740 955 623 Objectives Basic HTML HTML headings HTML paragraphs HTML links HTML images HTML HyperText Markup Language HTML adalah language
FLASH, FRAME, BEHAVIOR
FLASH, FRAME, BEHAVIOR 1. Flash Menyisipkan Flash Button a. Pilih menu : insert image interactive flash button b. Tentukan property : Style : pilih bentuk / jenis tombol flash Button text : tulis label
Mencari Text 2) 3) KTI A : Week 02 (Pembuatan Dokumen)
1 Mencari Text Untuk mencari sebuah text secara cepat, gunakan fasilitas Find and Replace, yang dapat dipanggil melalui menu Edit Find atau Ctrl+F. Hasilnya adalah : 4) Mencari untuk Highlight : menandai
TAG 10/2/2011. Pengenalan HTML. Pengantar Bahasa HTML (Menuliskan Kode HTML) Pengantar Bahasa HTML. Pengantar Bahasa HTML (Membuat Dasar Tag)
Perancangan & Pemprograman WEB Pertemuan 2 Pengenalan HTML, TAG, list, dan Hyperlink Pengenalan HTML Apakah file HTML itu? HTML singkatan dari Hyper Text Markup Language. Merupakan suatu bahasa pemorgraman
Rahasia Cermat & Mahir Menguasai Akuntansi Keuangan Menengah (Indonesian Edition)
Rahasia Cermat & Mahir Menguasai Akuntansi Keuangan Menengah (Indonesian Edition) Hery Hery Click here if your download doesn"t start automatically Rahasia Cermat & Mahir Menguasai Akuntansi Keuangan Menengah
365 Menu Sukses MP-ASI selama 1 tahun Menu Pendamping ASI untuk Bayi Usia 7-18 Bulan (Indonesian Edition)
365 Menu Sukses MP-ASI selama 1 tahun Menu Pendamping ASI untuk Bayi Usia 7-18 Bulan (Indonesian Edition) Hindah J. Muaris Click here if your download doesn"t start automatically 365 Menu Sukses MP-ASI
Keterampilan Komputer. 8. Pengenalan HTML
Keterampilan Komputer 8. Pengenalan HTML Table of Contents: World Wide Web (WWW) HyperText Markup Language (HTML) Browser dan Editor Tag-tag HTML Struktur HTML document Elemen Dasar HTML 2 Objectives Setelah
Pemrograman Web Week 2. Team Teaching
Pemrograman Web Week 2 Team Teaching WEEK 2 HTML IKG2I4 Software Project I Persiapan Instalasi Editor Download dan Install apilkasi editor (mis. Notepad++) Karena membantu dalam pengembangan syntax highlighting
P - 6 Bab 4 : HTML (Hypertext Markup Language)
P - 6 Bab 4 : HTML (Hypertext Markup Language) 4.1 Tujuan Mengerti cara membuat table, form & frame HTML. 4.2 Materi 1. Table 2. Form 3. Frame HTML 4.3 Table Tabel terdiri dari beberapa bagian, antara
HTML. Minggu 2. Pemrograman Web/MI/D3/2 sks 1
HTML Minggu 2 Pemrograman Web/MI/D3/2 sks 1 HTML (HyperText Markup Language) Mark up : informasi tambahan yang ditempatkan pada teks untuk menjelaskan bagaimana teks tersebut diinterpretasi Mark up ditambahkan
ANALISIS KINERJA MANAJEMEN (INDONESIAN EDITION) BY HERY HERY
ANALISIS KINERJA MANAJEMEN (INDONESIAN EDITION) BY HERY HERY READ ONLINE AND DOWNLOAD EBOOK : ANALISIS KINERJA MANAJEMEN (INDONESIAN EDITION) Click button to download this ebook READ ONLINE AND DOWNLOAD