Dan Dressler
  • Home
  • My Work
    • 2021
    • Fall_2019
    • Summer_2019
    • Beneath the Surface
    • Multi Media Collage
    • Photography
    • Drawings
    • Mono Prints
    • Acrylic
  • Contact

Web Design Assignments

CSS / Photoshop  Web Template

4/10/2017

 


​Objective:

For this assignment, you will be challenged to create a graphic representation of a web template using Adobe Photoshop and reconstructed using CSS and HTML coding language.

Directions:
Step One:  Research a pre-existing web site based on your own personal interests.
Step Two: Using a sheet of paper, create a Wire Frame that indicated how the layout of your web template will be broken up.  At minimum there should be an allocation for (1) mast head, (2) nav bar, (3) content area, (4) footer.  * Be sure to indicate with pixels the width and height of each section created within template.
Step Three: Using Adobe Photoshop create a new document @ "1200px" x "900px".  Resolution should be set to 72dpi.
Step Four:  Based on the wire frame layout and dimensions, use Photoshop to create an original graphic representation of a web template.
Step Five: Individually crop each section of the web template and save into the asset folder located within your sites Root folder.  Save each file as a ".jpg".  
Step Six: Using your knowledge of HTML and CSS, reconstruct individual sections of web template into a single viewable document. 
Picture

Comments are closed.

Visual Art by Dan dressler

Contact Information

Dan R. Dressler
​Waltham, MA 02453
visualart@dandressler.com
  • Home
  • My Work
    • 2021
    • Fall_2019
    • Summer_2019
    • Beneath the Surface
    • Multi Media Collage
    • Photography
    • Drawings
    • Mono Prints
    • Acrylic
  • Contact