Dreamweaver FAQ » Dreamweaver 8

Can I create all my pages in Photoshop and bring them into Dreamweaver as an image?

janinewarner — Mon, 06 Feb 2012 22:43:36 +0000

Janine

I just finished your Dreamweaver For Dummies book. I found it to be right on the money.

However, I have a question. I’m a photographer and graphic designer. I’m most comfortable working in Photoshop. Can I create all my pages in Photoshop and bring them into Dreamweaver as an image rather than create them from scratch? If this is possible can I then create hotspots to link the pages for example a thumbnail linked to the enlarged photographs?

Thanks for any help,

Barry

Hi Barry,

Thanks for the kind words. Yes, you “can” do that, and some sites are designed that way. There is even a ‘slicing’ tool in Photoshop designed for this purpose.

Before you rush off to do that, however, here are two reasons most web designers would not recommend that approach.

1. Images take longer to download than text so saving the entire page as an image often results in a web page that take a really long time to download — at the very least, make sure you are using the File> Save for Web and Devices dialog to optimize the images.

2. Search engines can’t ‘read’ the text on an image so your website will suffer when it comes to search engine results if all of your text is saved in images.

If you can live with those consequences, I make no judgement about your need to design your pages the way that works best for you. That said, what most of us do is create the design in Photoshop, Fireworks, or InDesign, then save the images (the parts that really have to be images), and reassemble it all in Dreamweaver using CSS.

I hope that helps you make the best decision for your website,

Janine

How do I arrange thumbnails in a photo slideshow?

janinewarner — Wed, 01 Feb 2012 18:07:23 +0000

Hi Janine,

I’m one of your students. Thank you for your very helpful online courses.

I am writing to ask your opinion. I am a graphic designer and illustrator. I am putting together my own website and would like to show samples of my work. My thought is to have a table of 15 thumbnails and a large mage to the left of the grid. The table would have 2 columns, one with the thumbnail images and one with the big version. Then using the swap image feature in Dreamweaver I would set them up to swap out each image as the viewer rolls over each thumbnail. Does that sound like the most efficient way to do that?

Otherwise, I thought I would have to create a series of Div tags using margins and padding to arrange them, but that seems like a lot of div tags, if each div tag had to contain an image.

Thank you for your help. Yours truly,

Mike

Hi Mike,

Thank you for your kind words about my training . I understand why you think tables might be a good solution to this design challenge, but trust me, they’re not. The only time Tables are still recommended in web design, is when you’re formatting ‘tabular data’ — in your case, I would not recommend a table.

However, it’s not as hard as you might think, and you DO NOT need a to create a div for each thumbnail image. Consider this. You can create two divs, one for the big image, and another one for all of the thumbnail images. Then insert all of the thumbnails in that one div, each separated by a single space. Then use a style to add as much space as you want between each image.

A compound style works well here. Ex: Create a class style for the div called .thumbnails, then create a compound style called .thumbnails img and set the margins to something like 10 pixels on the left and right, or top and bottom (depending on your design). That will put 20 pixels between each image. It’s like magic how that works instantly to spread the images apart, and it’s super easy to change if you decide you want more or less space between your thumbnails later.

I hope that helps you find the best solution for your website.

Janine

I completely redesigned my site, uploaded it to my server, but it did not change. I couldn’t find the answer in your Dummies book.. maybe I am an idiot..

janinewarner — Mon, 28 Nov 2011 04:31:33 +0000

Something tells me you’re not an idiot, but there are a few reasons that your new site may not be showing up. Here are a some things to check.

1. Make sure you uploaded your site to the right place. On many web servers, if you use the FTP info they send, you enter the main folder on the server where they keep your email, web folder, etc, but you need to then open the web folder and upload your files into that folder. It’s often called something like htdocs, or webdocs, or it could be named the URL of your site. It depends on your server, but the key thing to know is that you need to upload the files for your new site into that folder for them to become visible at your URL.

On a related note, a good way to make sure you’re in the right folder is to look for the pages of your old site, make sure you find the main page of the site, and then replace it with the main page of the new site and all of your other files.

2. Make sure you named the main page of your site correctly. On most servers, the main page of your site should be named index.html, but some servers are set up for default.html. It’s often okay to use .html or .htm — they work the same. However, if the main page of your old site is called, say, default.htm and you upload the new version with a main page named index.html, you won’t see the new page if the server is still ‘serving’ the old default.htm page.

Whatever the main page of your old site was called, assume that’s what you should name the main page of the new site and make sure you replace the old page with the new page.

I hope that helps and I wish you all be best with your newly redesigned site.

Janine

What is the difference between using Appearance (HTML) or Appearance (CSS) in the Page Properties Dialog Box? They both seem to have most of the same options.

janinewarner — Wed, 02 Nov 2011 01:30:42 +0000

