180 likes | 347 Views
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).
E N D
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) 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.
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.
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
HTML Basics • Basic structure of an HTML document • <!DOCTYPE html> • <html>...</html> • <head>...</head> • <body>...</body> • Tags are nested inside each other
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.
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….
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
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.
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/
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