Develop a Website on Windows Using Microsoft WebMatrix

Create a Free Website Online Using WebMatrix, Azure and Microsoft Windows

If you have a Windows laptop or desktop computer you can get started with website development with free Microsoft tools. One of several free software tools that Microsoft provides is WebMatrix. This contains a HTML editor in an Integrated Development Environment (IDE) and the express version of Internet Information Server (IIS) (a web server used for testing your website).  A Windows PC running WebMatrix allows you to develop a website and publish it online for free using Microsoft Azure cloud hosting. Microsoft free hosting is for a small number of low volume websites. If the website is successful and generates high traffic it can be upgraded to a registered domain and paid for high volume Azure hosting.

This tutorial was based upon using a Windows 8.1 PC but Windows 7 can run WebMatrix. You will need an Internet connection and a Microsoft account to install and run WebMatrix and to use Microsoft Azure.

Install WebMatrix Offline on Windows

Start by downloading the WebMatrix installer from the Microsoft WebMatrix home page. Click on the green Free Download button to download the Microsoft WebMatrix installer. Depending upon the browser you are using you may be asked to run or save WebMatrixWeb.exe, select Save and when the download has completed Run the installer. The installer needs permission from User Account Control (UAC) to run. If it is a corporate computer a systems administrator may need to install WebMatrix.

A progress bar is displayed as the installer is extracted and run. The installer is referred to as the Web Platform Installer (WebPI). At the Web Platform Installer dialog click the Install button. You can choose to opt out of the Customer Experience Improvement Program, or change the setting later in the WebMatrix Options. Click I Accept, for the licence terms. WebMatrix and the required components will install. After the progress bars have completed a list of what has been installed will be shown, click the Finish button. At this stage no additional products or applications are required so click the Exit button to close the Web Platform Installer.

Add WebMatrix to the Windows Start Screen and Taskbar

Use the context menu to select Pin to taskbarFor Windows 8 users and later at the Windows Start screen start typing webmatrix. From the Search list use the context menu (usually right-click with the mouse) on the WebMatrix icon, select Pin to Start, and again for Pin to taskbar to make WebMatrix easily available. (Or use the context menu on the Start screen icon to select Pin to Taskbar).

Start WebMatrix to Develop a Website on Windows

Run WebMatrix. It works best with Windows Azure to allow for online deployment and testing of websites that can be accessed from anywhere. A Microsoft account will be required, which is likely to be the same one used for Windows 8.1 and other Microsoft services. Sign into Azure with the Microsoft account. When WebMatrix starts the Quick Start screen is displayed.

WebMatrix Start-up Screen

If working on the same website often check the Skip this page on start-up option to always open in the last edited website. The Quick Start screen is shown again when a website is closed.

By default new websites are created in the My Web Sites folder under users Documents. This can be set to a OneDrive (SkyDrive) folder for easy backup and multi-device synchronising. Select the Options icon, then the Site option and change the Default site location to a folder under OneDrive.

Start by Creating a Blank (Empty) Website

Select the New icon and then Empty Site. A Create Empty Site dialog shows the option to create a site on Windows Azure. Use Azure so websites can be tested online (as well developed on the Windows PC). A website name and Azure location is required. Selecting the Site Name can be difficult because the popular ones are probably taken. However, to start with the name can be a test one, the final name being chosen later. The Site Name will be added to azurewebsites.net to make the live web address (the one typed into a browsers address bar). For example if the Site Name is tekeye then the website’s full address is: http://tekeye.azurewebsites.net

If you find it hard to think of a Site Name try the date of creation in the order of year, month and day, e.g. yyyy-mm-dd (the date allows for an ordered list when viewing all your sites on the PC). Add a relevant word, like test or sandbox, or your name, e.g. John Doe. Use hyphens as separators. A Site Name could be 2015-02-15-test giving http://2015-02-15-test.azurewebsites.net.

The Azure location should be the closest to where you live or your expected website viewers will be based, i.e. from where your main traffic is expected.

Set the Azure Options for a New WebMatrix Website

The main WebMatrix screen will appear and a provisioning message will display at the bottom. This can be closed, with the x, when the Azure set-up has completed.

For the First Website Try a Simple Web Page

Create a New File in WebMatrixCreate a new web page by selecting Create a new file in the middle of the WebMatrix screen or click the New icon in the tool bar. Select the HTML option for the file type and change the text in the Name box to index.html. Click OK. The web page created for this tutorial is very basic. It is the same as the one for the Hello World in HTML article.

Between the title tags add some text, this is what appears on the tab in a web browser. Between the body tags add Hello World! which will be displayed on the web page. The code will look like this:

Run the basic web page, click the Run icon on the toolbar. A web browser will load and show Hello World! 

Develop a Website on Windows with WebMatrix

Click the publish icon on the toolbar and the web web site will be sent to Azure. You will need to accept the dialogs that appear by clicking Continue.

The publishing status message will be displayed, when completed click the link to the new website, this time the website is displayed from the Azure cloud.

Test a WebMatrix site on Azure

See the WebMatrix home page for more information. You are ready to add more files and more content, see w3schools.com to learn about HTML and web development.

2 thoughts on “Develop a Website on Windows Using Microsoft WebMatrix

  1. Pingback: PHP on Windows Using WebMatrix Single Click Install -Tek Eye

  2. Pingback: WebMatrix Rename Site and Changing Virtual Folder Name -Tek Eye

Leave a Reply

Your email address will not be published. Required fields are marked *

Human Verification: In order to verify that you are a human and not a spam bot, please enter the answer into the following box below based on the instructions contained in the graphic.