Highlighted

Table Layout issues in Dreaweaver CS6

Explorer ,
Dec 07, 2018

Copy link to clipboard

Copied

I am trying to make it easier for myself to make my websites. I use Fireworks to make the page and in Dreamweaver I add tables for the links and videos needed. Problem is the table moves all over the place making it difficult to adjust the links correctly to the image. I do not feel making 300 images to place in the tables are easy at all. Hence the way I am doing it.

Is there any way to anchor the position of a table in place, so it wont move when adding other links and tables?

Thanks for any help.

Well, no, I never stated I was a web designer. I stated I learned Adobe CS3 - CS4 when I went to college. I am a game dev / indie music producer. I only try to make my own site as I have been doing for the last 6 years. I recently starting gaming 2 years ago decided to update my site graphically instead of cookie cutting. I can make this site work with tables, was just trying to make it easier, not harder on myself. I know coding and I know how to twist logic to work. Sorry you are stuck in the box. I like to think outside it. I understand as I stated earlier that div tags would work, I just have never used them. I might even just simply pay someone to do it. Thanks

Views

736

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Table Layout issues in Dreaweaver CS6

Explorer ,
Dec 07, 2018

Copy link to clipboard

Copied

I am trying to make it easier for myself to make my websites. I use Fireworks to make the page and in Dreamweaver I add tables for the links and videos needed. Problem is the table moves all over the place making it difficult to adjust the links correctly to the image. I do not feel making 300 images to place in the tables are easy at all. Hence the way I am doing it.

Is there any way to anchor the position of a table in place, so it wont move when adding other links and tables?

Thanks for any help.

Well, no, I never stated I was a web designer. I stated I learned Adobe CS3 - CS4 when I went to college. I am a game dev / indie music producer. I only try to make my own site as I have been doing for the last 6 years. I recently starting gaming 2 years ago decided to update my site graphically instead of cookie cutting. I can make this site work with tables, was just trying to make it easier, not harder on myself. I know coding and I know how to twist logic to work. Sorry you are stuck in the box. I like to think outside it. I understand as I stated earlier that div tags would work, I just have never used them. I might even just simply pay someone to do it. Thanks

Views

737

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Dec 07, 2018 0
Explorer ,
Dec 07, 2018

Copy link to clipboard

Copied

I also noticed that I have to raise the tables higher or lower than it appears in Dreamweaver for it to line up live.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Dec 07, 2018 0
LEGEND ,
Dec 07, 2018

Copy link to clipboard

Copied

If you're using Fireworks to create the layout and then slicing them for HTML, that is a very outdated method.

Tables should be used for tabular data.  You should read up on table-less design using CSS and DIV tags, and SPAN tags.

V/r,

^ _ ^

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Dec 07, 2018 1
Explorer ,
Dec 07, 2018

Copy link to clipboard

Copied

Do you have a link for that? And no, I didn't want to slice any more it takes too long to work with. I make the entire page as an image and then in Dreamweaver place tables for links and other things "clickable".

Thanks

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Dec 07, 2018 0
LEGEND ,
Dec 07, 2018

Copy link to clipboard

Copied

Please don't take this the wrong way, but in all seriousness, using a single image for a page is even worse, and even if you optimized the image it would still be a "heavy" page.  (I'm assuming you mean that the image is the body background, and you're trying to place tables within certain areas of the page and keep them there.  If my assumption is incorrect, please advise.)

As far as links to learning table-less design, Google is your friend.   

https://www.w3.org/2002/03/csslayout-howto

https://websistent.com/css-tableless-design-tutorial/

https://www.lifewire.com/css-positioning-layouts-without-tables-3466855

https://www.youtube.com/watch?v=NNDkMIyKfaw

HTH,

^ _ ^

UPDATE: If you do your own search on Google, please avoid anything from W3Schools.  They might be getting better, but they have a very lousy (and well-deserved) reputation.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Dec 07, 2018 1
Explorer ,
Dec 07, 2018

Copy link to clipboard

Copied

Yes, you are correct I am using the image as a single table BG and applying new table(s) inside to set the clickable spots. I will check out those links. I did do a Google search and ended up here as nothing was close to want I am trying to do or it wasn't working.

Thanks

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Dec 07, 2018 0
LEGEND ,
Dec 07, 2018

Copy link to clipboard

Copied

Something that might help you would be a CSS library of some sort.  There are many, but I like Bootstrap, myself.  Pre-defined settings so that all you do is add a class name, or two, or more, to any element that will position, size, etc.

