Basic Guide to Building Websites

I know you’ve all come across pages like this in the past and said to yourself Darn, it’s not even finished yet, well I really will finish this.  I promise! It will be slick and include video tutorials too.

Bookmark this page to come back by typing CTRL+D on your keyboard. If you are on a Mac, it should be COMMAND+D

This is intended to be a basic guide on how to create a simple web site, and make it modern and decent-looking too.  For the mostly basic learner, who is curious about how to take over contribute to the world wide webs.

Everyone starts somewhere, right?

1. Introduction
   • Little bit of history
   • Why DIY your website?
   • The horrors of WYSIWYG and benefits of learning proper HTML
   • How to get started and what you need
2. Getting Started
   • First Words: Hello World
   • What is a tag? Syntax
   • HTML Skeleton and Structure
   • What is the difference between <span> and <div>?
3. Formatting Text
   • Headings and Paragraphs
   • Special Characters
   • Paragraphs, Breaks and Horizontal Rules
   • Blockquotes
4. Introduction to CSS
   • What is CSS and why use it?
   • Understanding the Syntax
   • Inline, Embedded, and External Style Sheets: When to use them
   • DOM structure
   • Troubleshooting Browser Compatibility
5. HTML Links
   • Text Links
   • Absolute vs. Relative Paths
   • Targeting New Windows
   • Email Links
   • Adding Links
   • Anchors
   • The title Attribute
6. HTML Images
   • Inserting Images
   • Image Links
   • Adding Images to the Page
7. HTML Lists
   • Unordered Lists
   • Ordered Lists
   • Definition Lists
   • Creating Lists
8. HTML Forms
   • How HTML Forms Work
   • The <form> Tag
   • Form Elements
   • Creating a Registration Form
   • Adding Checkboxes and Radio Buttons
   • Adding a Select Menu and a Textarea
9. Page Layout
   • All about Tables, and when to use them
   • How to center the contents of your page
10. Maintenance
    • Designing for CMS systems
    • Stranger-friendly Code: Documenting Code with Comments
    • Usability and Browser Testing

Congratulations, you can now start building websites on your own.  Now that you’ve mastered the technical skills it’s time to learn how to organize and manage your own web projects.

1. Planning your Website
   • Defining the Purpose and Audience
   • Organizing Content for Web
   • Flow Charts and Wireframes
   • Selecting and nailing down a Domain Name
   • Assess your Technical Inventory
2. Creating a Mockup
   • Design Principles and Applying them
   • Putting together a Solid Concept
   • Mocking it up in Photoshop
3. Designing for Usability
   • The Usefulness of Usability
   • Basic rules
   • Common sense and how to use it
4. Marketing your Website
   • Using Social Media
   • Search Engine Rankings
   • Website Marketing

/clap

Feel free to comment on this guide if I left any chapters out.

Thanks!