Tables are a mess! Please advise!

[atomic-blonde]

http://www.mohawks.pwp.blueyonder.co.uk/

Sorry - I'm back again!
I've just uploaded my 'new look' web site (above) but I'm having table trouble! I just cannot get the same table layout (simple as it is) on each page! (I knew this before I uploaded but it's the only way I could show the problem!)

I use Front Page and I usually create one master page then simply change the html for each new subject. However the site is growing and it seemed so much work to do this I thought I'd try changing each page individually using the drag&drop method. Plus I'm scared to lose the javascripts that I have in place!

To anyone kind enough to have a look at my site, the 'Mixed' art page is just about right and that's how I'd like the rest to look.
I've even changed the thumb sizes (they should all be 40pix) to try and fix the prob.
I'm now exasperated with it - the tables are all over the place! :(
It may be to do with the javascripts I've used? I dunno...
I do know that I'd be totally lost without you!

Please help me!

[FordCorsair]

I can't profess to be an expert... but I use templates when creating in Macromedia Dreamweaver. This maintains a constant look. I've looked but never touched MS Frontpage so I don't know if it can do templates.

As for all the scripty stuff i'd just cut and paste that info across into each template editable region for each page and then change the code that refers to your images.

I'd too be interested in other methods.

[atomic-blonde]

Thanks FC.
I think I know what to do IF I was to start again! You're right - use a template.
However, that's what I'm tryin to avoid coz there's sooo much editing to be done!
On saying that, maybe I should just upload my original, older site whilw I work away at the above idea on the new pages.... hmm. Got me thinking now!

[atomic-blonde]

...meant to ask:-
If I'm gonna start again I want to add a side menu (and maybe header).

Whats the best (easiest!) way?
Are shared borders worth looking at Or are frames best?

If I'm gonna do the restart thing may as well do it right!

[FordCorsair]

I used frames for my site and two types of template.

http://www.domcoleman.co.uk

however, I noticed when viewed on my Mac the layers dropped down a bit. not sure myself what to do there... also my top image is 1004px and so gets cropped on smaller screens

I'm currently working on another one at the moment re-designing a photo library (euroimage.co.uk) and I think keeping it simple is the key. I'm going to use tables this time - unless someone else advises otherwise (in simple terms, please!!)

good luck.

[wkenny]

I use a product called Antenna Web Design Studio by a company called Stormdance. This is a budget designer (£25 €49) but is very powerful. You can download a time-limited trial version before paying any money. And the on-line support is top class (even for the trial period).

It allows you to include any existing pages in any other, which effectively gives you templates. So you can set up menus, logos, navs whatever in their own page and then include them where you want them.

I should state that I have no connection with the company - just a very satisfied customer.

[mwinter]

I meant to reply to this thread earlier, but I was slow in preparing the demonstration (see below).


I've just uploaded my 'new look' web site (above) but I'm having table trouble! I just cannot get the same table layout (simple as it is) on each page!You can, and should, achieve the same look without a single table and have it look consistent.

I've produced a partial reproduction (http://mwinter.webhop.info/dd/atomic-blonde/) of your site. If you look at the source code, you'll see the markup is very simple; the layout and presentation is produced with linked Cascading Style Sheets (CSS). I'm not entirely happy with it, but I was trying to stay as close to your original as feasible. I'll walk through it.

I dislike splash pages (so do many users) as they're a pointless barrier between me going to your site and getting to your content. Some splash pages can be justified, but not when they just show the logo and tag line for the site. There are two principle changes to this page.

The first, and most important, is better title element text. This has been implemented across all of the pages. The title element should uniquely identify a page, and be meaningful when taken out if context. The content of the element appears not just in the title bar of browsers, but in search engine results, the browser history, bookmark text, and it's often rendered to assistive technologies (though that usually isn't so much of a concern to a visual artist's site). The home page (or in your case, the splash page) title should contain the name of the site and briefly what that site's about. Your tag line accomplishes the latter part. The other titles should still name the site, but also indicate where the user is within it.

The second is the removal of the rollover. It didn't add much, so I couldn't be bothered to keep it. It would be trivial to add it again, though.

The home page is much the same, though lacking some of the colour. If you really want it, that's trivial to add as well, with only simple changes to the markup and style sheet. One site-wide change that I've implemented starts here: each page has the smaller site logo in the top left. Apart from the instance on the home page (because pages should never link to themselves), this will act as a link home. Navigation should appear in consistent location, which is something to consider if you want to add a side menu. It's also convenient to supply links to all major parts of the site (home, 2D gallery portal, links, and contact, for your site at the moment). As you already seem to have plans for that, I omitted it because I didn't know how you'd prefer your design to change.

There's not much to say about the links page. I only included a couple of links to demonstrate principle. However, I must say that I was initially very confused about the links at the top. I would have associated the left image with the link below it. Likewise with the right. A user might be very confused to find them switched.

If I were to stripe the text, I'd either use a client-side or a server-side script. As you can see in your original, doing it by hand can lead to mistakes. It's also tedious. :)

