Communication Through the Web

DCI 108

Winter 2021

Credits: 3

Requirements Met: DCI Minor Core

Class Meeting Metadata
Meets: MW 4:00 - 5:35pm Eastern
Classroom: Virtual (Zoom links in Canvas)
Instructor's Metadata
Instructor: Jason T. Mickel, Ph.D.
E-Mail: How to Email a Professor
Phone: (540) 458-8653
Office: Leyburn M33
Office Hours: M 1:00-2:00
T 2:30-3:30
W 11:00-12:00
Or by appointment

Project Deliverable #3: Completed Client Web Page for Desktop and Mobile150 points

Due Wednesday, April 7 @ 11:55pm ET


You have designed your client's web page and justified the choices you have made. Now take the skills you have learned from HTML and CSS and build the complete page for both desktop/laptop computer screens and for mobile devices.


  • Approximately 1,000 words of text used to tell the story (i.e., not including headlines or captions)
  • Logical structure of sections for parts of the story
  • A minimum of five images that enhance the story (i.e., not including icons or other navigational images). Images should be student-generated or from your client rather than be taken from the Internet. Free, royalty-free stock images from the Internet may be used beyond the first five.
  • A minimum of one video or audio clip of at least 10 seconds used to enhance the story
  • Effective use of the above images and media (size, framing, positioning, margins, padding, borders, proper image file format, etc.). Images that are not your own should have attribution within the img tag, within a caption, or at the bottom of the page.
  • A minimum of one HTML table used to display information that sensibly should be communicated in tabular form
  • Good styling of HTML and CSS (proper and consistent indentation, matching open/close tags, no excess tags, no tags outside of head or body, etc.)
  • Adherence to your wireframe and my comments. You may make changes to your submitted design; however, the reasons for the changes should be described briefly in an attached document.
  • Links that work to navigate to subsections of the page. Links to external sites should also function correctly.
  • Promote accessibility standards by using the correct choice of tags and attributes in HTML
  • Effective use of CSS:
    • Ensure fonts are readable. Vary them among headers and body text.
    • Contrasting foreground/background colors that make the text easy to read
    • Likewise, good readability through use of spacing (margins, padding, line-height)
    • Any additional CSS necessary to reflect your wireframe design
    • Media queries for responsive design

Grading Specifications

As with your individual assignments, you will be evaluated on the quality of your HTML and CSS code. Links should work, and media should load properly. All text should be readable. Page should appear as designed for both desktop and mobile.