html css website overview
Download
Skip this Video
Download Presentation
HTML/CSS Website Overview

Loading in 2 Seconds...

play fullscreen
1 / 10

HTML/CSS Website Overview - PowerPoint PPT Presentation


  • 96 Views
  • Uploaded on

HTML/CSS Website Overview. Dr. Lam. Typical Process. Learn HTML/CSS Complete information architecture Write, gather, edit content Create wireframe and/or design mock-up Build HTML/CSS site. Information Architecture. Description: Creating a “blueprint” for your website

loader
I am the owner, or an agent authorized to act on behalf of the owner, of the copyrighted work described.
capcha
Download Presentation

PowerPoint Slideshow about ' HTML/CSS Website Overview' - leland


An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -
Presentation Transcript
typical process
Typical Process
  • Learn HTML/CSS
  • Complete information architecture
    • Write, gather, edit content
  • Create wireframe and/or design mock-up
  • Build HTML/CSS site
information architecture
Information Architecture
  • Description: Creating a “blueprint” for your website
  • Outcome: You’ll know how many pages your site will have. You’ll also know what you’ll include on each page and how a user will navigate from one page to another. Usually web designers will create site maps at this stage.
  • What you should be working on NOW: Once you’ve made these decisions, you should begin writing and gathering your content. Content can be written in HTML, simple text documents, or Word documents.
create wireframe required
Create Wireframe (Required)
  • Description: A wireframe is a blueprint for a single page of your site (usually home page). It signals where each major element will go.
  • Outcome: You’ll know exactly what elements your page will consist of and where those elements will go.
  • What you should be working on NOW: Look at layouts that you are drawn to or impress you. Start hand drawing your wireframes. In lab, you’ll learn to create a wireframe in Photoshop.
create mock up optional
Create Mock-up (Optional)
  • Description: A mock-up is what one page on your actual website will look like.
  • Outcome: You’ll know exactly what all of your elements will look like (e.g., colors, fonts, spacing, etc.). This is usually done in photoshop or some other graphic design software.
  • What you should be working on NOW: Nothing/
suggested deadlines
Suggested Deadlines
  • All final deliverables are due when the final project is due. However, to stay on track, I suggest the following deadlines for yourselves.
  • Wednesday, February 19- Two Personas
  • Monday, February 24- Wireframe
  • Wednesday, February 26- Draft of written copy
other considerations regarding the project
Other Considerations Regarding the Project
  • Approximately 15% of your final project grade will be based on valid HTML5 and CSS
  • Valid HTML/CSS occurs when you follow the syntactic rules of each language (e.g., every tag that opens must close, tags close in opposite direction they open, images have alt tags, etc.)
  • Therefore, regularly test your HTML and CSS using the following sites:
  • http://validator.w3.org
  • http://jigsaw.w3.org/css-validator/
ad