Hi, I've gone wrong somewhere in CSS styling . How do I back track

If you're using the written tutorial (not the video one), you can revert to the beginning of part 3 by using the files in first_website_pt3_begin.zip. The link is at the top-right of the tutorial page (http://www.adobe.com/devnet/dreamweaver/articles/first_website_pt3.edu.html).

I've just had a look at part 3 of the tutorial. It doesn't cover the navigation menu. That's in part 4. Each part of the tutorial has download files showing what the code should look like at the beginning and end. Examine those files, and compare them to see where you might have gone wrong.

I could sit down, go through your code, and provide the answer. But it would take me time to do so, and you would learn nothing in the process. If you make a mistake, go back and start from a known position, such as the code in first_website_pt4_begin.zip. Having to go back over the same steps again might seem frustrating, but it will help consolidate the knowledge you gain.

Hi David,

I had a quick look at the tutorial, and was wondering if there is any underlying reason why you are using the insert tag dialog all the time, while just typing would have been much faster (and a much better learning experience for the beginning student)?

The insert tag method seems incredibly convoluted and more complex than just typing the tags in the code view. You suggest from the outset that it is best practice to use the split view to show the code and WYSIKWYG view side by side to keep an eye on the code.

So... Why deal with that insert dialog at all, and wouldn't it be much more efficient and faster (and less prone to structural errors) to just type the tags, instead of that insert tag dialog? I really can't see anyone struggling their way through these dialogs for actual development. What if something goes wrong, and the student must fix something? The visual dialogs only get in the way of that.

I feel this approach is teaching beginners an over-complicated and (in my opinion) wrong page coding workflow - almost as if the brief for this tutorial demanded you had to use the "visual" tools in DW CC and stay away from the coding view as much as you can.

At least, I tell my students to not bother with those cumbersome insert dialogs at all in Dreamweaver.

I appreciate the tutorial and time you spent on it, though. Yet trying to avoid simple html coding in favour of a "visual" DW workflow that is more detrimental than doing any good is, in my opinion, rather more damaging to the beginning student than beneficial.

I think a great many newbies come here looking for details on how to work with the various DW panels.  I agree that the workflow is often quicker & better when you work directly with code, but sadly that's beyond some people's skill set. 

Nancy O.

I once, at a design college, taught basic html in the first term to graphic design students, and was "forced" (according to their curriculum) to then use Dreamweaver's visual tools in the following term, showing how to use the DW panels.

Result: the students were completely and utterly lost and confused, and after two classes I switched back to normal html in the code view. Much to the delight and relief of the students.

Obviously the course order was insane, but I would still argue that learning plain old html is less hocus pocus than the panels in Dreamweaver. At least in my long experience as a teacher.

The point I am making is that a tutorial like this one (no matter how well meant) is teaching a less-than-ideal workflow, which is not really necessary - DW is not meant to be a visual coding tool.

If basic html is beyond people's skill set, or they refuse to learn any html, I would just show them the path to Muse or Xara Webdesigner, rather than DW.

Herbert2001 wrote:

 

The point I am making is that a tutorial like this one (no matter how well meant) is teaching a less-than-ideal workflow, which is not really necessary - DW is not meant to be a visual coding tool.

As someone who began building web pages two decades ago by typing everything by hand in Notepad, I'm no slouch when it comes to working in Code view. But I have to disagree with the premise that Dreamweaver is not meant to be a visual coding tool. That, according to the Dreamweaver product team, is its whole raison d'être.

If basic html is beyond people's skill set, or they refuse to learn any html, I would just show them the path to Muse or Xara Webdesigner, rather than DW.

One of the most common themes in this forum is the need to understand HTML and CSS. Without that basic knowledge, working with Dreamweaver remains an uphill struggle. Yet one of the most common refrains from users is that the reason they're using Dreamweaver is because they don't want to learn the code. In my view, those people would definitely be better off with Muse (shudder).

However, I disagree about the use of dialog boxes in Dreamweaver. If you know the HTML elements that you need to use, Dreamweaver's code hints certainly speed up the coding process. Nevertheless, I find that the dialog boxes can be a useful learning tool, particularly if you keep Split view open. You don't have to worry about getting all the code and spelling right. Dreamweaver handles it for you. But if you don't understand the code, and don't take care where it's being inserted, you'll end up with a dog's dinner.

Once you have a good handle on the code, it's probably more efficient to graduate to a dedicated code editor.

Ganges-boy wrote:

 

Hello, I seem to have stirred up something of an academic nature in my request for DW guidance.  May I say that I have worked through this tutorial three times already and on this attempt have just managed to grasp the point of positioning: the relative and absolute details are quite clearly explained.  I have tried to dissect the code but have got hopelessly lost with the various elements and ending up in the proverbial dog’s dinner!  I have found the course / tutorial easy to follow and of great value.  I am gradually learning something; which at 77 years of age pleases me tremendously.  Dreamweaver for me is a handhold; a support I can lean on while I ingest the discipline of HTML & CSS.  Something just got missed out. So thanks David for your advice, I have scrapped my present effort and started from the beginning once again. Repetition stimulates concentration and it is also so interesting to read others’ contributions.

Practice, practice makes perfect. You're doing it the right way. As a beginner I would use the DW panels initially to get you familar with the protocol. As you get more experienced and can identify a code pattern forming then switch to using code view........much simpler and you learn faster and can do more in a shorter time.

Good luck!

Herbert2001 wrote:

 

I had a quick look at the tutorial, and was wondering if there is any underlying reason why you are using the insert tag dialog all the time, while just typing would have been much faster (and a much better learning experience for the beginning student)? 

I'm sure David does just use code view the majority of the time when he is not teaching. The point is you have to put yourself in the postion of those that you are teaching. Initially code view can be very intimidating for beginners, so a little help with some automation is always welcome until you become familar with the coding, at which point you have more options. Anyone who takes this seriously eventually ditches the panels and hand codes, because it's easier and faster as you say.

osgood_ wrote:

 

Anyone who takes this seriously eventually ditches the panels and hand codes, because it's easier and faster as you say.

Yes and no. One of the great advantages of the Stucture category of the Insert panel is the way it lets you insert elements with great accuracy, for example, just after or nested inside an element with an ID. It can be a lot quicker than scanning Code view to find the relevant element.

Anyway, I'm glad that Ganges-boy managed to sort out his problem and found the exercise stimulating.

David_Powers wrote:

 

osgood_ wrote:

 

Anyone who takes this seriously eventually ditches the panels and hand codes, because it's easier and faster as you say.

Yes and no. One of the great advantages of the Stucture category of the Insert panel is the way it lets you insert elements with great accuracy, for example, just after or nested inside an element with an ID. It can be a lot quicker than scanning Code view to find the relevant element.

 

 

That's where a combination of code view and design view comes into play assuming youre using DW. I just click on the container near to where I need to nest another container and switch to code view.....highlighted.......must be a lot faster than the panel. I can't say for sure though, not used insert/css panels for years.