I strongly recommend Appearance (CSS). That option will cause Dreamweaver to create CSS styles that correspond to the Page Properties settings, which is the recommended way to define page properties today. To see how this works, create a new blank page, set the page properties with the CSS option selected, and then you can study the styles DW automatically creates by looking for them in the CSS Styles Panel.

If you choose Appearance (HTML) DW uses the HTML attributes, which are no longer recommended.

Janine

How do I remove Skype formatting from phone numbers on my web pages on my websites?

janinewarner — Fri, 21 Oct 2011 06:37:13 +0000

Skype automatically highlights any phone numbers displayed in a web browser to make it easy to ‘click to call’ the numbers. Just because you see this formatting on your computer, doesn’t mean other people see it. Skype formatting on phone numbers is specific to each person’s computer, not to the general formatting of a web page.

That means you can’t really control whether other people see phone numbers on your web pages with skype formatting, but you can remove it on your own computer. I for one, found they formatting — and the way skype changed the size and display of phone numbers — annoying!

It can also be problematic that if you copy and paste a phone number that skype has highlighted, you get a bunch of skype code when you paste it, which means you have to delete a bunch of unecessary characters if you do something like copy and paste a number from a web page into an email message.

So how do you get rid of skype formatting on phone numbers?

The easiest way is to uninstall the skype “click to call’ app. That doesn’t mean you have to uninstall skype, you can still use skype to make call, chat, etc, you’ll just keep skype from formatting numbers on your computer — but you can still copy and paste numbers into skype to make it easy to call any number you see on your screen. Uninstalling Skype Click to Call just removes the program that creates Skype shortcuts.

On a windows computer, you can uninstall the skype click to call feature the same way you’d uninstall any program.

1. Click on the start button

2. Choose Control Panel

3. Choose Uninstall a Program

4. Select Skype Click to Call (make sure you don’t remove the actual Skype program unless you really want to get rid of Skype completely)

5. Click the Remove button.

As soon as the program is removed from your computer, the Skype formatting should go away with it.

Note: You may need to vary these steps slightly, depending on the version of Windows you are using,

Where do I insert the Google Checkout shopping cart code?

janinewarner — Thu, 29 Sep 2011 18:44:18 +0000

Janine,

I just watched your class on E-Commerce on Kelby Training. It was an excellent class for someone like me, but I am experiencing a little difficulty in adding the Google checkout to my site. I have no problems adding the code for the items, but that 2nd piece of code that you said to put at the bottom of every page is causing me problems. I am using iWeb and I am not quite sure where to insert that code, or if it is even possible.

Thank you in advance,

Joe

Hi Joe,

Thanks for the kinds words about my training videos. I don’t know much about iweb specifically, but some web services — especially those that over simply web design and limit you to templates — make it difficult, or even impossible, to get to the right place in the code to use Google Checkout.

If that’s your situation, you may need to use PayPal instead. Unlike Google, which gives you a small piece of code for each button, and another small piece of code to put at the bottom of each page, when you use the shopping cart service from PayPal, you get all of that code in one big chunk. I still prefer the interface of Google Checkout, but in your case, PayPal may be your best (or only) choice.

I know many people prefer to learn with training videos, but I also have a written tutorial on how to use Google Checkout that may help you find the place you’re having trouble.

I hope that helps you find the right solution for your website and I wish you all the best with your online sales,

Janine
DigitalFamily.com

How do I create better URLs in my website?

janinewarner — Tue, 27 Sep 2011 15:57:52 +0000

Dear Janine,

While adding pages to my site, I have been organizing them via subfolders locally on my hard drive. This results in web pages URL’s appearing long and messy. Is there a way to enter a tag, style, or code to change the display URL on my website?

Thank you for your time,
Mike

Hi Mike,

Great question, here are few tips to help you create better URLs.

First, remember that browsers will open the index.html file in any folder or subfolder, even if you don’t type it into the URL. That means you can create shorter URLs by carefully naming folders and saving an index.html file inside each one. You can have as many index files as you want, just keep them in separate folders and make sure that you save all of the folders and subfolders in one main folder on your hard drive so that you can copy the structure to your Web server when your done.

The result is you can create a URL such as:

DigitalFamily.com/videos

if enter that URL into a browser, it actually opens http://www.digitalfamily.com/videos/index.html

Another tip, everything after the .com is case sensitive. Thus, if I had named that folder Videos, you’d have to type the V uppercase, so pay attention to that detail when you share the URL, and try to be consistent. I make all subfolders lowercase to keep things simple.

That said, everything before the .com is NOT case sensitive. So whether you enter: DigitalFamily.com or digitalfamily.com, you get to the same place, the index.html page at the main, or root level, of my site. I like to use DigitalFamily.com when I write the main URL because it’s easier to read.

Finally, search engines such as Google are known to use the URL as one of the many criteria for ranking search results. As a result, if you want to optimize for certain keywords, including them in the name of the files and folders in your site can help.

If you enter, DigitalFamily.com/dreamweaver, you go to my dreamweaver section, and the fact that I used the word Dreamweaver in the URL is probably helping me with search results (at least a little).

