Published Web Pages Do Not Look The Same As Preview Page

[edseward]

I set my default preview page to Firefox as this is the browser I use.

I designed a web page using the workspace and the preview pane so the page had the look and feel that I wanted.

I then use the Publish function to load the page to the server. When the upload was finished I checked to ensure both the index.html and index.css files had been uploaded to the server. I then call the page with Firefox to see how it looked on my desktop.

The displayed page was a complete mess. Paragraphs over ran each other, images over ran paragraphs, etc.

I read the forum to find out what might have caused this.

I then redesigned the web page, placing every paragraph in it's own text box, every image in it's own image box. I redid the page one element at a time, checking with the preview pane to ensure it was correct before I designed the next element. I finish the redesign using this method. The page looked good, with everything spaced properly on the page.

I then published the page to the server, checked to ensure index.html and index.css were on the server. I called the page up in Firefox. It was the same mess as the first time. I know this should not happen if the page designer is using html to store the code.

I checked the forum again, then looked at the code to see if I could discover the problem. I could not.

So once again I deleted the page and redesigned it again. I still kept each paragraph and each image in it's own box. This time I did not use the preview pane, I went direct to the server to see how it displayed. Needless to say this is more time consuming than designing using a preview pane and then uploading the finished web site to the server. But the finished web page displays properly.

I believe I see the problem. The workspace does not use the same amount of blank rows between the various boxes of content. So when you add a new box for test or image you must adjust the amount of blank rows between the two elements so the page displays properly. Which, needless to say, is very time comsuming. Sometimes you must make the adjustment two or three times, checking the page in the server each time before you get the spacing correct. I was going to provide screen shots but don't see a way to attach a file to this post.

Is there a way to set the paramenters so the spacing is the same between each element? Or so the look in the work space is the same as what you see on the server?

[Pablo]

This may be helpful:
viewtopic.php?f=10&t=85917
or else
viewtopic.php?f=10&t=34318

if you need further assistance then please include the URL of the page or a link to your project file.

[jerryco]

As always, I don't know if you know this, but if you expect to see an updated page and it doesn't show, give the browser a hard refresh (Ctrl+F5) to see if that helps.

[edseward]

I had already read viewtopic.php?f=10&t=34318 and applied that to the web page by making each paragraph and image a separate box.

I have made the change in viewtopic.php?f=10&t=85917 and will create another page this coming week to see if that fixes the problem for me.

If I still have the problem after this last fix I will post the working files of both pages. No sense wasting your time with the working file of this page if this fix solves the problem for me.

I doubt the url will show you much but it is http://superiorlanding.com/.

[edseward]

As always, I don't know if you know this, but if you expect to see an updated page and it doesn't show, give the browser a hard refresh (Ctrl+F5) to see if that helps.

Thanks for the advice but that wasn't the problem. I was also checking the page in all three browsers to see if it was a browser problem but all three would show the same thing.

The problem was the design in the preview page would be perfect while the published page would have the various elements over riding each other or have huge gaps between the paragraphs, etc. I quit checking the design in the preview and just published each change to see how it looked on the servier. It would take several trial spacings of each paragraph or image in the workspace, with a publish to server after each change, to get the elements close enough to be acceptable.

Hopefully this last change in viewtopic.php?f=10&t=85917 will fix the problem for me.

But I do appreciate your suggestion.

[Pablo]

I doubt the url will show you much but it is http://superiorlanding.com/.

Where exactly on the page do I need to look to see the problem?

[edseward]

Please don't worry about it until I create the second page and see if your suggestions fixed the problem for me.

But in answer to your question the problem is the uneven spacing between the different elements. This page is close enough that I am not going to spend the time to redo it. But the spacing between all the paragraphs and images should be the same.



I hope these two images show here so you can see what I mean. But please don't worry about it for now. I will be creating another web page in the next few days and the problem may no longer exist now that I made the change you recommended.

Ed

[Pablo]

In the suggested FAQ articles you can learn more about optimizing the text.
Or you can use flexible layout, in which case the spacing will always be the same