I believe the current version is v4.

HTH,

^ _ ^

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Dec 07, 2018 1
Adobe Community Professional ,
Dec 07, 2018

Copy link to clipboard

Copied

W3Schools is as good a place as any for absolute beginners.  Read the chapters, do the code exercises and take quizzes at the end. 

Online Video Tutorials -

Creating a First Website in Dreamweaver CC 2017

Dreamweaver CC 2018 - Introduction to responsive web design - YouTube

For more advanced users, Mozilla Developer's Network and the Word Wide Web Consortium are  the defacto web resources.

Nancy O'Shea, ACP
Alt-Web Design & Publishing

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Dec 07, 2018 0
LEGEND ,
Dec 07, 2018

Copy link to clipboard

Copied

https://forums.adobe.com/people/Nancy+OShea  wrote

W3Schools is as good a place as any for absolute beginners.

Not to highjack this thread, but this is where we will just have to agree to disagree.  They may (or may not) be getting better (I've heard conflicting reports), but for YEARS W3Schools had little, if any, updates to their information.

http://www.w3fools.com/

According to W3 Fools, W3Schools is improving.  But I'll still skip any Google results that go to w3schools.com in favor of ANYthing else.

V/r,

^ _ ^

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Dec 07, 2018 0
Explorer ,
Dec 07, 2018

Copy link to clipboard

Copied

I have an old understanding unfortunately. I was taught in college when it was cs3 and I was taught table formatting not div formatting. I see now I need to set the <Table> inside <Div> tags to hold its position better. Always learning more. Thanks

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Dec 07, 2018 0
LEGEND ,
Dec 07, 2018

Copy link to clipboard

Copied

Personally, and professionally, I'd get rid of the tables, completely, unless you have tabular data.

V/r,

^ _ ^

UPDATE: The reason for not using tables (unless you have tabular data) is, as I understand it, tables are not as responsive.  Also, tables load twice - once for layout, once for content.  So, in this modern day era of faster computers and internet speeds it may not be a huge issue.  But every little bit helps.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Dec 07, 2018 1
Adobe Community Professional ,
Dec 07, 2018

Copy link to clipboard

Copied

I invite you to look at their HTML & CSS tutorials and form your own opinion.  W3Schools presents the basics without overwhelming beginners.  That's important when you're starting out.  

Nancy O'Shea, ACP
Alt-Web Design & Publishing

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Dec 07, 2018 0
LEGEND ,
Dec 07, 2018

Copy link to clipboard

Copied

Apologies to the OP for getting off-topic.

It's VERY rare when I choose to remain blissfully ignorant on a subject.  But due to their beginnings and the fact that it lasted for as long as it did, I will not look at anything W3Schools, not even to form my own opinion on how they are currently doing.

Once bitten, twice shy.

V/r,

^ _ ^

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Dec 07, 2018 0
Adobe Community Professional ,
Dec 07, 2018

Copy link to clipboard

Copied

dusting93022209  wrote

. I was taught in college when it was cs3 and I was taught table formatting not div formatting.

Right.  A lot has changed in 12+ years.   You have some catching up to do.

  1. HTML = Content & structure.
  2. CSS = Styles & layout.
  3. Content is separate from styles.
  4. Layouts conform to mobile, tablet and desktop devices now (aka Responsive Web Design).   You cannot do that with tables.

A quick example.

On smaller devices

Code.

=============

<!doctype html>

<html lang="en">

<head>

<meta charset="utf-8">

<title>Flexbox Grid Example</title>

<!--CSS Styles-->

<style>

body {font-family:Baskerville, "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", "serif"}

header h1 {color:tomato}

header h2 {color:gray}

.container {

padding: 0;

margin: 0;

display: flex;

align-items: center;

justify-content: center;

}

.row {flex-wrap: wrap;}

.row div {background: black;}

.col {

padding: 5px;

width: 100px;

height: 100px;

margin: 10px;

line-height: 100px;

color: white;

font-weight: bold;

font-size: 2em;

text-align: center;

}

footer {

border-top: 4px solid silver;

margin-top: 1em;

color:tomato}

</style>

</head>

<body>

<header>

<h1>XYZ Website</h1>

<h2>Some Pithy Slogan</h2>

</header>

<main class="container row">

<div class="col">1</div>

<div class="col">2</div>

<div class="col">3</div>

<div class="col">4</div>

<div class="col">5</div>

<div class="col">6</div>

<div class="col">7</div>

<div class="col">8</div>

<div class="col">9</div>

<div class="col">10</div>

<div class="col">11</div>

<div class="col">12</div>

</main>

<footer>

© 2018 XYZ Website

</footer>

</body>

</html>

Nancy O'Shea, ACP
Alt-Web Design & Publishing

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Dec 07, 2018 1
Mentor ,
Dec 08, 2018

Copy link to clipboard

Copied

With all due respect, I'm with Wolf Shade on this. W3 Schools should be avoided... perhaps as much as Lynda.com. The W3C is the definitive place, with Mozilla Developer Network providing error-free and simple guidance.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Dec 08, 2018 0
Explorer ,
Dec 08, 2018

Copy link to clipboard

Copied

I get it. I see what I would have to do. Not sure if I can as it seems I would need a lot of math to figure out where I need each overlay to be. Tables are more visual for the layout. I think that's why I always tried to use them. On divs, I am not sure how to margin correctly to position. I'll try. Thanks

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Dec 08, 2018 0
Mentor ,
Dec 08, 2018

Copy link to clipboard

Copied

dusting93022209  wrote

I get it. I see what I would have to do. Not sure if I can as it seems I would need a lot of math to figure out where I need each overlay to be. Tables are more visual for the layout. I think that's why I always tried to use them. On divs, I am not sure how to margin correctly to position. I'll try. Thanks

If you're not careful on this forum you could get in over your head

You're coming from table design to modern web design and modern web design has evolved immensely over the past 10 years. You need to take baby steps. The first step is posting a visual representation of what exactly it is you want to do. A test page online would be best, but a picture will do. Then you need to decide whether you want to learn how to code it yourself or if you would prefer a tool (extension) that can give you the ability to lay out a page with modern CSS in a visual interface. Good extensions are, of course, not free. But for roughly $100, you can acquire a tool that will make laying out a page similar to playing with Legos - while you learn.

PVIIHarmony Flexbox for Dreamweaver

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Dec 08, 2018 1
Adobe Community Professional ,
Dec 08, 2018

Copy link to clipboard

Copied

ALsp  wrote

With all due respect, I'm with Wolf Shade on this. W3 Schools should be avoided... perhaps as much as Lynda.com.

For the record, Lynda.com and Video2Brain are owned by LinkedIn Learning now.  I recommend their structured courses to users who want to learn from certified experts and authors like David Powers and Deke McClelland (just 2 examples).  It's important to note that LinkedIn Learning courses are peer reviewed  for accuracy which is a lot more than I can say for YouTube. 

You guys can do whatever you want.  Meanwhile, I'll keep linking to W3Schools tuts when I feel it's appropriate to the user's skill level.

Nancy O'Shea, ACP
Alt-Web Design & Publishing

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Dec 08, 2018 0
Explorer ,
Dec 08, 2018

Copy link to clipboard

Copied

My site is temp up at http://www.nuhabitstudios.com if you want to see what I am trying to do. Thanks

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Dec 08, 2018 0
Mentor ,
Dec 08, 2018

Copy link to clipboard

Copied

Hi Nancy,

A good way to approach this is to allow that these are opinions and should  be treated us such. I have no idea what a certified expert is. Perhaps I am one, too, as I have written a book on Dreamweaver (years ago) and David got his start in the Dreamweaver community as one of our beta testers. That's not to say he has not gown immensely since then - especially where it concerns PHP - because he has.

I am also not concerned with peer reviews for Lynda.com, nor who owns them now. I can only go by some of the examples I've seen. Some are good and others are not so good (in my opinion, of course 🙂

But hopefully this makes sense to you, and if not you, to others.

It's all about opinions and being gracious enough to allow folks to make up their own minds...

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Dec 08, 2018 0
Adobe Community Professional ,
Dec 08, 2018

Copy link to clipboard

Copied

It's all about opinions and being gracious enough to allow folks to make up their own minds...

Stop hammering Bootstrap then and let people 'make up their own minds' ... The forum is about offering solutions and suggestions, video training is a great way to learn and I don't see what is wrong with pointing somebody in that direction, other than the fact that as usual you think you know better than everybody else,

WE ALL KNOW BY NOW WHAT AN EXTREMELY HIGH OPINION OF YOURSELF YOU  HAVE ALsp. Personally I'm sick of your attitude on these forums, your snide comments and the constant air of superiority you are trying to transmit, the level of arrogance is off the scale.

These forums would be much better if you bugged out, most of the time you are either (a) trying to undermine somebody (b) talking down to people or (c) trying to drive the conversation in the direction of recommended one of your extensions.

I see very little point to you being part of these forums ALsp, as you are extremely divisive I see other people like Nancy on the hand trying to keep things professional and answer people's questions/ IS it no coincidence a lot of the threads you jump on end up going off on an tangent, being hijacked by you or just end up in a farce,

Paul-M, ACP

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Dec 08, 2018 1
LEGEND ,
Dec 08, 2018

Copy link to clipboard

Copied

Energize  wrote

It's all about opinions and being gracious enough to allow folks to make up their own minds...

Stop hammering Bootstrap then and let people 'make up their own minds'

Its difficult for users to make up there own mind if they are offered nothing else and are constantly provided answers by users who quite frankly could not code their way out of a paper bag. The truth is not always great to hear but someone has to deliver it.

I think one has to be careful when using any source of information,  the more you know about what you are involving yourself in the better placed you will be to decide if whats on offer is any good.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Dec 08, 2018 0
Adobe Community Professional ,
Dec 08, 2018

Copy link to clipboard

Copied

So what you have right now is an image of a web page or what we call a design comp.  This whole thing must be rebuilt with real text inside HTML code.   As of right now, your site is invisible to search engines, screen readers and language translators.  This is all they see. 

For a comparison, look at this site and turn off images in your browser.  It's not great without images but at least there is real content.

https://lol.disney.com/

Nancy O'Shea, ACP
Alt-Web Design & Publishing

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Dec 08, 2018 1
Explorer ,
Dec 08, 2018

Copy link to clipboard

Copied

Yes, this is done on purpose due to the type of content.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Dec 08, 2018 0
Adobe Community Professional ,
Dec 08, 2018

Copy link to clipboard

Copied

dusting93022209  wrote

Yes, this is done on purpose due to the type of content.

Sorry to say, that's not going to work.  

Hopefully you still have all the layers from your PSD comp  from which you can extract and save separate images for background  and foreground elements. 

Text will need to be replaced with real HTML text.

Nancy O'Shea, ACP
Alt-Web Design & Publishing

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Dec 08, 2018 1
Explorer ,
Dec 08, 2018

Copy link to clipboard

Copied

Okay, well, thanks for your opinion.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Dec 08, 2018 0
Adobe Community Professional ,
Dec 08, 2018

Copy link to clipboard

Copied

Unfortunately, you're not a web designer (yet).  Until you know the rules, you can't break them.

Good luck with your project!

Nancy O'Shea, ACP
Alt-Web Design & Publishing

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Dec 08, 2018 1
Explorer ,
Dec 08, 2018

Copy link to clipboard

Copied

Well, no, I never stated I was a web designer. I stated I learned Adobe CS3 - CS4 when I went to college. I am a game dev / indie music producer. I only try to make my own site as I have been doing for the last 6 years. I recently starting gaming 2 years ago decided to update my site graphically instead of cookie cutting. I can make this site work with tables, was just trying to make it easier, not harder on myself. I know coding and I know how to twist logic to work. Sorry you are stuck in the box. I like to think outside it. I understand as I stated earlier that div tags would work, I just have never used them. I might even just simply pay someone to do it. Thanks

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Dec 08, 2018 0
LEGEND ,
Dec 08, 2018

Copy link to clipboard

Copied

Can we all please stay on track and help the OP!

As for someone being an expert in whatever, it is irrelevant. I was an asked to be an invited expert to the W3c regarding css a few years ago, which I turned down due to commitments, does that make me more of an expert than anyone alse. NO.

The fact that the W3C asked me, is more relevant than Adobe asking though, but I am not an expert.

Please start seperate discussions for disagreaments. Than goes for everyone even myself as I am as guilty as everyone else.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Dec 08, 2018 2
Mentor ,
Dec 08, 2018

Copy link to clipboard

Copied

pziecina  wrote

Can we all please stay on track and help the OP!

Apparently some people can't Seriously, I do think it is incumbent on those answering questions that they stick to the question, but if people are sent to a site that might not be considered the best (or even a good) resource, then presenting alternatives should be permissible... or encouraged.

That said, the OP was answered and the ball is now in his or her court. He or she can then choose to use whatever means. The noise can be ignored - it should be ignored.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Dec 08, 2018 0