ptg 432 HOUR 24: Publishing Your Website FIGURE 24.3 When selecting FTP as the pub- lishing method, you need to insert the address with the FTP protocol in place of the regu- lar HTTP protocol. your computer to the server and vice versa, but not all Internet service providers and web hosts allow multiple connections (therefore the term “maximum connections”). Figure 24.3 shows the FTP setup for the MyKipple.com site with the username blocked out. Note that the FTP protocol is specified in the prefix of the address, so the address starts with ftp:// instead of http://. Finally you have the option to turn on passive FTP if active FTP is not available. (Active FTP is often blocked by firewalls but you can normally get through using pas- sive FTP.) Secure Shell File Transfer Protocol (SFTP/SSH) In spite of what the name suggests, Secure Shell File Transfer Protocol is not regular FTP run under Secure Shell (SSH) but rather a file transfer protocol in its own right. Whereas FTP transfers all your file content and other data (including your username and password) in plain text between your computer and the server, SFTP transfers this information under encryption making it extremely hard to intercept or exploit. That said, for you, the user, there is no discernable difference between the two. The setup for SFTP is almost identical to that of FTP with the exception of SFTP not having the option of using Passive FTP. From the Library of Lee Bogdanoff ptg Six Different Publishing Options 433 File Transfer Protocol over Secure Sockets Layer (FTPS/SSL) FTPS is an FTP protocol that uses a Secure Sockets Layer (SSL) for added security. An oversimplified explanation of the difference between SFTP and FTPS is that whereas SFTP encrypts the data as part of the transfer protocol, FTPS adds a layer of encryp- tion on top of the FTP transfer. Another way to think of the difference is that SFTP encrypts all the data to binary code before it is transferred whereas FTPS sends the plain text data inside an encrypted connection that can be read only by the clients and servers that share the same authentication key. As the name Secure Sockets Layer implies, FTPS employs a second layer of constant challenging and verification of the authenticity of the transfer between the client and the server. For this reason FTPS works only with hosts that have a valid SSL certificate and supports SSL. And in many cases to get this service, you have to pay extra. Setup of an FTPS connection is identical to the setup of a regular FTP connection because with the exception of the added secure layer, there is no difference between them. FrontPage Server Extensions You were briefly introduced to FrontPage Server Extensions in Hour 21, “Working with Flash and Silverlight,” when you used them to create an email form. FrontPage Server Extensions are a set of small programs that run on the web server and give you the ability to add functionality (such as the ability to generate and send emails) to web- sites. More than that, they keep tabs on your files both locally and on the server to ensure that elements such as hyperlinks are updated if a file is moved from one folder to another, and so on. They follow your web-authoring process to tell you what files have been altered either by yourself or someone else on your team and whether the files on your computer are newer or older than the ones on the server. As the name suggests, FrontPage Server Extensions were introduced with Microsoft’s old web design program, FrontPage, and they have become common throughout web servers, espe- cially those running Microsoft Windows Server software. The name FrontPage Server Extensions might be a bit confusing because you are actually talking about many dif- ferent things: the extensions that run at the heart of the server, the extensions that run independently inside your files (such as the email form functions), and the exten- sions that run in your authoring program keeping tabs on your files and your work. When you check the FrontPage Server Extensions option in the Remote Web Site Prop- erties dialog, you tell Expression Web 3 that the server you are publishing the site to has FrontPage Server Extensions installed and that you want to use this technology to From the Library of Lee Bogdanoff ptg 434 HOUR 24: Publishing Your Website Watch Out! FIGURE 24.4 After selecting FrontPage Server Extensions as your publishing method, enter the destination address in the address bar along with your username and password. communicate the files to and from the server. After set up, the application uses the HTTP or HTTPS protocol to send and receive file contents. This is the same protocol you use when you surf the Internet (the http:// prefix in front of all web addresses), which means that even if you are on a computer behind a strong firewall, if you can surf the Internet, you can use FrontPage Server Extensions to publish content. To set up FrontPage Server Extensions as your upload option, select the option from the list, and enter your Remote Web Site location in the address box along with the username and password, as shown in Figure 24.4. You can use FrontPage Server Extensions as your publishing method only if your web server supports this technology. If it does not, you immediately get a warning mes- sage saying the current settings will not work, and you are directed back to the Con- nection Settings dialog where you can make a different choice. FrontPage Server Extensions Are on the Way Out Despite their popularity, Microsoft has not supported FrontPage Server Extensions for some time. For this reason, there have not been any security updates to the technology for several years, and many web hosts are now stepping away and dis- continuing their support for these scripts entirely. If you plan to use FrontPage Server Extensions, it is imperative that you contact your web-hosting service to make sure it is supported now and in the future. From the Library of Lee Bogdanoff ptg Six Different Publishing Options 435 FIGURE 24.5 The error mes- sage generated when WebDAV fails can be mis- leading because WebDAV and FrontPage Server Exten- sions are mutu- ally exclusive. Web Distributed Authoring and Versioning (WebDAV) WebDAV stands for Web Distributed Authoring and Versioning and is an extension of the HTTP protocol that provides better security in the form of encrypted transmissions (to keep your data secure), file versioning (to prevent files from being overwritten when more than one person is working on them at the same time), and authentica- tion. Unlike FrontPage Server Extensions, which are add-ons, WebDAV is already built in to your operating system to handle external links to HTTP addresses. Setting up WebDAV as the publishing method is done the same way as setting up FrontPage Server Extensions: Simply select the WebDAV option and insert the destina- tion address, username, and password. Also as with FrontPage Server Extensions, WebDAV has to be supported by your web server for it to work. If it is not supported or not turned on for your specific plan, you cannot access the server, and Expression Web 3 generates an error message. Unfortunately, this message causes a lot of confu- sion because the first item on the list of possible reasons why the connection failed is that the server does not have the FrontPage Server Extensions installed (see Figure 24.5). This suggestion is misleading because WebDAV and FrontPage Server Exten- sions are mutually exclusive. In fact if WebDAV fails, it could mean that FrontPage Server Extensions is installed on the server and is blocking WebDAV. If you get this message, contact your web-hosting provider and ask whether WebDAV is supported, and if so whether FrontPage Server Extensions is interfering with your connection. File System The final option is to host your website in a folder on your local computer or in your local network. That option can also be used to place your files on removable devices such as data discs, USB (Universal Serial Bus) keys, PDAs (Personal Data Assistants), From the Library of Lee Bogdanoff ptg 436 HOUR 24: Publishing Your Website MP3 players, or any other storage device that can be connected to the computer. That way you can bring the website with you without having to lug around your entire computer. The file system option is frequently used when publishing to local networks and corporate intranets in which the web server is on the same network as the com- puter used. If you publish to a local drive, all you need to do is insert the folder name in the address bar. If you publish to a local network location or a mapped drive, you need to insert the Universal Naming Code (UNC) path for this location. A UNC path looks like this: \\myServer\sites. Example: Publishing Content Using SFTP You now have a basic idea of what the six different publishing methods offer and when to use them. After you select a preferred method, the actual publishing process is the same. The method that is most readily available and at the same time secure is SFTP; so in this example you see how to use SFTP to publish your website to an exter- nal web host. 1. With the MyKipple site open, in Site view, click the Add publishing destination link in the middle of the window, or click Publishing Settings in the top-right corner, and under the Publishing tab press the Add button to open the Connec- tion Settings dialog. 2. In the Connection Settings dialog, set the name to MyKipple SFTP Connection. Select SFTP; enter the destination address provided by your web- hosting service. If you publish to a specific folder, enter the folder name in the FTP Directory box. 3. Under Credentials insert the username and password provided by your web host. Leave the Maximum simultaneous connections at 4 and click Add. If you started by opening the Publishing Settings you need to click OK in the Publish- ing Settings dialog to complete the process. When you add the new connection, the blue link in the middle of the Publishing view changes to say “Connect to the current publishing destination.” Clicking this link logs into your new connection automatically. Depending on your Internet connection and your web host, this initial login procedure might take a little bit of time, and while it is working the control bar at the top of the Site panel will be blurred out. After successfully logging in, you are presented with a view like in Figure 24.6 with the local website on the left and the remote website on the right. The left column From the Library of Lee Bogdanoff ptg Example: Publishing Content Using SFTP 437 FIGURE 24.6 When you are logged in to the web server, you can see both the local files and the remote files and move them back and forth. shows all the files in the folder you defined as your website project in Expression Web 3. The right column shows all the files currently at the remote location you defined in the address bar in step 2. Expression Web 3 uses icons to tell you about the status of the files in your local and remote locations. In front of every file is an arrow pointing right (file to be published to the remote location) or left (file to be downloaded from the remote location), a question mark (Expression Web 3 is unsure what to do with this file), or a red balloon with an x in it (don’t publish this file). When you log in to your remote location for the first time, all the files in your local view have an arrow pointing right because none of the files are in the remote location yet. How you proceed from this point depends on what you want to achieve. For example, if you publish your entire site to the remote location for the first time, all you need to do is press the blue arrow button in the middle going from left to right. This sends a copy of all your local files and folders to the remote location. Depending on how many files you have in your website, publishing the entire web- site to a remote location can take quite a bit of time. And it might look like Expression Web 3 stalls in the process. In general, publishing large sites to a remote server is a test of patience, so I usually start the process and then leave the computer to work on its own to avoid getting annoyed at how long it takes. Watch Out! From the Library of Lee Bogdanoff ptg 438 HOUR 24: Publishing Your Website If you have previously published files to your remote server and you have made changes to only some of your local files, Expression Web 3 inserts the arrow icons on only the files that have been changed, and you can use the same option as before to overwrite the old files on the remote location with the new ones. If files on the server have been changed since you last uploaded them, Expression Web 3 signifies that by attaching an arrow pointing to the left to the files in the remote location. This usually happens if you or a colleague uploads new files from a different computer or if someone made changes to the file directly on the server. To transfer these files from the server to your local computer, you simply click the arrow in the middle pointing left. In some cases, alterations have been made to both local files and remote files. If that is the case, you can use the Synchronize files button in the middle column (the one with two arrows pointing in opposite directions). Use this function with caution because sometimes even though the files on the server are newer than the ones in your local folder, they might not be the ones you want to keep, and you could inad- vertently overwrite important files in your local version of the site. In addition to using the publishing options from the menu, you can also drag and drop files and folders between Local and Remote view. This is actually an effective way to perform targeted updates and give you detailed control of which files are located where. You often find that your local folder contains many files that should not be put on the remote location for different reasons. For example, there is no reason to upload the Dynamic Web Template file to the server because it is functional only within Expression Web 3. To prevent a file or folder from being included when Expression Web 3 suggests files that should be uploaded or downloaded, right-click on the file and select Exclude from publishing from the pop-up menu (see Figure 24.7). A red balloon icon is attached to the file, and it will be ignored in the publishing process. Advanced Publishing Settings You can change the way Expression Web 3 handles local and remote files by default and configure the application to make changes to the files as they are uploaded. This is all done from the Publishing tab in the Site Settings dialog. Optimizing HTML Under the Publishing tab you have an option called Optimize HTML during publish- ing. If you check this option and click the Customize button that becomes available, From the Library of Lee Bogdanoff ptg Advanced Publishing Settings 439 FIGURE 24.7 To prevent a file from being uploaded or downloaded, right-click on it and select Exclude from Publishing from the context menu. you are taken to the HTML Optimization Settings dialog. From here you can instruct Expression Web 3 to remove all or part of the nonfunctional code in your HTML pages (see Figure 24.8). This option is available because both designers and developers using Expression Web 3 tend to insert a lot of nonessential elements in HTML pages to make them easier to understand. Among these elements are com- ments explaining the different sections, Dynamic Web Template comments, and whitespace. You can also remove code generated by the application. The rationale behind removing this content is usually to either reduce the file size to improve load FIGURE 24.8 You can config- ure Expression Web 3 to remove all nonfunctional code from your HTML pages. From the Library of Lee Bogdanoff ptg 440 HOUR 24: Publishing Your Website times (although this improvement will be negligible at best) or to make the HTML page less readable for people who take a sneak peek at the code. There are several options for HTML optimization, and when they are checked, the selected components are removed as the files are published to the remote location. Here is a quick rundown of each option: . All HTML Comments—All HTML comments whether inserted by Expression Web 3 or yourself will be removed. HTML comments are ignored by the web browser and are visible only in the source code. They always start with <! and end with >. . Dynamic Web Template Comments—In Hour 19, “Dynamic Web Templates,” you learned that the editable regions in pages based on Dynamic Web Tem- plates are inserted with HTML comments. These code sections relate only to Expression Web 3 and have no purpose outside the application. . Layout Tables Comments—When you use the Layout Tables function to create layouts in Expression Web 3, the application includes comments to these tables. . Script Comments—Expression Web 3 includes comments when inserting JavaScript and other script elements in your HTML pages. Likewise, it is com- mon to attach comments to scripts to help remember what they do. . All Other HTML Comments—This option covers all comments not covered by the other categories and can be used to remove only the comments you inserted without touching the comments Expression Web 3 created. . HTML Leading Whitespace—The leading whitespace is the empty space before the first character in each line. . HTML All Whitespace—In addition to leading whitespace, you can have inline whitespace and empty lines. . Expression Web Tracing Image and Interactive Button Attributes—When tracing images and interactive buttons are inserted into a page, Expression Web 3 adds attributes to them for editing purposes (that is, allowing you to open and edit the interactive buttons). These attributes relate only to Expres- sion Web 3 and have no function in a web browser. . Generator and ProgID Tags—The Generator and ProgID tags used to be inserted in HTML pages to tell the browser what program was used to create and edit them. This is not done by Expression Web 3 but can apply to pages originally created in other web-authoring applications. From the Library of Lee Bogdanoff ptg Advanced Publishing Settings 441 All the changes made by the Optimize HTML options are applied as the files are pub- lished to the remote location. Your local files are not changed. However, if you apply any of these options and then later overwrite your local files with ones from the remote location, all the content that was removed when the files were published will be removed locally as well. The Publishing Tab From the Publishing tab (see Figure 24.9), you can add, edit, or delete the publishing destinations for the current siteIn addition, and you can tell Expression Web 3 to publish subsites and generate a log file each time it publishes content. By default, only pages and folders contained within the main site are published by Expression Web 3. But if you have subsites defined in your project that you want published at the same time, you can check the Include Subsites option. When you open the Publishing view of your Site, Expression Web 3 makes an edu- cated guess as to what files it thinks you want to replace in your local and remote locations. By default it does this by comparing the modified dates of the files in both locations. However, if you work on the remote files as a team, from several different computers, or on the server itself, it can be almost impossible for Expression Web 3 to know which file is the correct one. Finally, you can choose whether to let Expression Web 3 create a log file during pub- lishing. If this box is checked, an HTML page is created and stored in your Tempo- rary Internet Files folder so that you can check to see that the publishing process went according to plan. FIGURE 24.9 You can add, edit, or delete the publishing destinations for the current site. From the Library of Lee Bogdanoff [...]... understanding of the code language ▼ Try It Yourself Downloading and Installing the Starter Kit The Expression website features learning tools such as videos, articles, tutorials, and downloads to help you start to use the different applications in the Expression Suite For Expression Web 3, the Starter Kits can be a great help when taking your first steps with ASP.NET 1 In your web browser, go to http:/ /expression .microsoft. com,... HOUR 24: Publishing Your Website To view the log file after publishing a site, click on the View Your Publish Log File option under Status in the Publishing view This opens the log in your web browser for you to inspect If you want to save the log file, select Save As under File in your browser At the bottom of the Publishing view panel there is a new section added in Expression Web 3 that provides information... properly linked from within Expression Web 3, you can open the pages, make changes, and test the site from within the program through Expression Development Server From the Library of Lee Bogdanoff 448 BONUS HOUR 25: Beyond the Basics, Part 2: Building a Site with ASP.NET FIGURE 25.2 Create a new empty website located in the folder you just installed This lets Expression Web 3 know that there is a site in. .. existing ASP.NET site Introduction In Hour 19, “Dynamic Web Templates,” you learned about Dynamic Web Templates (DWTs) and how to use them to create an easily updateable website with a consistent look Then in Hour 22, “Beyond the Basics, Part 1: PHP in Expression Web 3, ” you got a first glimpse of how server-side scripting can be used to create websites with highly advanced dynamic content and interactivity... information about your publishing status This area lists the Last publish status (whether files were published successfully, and if there were problems what they were) as well as last publish time and also provides a link that says “Open destination site in Expression Web. ” This link opens the external site in a new instance of Expression Web 3 and sets it as the local site for that instance That way you can... is done from the Remote Web Site Properties dialog In this hour, you learned how to set up your site in Expression Web 3 for publishing to the desired location And with that you have reached the end of the road of the initial design and deployment process But this is just the beginning When your From the Library of Lee Bogdanoff Workshop 4 43 website goes live and you start getting visitors, you probably... you know how to use Expression Web 3, you can apply the techniques you have acquired to build your knowledge of HTML, CSS, ASP.NET, PHP, and all the other technologies available to you and make informative and entertaining web experiences for the world to see Q&A Q I tried uploading my site to my web host using FrontPage Server Exten- sions/WebDAV, but when I do, I get a warning saying that FrontPage... Part 2: Building a Site with ASP.NET want the title, keywords, and description tags to be inside an editable region so that they can be customized for each individual page 1 In Code view, find the ContentPlaceHolder tag for the head content (It should be on line 9.) 2 Create a new line between the beginning and end tags and cut and paste the Main tags from line 7 into the new line (see Figure... files in the remote location as if they were on your local computer Summary By following the tutorials in this book, you have created a basic website with a lot of functionality The last step of any web design process is to publish the site so that others can access it and enjoy the results of your hard work That is when Expression Web 3 goes from being a web design and authoring tool to becoming a... of answering questions and doing exercises, I am giving you a challenge instead: Take all the things you learned from reading this book and use them to create your own fantastic website When you finish, submit it to the book website at http:/ /expression. pinkandyellow.com, and I will post it for the world to see And last but not least, have fun! From the Library of Lee Bogdanoff This page intentionally . provides a link that says “Open destination site in Expression Web. ” This link opens the external site in a new instance of Expression Web 3 and sets it as the local site for that instance. That way. Whitespace In addition to leading whitespace, you can have inline whitespace and empty lines. . Expression Web Tracing Image and Interactive Button Attributes—When tracing images and interactive. your website project in Expression Web 3. The right column shows all the files currently at the remote location you defined in the address bar in step 2. Expression Web 3 uses icons to tell you