Latest web development tutorials
 

Web Building - Creating a Web Site

❮ Previous Next Chapter ❯

WebMatrix

WebMatrix is a free web development tool that provides the easiest way to build websites.

WebMatrix contains:

  • Web examples and templates
  • Support for many different web languages
  • A web server (IIS Express)
  • A database server (SQL Server Compact)

With WebMatrix you can start with an empty web site and a blank home page, or you can build on templates using PHP, ASP, Umbraco, DotNetNuke, Drupal, Joomla, WordPress and more.

WebMatrix also has built-in tools for databases, security, search engine optimization, and web publishing.

To install WebMatrix, follow this link: http://www.microsoft.com/web/gallery/install.aspx?appid=WebMatrix

Create an Empty Web Site

Follow the three simple steps below to create an empty web site with WebMatrix:

  • Select a Template
  • Edit the Home Page
  • Run the Web Site

The 3 steps below, creates an empty HTML web site. If you want to create an PHP Site, an ASP site, or a Node.js site, look at the bottom of this page.

Step 1: Select a Template

Start WebMatrix, select New.

WebMatrix

From the template gallery, select Empty Site from HTML templates.

Name the site demoweb (or anything you like)and click Next:

Web Templates

WebMatrix creates a new web site and displays a workspace window.

In the left pane, select the Files workspace:

Home Page

Step 2: Edit the Home Page

To edit your home page, double-click the file index.html.

Put the following content into the file:

index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>Web Page Demo</title>
</head>
<body>
    <h1>My First Web Page</h1>
</body>
</html>

Step 3: Run Your Web Site

In WebMatrix, click Run:

WebMatrix starts a web server and runs the page in your default browser:

My First

WebMatrix selects a random port number for your local web server.
In the example above it is displayed as: http://localhost:4676.

Create an Empty ASP Classic Web Site

Rename the home page from index.html to default.html.

Create an Empty PHP Site

In step 1 select Empty Site from the PHP templates.

Create an Empty ASP.NET Web Pages Site

In step 1 select Empty Site from the ASP.NET templates.

Create an Empty Node.js Site

In step 1 select Empty Site from the Node.js templates.


❮ Previous Next Chapter ❯