I hope that helps you create great URLs and I wish you all the best with your website.

Janine

I’m having trouble uploading my site changes — why?

malinda — Sat, 24 Sep 2011 19:38:52 +0000

Hello,

I wonder if you can help me, I’ve been using my website for 10 years without any problems until a couple of weeks ago when I went to upload the site after knocking an item off. Instead of just synchronizing the 2 pages I’d changed, it tried to re-synchronize the whole site and got stuck. Since then it will stick on different pictures until the connection is lost. I’ve checked everything I can think of. I did get it to synchronize off-line, but it won’t upload.

I’m using Dreamweaver 3; any ideas?

Yours in anticipation,
Jane
United Kingdom

Hi Jane,

Sorry to learn you’re having trouble. Many things can cause problems when you upload a site. There may have been changes on the Web server you use, or your version of Dreamweaver may have been damaged or there may be corrupt files in your site.

Whatever the cause, here are a few possible solutions. First, try uploading just the pages you changed, not the entire site. You don’t have to synchronize to use Dreamweaver to update your site. If you’re timing out with the Synchronize feature, see if you can fix the problem by just selecting the pages you want to update and then clicking on the Upload arrow.

Did you mean you’re using Dreamweaver 3 or CS3? If you’re using Dreamweaver 3, you really should consider upgrading; that is a very old version of the program and after years and all the changes on the web, you really can’t rely on a program that old to be stable. If you’re using version CS3, you’re probably fine, although it is also starting to get old by web standards.

Hope that helps,
Janine

Still want more? Visit the Dreamweaver Help Center at www.DigitalFamily.com/dreamweaver to find Dreamweaver tips, tricks, and tutorials.

Why do my web pages look different in Internet Explorer than in other browsers?

janinewarner — Sat, 27 Aug 2011 17:37:44 +0000

Unfortunately, different web browsers display text and HTML differently, and Internet Explorer is one of the worst, and most notorious, for bad code display. What most web designers do is test their pages in a variety of web browsers and work to make sure their pages look ‘good enough’ in all of them. Because the text size and spacing can vary from browser to browser, it’s challenging to get exactly the same display in all browsers. And if your concern is the way text wraps, it’s almost impossible. That’s because your users can change the text size in some browsers, and because text size is different between Mac and Windows computers. Here’s an article I published on my web site addressing this issue. It may help you understand why this is a challenge for all web designers. You’ll also find links to a few online testing tools that can help you make sure you site looks good, even in web browsers you may not have on your own computer. http://www.digitalfamily.com/dreamweaver/resources/web-browser-test.html I hope that helps and I wish you all the best, Janine

What’s a good way to insert audio files into a web page?

janinewarner — Sat, 23 Jul 2011 19:07:05 +0000

Many people who want to host audio on their sites are surprised that it’s harder than hosting video.

In some cases, not using a player or inserting audio well, can lead to audio files playing simultaneously. Not good.

The challenge with audio files is similar to the challenge with video, and you’d think audio would be simpler, but it’s not.

If you were hosting video clips, I’d recommend YouTube or Vimeo, which enable you to upload videos in MP4 and other video formats and then embed a little code in your site to play for your visitors.

Hosting video on YouTube, Vimeo, or any of the other video sharing sites, gives you several advantages:

1. You save on hosting fees (video and audio files are much larger than text and image sand can get expensive to host on your own server)

2. Video hosting sites automatically convert video files for you and deliver your video in the best formats for each of your visitors based on the type of web browser, computer, or mobile device your visitor is using.

3. Video hosting sites have nice, clean players that make it easy for visitors to start, stop, rewind, etc.

So if you can use Vimeo and YouTube to take care of all those things for you with video files, why can’t you do that with audio files?

The simple answer is that no one has created a YouTube-like solution for audio files, mostly because there is so much piracy in the world of music that few, if any sites, want to get involved.

So here’s a crazy solution many people are using to get around this seeming paradox and make hosting audio files as easy as it is to host video.

The first step is to turn your audio files into videos… That’s not as hard as you might image.

Start a new file in a video editor, such as iMovie or Adobe Premiere, place a still image, such as the cover of one of your books or a photo of the person doing the audio, and then copy the audio file into the video.

The result, is that your audio will play like a video and you can then save it as an MP4, upload it to a video site and embed it into your page, complete with the video player, which works like a great audio player in your case.

It’s not a perfect solution, but it seems that what you need is a way for visitors to your site to stop, start, play, rewind, etc. and converting each sound file into a simple video will make it possible to use these services.

As an alternative, you can host the audio files on your own service and set up a player on your own site. In that case consider searching for an audio player extension for Dreamweaver or some other way to host and play audio, such as a Flash player.

If you’re not sure how to add the embed code from YouTube or Vimeo into your web pages in Dreamweaver, this tutorial shows you how to copy code into code view in Dreamweaver.

Hope that helps,

Janine