Expression® Web Design

Adobe Photoshop Express

Thursday, March 27, 2008

Adobe announced they are offering a version of Photoshop at no charge on their web site.  I have not had the opportunity yet to take a test drive, but this might be useful to some users.  (By the way, on Opera 9.25 the test drive link had a few issues.

So if you were looking to use Adobe Photoshop and just could not afford it, here is a way for you to use some of the features of Adobe Photoshop at no charge.

They also seem to give you 2G of hard drive space as well at no charge

There's nothing sadder than a photo without a home. You hate to see that. Give your photos a free ride with Photoshop Express. Just sign up, then start uploading, polishing and showing off up to 2 GB of photo on our dime.

Now of course, one thing comes to mind with the brand Adobe Photoshop Express - FrontPage Express.  Maybe a coincidence, maybe names are now on the verge of running out, or maybe Adobe thinks Microsoft has a good naming convention?

Replace Options

Tuesday, March 18, 2008

Microsoft Expression Web offers users a variety of ways to Find and Replace text and source code in your web page.  You might have even seen this dialog box in the past when you were trying to locate some text.  To get to to this dialog box, you can hit CNTL-H or go to Edit - Replace.

This dialog box will offer you a multitude of options.  You can find and replace HTML source code or the text the user sees in the browser.

Find What

In this text area, you can enter HTML source code, or the text you see as in the Design mode.  The arrow pointing to the right will give you some options like any single character or the beginning of the line.   The arrow pointing down will give you some of the previous code / text that you replaced earlier.

Replace With

In this text area, you can enter the HTML source code or text that you want to be seen.  You will always want to be careful with this and consider making a back-up copy of your web site.

Search Options

The search options can vary depending on what you have selected previously. 

• You can choose All Pages which will make changes in your entire web site.
• You can choose Open Page(s) which will make changes in all your pages you have opened - these pages are found near the top of your page you are working on.
  
• If you have selected pages from your Folder List, this option will be available to you.
• Current Page is the page that you working on when you opened the Find and Replace dialog box.

Advanced

Here you can choose even more specifics (i.e. match case). This might be important if you have mixed case on your web site.

Ignore whitespace differences would come in handy when you are replacing chunks of code.  For example, if you hit the tab key when entering some text while in code view, you will have some extra spaces.  Ignore whitespace differences will help with this.

Find in source code will help you once again when you are replacing HTML source code, not just the text the users see in the browser.

Of course, before doing anything like this, create a backup copy of your web site.  If you are doing just one page, you can easily create a copy of that as well.

File Includes

When working with FrontPage, you had the option of using FrontPage Page Includes.  This made it very easy to have the same content on all your web pages.  You would go to Insert - Web Component.  In the Component Type on the left, you would choose Advance Controls.  Now in the right side of the dialog box, you see HTML.  Choose this and Finish.  Now browse your FrontPage web site for the HTML you would like to include.  This was one of the very few FrontPage components that was handled by FrontPage and locally and did not rely on FrontPage Server Extensions (FPSE).

FrontPage also had an option called shared borders.  This component relied heavily on FrontPage Server Extensions and would be corrupted very easily; through ten shared borders.  Some people relied on these since they were fairly simple to use.

FrontPage also offered a Dynamic Web Template (DWT) that was managed locally by FrontPage.  You created a "template" via FrontPage, made some regions editable and uneditable.  The editable regions were then able to be changed on any new pages you attached to the template.

The real benefit was that you were able to see what the web page would look like before publishing it on the web server.

Another method was frames but these just even had more problems, especially with search engines.  And a lot of web developers new to the HTML world had problems usually with it.  One of the other problems was with the search engine results.  If the search engine directed the user to the specific link in your web site, then users would not see any other frame (possibly your navigation).  See a video tutorial on what might happen if you use frames.

File Includes

However, each of these methods had it's pitfalls, but there is another solution and some of the Expression Web users are relying on these methods now.  Files are actually included by the server through a process.  You have a variety of options to use.

Server Side Includes

The first one we will look at is Server Side Includes (SSI).  SSI can be used usually on all platforms (*NIX and Windows) with an .shtml or .shtm file extension.  You use this directive:

<!--#include file="includes/nav.html" -->

This will locate the nav.html in your includes folder and insert it into your web page before being rendered in the browser.  There is also a way to have an *NIX server parse .html files as an .shtml file, which would help in not renaming the files.  You can see an example of a web site using Server Side Includes.

ASP Server Includes

Active Server Pages (ASP) is usually ran on a server with some version of Windows installed.  You can insert the page by adding

<!--#include file="includes/nav.html" -->

to your code.  This is using a relative path to your nav.html file.  You can also use a virtual path

<!--#include virtual="/includes/nav.html" -->

This comes in handy on your 404 Error Page depending on how many folders you have, where the user might have come to get your 404 Error Page, and how the server actually handles the page.  You can also download an example of a web site using ASP Includes.

PHP Server Includes

PHP Server Side Includes will come in very handy if you are using PHP to build your web site. 

<?php include("includes/nav.html"); ?>

Is the directive you can use to include you nav.html file in your PHP file.  You can download an example site using PHP includes.

ASP.NET File Include

A lot of ASP users are attempting to migrate over to .NET, some with great success and some with very little success.  And then you have the few (like me) that would like to still see ASP supported forever.  But if you find yourself where you are using .NET and need to include a file:

<%
Response.WriteFile ("includes/nav.html") 
%>

JavaScript Includes

This is one that I do not recommend.  You need to convert your HTML into JavaScript for it to be included into your HTML page.  Plus, if the user does not have JavaScript enabled on the browser, the included content might not show.  Search engines might also have a problem reading the information in the JavaScript.  The one good thing about this is you do not need to worry about re-naming you .html files to .shtml or .asp. 

For example, if you HTML code was something:

| <a href="/default.asp">Home</a> | <a href="/about.asp">About</a> | 
<a href="/contact.asp">Contact</a> |

Then the JavaScript file would look something like

<!-- 
document.writeln("| <a href=\"/default.asp\">Home</a> | 
<a href=\"/about.asp\">About</a> 
| <a href=\"/contact.asp\">Contact</a> |"); 
//-->

To include this file into your HTML web page, you would add:

<script src="includes/nav.js"></script>

This even sounds more complicated than the others as well.

Some of the Differences between FrontPage Includes and Server Side Includes

As discussed previously in FrontPage Includes, users were able to actually see the included content.  However, if it is a server side include, users were unable to see this content and sometimes it was more difficult to work with.

In FrontPage Includes, FrontPage required the page that was going to be included to have a "complete" HTML page, for example, the page needed to have the <html>, <head>, and <body> elements to be displayed properly. 

In a Server Side Include (SSI, ASP, PHP, .NET), you only want to include the code that you want to be seen.  For example, you would only have:

| <a href="/default.asp">Home</a> | <a href="/about.asp">About</a> | 
<a href="/contact.asp">Contact</a> |

in the HTML page.  If you include the <html>, <head>, and <body> elements, chances are it will still display properly, but some browsers might not show everything properly.

Expression Web will still show the FrontPage Page Includes since the Includes are handled via the program.  Now if you wanted to change to some type of server side includes, you can do a Find - Replace in the Source code.  If you do this, create a backup copy of your web site before changing this.  This will help you in case something goes wrong. 

404 Error Page -Not- Found

When creating a web site in today's time, it is imperative that you consider creating a 404 Error, Page Not Found.

Basically, a server has a list code, 18 in the 400 arena, that mean different things.  The 404 Page Not Found is one of the basic ones that is found a lot of times, no matter how large or small your web site is.  You might have accidentally linked to an image, and that image is no longer in your web site.  Now, the user won't see this page, but the server will tell the browser 404 on that file and the browser will stop trying to download the file.

Over the years, some 404 pages have be very comical and there is probably still a race going on somewhere to see who can great the funniest 404 Error page.

Proper 404 Pages

When a user goes to your web site, he / she excepts to see a certain page. After all, he clicked on a link from a search engine and your URL told him this was what he wanted.  However, when he clicked on it, that information is no longer on that page.  Maybe you re-did all your pages as a server-type so you could use Server Side Includes (SSI).  Maybe you re-did your web site so that it was easier for you to organize.

Helpful Web Sites

And of course there are web sites dedicated to 404 Error pages.  There is the 404 Research Lab and the 404 Lounge.