Lecture 1
- 1. Instructors: Ahmad Ali Ali Ahmad Malik
- 2. About the Course ….. Basic Web Development Course Simple Static to Dynamic Website making Link: https://sites.google.com/site/phpwebdevelopmentcourse2 012/ Will do Design + Development Assignments & Activities Participation Discipline !!! NO eating, Mobile phones ….
- 3. Web Development… What is Web Development ?? web site for the Internet (World Wide Web) How it Works !! http://www.google.com http://www.google.com Web Hosting Servers
- 4. Web Development… Components Needed to Build a Complete Website 1) Text Editor 2) Browser 3) Server 4) DataBase (Dynamic Websites)
- 5. HTML,CSS, PHP & MySQL •HTML •CSS •JavaScript etc. •PHP •ASP etc. •SQL Quries
- 6. Hyper Text Markup Language
- 7. Structure <html> </html> Parts HTML HEAD BODY <head> // All the code related to headers… </head> <body> // All the code related to body… </body>
- 8. HTML Tags Text tags Related to typography, paragraphs, breaks, text formatting. Image tags Link tags Table Forms
- 9. Some Text Tags <h1></h1> <h2></h2> <h3></h3> <h4></h4> <b></b> <i></i> <br></br> <q></q> <em></em> <strong></strong> <acronym></acrony m> <abbr></abbr> <pre></pre>
- 10. List Tags 3 Types of List mainly used: 1) Ordered List 2) Unordered List 3) Definition List <ul type = “circle”> <li>Item One</li> <li>Item Two</li> </ul> <ol type = “A”> <li>Item One</li> <li>Item Two</li> </ol> <dl > <dt>Term One</dt> <dd>Any definition</dd> </dl>
- 11. Image Tags <img></img> Two attributes Source - “src” Alternate – “alt” <img src = “myImage.jpg” alt =“ A text info of the image”> </img>
- 12. Link Tags Inline Tag Syntax <a href = “http://www.google.com” title = “google Homepage” > </a> Relative links Base links: <base href = “ ”> </base> (head section)
- 13. Table Tags Used for displaying data Attributes e.g. border, align etc. <table> <tr> <th>Heading</th> </tr> <tr> <td>Heading</td> </tr> </table>
- 14. <form method = “post” action = “”> Forms Tags Used for interaction of data from/to server side. Used along with form elements like checkboxes, textboxes etc. //use form element e.g. buttons, textbox etc. </form> Label <label>some label</label> Text Field <input name = “input Text” type = “Text”></input> Button <input type = “submit” value = “AnyButtonValue“></input> Radio Box <input name=“radioName” type =“radio” value = “AnyValue”></input>
Editor's Notes
- #3: Class Environment