Welcome to How To Build a Website!

Our Objective

• To build a web site consisting of at least 3 web pages.
• Acquire a domain name
• Sign up with a HOST

How?

Discussion
Domain Names and registration
Signing up with a host

Domains and Hosts

What's the most important "THING" on a web page? What are the main parts of a web page?

Can you List them?

Write THEN CHECK OUT THIS LIST...

How do you put a web page together?

1. The Content First
• Create it with a text editor
• Later we will mark it up with xhtml/html5 in your web editor
2. The Layout
• Will be Created with CSS3 in your web editor
3. The Style
• Will be Created with CSS3 in your web editor

Web Page Creation: The Preparation

You'll need 2 folders on YOUR flash drive and/or Home computer

1. Make a "Master" website folder
   1. Name it with "Your name" something like "Garry-MasterWebsite"
   1. This folder only contains the files that makes your website work.
   2. And Make A "Webstuff" folder.
   1. This folder will contain the parts you collect to make your website...
      1. Things like, IDEAS, Text files, widgets, lists of links, graphics, pictures, videos... etc...

   Web browsers

   Here's a list that links you to web browser publishing sites Download all the browsers! Install them!

   The Web Editors

   If you already have a Web Editor, by all means, use it! The following is a link to a web page that discusses the various kinds of web editors and give you some choices. The goal here is to find a web editor that you like, and that will help you build your web site. The Web Editors

   Homework:  Write the most important part of your web pages

   The Content
   Always write the content first as plain text with no formatting.

   You'll find some ideas at this web page that will help you "layout" your web page. Lesson 1: Penciling it out!

    

   Most of all have fun! Get stuck, send an e-mail…

   Navigation Links

   • Week 1 (That's this page on my web site at the bottom of the page you'll see an RSS News feed that displays links to the last 5 articles on the class website blog)
   • Home   (Class Portal page)
   • Lesson 1 (Interesting stuff)
   • Domains and Hosts Resources 
   • Contact

   Vocabulary 

   URL

   ---Uniform Resource Locator

   HTML & CSS

   --- HTML, Hyper Text Markup Language, creates the content of a web page.

   --- CSS, Cascading Style Sheets, Creates the Styling for a web page.

   Provider

   --- Physically links your computer to the Internet.

   Host

   --- Provides the Computers (servers) to store and host your web site on the internet.

   Domain Name (Server) (DNS)

   --- makes a recognizable name for the actual numerical Internet address.

   Got a question? 'Holler!

WYSIWYG --Visual Web Editors

Is there a way to edit a web page directly without using an html text editor? Is there a way to design a web page visually?

The answer is, YES! Sometimes a visual editor is real handy to have  around!

If you have purchased the Coffee Cup HTML Editor, you'll discover that it comes with a visual editor. You might not notice it as it might be "turned off!"  I found this "Faq" on the Coffee Cup web site.

Visual Editor Tab not displaying at all.

Solution: With the update to the latest version of the HTML Editor, the Visual Editor has been turned off by default. We did this to provide the best possible user experience. But don't fret — this is an easy issue to fix. To re-enable the Visual Editor, launch the Editor and go to the Tools > Preferences > General tab. Once there, uncheck the Hide Visual tab option...

 

When you click on the Visual Editor Tab you can edit directly on the web page.

Insert HTML elements just like using a word processor...

Give it a try!

Coffee Cup has another Wed Editor that could be better described as a web designer.  It's called Visual Site Designer.

If you are visually oriented this might be a great editor for you.  You can download a free trial from Coffee Cup's web site

 

If you have a Mac (or a PC) you can try the Open Source program Kompozer (It's Free)

Click the link below to start the Download and give it a try.! Load a web page and start adding your content directly on the web page!

• kompozer-0.8b3.en-US.win32.exe (Windows™ installer)
• kompozer-0.8b3.en-US.mac-universal.dmg (Mac OS X™)

 

 

There is other software, noteablely Adobe's  Dreamweaver, but this class is not about web editors, it's about  creating a web site!

Web Editors are our tools of the trade!

Got a question,? 'Holler!