Expression Web 4 Licensing June 21, 2010
Posted by minals in Expression Web Tips and Tricks.Tags: Expression Studio 4, Expression Web 4
add a comment
For those who are looking out to upgrade from Expression Web 3 to 4, the upgrade path depends upon how you have obtained Expression Web 3. If you have purchased a retail version of Expression Web 3 from the Microsoft Store, Digital River or a local software retailer, then you can download the Expression Web 4 Trial version from the Microsoft site. The Setup program will identify the license for Expression Web 3 from the Windows License Store and apply it to version 4. And the full version will automatically be enabled. Once Expression Web 4 is installed, you can either uninstall Expression Web 3 or leave it installed. But remember to retain your copy of Expression Web 3 and the product id, if you may need to reinstall the program in case of hard drive failure or reinstall the OS (Windows).
If you have acquired Expression Web 3 either from MSDN, DreamSpark or through a volume license, then you should not install the trial version. You need to get a copy of Expression Web 4 the same way you acquired Expression Web 3.
You can download the free upgrade to Expression Web 4 here.
For more details on Expression Web 4 licensing, read here.
Microsoft Expression Web 4 is here!! June 8, 2010
Posted by minals in Expression Web Tips and Tricks.Tags: Expression Studio 4, Expression Web 4
1 comment so far
At last the wait is over with the release of Microsoft Expression Studio 4 Ultimate on 7th June 2010. Expression Studio 4 is a collection of professional design tools to create standards based websites, rich desktop applications also enabling designers and developers to create dynamic applications. The Expression Studio 4 Ultimate has:
· Expression Web 4 + SuperPreview
· Expression Blend 4
· SketchFlow
· Expression Encoder Pro
· Expression Design 4
What’s new in Expression Web 4?
Some of the highlighting features of Expression Web 4 are:
· SEO tools
· Online SuperPreview improves compatibility testing
· Create add-ins for Expression Web with HTML and JavaScript
· Professional Design Surface
· Flexible Publishing features
For more details read my article on dotnetcurry.com – What’s new in Microsoft Expression Web 4?
You can download the trial version of Expression Web 4 here.
Close All Pages command in Expression Web May 25, 2010
Posted by minals in Expression Web Tips and Tricks.Tags: close all pages, close pages, commands, Expression Web, Expression Web 2, Expression Web 3
add a comment
Just as the Save All command lets you save multiple pages at one go, Close All Pages command lets you close multiple pages at once. The command can be found under the Window menu, see below:
When you invoke the Close All Pages command, Expression Web will close all the saved pages and throw a warning for those pages that are not saved. See below:
Expression Web will prompt you to save each and every unsaved page before closing them. Click Yes to save the page. A good practice would be to use the Save All command in conjunction with Close All Pages command. So before you use the Close All Pages command, use the Save All command to save all the unsaved pages.
In Expression Web 3 you cannot customize the toolbars or menus. But if you are still using Expression Web 2 or 1 you can place the Close All Pages command under the File menu under the Close menu item or anywhere else you find it convenient to use. Follow the tutorial Add a command to toolbar and menu bar in Microsoft Expression Web 2 to add the Close All Pages command to the ‘File menu’. The ‘Close All Pages’ command can be found under the Window and Help category in the Customize dialog box.
I hope you find this command useful.
Save All command to my rescue! May 18, 2010
Posted by minals in Expression Web Tips and Tricks.Tags: commands, Expression Web, Expression Web 3, save, save all
2 comments
I was working on a website last evening. I created a dynamic web template (dwt) and then generated pages from that template. As I progressed, I saw myself making some changes to the template every now and then and then saving it to update all the pages that were attached to the template. After doing that all the pages that I created from the template had to be saved in order to preview the reflected changes. If you have one or two pages attached to the template then you can save individual pages. But I had around 15 pages waiting to save. Going to each and every page (open in Expression Web) and pressing ‘CTRL + s’ was irritating.
There came the ‘Save All’ command to my rescue. The ‘Save All’ command is lets you save multiple pages at one go. So when you have many pages that are waiting to be saved (pages marked with a *) use the Save All command/button. When the pages are already saved, the option is disabled.
The command is found on the ‘Common Toolbar’ next to the Save button.
Or you can find it under the File menu > Save All.
I find it a handy tool that saves you a lot of design time, find it out yourself!
Add templates to Expression Web May 14, 2010
Posted by minals in Expression Web Tips and Tricks.Tags: add template, custom template, Expression Web templates, template
1 comment so far
You must have explored the built-in templates in Expression Web. These are basic templates that help you create your own website, without requiring many efforts. Although some tweaking is required! To design professional websites you ought to have plenty of site templates for your use. You can create your own or purchase them from other websites. Add these templates to Expression Web and keep them handy. In this article we will see how to add downloaded templates to Expression Web.
In Expression Web 3, to add a template to the same location as the built-in templates:
1. Download the template and unzip it. The template file folder will have an extension of ‘.tem’.
2. Place ‘.tem’ folder at: C:\Program Files\Microsoft Expression\Web 3\en\WEBS
NOTE: C:\ is the drive where Expression Web is installed. If on your machine Expression Web is installed on any other drive then replace C:\ with that drive name in the above path.
3. Now go to Site > New Site > Templates and find your template in the list.
In Expression Web 2, the location would be: C:\Program Files\Microsoft Expression\Web 2\Templates\1033\WEBS12
In Expression Web 1, the location would be: C:\Program Files\Microsoft Expression\Templates\1033\WEBS12
If you do not want to add your custom templates to the default templates folder in Expression Web, you can add them to the My Templates section (only in Expression Web 3). To add a template to My Templates section:
1. Download the template and unzip it. The template file folder will have an extension of ‘.tem’.
2. Place ‘.tem’ at: C:\Users\Minal-Win7\AppData\Roaming\Microsoft\Expression\Web 3\Legacy\Expression\Web 3\Webs
NOTE: C:\ is the drive where Expression Web is installed. If on your machine Expression Web is installed on any other drive then replace C:\ with that drive name in the above path.
3. Now go to Site > New Site > My Templates. See image below:
My fellow MVPs – Pat and Tina have made a set of 12 Site Templates for Expression Web which are available free for commercial or private/non-profit use. You can find them here. Some other members of the Expression community have contributed their templates to the Microsoft gallery.
Layers Panel in Microsoft Expression Web 3 May 9, 2010
Posted by minals in Expression Web Tips and Tricks.Tags: div, layer panel, layer properties, layer visibility, layers, panels, z-index
add a comment
A layer is effectively a <div> that is positioned absolutely or relatively. The Layers Panel lets you set the visibility, z-index and ID for layers.
To view the Layers Panel, go to Panels menu > choose Layers. The Layers panel will be docked next to Apply and Manage Styles panels by default. You can always float it or dock it anywhere else.
Let us see each of these options available in the Layers Panel.
1. Insert Layer button: lets you insert a layer in Design view or Code view.
2. Draw Layer button: lets you draw a layer in the Design view. The button is inactive in Code view.
3. Layer visibility column: denotes the visibility of a layer, depicted by a small eye icon. 
denotes visible and 
denotes hidden. The layers that are created are visible by default (as shown in the image above) but their visibility property is not set. You can do that explicitly by clicking in this column.
4. Z-Index column: shows the value of a layer’s z-index property. The z-index defines the display order of the layer along the z-axis.
5. Layer ID column: displays the layer’s ID attribute value. Double click on the value in the column to edit it. An ID attribute must have a unique value. The ‘+’ sign in the column, shows nested layers. Click on the + sign to expand. Nested layers are also indented in the column to indicate the same. See image below:
Working with line breaks in Expression Web May 4, 2010
Posted by minals in CSS Hacks Tips and Tricks, Expression Web Tips and Tricks.Tags: , break, Expression Web, HTML, line break, space
add a comment
The basic formatting techniques like Line breaks, white spaces and indentation make your web content stand out and look clean and neat. The HTML <br> tag is used to add line breaks in your page. See below:
marks denote line breaks. To view line breaks or other Formatting marks in Expression Web, go to View menu > Formatting Marks > Show and then from the same menu choose ‘Line Breaks’.
Tip: Use the same menu to view other formatting marks. The screenshots in this article are taken in Expression Web 3.
To add line breaks; in Design view, place the cursor at the point where you want to insert a line break and do either of the following:
a. In the Toolbox, under the Tags heading, double click or drag the 
.
b. Insert > HTML > Break.
c. Hit Shift + Enter.
NOTE: Hitting Shift + Enter will add a line break whereas hitting only the enter key adds a paragraph break.
To format a line break, select the line break in the design view, go to the Format menu and choose Properties. The Break dialog box will be prompted as follows:
a. Normal line break: create a default line break.
b. Clear left margin: clears left margin and begins the next line at the nearest line below the content in the left margin.
c. Clear right margin: clears right margin and begins the next line at the nearest line below the content in the right margin.
d. Clear both margins: clears both the margins and begins the next line at the nearest line below the contents in both the margins.
Get rid of the dotted border from a focused hyperlink April 28, 2010
Posted by minals in CSS Hacks Tips and Tricks, Expression Web Tips and Tricks.Tags: a:focus, anchor, css, dotted border, Expression Web
3 comments
You must have observed this behavior that when you click on a hyperlink it is surrounded with a dotted border as shown in the image below:
I observed this behavior in Internet Explorer 8 and Firefox 3.0 and above. I also tested the behavior in Safari 4.0.4 and Google Chrome 4, but they did not display such border. Even though, this is temporary and the border disappears as soon as the link loses its focus, I do not like it. So I came up with this solution.
Add the following CSS to your page:
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<title> Get rid of the dotted border</title>
<style type=”text/css”>
a:focus {
outline: none;
}
</style>
</head>
<body>
<a href=”#” id=”anchor1″ target=”_blank”> Read More..</a>
</body>
</html>
You can add the same code in your Expression Web page.
However, this could be a problem for users with disablity or those using keyboard instead of mouse. In that case, a woraround could be, when you remove the dotted border, you could change the color of the font similar to the hover/active hyperlink or change the font-weight to bold. This could help the user get a visual cue for navigation. See below:
a:focus{
outline:none;
color:#FF0000;
}
or
a:focus{
outline:none;
font-weight: bold;
}
Add or remove metadata in Expression Web April 20, 2010
Posted by minals in Expression Web Tips and Tricks.Tags: add metadata, Expression Web, metadata, remove metadat
2 comments
Microsoft Expression Web requires metadata to maintain a whole bunch of cross-page dependencies features like hyperlinks, DWTs and some site reports.
Metadata is stored in hidden folders. This prevents them from any unintentional modification, deletion or any such action on the metadata. There are two types of folders:
a. _vti_cnf folders – stores information about all the files such as the links in the file.
b. _vti_pvt folders – stores configuration information for the site.
It depends on the method you use to publish you site whether the metadata is visible to the visitors of the site. You can choose this while publishing the site.
What is metadata and what does it store?
I am sure you must have come across the definition of metadata that says ‘Metadata is data about data’. Is that enough to understand what metadata is? I don’t think so. Of course metadata is data about data but there is more to that. Metadata allows you to describe your website to help the Search Engines locate your site and index it. To optimize your site on search engines’ you need to have a well descriptive title tag and also use your keywords in the body of your document and in your metadata. Let’s not go into SEO techniques over here and get back to metadata.
Expression Web uses metadata to store information about:
1. File properties such as Page title, keywords, file size and other properties that appear on the General tab of the Properties dialog box.
2. Summary comments (the Comments box on the Summary tab in the Properties dialog box).
3. Workgroup options (the Workgroup tab in the Properties dialog box).
4. Site Reports.
5. Script language settings (the Advanced tab in the Site Settings dialog box).
6. Server message language settings (the Language tab on the Site Settings dialog box).
7. Database connection information (the Database tab on the Site Settings dialog box).
8. Pages attached to a DWT (Dynamic Web Template).
Where is metadata required?
Metadata is required by:
1. FrontPage sites with components that require FrontPage Server Extensions.
2. Hyperlink management features.
3. Hyperlinks view.
How do I configure Expression Web to use metadata?
In Expression Web you can easily add or remove metadata from your site. You can also refresh the metadata and resynchronize the cross-page dependencies with Recalculate Hyperlinks command, to update all the links in your site.
Add metadata-
1. Open the site.
2. On Site menu > choose Site Settings.
3. On the General tab, choose ‘Maintain the site using hidden metadata files’.
Remove metadata-
1. Open the site.
2. On Site menu > choose Site Settings.
3. On the General tab, uncheck ‘Maintain the site using hidden metadata files’.
NOTE: The metadata for a site stored under the ‘My Web Sites’ folder on your computer cannot be removed. Hence for all the sites saved in above location, the ‘Maintain the site using hidden metadata files’ is grayed out in the Site Settings dialog box.
Recalculate metadata-
1. Open the site.
2. Go to Tools > click Recalculate Hyperlinks.
3. In the Recalculate Hyperlinks dialog box, choose Yes.
Expression Web 3 Service Pack 2 Released! April 8, 2010
Posted by minals in Expression Web Tips and Tricks.Tags: Expression Web, Expression Web 3, Expression Web 3 Service Pack 2, update
add a comment
Microsoft Expression Web 3 Service Pack 2 has been released and is available for download. It has general improvements to the application. The biggest improvement of them all is the SuperPreview support for Firefox 3.6. We all have been waiting for this one for a long time. Here is a list all that SP2 has to offer:
1. SuperPreview feature supports Firefox 3.6.
2. Sometimes SuperPreview crashed while launching, due to the process of locating Firefox on your system. SP2 fixes that.
3. While editing PHP files, you were asked to update related hyperlinks on that page. After doing so some PHP tags were removed. With this update, they are no longer removed when you update related hyperlinks.
4. Expression Web 3 sometimes crashed when ‘list-style-image’ property was used in a CSS file. Now is fixed.
5. Renaming PDF file in the Folder List caused corruption to the file. PDF files can now be saved safely.
How do I install Expression Web 3 SP2?
Expression Web 3 SP2 is available on the Microsoft Download Center. To download this service pack from the Microsoft Download Center, visit the following Microsoft website:
http://go.microsoft.com/fwlink/?LinkID=186181
How do I know if SP2 is installed?
Launch Expression Web 3 and go to Help > About Microsoft Expression Web.
If Expression Web 3 SP2 is installed, the following version number appears:
Microsoft Expression Web 3 Service Pack 2 Version 3.0.3816.0
If Expression Web 3 SP2 is not installed, one of the following version numbers appear based on your region and current service pack level:
1. Microsoft Expression Web 3 Version 3.0.1762.0
2. Microsoft Expression Web 3 Version 3.0.1773.0
3. Microsoft Expression Web 3 Service Pack 1 Version 3.0.3813.0
