none
Superpreview in Expressionweb 3 does not work RRS feed

  • Question

  • I have a new computer.  Started with FP 98 way back - on my old computer I piled up all the upgrades on top of FP 98 till ExpressionWEb.  When I got new computer - I upgraded to EW3 - put upgrade CD in new computer and followed directions.  Thought it might ask for code numbers from my other upgrades or the original FP 98, but it did not.  It never asked me for any previous versions.  During the installation process it  did validate my email address.  About EW3 shows service pack 1 installed 11/26/2011.

    I am not happy with EW3 right now.  In design view, I have to pile all my layers on top of one another - no WYSIWYG at all!! - if I preview that page using the icon previewing in IE 8 - I can get a pretty good picture of how it will look.  I have even published it and it does look like that preview.  BUT, if I use Superpreview - all I see is the same design view page - with all the layers piled on top of one another in a jumbled mess.

    Makes me with for FP back again.  Would appreciate any help.

    Monday, January 3, 2011 6:29 PM

Answers

  • When you said "In design view, I have to pile all my layers on top of one another - no WYSIWYG at all!!", I assume that you really do mean layers (absolutely positioned DIVs). That's one of the problems with WYSIWYG--treating web design like desktop publishing. You can't control the user's viewing experience.

    But why do you point out that you have to pile them on top of one another? That's what layers are. What do you really mean?

    If you really are using layers, I can guarantee you that you your site looks different on other browsers, and it's probably a mess. It's also probably very fragile--highly susceptible to breaking if someone has their browser set to different settings than yours (especially zooming text-only--many Dell laptops now come with text-only zoom already set to larger from the factory).

    Here's a test--switch IE8 from standard to Compatability mode (or, more probably, Compatability mode to standard). I bet the site breaks in one of those settings. Also, install Firefox, Chrome, and Opera browser and check how it looks in each of them. That's how you should work--previewing often in multiple browsers.

    EW is not an upgrade to FP. It is a new product, and as the MS site says, it's purpose is to allow users to develop standards-compliant websites--something that FP never did. FP came from an age when IE5/6 ruled the roost (and rendered in its own quirky way. Those days are over, and you'll need to deal with at least 5 popular browsers (including 2 very different versions of the IE rendering engine--IE7 and IE8) as well as a few hoary old hangers-on.

    Time to learn how to do a site properly, which means discarding layers. There is no use for them in daily use and unless you know the pitfalls, you can get in deep doo-doo.


    What do you mean, " 'twas brillig"?!?
    Monday, January 3, 2011 8:06 PM
  • I have a fast fix for you.

    Get rid of the layers: your site is broken when you use them.

    To see this, open your site in Firefox, set View->Zoom to text only, and hit Ctrl-+ a couple of times.

    Layers don't let text containers expand when text is resized - as many of your visitors will do.

    Plain old divs, not layers, will expand.  Use them instead.

    Note that you have your content placed in an order different from the one you want to display on the page.  Don't do that.  You'll need to reorder the divs so that content occurs as you expect the page to flow: in order.

    Monday, January 3, 2011 9:13 PM
  • That is not his last sentence, it is his signature, and is a quote from "Jabberwocky," from Lewis Carroll's "Through the Looking Glass." Before that, what he was trying to tell you is that you shouldn't be using layers at all, or tables, for that matter.

    Do you realize just how broken your site is for a vision-impaired user (like the middle-aged and older folks who probably are a good part of your target market)? Open the page in Firefox, set View|Zoom|Zoom Text Only, then hit Ctrl-+ a few times and watch your layout break all to hel and gone. That's what absolute positioning (i.e. layers) will do for you. Not pretty, and completely unnecessary.

    That page is about as simple as they get, and the whole thing could be done with a few divs, zero tables, and no CSS position attributes anywhere. None.

    cheers,
    scott
    Please remember to "Mark as Answer" the responses that resolved your issue. It is common courtesy to recognize those who have helped you, and it also makes it easier for visitors to find the resolution later.
    Monday, January 3, 2011 9:16 PM

