In Week 6 we will look at basic Web technologies as we work on our Community Project:
- Client:
- Browser on computers and mobile devices
- Sends Request for a URL (Uniform Resource Locator – expects to get HTML back
- Browsers all know how to read HTML
- Executes Client-Side code: Many Websites rely on the Browser’s ability to execute JavaScript
- Server:
- Runs Web Server software (IIS on Windows, Apache, etc. that “Serves” up the Web pages
- Sends Response as HTML to the Browser
- Hosts and executes Server-side code modules
- Code can be in PHP, Java, C# (ASP.NET), etc.
- Hosts images and scripts for the site
- May host HTML pages but the HTML Response could also be generated “on the fly” by the code
- HTML
- Hypertext Markup Language
- Determines structure of the page layout
- Basic structure of an HTML page
- HTML <html></html> outer wrapper for the whole page
- Head: contains metadata and title; note that the title appears on the tabs in browser <head><title>My Web Site</title></head>
- Body: <body></body> precedes the closing </html> tag; contains the content for the page. Content within the body can be structured with other tags, like <h1> for header, <p> for paragraph.
- Each tag has to have a matching closing tag
- CSS
- Cascading Style Sheet
- Determines appearance of the page
- Defines style attributes for specific tags or specific named items on a page or site
- Can also define style for a class of items (more on this later…)
- View Source/Developer’s Tools
- Usually an option from the Browser’s shortcut menu: “View Source” or “View Page Source” allows you to see the actual HTML
- Developer’s Tools: allows you to see much more of the structure of the site, including the CSS, scripts, etc. You can try out and preview some modifications here as well
Fox Valley Girls Coding Club 