{Point of View} Marking up your design for production

After picking which design to build at the start of class Wednesday, you will have to measure and markup that design. Marking up layout for web development is common practice and the more specific and exacting you are, the better, and closer to the original, the results will be. In class, print out your layout and its various stages of interactivity, and draw directly onto the printouts.

Things you will need to measure and consider:

• Structure: Where will my containers be to best build my design (draw boxes around them and give them x,y coordinates)
• Semantic markup: name the containers, text, and image elements logically by content, which are "classes" that you create and name or by existing HTML tag names like paragraphs "p" and headings "h" (h1-h6).
  
• Relationships: how should the CSS cascade affect your design elements, how do they sit within each other to facilitate your layout.
  
• Functionality: what functionality exists on my layouts (where links and pop-ups happen, how they are activated, either rollovers, mouse-clicks, anchor tags)
• Links: how do I differentiate link types (are interior links link anchor tags different from exterior links that take me to a new place)
• Color: hat are the hex codes for all of my text and solid colors, and where do they appear
• Images: what are my backgrounds made of, are they repeating images, or large static images. Which images need transparency, if any.
  

Try to have most of your markup done by the end of class.