The text in the 2D gallery portal could be images, but I was too lazy to upload them. :) The same goes for the links in the galleries themselves. Note that only the Cats link works.

I've used a different script for displaying the images. This works using the click event; mouseover is a very bad idea as it invokes action when the user might just be trying to get to the image they want to see. They can't move the mouse then, either as that will load a different image. The script could be modified to notify the user (particularly those on dial-up, like me) that something is actually happening. Ideally, it would also show notes on the image (when it was made, medium, title, etc.) and be combined with a server-side script as a fallback. I wrote the current script quickly late last night, so I wasn't in the mood to make it too complicated at the time. Your current method is obtrusive and causes flickering with Firefox.

If client-side scripting is disabled, your images are totally inaccessible. At the moment, the replacement script will just show the image on its own. The server-side fallback I mentioned above would change that, but my Blueyonder Web space doesn't include PHP support, so I can't demonstrate that for now.

The other galleries would follow a similar format. The only thing that would change is the thumbnails and the list of links on the right. A very simple template.


I use Front Page [...]Frontpage is a terrible editor. I wouldn't use it, if I were you. Dreamweaver is a little better, but very expensive. If you're willing to learn HTML and CSS well, any syntax-highlighting editor would do, and many are free.



If I'm gonna start again I want to add a side menu (and maybe header).

Whats the best (easiest!) way?
Are shared borders worth looking at Or are frames best?Frames have very little justification. They should rarely ever be used. Most menus are simple lists of links, floated to one side (like the gallery links in Cat gallery). They can be as elegant or as simple as you like.


If I'm gonna do the restart thing may as well do it right!Try to consider a more uniform appearance for your site. At the very least, it will make your life easier, but it will also be easier for users to navigate. Though my demonstration is consistent, it's still based around a design that wasn't meant to be, so some parts (the headers, mainly) appear bare.




I use a product called Antenna Web Design Studio by a company called Stormdance.It produces awful markup, and terrible CSS. Sorry, but no-one should use it.

Mike

[wkenny]

Hi Mike

The link to the demo appears not to work. Error message:

"There was no page found at this location. You may wish to report this to the owner of the site."

[atomic-blonde]

I just tried the link too - not working I'm afraid.
Looking forward to see what you mean!

[atomic-blonde]

mike,

Thank you so much for your time and patience.
I had a look at your example and admit that the source code does look a lot cleaner and easier.

I like the idea of clicking the thumbs rather than rollover. I know what you mean about the flickering - it was annoying!

However, I see the description tooltip js has gone...
I kinda liked that script and cannot see a better way of displaying image details with the Thumbnail Image Viewer II.
I don't mind the alt way of doing - I just wanted something a bit more arty!

On saying that, I take on board everything you've explained, much of which is new to me: I've learned a lot from your comments!
So I'm gonna have a wee mess around with your ideas...

Thanks to all who helped!

[FordCorsair]

Mike: Thanks, I'm slowly converting my methodology to 'div' tags (are they also know as layers?) rather using tables & framesets. However, I must admit working in code is very difficult for someone like me who thinks in pictures.

Atomic: Keep us informed of progress? I'm interested how you'll re-develop your site.

[atomic-blonde]

Atomic: Keep us informed of progress? I'm interested how you'll re-develop your site.
..........Me too! :o

[mwinter]

Mike: Thanks, I'm slowly converting my methodology to 'div' tagsYou should be using semantic markup. The div element is a generic container and should be used to group sections of the document (like headers, footers, etc.), or as a block-level element when there isn't a better alternative. The span element is similar, though it's an in-line element.


(are they also know as layers?)The term 'layer' is Macromedia marketing speak, similar to Microsoft's DHTML. Neither has any real meaning.

The term is usually applied to absolutely-positioned div elements, however absolute positioning shouldn't be common enough to deserve its own term, especially not with div elements. What's more, any element can be absolutely-positioned.

Mike

[FordCorsair]

Atomic: you wanted to know the progress, well after considerable help from Mike Winter on all my CSS this is the result (link on another thread).

http://www.dynamicdrive.com/forums/showthread.php?p=22163#post22163

many thanks to all involved.