Mac SEO Blog

With many iWeb users e-mailing us, letting us know that their websites do not look good in Internet Explorer, we began investigating ways to help iWeb users make their sites become a lot more compatible with Internet Explorer. In the video below, we will discuss and demonstrate seven different ways to ensure your iWeb website has a better chance at being more compatible with Internet Explorer. The following is a summary of the seven steps, with the video tutorial below.

1. Text based navigation menu (Better for all web browsers and search engines)
2. Web-safe fonts (Always a good idea to use no matter what)
3. No shadows and reflections for text and images
4. YouTube for video, not QuickTime
5. No embedded images from third-party websites
6. WebCrusher’s ‘Improve Internet Explorer Compatibility’ option (plus makes your site faster too!)
7. Check compatibility in all web browsers

Although iWeb makes it extremely easy to build websites, there are still things you need to consider when designing your websites. This video goes over many of these guidelines. Because of the nature of the web, we do have a few limitations but we can still design beautiful and professional websites with iWeb.

iWeb and Internet Explorer Video Transcript

Many iWeb users have been reporting that their websites appear abnormal when viewed in Internet Explorer. In this video, we are going to go over several ways of making an iWeb site more compatible with Internet Explorer. This doesn’t mean that everyone’s website will look perfect in Internet Explorer, but an iWeb site’s appearance in Internet Explorer can be greatly improved by following these steps.

Make sure to listen to each step carefully, and not leave any of them out. Especially one of the last steps we will talk about, which involves our application called WebCrusher, which most of you are familiar with. For those not familiar with WebCrusher, it’s an application that reduces the size of your site so that it loads faster in your users browsers. We have released an update to it, that specifically targets this issue with Internet Explorer.

The first way of making an iWeb site more compatible with Internet Explorer is to make a text based navigation menu. This is because, for security reasons, Internet Explorer may not have javascript enabled, which is what is needed to show the iWeb navigation menu. For both Internet Explorer compatibility, and SEO benefits, change your navigation menu to a text based navigation menu. So to change your navigation menu in iWeb you will first need to disable the current navigation menu. To do this click on a page of your website, open the Inspector window, select the page tab, and then deselect the option that says Include Page In Navigation Menu. Repeat this process for all pages on your site.

When this is complete, you will no longer have any links in your navigation menu. Now you will need to create a custom navigation menu using text links. Simply click on the Text Box button, type in your anchor text, resize the box, and move it to where you want it to be on your navigation menu. Then highlight the text, and press the inspector button. Then go to the link tab which is a blue circle with an arrow in it. Check the option to Enable As Hyperlink, and type in the URL or select the page from the drop down menu. Repeat this process for the remaining links. When you are all done, select all text boxes by holding down command and clicking on each text box. Then copy what you have selected. Now you will need to go to each page on your site and press the paste button. And your navigation menu will now be text as opposed to javascript.

The second step is very easy to do. Using a font that is considered web safe, will give iWeb users a much better chance at having their website load correctly in Internet Explorer. To find a web safe font, just press the Fonts button, and click where it says Web. Here is a list of about 10 different fonts that you should choose from to use on your site. These fonts should be used everywhere on your site that contains text. Using web safe fonts will increase the compatibility of your website with Internet Explorer.

The third step is also an easy one. Much like how we want to avoid using fonts that are not considered web safe, we also want to avoid altering our text and images by using shadows and reflections. Doing so will also increase our chances at having our sites load normally in Internet Explorer. So how can you check to see if your text and images have shadows or reflections? Simply click on the text or image, press the inspector button, click on the Graphics tab and see if Shadow, or Reflection are checked. If they are, you may want to consider unchecking them so that your site can be viewed better in Internet Explorer.

By default, iWeb uses QuickTime, which is installed by default on all Mac computers. This isn’t the case for Windows users, however. Instead of putting your videos on your site directly, it is a better idea to upload them to YouTube, and then embed them on your site using the YouTube Widget. This will ensure the best compatibility for users who might not have QuickTime installed on their computer.

To avoid Internet Explorer giving your users security warnings, do not include HTML Snippets that embed images from other websites. This might sound a bit technical, but basically to avoid any security popups for Internet Explorer users, only use image and media files from your local computer.

An example of something that would provide a security warning for Internet Explorer users is this;

What this does is tell the web browser to load an image from a third party website which it may interpret as a security risk.

This next step is the most important one, as I mentioned earlier in the video. In this step, we are going to be using WebCrusher. The version of WebCrusher I am using in this tutorial is 1.9. Make sure you have this version or later. It is always a good idea to make sure you are using the most recent version of any software. Visit our website at ragesw.com to make sure you have the latest version.

The first thing you will need to do is open the Preferences by clicking on WebCrusher in the menu bar, and selecting Preferences. Next, under the Tag Optimizations heading, look for an option that says Improve Internet Explorer Compatibility, and make sure it is selected. Close the preferences window, and drag and drop your website folder onto WebCrusher like you normally would.

In the bottom left corner, there is a button that says Options. Click on that button, and make sure that Only Optimized Modified Files is not checked. The reason for this is because we want to make sure we apply the Improve Internet Explorer Compatibility option to every page on our site. Then, you can press Go and optimize your site and publish it like you normally would.

Since every website is built differently, it is still very important to check your site’s compatibility by visiting your site in as many browsers as you can. The most important thing to understand is that your site will not be perfect in many browsers, especially older ones such as Internet Explorer 6 and 7. Following the above steps, especially the step involving WebCrusher will make your site look much better in Internet Explorer 8 and higher. It is important to note that you should not expect perfection, but combining all of these methods should result in your site looking very good.