Elemen-elemen baru yang disediakan pada HTML5 Tag
|
|
|
- Johan Tanudjaja
- 9 tahun lalu
- Tontonan:
Transkripsi
1 Modul 1 Html5, php5 dan css3 1. TUJUAN Mahasiswa dapat memahami pemrograman server side menggunakan HTML5, PHP5 dan CSS3 Mahasiswa dapat mengetahui sintak-sintak yang sering digunakan pada HTML5, PHP5 dan CSS3 Mahasiswa mampu menyelesaikan beberapa permasalahan menggunakan pemrograman 2. DASAR TEORI 2.1 HTML5 Pemrograman HTML mengalami perkembangan, standart terbaru HTML adalah HTML5 yang dirilis padaa tahun HTML5 merupakan salah satu karya Konsortium Waring Wera Wanua(World Wide Web Consortium, W3C) dan dan IETF (Internet Engineering Task Force) yaitu sebuah organisasi yang menangani HTML sejak versi 2.0. HTML5 memiliki beberapaa kelebihan diantaranya : HTML5 dirancang khusus untuk menangani konten website tanpa memerlukan tambahan plugin (seperti flash) Penanganan kesalahan yang lebih baik HTML5 memiliki elemen semantik, gambar dan multimedia baru HTML5 mempunyai elemen form baru dan API baru sehingga pengembangan aplikasi web lebih mudah HTML5 merupakan cross-platform, dirancang untuk bekerja pada beberapa tipe perangkat keras (PC, Tablet, Phone, TV, dll) Format penulisan sintak HTML5 secara umum masih seperti format HTML versi sebelumnya. HTML5 menggunakan encoding (charset) UTH-8 yang didefinisaikan pada setiap halaman html. Format Sintak HTML5 seperti dibawah ini <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>title of the document</title> </head> <body> Content of the document.... </body> </html> Ada beberapa elemen baru yang disediakan pada HTML5 untuk mendukung pembuatan halaman website modern seperti : header, footer, navigationn bars, sidebars dan sebagainya. Beberapa elemen baru HTML5 seperti terlihat pada tabel 1. Tabel 1. Elemen-elemen baru yang disediakan pada HTML5 Tag Deskripsi <article> Mendefinisikan sebuah artikel pada dokumen seperti : berita, komentar dan sebagainya <section> Mendefinisikan sebuah section subuah dokumen <nav> Mendefinikan link navigasi sebuah dokumen <aside> Untuk menandai sebuah sidebar atau beberapa konten lainnya yang dianggap agak terpisah untuk konten sekitarnya. Contohnya adalah iklan <header> Mendefinisikan header sebuah dokumen atau section <footer> Mendefinisikan footer sebuah dokumen atau section 1
2 <figcaption> Mendefinisikan caption sebuah elemen gambar Elemen form juga mengalami pengembangan pada HTML5. Elemen-elemen baru pada form seperti tabel 2. Tabel 2. Elemen form pada HTML5 Tag Deskripsi <datalist> Definisi awal pilihan untuk pengaturan masukan <keygen> Mendefinisikan sebuah key-par generator field (untuk form) <output> Mendefinisikan hasil dari sebuah kalkulasi Untuk mendukung mendukung fasilitas gambar dan media HTML5 menyediakan beberapa elemen seperti pada tabel 3 dan 4. Tabel 3. Elemen grafis pada HTML5 Tag Deskripsi <canvas> Mendefinisikan gambar grafis menggunakan JavaScript <svg> Mendefinisikan gambar grafis menggunakan SVG Tabel 4. Elemen media pada HTML5 Tag Deskripsi <audio> Mendefinisikan konten audio atau musik <embed> Mendefinisikan containers untuk aplikasi eksternal (seperti plug-ins) <source> Mendefinisikan suber untuk <audio> dan video <video> Mendefinikan konten video atau film <track> Mendefinisikan track <audio> dan <video> Sebuah elemen simantik mengambarkan secara jelas kepada browser dan para pengembang web. Perbedaan antara elemen non-siamtik dan elemen simantik seperti dibawah ini Contoh elemen non-simatik : <div> dan <span> tidak menjelaskan sesuatu tentang konten Contoh elemen simatik : <form>, <table> dan <img> mendefinikan dengan jelas mengenai konten Pada beberapa website terdiri dari beberapa kode HTML seperti : <div id= nav >, <div class= header > atau <div id= footer > yang mendefinisikan sebuah link navigasi, header dan footer. HTML5 menawarkan elemen simatik baru untuk mendefinisikan dengan jelas perbedaan bagian-bagian pada sebuah halaman web, seperti : <header> <nav> <section> <article> <aside> <figure> <figcaption> <footer> <details> <summary> <mark> <time> 2
3 2.2 PHP5 PHP adalah bahasaa programan untuk membangun sebuah website dinamis. PHP meupakan kependekan dari PHP:Hypertext Preprocessing. Pada Juni 2004 PHP versi 5.0 telah dirilis dan mengalami perubahan besar. Pada versi ini PHP memasukkan model pemrograman berorientasi objek. Sintak dasar program PHP yang sering digunakan seperti dibawah ini Isi program PHP sebagai bahasa pemrograman web memiliki beberapa kelebihan, diantaranya 'Bahasa pemrograman PHP adalah sebuah bahasa script yang tidak melakukan sebuah kompilasi dalam penggunaannya.' 'Web Server yang mendukung PHP dapat ditemukan dimana - manaa dari mulai apache, IIS, Lighttpd, hingga Xitami dengan konfigurasi yang relatif mudah.' 'Dalam sisi pengembangan lebih mudah, karena banyaknya milis - milis dan developer yang siap membantu dalam pengembangan.' 'Dalam sisi pemahamanan, PHP adalah bahasa scripting yang paling mudah karena memiliki referensi yang banyak.' 'PHP adalah bahasa open source yang dapat digunakan di berbagai mesin (Linux, Unix, Macintosh, Windows) dan dapat dijalankan secara runtime melalui console serta juga dapat menjalankan perintah-perintah system.' 2.3 CSS3 Cascading Style Sheet (CSS) merupakan aturan untuk mengendalikan beberapa komponen dalam sebuah web sehingga akan lebih terstruktur dan seragam. CSS bukan merupakan bahasa pemograman. CSS dapat mengatur beberapa style, misalnya heading, subbab, bodytext, footer, images, dan style lainnya untuk dapat digunakan bersama-sama dalam beberapa berkas (file). Pada umumnya CSS dipakai untuk memformat tampilan halaman web yang dibuat dengan bahasa HTML dan XHTML. CSS dapat mengendalikan ukuran gambar, warna bagian tubuh pada teks, warna tabel, ukuran border, warna border, warna hyperlink, warna mouse over, spasi antar paragraf, spasi antar teks, margin kiri, kanan, atas, bawah, dan parameter lainnya. CSS adalah bahasa style sheet yang digunakan untuk mengatur tampilan dokumen. Dengan adanya CSS memungkinkan kita untuk menampilkan halaman yang sama dengan format yang berbeda. CSS 3 adalah versi CSS terbaru yang masih dikembangkan oleh W3C. Namun beberapa web browser sudah mendukung CSS 3. CSS 2 didukung seutuhnya oleh CSS 3 dan tidak ada perubahan, hanya ada beberapa penambahan, sehingga ketika bermigrasi dari CSS 2 ke CSS 3, tidak perlu mengubah apapun. CSS 3 memiliki beberapa fitur baru, seperti: Animasi, sehingga pembuatan animasi tidak memerlukan program sejenis Adobe Flash dan Microsoft Silverlight Beberapa efek teks, seperti teks berbayang, kolom koran, dan "word-wrap"sehingga dapat menggunakan huruf yang tidak termasuk "web- Jenis huruf eksternal, safe fonts". Beberapa efek pada kotak, seperti kotak yang ukurannya dapat diubah-ubah, transformasi 2 dimensii dan 3 dimensi, sudut-sudut yang tumpul dan bayangan. 3
4 3. LANGKAH PERCOBAAN 3.1 Latihan HTML5 Lengkapi beberapa sintak HTML5 dibawah ini dan simpan file dengan ekstensi.html. Elemen <section> HTML5 Elemen section digunakan untuk mendefinisikan sebuah section padaa dokumen <section> <h1>wwf</h1> <p>the World Wide Fund for Nature (WWF) is an international organization working on issues regarding the conservation, research and restoration of the environment, formerly named the World Wildlife Fund. WWF was founded in 1961.</ /p> </section> <section> <h1>wwf's Panda symbol</h1> <p>the Panda has become the symbol of WWF. The well-known panda logo of WWF originated from a panda named Chi Chi that was transferred from the Beijing Zoo to the London Zoo in the same year of the establishment of WWF.</p> </section> Elemen <article> HTML5 Elemen article biasanyaa digunakan untuk : - Forum post - Blog post - Berita - komentar <article> <h1>internet Explorer 9</h1> <p>windows Internett Explorer 9 (abbreviated as IE9) was released to the public on March 14, 2011 at 21:00 PDT...</p> </article Elemen <nav> HTML5 <nav> <a href="/html/">html</a> <a href="/css/">css</ /a> <a href="/js/">javascript</a> <a href="/jquery/">jquery</a> </nav> Elemen <aside> HTML5 <p>my family and I visited The Epcot center this summer.</p> <aside> <h4>epcot Center</h4> <p>the Epcot Center is a theme park in Disney World, Florida.</p> </aside> 4
5 Elemen <header> HTML5 <article> <header> <h1>internet Explorer 9</h1> <p><time pubdate datetime=" "></time></p> </header> <p>windows Internett Explorer 9 (abbreviated as IE9) was released to the public on March 14, 2011 at 21:00 PDT...</p> </article> Elemen <footer> HTML5 <footer> <p>posted by: Hege Refsnes</p> <p><time pubdate datetime=" "></time></p> </footer> Elemen <figure> dan <figcaption> HTML5 <p>the Pulpit Rock is a massive cliff 604 metres (1982 feet) above Lysefjorden, opposite the Kjerag plateau, in Forsand, Ryfylke, Norway. The top of the cliff is approximately 25 by 25 metres (82 by 82 feet) square and almost flat, and is a famous tourist attraction in Norway.</p> <figure> <img src="img_pulpit.jpg" alt="the Pulpit Rock" width="304" height="228"> <figcaption>fig.1 - The Pulpit Rock, Norway.</figcaption> </figure> Elemen <datalist> HTML5 <form action="#" method="get"> <input list="browsers" name="browser"> <datalist id="browsers"> <option value="internet Explorer"> <option value="firefox"> <option value="chrome"> <option value="opera"> <option value="safari"> </datalist> <input type="submit"> </form> 5
6 <p><b>note:</b> The datalist tag is not supported in Internet Explorer 9 and earlier versions, or in Safari.</p> Elemen <output> HTML5 <form oninput="x.value=parseint(a.value)+parseint(b.value)">0 <input type="range" id="a" value="50">100 + <input type="number" id="b" value="50">= <output name="x" for= ="a b"></output> Elemen <canvas> HTML5 <canvas id="mycanvas" " width="200" height="100" style="border:1px solid #000000;"> Your browser does not support the HTML5 canvas tag. </canvas> Menggambar sebuah canvas menggunakan JavaScript <canvas id="mycanvas" " width="200" height="100" style="border:1px solid #c3c3c3;"> Your browser does not support the HTML5 canvas tag. </canvas> <script> var c = document.getelementbyid("mycanvas"); var ctx = c.getcontext("2d"); ctx.fillstyle = "#FF0000"; ctx.fillrect(0,0,150,,75); </script> Elemen SVG HTML5 <svg width="300" height="200"> <polygon points="100,10 40, ,78 10,78 160,198" style="fill:lime;stroke:purple;stroke-width:5;fill-rule:evenodd d;" /> Sorry, your browser does not support inline SVG. </svg> 6
7 3.2 Latihan PHP5 Sintak dasar PHP <h1>my first PHP page</h1> echo "Hello World!"; Fungsi pada PHP5 function writemsg() { echo "Hello world! (di dalam fungsi)"; writemsg(); Array PHP5 $cars=array("volvo"," "BMW","Toyota"); echo "I like ". $cars[0]. ", ". $cars[1]. " and ". $cars[2]. "."; Index array $cars=array("volvo"," "BMW","Toyota"); echo "I like ". $cars[0]. ", ". $cars[1]. " and ". $cars[2]. ".";? Associative array Sorting Ascending $cars=array("volvo"," "BMW","Toyota"); sort($cars); $clength=count($cars) ); for($x=0;$x<$clength; ;$x++) { echo $cars[$x]; echo "<br>"; 7
8 Sorting ascending padaa angka $numbers=array(4,6,2,,22,11); sort($numbers); $arrlength=count($numbers); for($x=0;$x<$arrlength;$x++) { echo $numbers[$x]; echo "<br>"; Sorting Descending $cars=array("volvo"," "BMW","Toyota"); rsort($cars); $clength=count($cars) ); for($x=0;$x<$clength; ;$x++) { echo $cars[$x]; echo "<br>"; Sorting descending pada angka $numbers=array(4,6,2,,22,11); rsort($numbers); $arrlength=count($numbers); for($x=0;$x<$arrlength;$x++) { echo $numbers[$x]; echo "<br>"; Date dan Time PHP5 Date dan Time sederhana echo "Today is ". date("y/m/d"). "<br>"; echo "Today is ". date("y.m.d"). "<br>"; echo "Today is ". date("y-m-d"). "<br>"; echo "Today is ". date("l"); 8
9 Otomatis tahun copyright echo date("y") 3.3 Latihan CSS3 Navigasi ul { list-style-type: margin: 0; padding: 0; none; <ul> <li><a href="#home" ">Home</a></li> <li><a href="#news" ">News</a></li> <li><a href="#contact">contact</a></li> <li><a href="#about">about</a></li> </ul> Navigasi horisontal ul { list-style-type: margin: 0; padding: 0; li { display: inline; <ul> <li><a href="#home" ">Home</a></li> <li><a href="#news" ">News</a></li> <li><a href="#contact">contact</a></li> <li><a href="#about">about</a></li> </ul> none; Image gallery div.img { margin: 5px; padding: 5px; border: 1px solid #0000ff; 9
10 height: auto; width: auto; float: left; text-align: center; div.img img { display: inline; margin: 5px; border: 1px solid #ffffff; div.img a:hover img { border: 1px solid #0000ff; div.desc { text-align: center; font-weight: normal; width: 120px; margin: 5px; <div class="img"> <a target="_blank" href="klematis_big.htm"><img src="klematis_small.jpg" alt="klematis" width= ="110" height="90"></a> <div class="desc">add a description of the image here</div> </div> <div class="img"> <a target="_blank" href="klematis2_big.htm"><img src="klematis2_small.jpg" alt="klematis" width= ="110" height="90"></a> <div class="desc">add a description of the image here</div> </div> <div class="img"> <a target="_blank" href="klematis3_big.htm"><img src="klematis3_small.jpg" alt="klematis" width= ="110" height="90"></a> <div class="desc">add a description of the image here</div> </div> <div class="img"> <a target="_blank" href="klematis4_big.htm"><img src="klematis4_small.jpg" alt="klematis" width= ="110" height="90"></a> <div class="desc">add a description of the image here</div> </div> CSS Border div { border: 2px solid #a1a1a1; padding: 10px 40px; background: #dddddd; width: 300px; border-radius: 25px; <div>the border-radius property allows you to add rounded corners to elements.</div> 10
11 Border menggunakan gambar div { border: 15px solid transparent; width: 250px; padding: 10px 20px; #round { -webkit-border-image: url(border.png) round; /* Safari */ -o-border-image: url(border.png) round; /* Opera */ border-image: url(border.png) round; #stretch { -webkit-border-image: url(border.png) stretch; /* Safari */ -o-border-image: url(border.png) stretch; /* Opera */ border-image: url(border.png) stretch; <p><strong>note:</strong> Internet Explorer 10, and earlier versions, do not support the border-image property.</p> <p>the border-image property specifies an image to be used as a border.</p> <div id="round">here, the image is tiled (repeated) to fill the area.</div> <br> <div id="stretch">here, the image is stretched to fill the area.</ /div> <p>here is the image that is used:</p> <img src="border.png" "> Text Effect h1 { text-shadow: 5px 5px 5px #FF0000; <h1>text-shadow effect!</h1> <p><b>note:</b> Internet Explorer 9 and earlier versions, does not support the text- shadow property.</p> 11
Praktikum Disain Web HTML
Praktikum Disain Web HTML Tujuan : 1. Memahami tentang konsep HTML 2. Memahami fitur-fitur baru pada HTML5 3. Memahami aturan penulisan HTML khususnya HTML5 4. Membuat dokumen web dengan HTML khususnya
HTML Scripting Desain Visual dan Tata Letak dengan CSS 3
Tujuan : Memahami dan dapat menggunakan konsep CSS3 Memahami dan dapat mengetahui kelebihan maupun kekurangan CSS 3 Menerapkan CSS 3 dengan fitur lainnya 8.1 CSS 3 CSS3 adalah standar untuk CSS yang paling
Materi 9 Komputer Aplikasi IT (KAIT) 2 SKS Semester 1 S1 Sistem Informasi UNIKOM 2014 Nizar Rabbi Radliya
Materi 9 Komputer Aplikasi IT (KAIT) 2 SKS Semester 1 S1 Sistem Informasi UNIKOM 2014 Nizar Rabbi Radliya [email protected] Nama Mahasiswa NIM Kelas Kompetensi Dasar Memahami perkembangan HTML5.
PENDAHULUAN Yosef Murya Kusuma Ardhana. ST., M.Kom
PENDAHULUAN Yosef Murya Kusuma Ardhana. ST., M.Kom WWW World Wide Web atau lebih sering dikenal sebagai Web adalah suatu layanan sajian informasi yang menggunakan konsep hyperlink (tautan), yang memudahkan
2. DASAR TEORI 2.1 PHP5
Modul 2 1. TUJUAN Mahasiswa dapat memahami pemrograman server side menggunakan PHP5 Mahasiswa dapat mengetahui sintak-sintak yang digunakan dalam penanganan form dengan menggunakan metode GET dan POST
HTML 5. Geolocation Web SQL Database, media penyimpanan database lokal
HTML 5 HTML5 adalah sebuah bahasa markah untuk menstrukturkan dan menampilkan isi dari Waring Wera Wanua, sebuah teknologi inti dari Internet. Tujuan utama pengembangan HTML5 adalah untuk memperbaiki teknologi
Belajar Dasar HTML 5. It s all about 4rt, not how smart you are. S u p p o r t e d b y : [ C y b e r 4 r t C r e w ]
Belajar Dasar HTML 5 S u p p o r t e d b y : [ C y b e r 4 r t C r e w ] [ H I G r o u p o n F a c e b o o k ] r00t@cyber4rt:~# It s all about 4rt, not how smart you are [ H I F a n s P a g e ] 1 1 / 2
Cara Membuat website dengan Dreamweaver
Cara Membuat website dengan Dreamweaver Pajrin Wurika Sahara [email protected] Abstrak Dreamweaver adalah software aplikasi desain web visual yang biasa dikenal dengan istilah WYSIWYG What You See
Sejarah HTML5. Abstrak. Pendahuluan. Reni Resiani Sunmaryati
Sejarah HTML5 Reni Resiani Sunmaryati [email protected] Abstrak HTML5 adalah suatu spesifikasi sebagai hasil perbaikan dari standard HTML sebelumnya yang dikeluarkan oleh W3C (World Wide Web Consortium)
Modul Web Design. Dosen: Nofiyati, S.Kom, M.Kom Program Studi Teknik Informatika Universitas Jenderal Soedirman
Modul Web Design Dosen: Nofiyati, S.Kom, M.Kom Program Studi Teknik Informatika Universitas Jenderal Soedirman Materi: Pertemuan ke- Materi 1, 2 & 3. Konsep Dasar Web Design: Perencanaan WebSite Typografi,
Triswansyah Yuliano
Mendesain Menu dengan CSS Triswansyah Yuliano [email protected] http://triswan.wordpress.com Lisensi Dokumen: Seluruh dokumen di IlmuKomputer.Com dapat digunakan, dimodifikasi dan disebarkan
XHTML dan Dasar-dasar CSS XHTML
XHTML dan Dasar-dasar CSS Pemrograman Web Rosa Ariani Sukamto Email: [email protected] Blog: http://udinrosa.wordpress.com Website: http://www.gangsir.com XHTML Extensible Hypertext Markup Language
BAB III LANDASAN TEORI. Pengertian sistem menurut Jogianto (2005 : 2) mengemukakan
BAB III LANDASAN TEORI 3.1 Pengertian Sistem Informasi Pengertian sistem menurut Jogianto (2005 : 2) mengemukakan bahwa sistem adalah kumpulan dari elemen-elemen yang berinteraksi untuk mencapai suatu
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
Modul 10 DreamWeaver MX Suendri, S.Kom
Modul 10 DreamWeaver MX 2004 Suendri, S.Kom -- Untuk Indonesia Tanah Air Tercinta -- Suendri, S.Kom 2 Lisensi Dokumen Seluruh isi dokumen ini dapat digunakan, dimodifikasi dan disebarluaskan secara luas
MEMBUAT WEBSITE SEDERHANA DENGAN HTML 5
MEMBUAT WEBSITE SEDERHANA DENGAN HTML 5 NELI WIDI ASTUTI [email protected] Abstrak Pada kesempatan ini saya akan mencoba menjelaskan tentang membuat website sederhana dengan HTML 5 dan CSS 3,
BAB III Validasi HTML5
1 Modul Praktikum Pemprograman Web BAB III Validasi HTML5 A. Tujuan Memahami konsep dasar active web page, Mampu menghasilkan halaman web yang interaktif, Mampu memanfaatkan validasi data menggunakan HTML5.
Pengenalan Script. Definisi HTML
1 Pengenalan Script Pada bab ini akan dibahas bahasa script yang dapat digunakan untuk membuat halaman web. Untuk dapat membuat halaman web bahasa script pertama yang harus anda kenal adalah HTML. HTML
CSS (Cascade Style Sheet)
CSS (Cascade Style Sheet) CSS merupakan bahasa (script) yang digunakan untuk mengatur tampilan suatu dokumen yang ditulis dalam bahasa markup / markup language. Jika kita berbicara dalam konteks web, bisa
Pengenalan Dasar HTML 5. Author : Minarni, S.Kom.,MM Universitas Darwan Ali Sampit - KALTENG
Pengenalan Dasar HTML 5 Author : Minarni, S.Kom.,MM Universitas Darwan Ali Sampit - KALTENG HTML adalah bahasa standar untuk membuat halaman Web HTML (Hypertext Markup Language) adalah suatu bahasa yang
BAB 2 LANDASAN TEORI. 2.1 Sekilas Tentang Sistem Ujian Konevensional
BAB 2 LANDASAN TEORI 2.1 Sekilas Tentang Sistem Ujian Konevensional Dalam ujian konvensional,ada beberapa hal yang harus dipenuhi agar ujian bisa dilaksanakan secara layak. Hal yang utama adalah kertas.
6. HTML & CSS. PTI15010 Pemrograman Web. Agi Putra Kharisma, S.T., M.T. Genap 2014/2015. Desain slide ini dadaptasi dari University of San Fransisco
6. HTML & CSS PTI15010 Pemrograman Web Agi Putra Kharisma, S.T., M.T. Genap 2014/2015 Desain slide ini dadaptasi dari University of San Fransisco HTML, CSS, JavaScript HTML (Struktur Dokumen) CSS (Tampilan
C. Ms Powerpoint D. Notepad E. Ms Acces
1. Apakah kepanjangan dari HTML? A. Hyper Text Mark Up Language B. Hyper Text Mark Language C. Hight Text Mark Up Language D. Hight Text Mark Language 2. Berikut ini adalah termasuk Software Browser, Kecuali:
DESAIN WEB STATIS DAN HTML. Dahlan Abdullah Website :http://dahlan.unimal.ac.id
DESAIN WEB STATIS DAN HTML Dahlan Abdullah Email : [email protected] Website :http://dahlan.unimal.ac.id HALAMAN WEB KONSEP DASAR DAN TEKNOLOGI WEB World Wide Web secara luas lebih dikenal dengan istilah
UAS (Pemrograman Web Statis) Oleh : N.I.M : : Reza Bayu Permana : Teknik Informatika Mata Kuliah : Pemrograman Web Statis
UAS (Pemrograman Web Statis) Oleh : N.I.M : 12141378 Nama : Reza Bayu Permana Prodi : Teknik Informatika Mata Kuliah : Pemrograman Web Statis SEKOLAH TINGGI MANAGEMEN INFORMATIKA DAN ILMU KOMPUTER EL-RAHMA
Percobaan 1 : Mengatur Width Dan Height Hasil :
Percobaan 1 : Mengatur Width Dan Height Analisa : Terlihat di atas kalau width dan height dari tag dan berbeda sesuai value yang telah diinputkan yang bias dibedakan dengan background-color
LAPORAN RESMI PRAKTIKUM PEMROGRAMAN WEB PHP INTRODUCTION
LAPORAN RESMI PRAKTIKUM PEMROGRAMAN WEB PHP INTRODUCTION DISUSUN OLEH : ANASTASIA DEWANTI PRATAMA PUTRI 2110141008 3 D4 TEKNIK INFORMATIKA A POLITEKNIK ELEKTRONIKA NEGERI SURABAYA TAHUN AJARAN 2016/2017
HyperText Markup Language
1 HyperText Markup Language HTML merupakan sebuah bahasa Markup yang digunakan untuk mendeskripsikan dokumen/halaman Web. Bahasa Markup terdiri dari sekumpulan tag markup. Dokumen/halaman HTML dideskripsikan
Pemrograman Web PRAKTIKUM 3 CSS. TUJUAN BELAJAR Mahasiswa dapat menggunakan css untuk mengatur gaya tampilan elemenhtml
PRAKTIKUM 3 CSS TUJUAN BELAJAR Mahasiswa dapat menggunakan css untuk mengatur gaya tampilan elemenhtml MATERI Sintaks CSS, cara memakai CSS, jenis-jenis selektor, satuan ukuran, satuan warna, properti
BAB II LANDASAN TEORI
BAB II LANDASAN TEORI 2.1 Perancangan Basidata ( Database Design ) Proses perancangan database merupakan bagian dari micro lifecycle. Sedangkan kegiatan-kegiatan yang terdapat di dalam proses tersebut
BAB 2 LANDASAN TEORI
BAB 2 LANDASAN TEORI 2.1 Pengertian Komputer Komputer (computer) berasal dari bahasa latin computare yang berarti menghitung. Komputer mempunyai arti yang sangat luas dan berbeda untuk orang yang berbeda.
Modul Praktikum Web Statis Disusun : Wahyu Widodo, S.Kom.,M.Kom
Modul Praktikum Web Statis Disusun : Wahyu Widodo, S.Kom.,M.Kom Pertemuan 1 Point Pembahasan : Feature baru HTML5 Attribut Element Element Semantik Mengenal HTML 5 HTML5 memperkenalkan sejumlah elemen
CSS. inheritance (pewarisan)
{CSS} lanjut CSS inheritance (pewarisan) sebuah elemen mewarisi beberapa nilai dari properti yang dimiliki oleh elemen parent-nya http://www.w3.org/tr/css21/cascade.html#inheritance http://www.slideshare.net/diniscorreia/htmlcss-3-introduction-to-css
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
2011 Ahmad Amarullah
1 Silabus Mata Kuliah Program Studi : Sistem Informasi Kode Mata Kuliah : Nama Mata Kuliah : Komputer Aplikasi IT ( XHTML & CSS ) Jumlah SKS : 2 SKS Semester : 1 Deskripsi Mata Kuliah : Mata kuliah ini
BAB 2 TINJAUAN PUSTAKA. : Multi sistem operasi, bisa Windows, Linux, Mac OS, maupun Solaris
BAB 2 TINJAUAN PUSTAKA 2.1 XAMPP XAMPP merupakan singkatan dari : X A M P P : Multi sistem operasi, bisa Windows, Linux, Mac OS, maupun Solaris : Apache HTTP Server : MySQL Database Server : PHP Scripting
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
BAB 2 LANDASAN TEORI. 2.1 Pengertian Sistem, Informasi dan Sistem Informasi
7 BAB 2 LANDASAN TEORI 2.1 Pengertian Sistem, Informasi dan Sistem Informasi 2.1.1 Sistem Sistem berasal dari bahasa Latin (systēma) atau bahasa Yunani (sustēma) yang berarti suatu kesatuan yang terdiri
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
BAB III LANDASAN TEORI
BAB III LANDASAN TEORI 3.1 Fotografi Amir Hamzah Sulaeman mengatakan bahwa fotografi berasal dari kata foto dan grafi yang masing-masing kata tersebut mempunyai arti sebagai berikut: foto artinya cahaya
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.
MODUL 2 HTML. (HyperText Mark-Up Language)
MODUL 2 HTML (HyperText Mark-Up Language) STIMIK Laboratorium Komputer PPKIA Pradnya Paramita Malang Pertemuan 2 2.1 Tujuan : 1. Mahasiswa dapat memahami dan mengenai perintah perintah HTML 2. Mahasiswa
Dasar Pemrograman Web. Pemrograman Web. Adam Hendra Brata
Dasar Pemrograman Web Pemrograman Web Adam Hendra Brata Konsep Dasar Desain Web HTML CSS HTML HTML (HyperText Markup Language) Bahasa standar yang digunakan untuk menampilkan document web. Mengontrol tampilan
CSS Cascading Style Sheet
CSS Cascading Style Sheet Pengenalan CSS CSS adalah singkatan dari Cascading Style Sheets CSS (Cascading Style Sheet) digunakan untuk melengkapi file HTML, dan tugas utamanya adalah menetapkan aturan tampilan/style
MODUL PRAKTIKUM PEMROGRAMAN INTERNET
MODUL PRAKTIKUM PEMROGRAMAN INTERNET PENANGANAN FORM DALAM HTML DAN STYLE SHEET (CSS) DISUSUN OLEH : Astrid Lestari Tungadi, S.Kom FAKULTAS TEKNOLOGI INFORMASI UNIVERSITAS ATMA JAYA MAKASSAR 2014 FORM
Materi 1 Komputer Aplikasi IT (KAIT) 2 SKS Semester 1 S1 Sistem Informasi UNIKOM 2014 Nizar Rabbi Radliya [email protected]
Materi 1 Komputer Aplikasi IT (KAIT) 2 SKS Semester 1 S1 Sistem Informasi UNIKOM 2014 Nizar Rabbi Radliya [email protected] Nama Mahasiswa NIM Kelas Memahami cakupan materi dan sistem perkuliahan
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
Dasar Pemrograman Web. Pemrograman Web. Adam Hendra Brata
Dasar Pemrograman Web 2 Pemrograman Web Adam Hendra Brata Teknologi Client Server Konsep Dasar Desain Web Teknologi Client Server Arsitektur Client Server Model komunikasi yang terdiri server sebagai pemberi
Pengenalan HTML dan CSS
Pengenalan HTML dan CSS Pengenalan HTML dan CSS Jubilee Enterprise PENERBIT PT ELEX MEDIA KOMPUTINDO Pengenalan HTML dan CSS Jubilee Enterprise 2016, PT Elex Media Komputindo, Jakarta Hak cipta dilindungi
BAB 2 TINJAUAN PUSTAKA. memerlukan Jaringan Internet. Namun Tentu saja filenya berada di komputer
BAB 2 TINJAUAN PUSTAKA 2.1. Cloud Storage Cloud Storage Merupakan Media Penyimpanan yang dalam pengaksesannya memerlukan Jaringan Internet. Namun Tentu saja filenya berada di komputer dimana kita harus
BAB IV CASCADING STYLE SHEET (CSS)
BAB IV CASCADING STYLE SHEET (CSS) A. KOMPETENSI DASAR Memahami jenis dan struktur dasar dokumen CSS dan CSS3. Mampu memanfaatkan CSS untuk memformat dokumen HTML. Mampu memanfaatkan pendekatan CSS untuk
HTML5 Komplet. Jubilee Enterprise PENERBIT PT ELEX MEDIA KOMPUTINDO
HTML5 Komplet HTML5 Komplet Jubilee Enterprise PENERBIT PT ELEX MEDIA KOMPUTINDO HTML5 Komplet Jubilee Enterprise 2017, PT. Elex Media Komputindo, Jakarta Hak cipta dilindungi undang-undang Diterbitkan
PEMROGRAMAN WEB 1 CSS
PEMROGRAMAN WEB 1 CSS RIO ANDRIYAT KRISDIAWAN, M.KOM Definisi CSS CSS adalah kepanjangan dari Cascading Style Sheet dan digunakan para web designer untuk mengatur style elemen yang ada didalam halaman
CSS Cascading Style Sheet
CSS Cascading Style Sheet Pemrograman Web 1 Genap 2011-2012 CSS Lanjut CSS Dimension Berfungsi untuk mengatur panjang dan lebar dari sebuah elemen HTML. contoh: height:100px; width:200px; Nilai/ value:
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
CSS RANDY CAHYA WIHANDIKA, S.ST., M.KOM
CSS RANDY CAHYA WIHANDIKA, S.ST., M.KOM CSS Cascading Style Sheet Bahasa yang digunakan untuk mengatur tampilan dan format dari dokumen markup (HTML) CSS didesain untuk memisahkan antara dokumen yang mendeskripsikan
CSS (Cascading Style Sheet) Oleh : Devie Rosa Anamisa
CSS (Cascading Style Sheet) Oleh : Devie Rosa Anamisa Pembahasan Pengertian CSS CSS (FONT, TEXT, COLOR) CSS - Image PENGERTIAN CSS Singkatan dari Cascading Style Sheet Digunakan dalam kode HTML untuk menciptakan
Interactive Broadcasting
Modul ke: Interactive Broadcasting HTML Fakultas Ilmu Komunikasi Bagus Rizki Novagyatna Program Studi Broadcasting www.mercubuana.ac.id Pengertian HTML Program adalah kata, ekspresi, pernyataan atau kombinasi
Cara membuat HTML dasar
Cara membuat HTML dasar Oleh : Ronaldo Fantoni 11 IPA /12 1. Struktur dasar HTML HTML (Hypert Text Markup Language) merupakan bahasa pemrograman yang digunakan dalam pembuatan halaman web. Dalam penggunaannya
BAB II LANDASAN TEORI
BAB II LANDASAN TEORI 2.1 PHP PHP adalah script bersifat server-side yang ditambahkan ke dalam HTML. Kelebihan PHP yang paling signifikan adalah kemampuannya untuk melakukan koneksi dengan berbagai macam
PENGANTAR KOMPUTER DAN TI 2C
PENGANTAR KOMPUTER DAN TI 2C PERTEMUAN 4 Peg. Komp & TI 2C M4 HyperText Markup Language (HTML) Sebuah bahasa markup yang digunakan untuk membuat sebuah halaman web dan menampilkan berbagai informasi di
Komunikasi Multimedia
Komunikasi Multimedia Modul ke: Fakultas Ilmu Komunikasi Teknik Lanjutan Corporate Website: HTML Editing dengan Macromedia Dreamweaver MX Anindita, S.Pd, M.Ikom Program Studi Public Relations www.mercubuana.ac.id
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
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
BAB 2 LANDASAN TEORI
BAB 2 LANDASAN TEORI 2.1 Pengertian Sistem Informasi Menurut John F. Nash Sistem Informasi adalah kombinasi dari manusia, fasilitas atau alat teknologi, media, prosedur dan pengendalian yang bermaksud
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.
sebuah bahasa markup yang digunakan untuk membuat sebuah halaman web dan menampilkan berbagai informasi di dalam sebuah browser Internet.
HTML (Hyper Text Markup Language) adalah sebuah bahasa markup yang digunakan untuk membuat sebuah halaman web dan menampilkan berbagai informasi di dalam sebuah browser Internet. HTTP Singkatan dari Hypertext
PEMROGRAMAN BERBASIS WEB. Part 1,2 HTML. By Rolly Yesputra Sekolah Tinggi Manajemen Informatika dan Komputer Royal Kisaran, 2018
PEMROGRAMAN BERBASIS WEB Part 1,2 HTML By Rolly Yesputra Sekolah Tinggi Manajemen Informatika dan Komputer Royal Kisaran, 2018 Referensi HTML5, JavaScript, and jquery 24-Hour Trainer, Copyright 2015 by
Pemrograman Web Sisi Client Pertemuan 3 PI
Pemrograman Web Sisi Client Pertemuan 3 PI Oleh : Hasanuddin, S.T. Program Studi Teknik Informatika Fakultas Teknologi Industri Universitas Ahmad Dahlan Yogyakarta Topik Pendahuluan HTML CSS JavaScript
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 6 CSS3 Tujuan: Mahasiswa mengenal komponen CSS 3 sebagai pelengkap element HTML dalam membangun website statis. Pustaka:» HTML dan XML Edisi 2: Betha
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 [email protected] liyantanto.wordpress.com Pendahuluan HTML adalah sebuah bahasa markup yang digunakan untuk membuat
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
MODUL PRAKTIKUM PEMROGRAMAN WEB (DASAR)
MODUL PRAKTIKUM PEMROGRAMAN WEB (DASAR) MATERI KULIAH SEMESTER 3 D3 TEKNIK INFORMATIKA STMIK AMIKOM YOGYAKARTA 2009 Disusun Oleh : ANGGIT DWI HARTANTO, S.KOM MODUL II CASCADING STYLE SHEET (CSS) I. PENGERTIAN
TUTORIAL CODEIGNITER Langkah Tepat menjadi Web Developer Handal, menguasai CodeIgniter, jalan membuat aplikasi berbasis website lebih mudah
TUTORIAL CODEIGNITER Langkah Tepat menjadi Web Developer Handal, menguasai CodeIgniter, jalan membuat aplikasi berbasis website lebih mudah www.ilmuwebsite.com Bagian 7. Membuat Data Pagination Menggunakan
LAPORAN RESMI. Boxes
LAPORAN RESMI Boxes Dosen Pembimbing : Dwi Susanto,ST, MT Oleh Hamidah Nur Hidayati 4103131038 PROGRAM STUDI TEKNOLOGI MULTIMEDIA BROADCASTING DEPARTEMEN MULTIMEDIA KREATIF POLITEKNIK ELEKTRONIKA NEGERI
DASAR-DASAR CSS DASAR-DASAR CSS By: Rohi Abdulloh A. PENGENALAN
DASAR-DASAR CSS DASAR-DASAR CSS 2015 A. PENGENALAN CSS merupakan kependekan dari Cascading Style Sheet yaitu suatu skrip yang digunakan untuk mempercantik tampilan HTML atau mengatur bagaimana elemen HTML
DAFTAR ISI DAFTAR ISI... 1 KATA PENGATAR... 2 BAB I PENDAHULUAN Latar Belakang Rumusan Masalah Tujuannya...
DAFTAR ISI COVER DAFTAR ISI... 1 KATA PENGATAR... 2 BAB I PENDAHULUAN... 3 1.1 Latar Belakang... 3 1.2 Rumusan Masalah... 3 1.3 Tujuannya... 3 BAB II PEMBAHASAN... 4 2.1 Pengertian CSS... 4 2.2 Format
Bab 5. Cascading Style Sheet (CSS)
Bab 5. Cascading Style Sheet (CSS) Overview Cascading Style Sheets (CSS) adalah suatu bahasa stylesheet yang digunakan untuk mengatur tampilan sebuah dokumen yang ditulis dalam bahasa markup. CSS diperkenalkan
BAB 2 LANDASAN TEORI
BAB 2 LANDASAN TEORI 2.1 Pengertian Sistem Informasi Pada dasarnya sistem informasi merupakan suatu sistem yang dibuat oleh manusia yang terdiri dari komponen komponen dalam organisasi untuk mencapai suatu
Pemrograman Web Teknik Informatika Fakultas Teknologi Industri
22 Pengantar PHP PHP merupakan sebuah bahasa scripting yang dibundel dengan HTML, yang dijalankan di sisi server. Sebagian besar perintahnya berasal dari C, Java dan Perl dengan beberapa tambahan fungsi
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
Modul Praktikum Desain Web 2015
MODUL 1 DASAR-DASAR HTML A. TUJUAN PRAKTIKUM Melalui praktikum Dasar-dasar HTML, diharapkan mahasiswa dapat memiliki kompetensi, antara lain: 1. Memahami struktur dasar dokumen HTML. 2. Membuat dokumen
HTML Uncover. Duniailkom Duniailkom
HTML Uncover Duniailkom 2015 Duniailkom Contents 1. Berkenalan Dengan HTML (Contoh Bab 1)....................... 1 1.1 Pengertian HTML................................... 1 1.2 Fungsi HTML.....................................
BAB III LANDASAN TEORI. sedemikian rupa sehingga komputer dapat memproses input menjadi output.
BAB III LANDASAN TEORI 3 3.1 Definisi Aplikasi Aplikasi menurut Hartono (1999:12), adalah penggunaan dalam suatu komputer,instruksi(instruction) atau pernyataan (statement) yang disusun sedemikian rupa
Pemrograman Basis Data Berbasis Web
Pemrograman Basis Data Berbasis Web Pertemuan Ke-2 (HTML) Noor Ifada [email protected] S1 Teknik Informatika - Unijoyo 1 Sub Pokok Bahasan HTML? Istilah-istilah dalam HTML Tag Utama dalam struktur
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
Bahasa Pemrograman Untuk Pembuatan Web
Bahasa Pemrograman Untuk Pembuatan Web Iman Amalludin [email protected] :: http://blog.imanllusion.hostzi.com Abstrak Bahasa Pemrograman (Programming Language). Apa itu? Bahasa Pemrograman adalah
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
Design Web Dengan 2 Kolom
Design Web Dengan 2 Kolom Muh Hasan Tanjung [email protected] Lisensi Dokumen: Seluruh dokumen di IlmuKomputer.Com dapat digunakan, dimodifikasi dan disebarkan secara bebas untuk tujuan bukan komersial
Cara Mudah Mengedit Cascading Style Sheet (CSS)
Cara Mudah Mengedit Cascading Style Sheet (CSS) Riska Islaminati [email protected] :: http://www.komputeran.com/2012/04/cara-mudahmengedit-cascading-style.html Abstrak CSS salah satu teknik
MODUL VII PENGATURAN TAMPILAN DOKUMEN
MODUL VII PENGATURAN TAMPILAN DOKUMEN 7.1 Paragraf Elemen menandai serta melatakkan sekumpulan teks sebagai suatu paragraf. Tag menyatakan awal dari paragraf, sedangkan tag menyatakan
BAB V DESAIN WEB CSS
BAB V DESAIN WEB CSS A. KOMPETENSI DASAR Memahami konsep dan strategi desain web yang rapi berbasis HTML dan CSS/CSS3. Mampu mengoptimalkan fitur-fitur CSS dalam desain web. Mampu memanfaatkan pendekatan
CSS Cascading Style Sheet
CSS Cascading Style Sheet Pemrograman Web 1 Genap 2011-2012 Pengenalan CSS CSS = Cascading Style Sheet. Suatu style yang digunakan untuk menampilkan elemen HTML. Dapat mengatur dan mengontrol tampilan
BAB II TINJAUAN PUSTAKA. Sistem adalah jaringan kerja dari prosedur-prosedur yang saling berhubungan,
5 BAB II TINJAUAN PUSTAKA 2.1 Pengertian Sistem Sistem adalah jaringan kerja dari prosedur-prosedur yang saling berhubungan, berkumpul bersama-sama guna melakukan suatu pekerjaan untuk memcapai suatu tujuan
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
BAB II LANDASAN TEORI
BAB II LANDASAN TEORI 2.1 Sistem Informasi 2.1.1 Sistem Sistem adalah sekelompok elemen-elemen yang terintegrasi dengan tujuan yang sama untuk mencapai tujuan. Organisasi terdiri dari sejumlah sumber daya
MODUL 1 STYLE SHEET UNTUK TAMPILAN DASAR
MODUL 1 STYLE SHEET UNTUK TAMPILAN DASAR PENDAHULUAN Setelah semua yang Anda ketahui tentang dasar pembuatan halaman Web dalam perkuliahan sebelumnya, kini tiba saatnya untuk membuat halaman web Anda tampil
