On this page…
Note that all the presentations on this page are available under a Creative Commons Attribution-ShareAlike License. You can use these slides in many ways, provided you follow the terms of the license.
Scott & Jans: An Intro
Scott. Jans. Lovecraft. An outline.
Web Development: The Absolute Basics
History. Browsers. Rendering engines. Simple webpages. Elements, attributes, & values. DTDs. Character encoding. Simple webpages, corrected. Comments. Editing tools. Templates.
Bonus: Installing, Configuring, & Using Brackets
Installation. How it works. First extensions. Brackets as debugging tool. Configuration. Other extensions.
HTML Overview: Elements, Attributes, Entities
Categorizing HTML elements. Basic document structure. Metadata. Global attributes. Lines & paragraphs. Outlines & sections. Grouping. CSS hooks. Lists. Quotations. Text semantics. Text formatting. Links. Multimedia. Tables. Forms. Frames. Scripting. Foreign characters. Obnoxious & obsolete. Character entities. IE, bringing up the rear. Tools.
Background. Basic syntax. Process. MultiMarkdown. PHP Markdown Extra. Sundown. Pandoc. Testing. Software. Integrating.
It’s Boxes All the Way Down!: Elements & Their Relationships
Parents & children. Ancestors & descendants. Grandparents. Siblings. Boxes. Block. Inline.
CSS Overview: Selectors, Integration, Inheritance, Cascading
History. Why CSS? DOM. Basic Selectors. Universal. Type. Class. ID. Grouping. Descendant Combinator. Formatting.
<div>. Integrating CSS. Inheritance. Importance. Specificity. Order. The Cascade. Tools.
CSS Building Blocks: Selectors
Numbers. Key Selectors. Basic Selectors. Combinators. Pseudo-Elements.
<string>. Pseudo-Classes. Attributes. Compound. Parents?
CSS Data Types
Defined. Images. Text. Wide Usage. Media Queries. Animations & Transformation. Future.
CSS Typography: Fonts & Formatting
Types. Measure. Leading. Scale. Operating system defaults. Web browser defaults. Core Fonts for the Web. ClearType Font Collection. Font properties. Font stacks. Text properties. Line box properties. Multi-column layout. Generated content. Font formats.
Tables & Lists: Organized Data
Basic tables. Defining sets of rows. Table title. Styling tables. Columns. Sortable columns. Creating tables the easy way. Styling lists.
CSS Layout: Boxes, Displays, & Positioning
Layout modes. Positioning. Normal flow. Out of normal flow.
z-index. Box model. Padding. Border. Margin.
visibility. Opacity. Flexbox. Grid.
Decorating with CSS: Cool Ways to Make Things Pretty
Background images. Background layers. Linear gradients. Radial gradients.
transform. Creating shapes.
Media-Specific Styles: Same HTML, Different CSS
Media types. Media-specific rule sets. Common print styles. Print CSS. Media queries.
CSS Animation: Visual Change Over Time
Daily use. How forms work. Labels, fields, & controls. Form attributes. Form containers. Text controls. Choice controls. File select controls. Submission controls. Accessibility. Tips & caveats.
Fixed to Fluid to Responsive: Grids in Design
Grids in design. 960. Unsemantic. Foundation. Bootstrap. Fixed layouts. Fluid layouts. Responsive layouts.
Bootstrap: A Quick Introduction
Installation. Using Bootstrap. Template. Grid system.