PEMROGRAMAN WEB Indra Gunawan, ST., M.Kom., CEH., CHFI
Curiculum Vitae Pendidikan : S1 Teknik Informatika, Minat Studi Kecerdasarn Buatan, 2007, Universitas Islam Indonesia Yogyakarta Skripsi : Membuat Aplikasi Algoritma Genetika utk menyelesaikan Knapsack Problem menggunakan Vb.Net S2 Teknik informatika, Minat Studi Digital Forensic, 2014, Cumlaude, Universitas Islam Indonesia Yogyakarta Thesis : Membangun Aplikasi I-Polink (Indonesian Police Link) yaitu Knowledge Management untuk membantu investigasi forensika digital pada Laboratorium Digital Forensic Mabes Polri. Pengalaman Kerja : Software Konsultan +- 4 tahun, 2011, Jakarta dan Batam, telah melakukan implementasi di +- 30 an perusahaan di Jakarta, Bandung, Denpasar, Pekanbaru dan Batam. Founder of Ex-java Technologies, 2011-2012, Batam, mempunyai client di pemerintahan, perusahaan lokal maupun perusahaan asing di Batam. International Certification: Computer Ethical Hacking, ECCouncil. Computer Hacking Forensic Investigator, ECCouncil. Cisco Networking Academy Program, Cisco.
CONTACT PERSON Email : Igunawan@stt-ibnusina.ac.id HP / WA : 0857 66666 148 PIN : 7EC491F9 Blog : http://digital4rainsick.wordpress.com Modul silahkan download di KelasOnline/Elearning
ATURAN DAN PENILAIAN Syarat Ujian UTS : Kehadiran 50% Syarat Ujian UAS : Kehadiran 50% Range Nilai : Unsur Penilaian : Kehadiran : 20% Tugas : 30% UTS : 25% UAS : 25% 86-100 = A 71-85 = B 56-70 = C 41 55 = D <= 40 = E
OUTLINE MATERI 1. Introduction 2. Server-side & Client-side programming 3. HTML Language 4. CSS Cascading Style Sheets 5. CSS vs Framework CSS 6. PHP Personal Home Page 7. PHP vs Framework PHP 8. CodeIgniter PHP Framework 9. RDBMS MYSQL 10. CMS Content Management System 11. Security Threats 12. Securing www 13. Web Server 14. Hosting & Implementation
REFERENSI http://www.w3schools.com/html http://www.codeigniter.com/user_guide https://en.wikipedia.org/wiki/html
DEFINITION HTML HyperText Markup Language, commonly referred to as HTML, is the standard markup language used to create web pages.[1] Web browsers can read HTML files and render them into visible or audible web pages. HTML describes the structure of a website semantically along with cues for presentation, making it a markup language, rather than a programming language. HTML elements form the building blocks of all websites. HTML allows images and objects to be embedded and can be used to create interactive forms. It provides a means to create structured documents by denoting structural semantics for text such as headings, paragraphs, lists, links, quotes and other items. The language is written in the form of HTML elements consisting of tags enclosed in angle brackets (like <html>). Browsers do not display the HTML tags and scripts, but use them to interpret the content of the page. HTML can embed scripts written in languages such as JavaScript which affect the behavior of HTML web pages. Web browsers can also refer to Cascading Style Sheets (CSS) to define the look and layout of text and other material. The World Wide Web Consortium (W3C), maintainer of both the HTML and the CSS standards, has encouraged the use of CSS over explicit presentational HTML since 1997.[2]
HTML TIMELINE November 24, 1995 HTML 2.0 was published as IETF RFC 1866. Supplemental RFCs added capabilities: November 25, 1995: RFC 1867 (form-based file upload) May 1996: RFC 1942 (tables) August 1996: RFC 1980 (client-side image maps) January 1997: RFC 2070 (internationalization) January 1997 HTML 3.2[15] was published as a W3C Recommendation. It was the first version developed and standardized exclusively by the W3C, as the IETF had closed its HTML Working Group in September 1996.[16] Initially code-named "Wilbur",[17] HTML 3.2 dropped math formulas entirely, reconciled overlap among various proprietary extensions and adopted most of Netscape's visual markup tags. Netscape's blink element and Microsoft's marquee element were omitted due to a mutual agreement between the two companies.[13] A markup for mathematical formulas similar to that in HTML was not standardized until 14 months later in MathML.
HTML TIMELINE December 1997 HTML 4.0[18] was published as a W3C Recommendation. It offers three variations: Strict, in which deprecated elements are forbidden, Transitional, in which deprecated elements are allowed, Frameset, in which mostly only frame related elements are allowed. Initially code-named "Cougar",[17] HTML 4.0 adopted many browserspecific element types and attributes, but at the same time sought to phase out Netscape's visual markup features by marking them as deprecated in favor of style sheets. HTML 4 is an SGML application conforming to ISO 8879 SGML.[19]
HTML TIMELINE April 1998 HTML 4.0[20] was reissued with minor edits without incrementing the version number. December 1999 HTML 4.01[21] was published as a W3C Recommendation. It offers the same three variations as HTML 4.0 and its last errata were published May 12, 2001. May 2000 ISO/IEC 15445:2000[22][23] ("ISO HTML", based on HTML 4.01 Strict) was published as an ISO/IEC international standard. In the ISO this standard falls in the domain of the ISO/IEC JTC1/SC34 (ISO/IEC Joint Technical Committee 1, Subcommittee 34 Document description and processing languages).[22] As of mid-2008, HTML 4.01 and ISO/IEC 15445:2000 were the most recent versions of HTML. Development of the parallel, XML-based language XHTML occupied the W3C's HTML Working Group through the early and mid-2000s.
HTML TIMELINE October 1991 HTML Tags,[6] an informal CERN document listing 18 HTML tags, was first mentioned in public. June 1992 First informal draft of the HTML DTD,[26] with seven[27][28][29] subsequent revisions (July 15, August 6, August 18, November 17, November 19, November 20, November 22) November 1992 HTML DTD 1.1 (the first with a version number, based on RCS revisions, which start with 1.1 rather than 1.0), an informal draft[29] June 1993 Hypertext Markup Language[30] was published by the IETF IIIR Working Group as an Internet-Draft (a rough proposal for a standard). It was replaced by a second version[31] one month later, followed by six further drafts published by IETF itself[32] that finally led to HTML 2.0 in RFC1866
November 1993 HTML TIMELINE HTML+ was published by the IETF as an Internet-Draft and was a competing proposal to the Hypertext Markup Language draft. It expired in May 1994. April 1995 (authored March 1995) HTML 3.0[33] was proposed as a standard to the IETF, but the proposal expired five months later (28 September 1995)[34] without further action. It included many of the capabilities that were in Raggett's HTML+ proposal, such as support for tables, text flow around figures and the display of complex mathematical formulas.[34]
HTML TIMELINE January 2008 HTML5 was published as a Working Draft (link) by the W3C.[38] Although its syntax closely resembles that of SGML, HTML5 has abandoned any attempt to be an SGML application and has explicitly defined its own "html" serialization, in addition to an alternative XML-based XHTML5 serialization.[39] May 2011 On 14 February 2011, the W3C extended the charter of its HTML Working Group with clear milestones for HTML5. In May 2011, the working group advanced HTML5 to "Last Call", an invitation to communities inside and outside W3C to confirm the technical soundness of the specification. The W3C is developing a comprehensive test suite to achieve broad interoperability for the full specification by 2014, which is now the target date for Recommendation.[40]
HTML - SAMPLE CODE <!DOCTYPE html> <html> <head> <title>this is a title</title> </head> <body> <p>hello world!</p> </body> </html> DOCTYPE HTML 4 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/tr/html4/strict.dtd">
HTML STRUCTURE
HTML ELEMENT HEADER <head> <title>the Title</title> </head> HEADING <h1>heading level 1</h1> <h2>heading level 2</h2> <h3>heading level 3</h3> <h4>heading level 4</h4> <h5>heading level 5</h5> <h6>heading level 6</h6>
HTML ELEMENT HEADER <head> <title>the Title</title> </head> HEADING <h1>heading level 1</h1> <h2>heading level 2</h2> <h3>heading level 3</h3> <h4>heading level 4</h4> <h5>heading level 5</h5> <h6>heading level 6</h6>
HTML ELEMENT PARAGRAPH <p>paragraph 1</p> <p>paragraph 2</p> LINE BREAKS <p>this <br> is a paragraph <br> with <br> line breaks</p> LINK <a href="https://www.wikipedia.org/">a link to Wikipedia!</a> COMMENT <!-- This is a comment -->
HTML ELEMENT TABLE <table style="width:100%"> <tr> <td>1</td> <td>eve</td> <td>jackson</td> <td>94</td> </tr> <tr> <td>2</td> <td>john</td> <td>doe</td> <td>80</td> </tr> </table>
FORM <form> First name:<br> <input type="text" name="firstname"> <br> Last name:<br> <input type="text" name="lastname"> </form> HTML ELEMENT
FORM <form> <input type="radio" name="sex" value="male" checked>male <br> <input type="radio" name="sex" value="female">female </form> HTML ELEMENT
FORM <form action="action_page.php"> First name:<br> <input type="text" name="firstname" value="mickey"> <br> Last name:<br> <input type="text" name="lastname" value="mouse"> <br><br> <input type="submit" value="submit"> </form> HTML ELEMENT
HTML ELEMENT FORM METHOD GET <form action="action_page.php" method="get"> POST <form action="action_page.php" method="post"> When to Use GET? action_page.php?firstname=mickey&lastname=mouse
LIST HTML ELEMENT
UNORDERED LIST <ul list-style-type:disc> <li>coffee</li> <li>tea</li> <li>milk</li> </ul> Style list-style-type:disc list-style-type:circle list-style-type:square list-style-type:none HTML ELEMENT Description The list items will be marked with bullets (default) The list items will be marked with circles The list items will be marked with squares The list items will not be marked
ORDERED LIST <ol> <li>coffee</li> <li>tea</li> <li>milk</li> </ol> Type type="1" type="a" type="a" type="i" type="i" Description HTML ELEMENT The list items will be numbered with numbers (default) The list items will be numbered with uppercase letters The list items will be numbered with lowercase letters The list items will be numbered with uppercase roman numbers The list items will be numbered with lowercase roman numbers
HORIZONTAL MENU WITH CSS HTML ELEMENT <!DOCTYPE html> <html><head><style> ul#menu {padding: 0;} ul#menu li {display: inline;} ul#menu li a { background-color: black; color: white; padding: 10px 20px; text-decoration: none; border-radius: 4px 4px 0 0;} ul#menu li a:hover { background-color: orange;}</style></head> <body> <h2>horizontal List</h2> <ul id="menu"> <li><a href="/html/default.asp">html</a></li> <li><a href="/css/default.asp">css</a></li> <li><a href="/js/default.asp">javascript</a></li> <li><a href="/php/default.asp">php</a></li> </ul> </body> </html>