All replies

  • When you said "In design view, I have to pile all my layers on top of one another - no WYSIWYG at all!!", I assume that you really do mean layers (absolutely positioned DIVs). That's one of the problems with WYSIWYG--treating web design like desktop publishing. You can't control the user's viewing experience.

    But why do you point out that you have to pile them on top of one another? That's what layers are. What do you really mean?

    If you really are using layers, I can guarantee you that you your site looks different on other browsers, and it's probably a mess. It's also probably very fragile--highly susceptible to breaking if someone has their browser set to different settings than yours (especially zooming text-only--many Dell laptops now come with text-only zoom already set to larger from the factory).

    Here's a test--switch IE8 from standard to Compatability mode (or, more probably, Compatability mode to standard). I bet the site breaks in one of those settings. Also, install Firefox, Chrome, and Opera browser and check how it looks in each of them. That's how you should work--previewing often in multiple browsers.

    EW is not an upgrade to FP. It is a new product, and as the MS site says, it's purpose is to allow users to develop standards-compliant websites--something that FP never did. FP came from an age when IE5/6 ruled the roost (and rendered in its own quirky way. Those days are over, and you'll need to deal with at least 5 popular browsers (including 2 very different versions of the IE rendering engine--IE7 and IE8) as well as a few hoary old hangers-on.

    Time to learn how to do a site properly, which means discarding layers. There is no use for them in daily use and unless you know the pitfalls, you can get in deep doo-doo.


    What do you mean, " 'twas brillig"?!?
    Monday, January 3, 2011 8:06 PM
  • Thanks for your reply.  What I meant was that in design view - in order to have the layers appear in their proper place when previewing in IE8 - in design view they have to be pushed on top of one another - when they were meant to be placed each in its own place on the page.  I did not intend for any of them to be placed over any other layer. I have about 9 layers in the default page - one for the home page name - one for the top textc - one for the table with the row of photos - another layer for the bottom text and recently I put each hotel and its linke into its separate layer.  Each layer is supposed to have its own flat space on the page.   When this page is in design view - all the pictures and text have to climb onto one another in order to be seen correctly when I use the IE8 icon in my tool bar.

    When I view this default page in SuperPreview - even if I ask it to view in IE6 - I still see the same "piles of layers - climbing ontop of one another" as I see in design view - it is exactly the same.

     If you would like to check out my site it is www.boutiquecaribbeanhotels.com

    This site was to be a carbon copy of another site and I imported the files into EW3 from the domain site.

     I have only begum to rework the default.com page.  All the other pages were imported from ExpressionWeb (and maybe originally created in Front Page 2003).

    In researching this problem, several suggested reconstructing a new page instead of importing or copying over

    I will take your suggestion and install the other browsers.  The one that seems to cause the most problem is Safari on the MAC. 

    Not sure you understood that in SuperPreview - I really don't see any difference in the page - it looks like the same piled on layers as in design view. 

    When I gave all that installation information, I was wondering if EW3 upgrade didn't load properly.  Is it treating me like I had just purchased the upgrade and was trying to use it as a stand alone product.  Is that possible?  Is some part of EW3 not working? 

    I am beginning to understand that EW is now a completely different animal than FP. 

    I really wanted to use the layers feature on this website.  It is terribly difficult to use tables and get all those pictures and text to line up.  I have tried that before.

    As to your last sentence - I don't know what you mean "twas brillig?!?  I don't believe I wrote that.  I did mispell wish in my last sentence.

    Thanks for your help and time.

     

    Monday, January 3, 2011 8:29 PM
  • I have a fast fix for you.

    Get rid of the layers: your site is broken when you use them.

    To see this, open your site in Firefox, set View->Zoom to text only, and hit Ctrl-+ a couple of times.

    Layers don't let text containers expand when text is resized - as many of your visitors will do.

    Plain old divs, not layers, will expand.  Use them instead.

    Note that you have your content placed in an order different from the one you want to display on the page.  Don't do that.  You'll need to reorder the divs so that content occurs as you expect the page to flow: in order.

    Monday, January 3, 2011 9:13 PM
  • That is not his last sentence, it is his signature, and is a quote from "Jabberwocky," from Lewis Carroll's "Through the Looking Glass." Before that, what he was trying to tell you is that you shouldn't be using layers at all, or tables, for that matter.

    Do you realize just how broken your site is for a vision-impaired user (like the middle-aged and older folks who probably are a good part of your target market)? Open the page in Firefox, set View|Zoom|Zoom Text Only, then hit Ctrl-+ a few times and watch your layout break all to hel and gone. That's what absolute positioning (i.e. layers) will do for you. Not pretty, and completely unnecessary.

    That page is about as simple as they get, and the whole thing could be done with a few divs, zero tables, and no CSS position attributes anywhere. None.

    cheers,
    scott
    Please remember to "Mark as Answer" the responses that resolved your issue. It is common courtesy to recognize those who have helped you, and it also makes it easier for visitors to find the resolution later.
    Monday, January 3, 2011 9:16 PM
  • Thank you to everyone.  I will go back to the drawing board - take your suggestions -  add browsers to my collection and start all over again.

     

    Monday, January 3, 2011 9:33 PM
  • Just as a follow-up...You said, "...and install the other browsers.  The one that seems to cause the most problem is Safari on the MAC."

    It's really the other way around; Safari, Opera, Firefox, Chrome, and, finally, IE8 are all very good at complying with the standards. So now it's up to people to create websites that also meet those standards. Sites that use layers for layout do not meet modern standards. The different browsers use different rendering engines and they may sometimes interpret things a little differently, so it's always good to preview often in differnt browsers as you work. 


    What do you mean, " 'twas brillig"?!?
    Tuesday, January 4, 2011 3:12 AM
  • Thanks for all your help Bill.  Then what confuses me is why does Expression Web calls itself  WYSISYG authorzing software, and why do we have tools as layers and layout, when they are really not good. 

     I did reconstruct my default page on my website - taking out all the layers.  I have several friends who report on the irregularities as they use their different browsers.

     

    Am I going to have to become a better code writer?  Is there a better authoring software program?  I can read html, but kind of at a loss as to how to make Expression Web write better code. 

    Know anywhere I can get a book?  tutorials? 

    As always thanks for your help.

     

    Tuesday, January 4, 2011 3:49 PM
  • Microsoft does NOT call Expression Web a WYSIWYG authoring tool. Other people might, but not Microsoft. From their FAQ: "Expression Web 4 is targeted at professional Web developers and designers who are building standards-based XHTML Web sites and applications."

    Now, WYSIWYG is a loosely defined term, which some people use to describe the Design Pane. But in the common sense--an interface that lets you drag stuff around without paying attention to code (like many online web builders provided by ISPs or junk like Web Page Maker), EW is not WYSIWYG.

    Layers do have very limited uses (some drop-down menus, for example, and some special effects), and that's why they are included. It's not Microsoft's fault that people misuse them or don't understand their limitations (It is Microsoft's fault for including a sample training on the DVD that shows layers without explaining their pitfalls.). It's the same with text sizing--points are included because people may need them for a printing CSS style sheet, but points mean nothing to a browser; it's up to the user to learn the difference and only use them for a print style sheet. A program as flexible as EW has many powerful features for Web developers, but the user must learn when and when not to use them.

    EW is one of only two programs that have this capability and flexibility; the other is Dreamweaver--very similar in its capabilities and workflow. Some of us use (or have used) Dreamweaver, but it has no support for ASP.NET, and it costs a lot more. I've moved away from DW, finding EW easier to use. You won't find a better or more capable authoring tool than EW or Dreamweaver.

    Learn the program. You don't have to actually write the code (sort of)--that's what the panes on the lower left and right can help you with. Work always in split view. Tutorials? Look in the BEFORE POSTING thread at the top of this forum. Do the one at by-expression.com first (download the materials so you can play along). It's for an earlier version, but everything's very similar. Then go to w3schools for more details. And there's the Learn tab right at the top.


    What do you mean, " 'twas brillig"?!?
    Tuesday, January 4, 2011 4:54 PM
  • "I did reconstruct my default page on my website - taking out all the layers.  I have several friends who report on the irregularities as they use their different browsers."

    If you are talking about the page that is currently up there, I doubt it's browser irregularities.  I suspect it's just that people have browser windows set to different sizes.

    When you preview the site in various browsers, there are two basic things to always check.  Resize the text (only) in the browser and make sure it doesn't break your site.  Also, shrink and expand the browser window and watch what happens.  Those two things will catch most basic "whoops!".

    Your current version of the page uses two tables, one for the images, and one for the location links.  Both tables have widths defined, and are otherwise left to do their own thing.  That means they'll sit at the left of the line they are on.  Meanwhile, all your other content is in paragraphs, not contained in anything with a defined width, and the text is centered.  That means the width will be as big as a person's browser window, and the text centered within that width.  In other words, the tables stay on the left, while the rest of the content moves (right/left) depending on how wide the browser window is, so it will not line up for most people.

    I'll second Bill's suggestion to look at the resources section in the Before Posting post.

    Tuesday, January 4, 2011 5:48 PM