How to Create/Build Web Pages
Web pages are the fundamental building blocks of a website.
Before you can build a website you need to understand how to:
- Create/make/build web pages using simple tools like notepad.
- Create/make/build web pages using web page editors (WYSIWYG)
- Name web pages.
- Use Web page Templates.
- Layout/structure web pages.
- Add a link to a page and linking pages.
- How to write HTML code.
- Add scripting code (Javascript) to web pages.
- Host web pages
- Upload web pages to a host
Web Page Basics
All web pages are written in HTML (Hypertext Markup Language) or converted to HTML before they are displayed by a web browser.
The actual HTML code is not seen by the viewer of the page as it is removed by the web browser. The web browser uses the HTML code to structure/format the web page.
How to Create/Make/Build a web Page
You can create simple web pages using a text editor like notepad.
Doing it this way is a very good way of learning the basics of HTML, as you will need to enter the HTML code manually into the page. See Making HTML Web Pages Using a simple text editor- Notepad- 3 part tutorial.
Useful as it is for learning HTML no one creates web pages using simple editors like notepad, or even html editors.
All web designers use a visual WYSIWYG editor.
Using a WYSIWYG editor means that you don't really need to understand HTML in detail to create your pages. However I always recommend that you understand HTML basics.
In the video I will take you through using a free web page editor called Trellian Web Page and point out the important features that you will find in almost all visual web page editors.
Naming Your Pages
One of the most common mistakes people make when creating their first web pages is to give them meaningless names.
Page Names are important and so you need to Understand page names and page extensions before you create real pages for your site.
Web Page Templates
Although starting with a blank page can be instructional it is very rarely done. Most often you will start your design by using a web page template.
Although there are many to choose from I would recommend that you stay with a basic template, and not a flash template if you are creating the page yourself as you will find it easier to edit.
Web Page Structure &Layout
A web page consists of two components.
- A visible component (what the visitor actually sees)
- An invisible one (formatting, scripting components, meta tags etc)
Shown here in the schematic
When examining the web page HTML this is what we see:
<html>
Scripts and comments can go anywhere here
and are also hidden |
The Hidden Web Page Components.
These components are not visible to the web page visitors and are used to provide information for use by web browsers and search engines (meta tags) or additional functionality (scripts).
They are also normally invisible in most web page editors (in normal mode). However most web page editors have a view source tab which reveals the actual HTML coding and the hidden meta tags, scripts and comments.
Because you need to view the HTML source code itself to see these tags, and in most editors to modify them, they are frequently overlooked.
In addition, most editors will enter default information for some of the meta tags.
The Visible Web Page
The visible parts of the web page consist of the actual web page content. As with a newspaper or book the content of a web page is structured in standard manner. All Web Pages have a content area, a logo area and navigational areas. A typical web page is show below:
There are two main methods used for laying out web pages- tables and CSS. The page structure is taken care of by the web page template.
Adding Links and Linking Pages
Links between pages and page elements are what makes the web a web. One of the most common task you will do is add links to a page.
Although it isn't difficult there are many elements to linking correctly and it is important that you have a really good understanding of links and linking.
Adding Scripts
Many web pages have JavaScript added to them. The most common reason is for monitoring purposes. Although the visitor doesn't see the script itself they see the results of the script.
Unless you are a web developer or programmer it is unlikely that you will need to write any scripts but as a Web site owner/webmaster you will need to add pre-written scripts to a web page.
Although this isn't difficult it does require that you are familiar with HTML. The Starting HTML course as all you need for this task and adding scripts to web pages show you how it is done.
Hosting Web Pages
When creating web pages using an editor like Trellian, FrontPage or Dreamweaver the pages are created and stored on your PC. As such they are not accessible to anyone on the Internet.
To make them accessible to people on the Web you will need to place them on a web Host and associate a domain name/website address with them.
After that you can upload the web pages (called publishing) using a FTP client to your hosting space.
Related Articles/Resources:
- The Home Page -The Home Page is the most Important Page on your website ! What should it contain?