CCOG for CIS 195H Fall 2024
- Course Number:
- CIS 195H
- Course Title:
- HTML and CSS
- Credit Hours:
- 4
- Lecture Hours:
- 30
- Lecture/Lab Hours:
- 0
- Lab Hours:
- 30
Course Description
Covers the creation of static web content using the latest versions of HyperText Markup Language (HTML) and Cascading Style Sheets (CSS). Includes the structure and syntax of HTML, commonly used block and inline HTML elements, hypertext links, forms, web project and website structure, navigation, and version control. Also includes CSS syntax, commonly used style properties, the CSS box model, and Responsive Design. Prerequisites: WR 115, RD 115 and MTH 20 or equivalent placement test scores. Audit available.
Intended Outcomes for the course
Upon completion of the course students should be able to:
- Structure static website content using HyperText Markup Language (HTML).
- Format content using Cascading Style Sheets (CSS).
- Create navigational and resource links between pages and assets for multi-page websites.
- Represent multi-page websites as separate files with shared content across pages, using appropriate file naming, directory structure, and version control.
- Apply the principles of Mobile First and Responsive Design to web pages and websites.
Course Content (Themes, Concepts, Issues and Skills)
Outcome: Structure static website content using HyperText Markup Language (HTML5).
- Basic Markup syntax and structure.
- Basic page structure (!DOCTYPE, html, head, body).
- Structural elements (header, main, footer, aside).
- Head elements (title, meta, script, link).
- Body elements (table, div, p, li, ul, ol, img).
- Form elements (form, button, input, label, option, select).
- Hyperlinking (anchor tags, link hrefs, img srcs).
- Tag attributes.
- Correct syntax and formatting standards based on a set of industry standard style guidelines.
- Use appropriate browser developer tools for debugging and testing style and markup.
Outcome: Format content using Cascading Style Sheets (CSS).
- Inline style properties.
- Embedded, and external style sheets.
- Selector types and uses.
- Common style properties and syntax (margin, padding, color, vertical-align, background-color, etc.).
- CSS Box model.
- Cascading nature of style properties based on hierarchical structure of HTML content.
- Style property precedence.
- Responsive page display using @media.
- Mobile-first design.
- Correct syntax and formatting standards based on a set of industry standard style guidelines.
- Use appropriate browser developer tools for debugging and testing style and markup.
Outcome: Create navigational and resource links between pages and assets for multi-page web sites.
- Create directories and files.
- Understand and use relative and absolute file paths.
- Structuring assets and resources in appropriately named directories.
- Follow web standard file and folder naming conventions, including proper escaping of special characters in URLs.
Outcome: Represent multi-page web sites with shared content across pages using appropriate project structure and version control systems.
- File system directory structure
- FTP
- Text editting
- URLs, hypertext references, href and src attributes
- <a>, <link>, <script>, <style>, <img> tags
Outcome: Apply the principles of Mobile First and Responsive Design.
- @media CSS at-rules and media queries
- Fluid grids
- Flexible images
- Responsive layout
- Mobile First vs. Progressive Enhancement