1 / 18

XAMPP and HTML

XAMPP and HTML. MIS 3501, 2014 Fall Jeremy Shafer Department of MIS Fox School of Business Temple University August 28, 2014. An Illustration (end User, reading a web page). URL, referencing a .html page. HTTP Response. An Illustration (developer, working remotely).

cora-briggs
Download Presentation

XAMPP and HTML

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. XAMPP and HTML MIS 3501, 2014 Fall Jeremy Shafer Department of MIS Fox School of Business Temple University August 28, 2014

  2. An Illustration (end User, reading a web page) URL, referencing a .html page HTTP Response

  3. An Illustration (developer, working remotely) Upload his / her work via sftp (port 22) XAMPP installed locally. Use it to store and test your work until it is ready to be sent to the server.

  4. An Illustration (developer, working remotely) Upload his / her work via sftp (port 22) XAMPP installed locally. Use it to store and test your work until it is ready to be sent to the server. Here we need to know where the wwwroot folder is. Here we need to know where the htdocs folder is.

  5. HTML Basics • HTML: HyperText Markup Language • Language for displaying web pages • Consists of tags and content; content is enclosed tags • Why we do we need to know HTML? • To build a foundation for PHP programming • PHP is embedded in HTML • Results of PHP are always returned in HTML format

  6. HTML Basics • Basic structure of an HTML document • <!DOCTYPE html> • <html>...</html> • <head>...</head> • <body>...</body> • Tags are nested inside each other

  7. HTML … a simple template

  8. HTML Basics • Tag surrounds content and apply meaning to it • <p>...</p> • <div> … </div> • <h1>...</h1> • <br> • <hr> • <a> … </a> • <em> … </em> • Let’s try these out.

  9. HTML Forms The <form> </form> tags hold form elements. • The form elements are also tags • The form element tags are nested inside the form tag. So….

  10. HTML source gets interpreted by the browser

  11. Looking more closely at a very simple form.

  12. HTML Labels • Form elements should have labels. • Labels are good for: • Making your form accessible to persons with disabilities • Applying styles (CSS) to your form elements PHP Programming with MySQL, 2nd Edition

  13. A better HTML form example

  14. HTML Tables Tables can be used to present any data in a grid. The <table> tag contains rows. The <tr> tag represents a row. The row tag contains <td> or <th> tags. The <th> tag represents a table header cell. The <td> tag represents a table data cell. Again, there’s nesting going on. Data tags nested inside row tags, row tags nested inside the table tag.

  15. So this, gets interpreted as….

  16. This

  17. Finding HTML Errors… Firefox has a “View Source” feature that will reveal HTML source code with the HTML errors highlighted in red. There is also a very useful FireFox plugin called WAVE that can be found here http://wave.webaim.org/toolbar/

  18. Recommended reading • Basics • Tutorial: http://www.w3schools.com/html • Quick list: http://www.w3schools.com/html/html_quick.asp • HTML forms • http://www.w3schools.com/html/html_forms.asp • http://www.w3schools.com/tags/tag_label.asp • HTML tables • http://www.w3schools.com/html/html_tables.asp

More Related