2 Web Design Tutorials for Programmers
Here are two Web Design Tutorials: Design
for Developers and Web
Design for Programmers,
hosted
at New Auburn Personal Computer Services. These two Web
design
tutorials will help you to create successful web sites and web
applications, along with getting you
familiar with the process and tools involved with developing a
functional and attractive site/application. The first tutorial
is
illustrated using presentation slides, and the second one is
illustrated as an e-book. Both tutorials are in pdf format.
Design
for Developers (224 Kb, 34 pages)
This course is meant to be a hands-on experience. The goal is to get
you familiar with the process and the tools involved in developing a
functional, attractive site or application. Various hands-on examples
are illustrated using the help of Photoshop, Dreamweaver, and CSS.
- Introduction
- Layout
- Choosing Colors
- Fonts
- Logo Design with Illustrator
- Mocking up with Photoshop
- Building the HTML
- Graphics on the Web
- CSS
- Accessibility
- Resources
- Notes
Web
Design for Programmers (2.48 Mb, 83 pages)
This tutorial explains you about basic color theory, learning how to
choose colors, basic typography, learning how to choose fonts, basic
layouts, how to mock up a site in Photoshop and basic XHTML and CSS.
Also covered are building a logo that can scale using Illustrator and
building a mockup of the site in Photoshop
- Quick Disclaimers
- We are going to learn stuff
- We’re gonna build stuff
- Good vs. Bad Design
- Bad Design
- Good Design
- Design is more than pretty
colors!
- Commandments
- Basics of Layout
- Navigation
- Gather information
- Sketch your stuff
- Doesn’t have to be pretty
- Get inspired!
- Sketching Guidelines
- Color
- What is Color
- Basic Color Theory
- Color Schemes
- Monochromatic
- Analogous
- Complimentary
- Technical Color Selection
- Photographs
- Natural Color Selection
- Choose a color scheme
- Typography
- Font types
- Monospaced
- Legibility
- Fonts and Style
- The Baseline Grid
- Limited Options
- No Grid Used
- Grid Used
- Basics of a Grid
- Units of Measure
- Logo Design
- Designing a Logo
- Learning to Draw with
Illustrator
- Make a Logo
- Mockup with Photoshop
- HTML Basics
- Semantic Markup
- Tables
- HTML Tags
- Block level tags
- Inline Elements
- Scope
- Valid markup
- Block vs Inline Elements
- Doctype
- Create Your HTML Page
- Validation
- CSS Basics
- A CSS Rule
- Types of Stylesheets
- Inline Styles
- Inline Stylesheet
- External Stylesheets
- Media Types
- Selectors
- Selectors by HTML Elements
- Selectors by Class Name
- Selectors by ID Name
- Guidelines for use
- Grouping
- Scoping
- Layout.css
- Resetting
- Web Graphics
- Style.css
- Optimizing Images
- Accessibility
- How?
- Questions
- Follow up
Popularity: 7% [?]
Related Posts:
Tags for this post>> Web Development





























