How To Use Microsoft Expression Web

click to enlarge

Microsoft Expression Web is a web design program and WYSIWYG HTML editor created by the Microsoft Company. Creating standards-based Internet sites has never been easier. Microsoft Expression Web is included in the Microsoft Expression Studio suite. With the ability to edit web pages using CSS, XHTML, JavaScript, XML, XSLT and ASP.NET, you may be wondering exactly how to use Expression Web.

Expression Web was first released in 2006 by Microsoft, and it replaced the venerable FrontPage web design tool and HTML editor. While Expression Web has rapidly developed through the last several years, it still maintains much of the ease and stability that many web developers enjoyed with FrontPage. Here we will take a look at several Microsoft Expression Web features.

One of the more favorable features of Expression Web is that it can be used in any web browser. FrontPage lacked structured coding and many generated codes did not work well, or at all, in any browsers besides Internet Explorer. While Expression Web writes code for IE first, it does provide standards for other web browsers second.

Microsoft Expression Web contains three useful validators that are excellent for users who are more focused on design and page layout. The first is a CSS validator which is used to check selected documents to ensure that all CSS is properly used, such as tags that contain undefined classes. The second is an HTML validator which uses a declared DTD, or set DTD, to verify that all pages are valid and CSS meets certain standards. The third is an accessibility validator. This is primarily used to make sure that the web page or site meets all standards for accessibility.

The final feature used with Expression Web is its connection with Microsoft Script Editor. Since Microsoft Expression Web is not meant to be used for code writing, the Script Editor can provide client-side scripting, as well as debugging tools. Although this can be an inconvenience for some web developers, others who generally use Expression Web for basic design and layout do not necessarily require this feature.

Begin by opening the Microsoft Expression Web program and create a blank page using the default layout. Once Expression Web is opened, click on ‘Task Panes’ > ‘Reset Work Space Layout’.

Next open a new page by clicking ‘File’ > ‘New’ > and ‘Page’.

A pop up menu which will contain CSS layouts will then appear. Select the fifth template which will proceed to open two new page files. These include the CSS file and HTML page. Save your pages regularly by clicking ‘File’ > ‘Save As’ and name them as ‘masterpage’ and ‘masterstyles’.

The next step is to add color to your internet page starting from the top of the page and working your way down. Towards the bottom of the default web layout, you will see a task pane box that contains various tabs including ‘Apply Styles’, ‘Manage Styles’, and ‘CSS Properties’.

The ‘Manage Styles’ task represent the styles that are used in your web page. The ‘CSS Properties’ or ‘Tag Properties’ task is used for styling the web page template.

We will want to add color to your web page by clicking inside the ‘#masthead <div>’ that is located in the ‘CSS Properties’ task box.

Select ‘Background Color’ and enter your wanted color code to change the background color. Click inside ‘#top_nav <div>’ and enter a color code to change the top_nav background color. Change the color for the following: ‘#left_col <div>’, ‘#page_content <div>’ and ‘#footer <div>’. from the ‘CSS Properties’ task box.

Microsoft Expression Web templates can be used to create your own personal websites. Using an un-styled CSS template, you can turn a blank page into a work of art by simply starting with a basic header, columns, navigation bar and footer. Expression Web is a basic program that can be used by beginners or advanced developers alike. Microsoft Expression Web has the ability to install add-ons from third parties and other developers which extends its amazing capabilities. For those web developers just starting out or those who enjoy the ease and advanced features of a classic program, don't count out Expression Web.

To help you get started check out some Free Microsoft Expression Web Templates.

http://www.microsoft.com/expression/products/web_overview.aspx