Critique my first hand-coded site.

[66217]

So here I am, after much trouble, I finally think I am good to at least publish the site. First off, I would like to thank all the people who helped, it was great all the advice I received here.

So this is it: removed for now, I'll post it back again later.
Things to notice:
1- I'm still having one problem with IE6.
2- The navigation bar was included using DreamWeaver, so the code looks messy in that part. I really hate how it looks, but I didn't had any idea how else to do it. The code for the bar is what is inside <div id="navbar">.
3- And for some reason, all the Flash animation I included make the validation process go terribly wrong.

Let me know what you think of the design. Any advice is welcome.

 

[one3]

I guess the thread title ".... hand-coded site" is a bit misleading since a lot of the code seems to have been generated with Dreamweaver and Fireworks.

I would say the best thing from a coding stand point of view is to actually find a clean CSS / Javascript alternative to using the messy Dreamweaver menu code. Try "A List Apart" for great examples of CSS Menus.

I realize this is your first 'hand coded' site so I'm not sure to what level you would like feedback ... but little things like having your primary headings as <H1> tags instead of the <H3> tags you use is a start. I would also put all CSS in the external CSS file and put the Javascript code in an external JS file as well.

Since you have very few images / graphics I would suggest not letting Fireworks cut up the images and create the code ... my guess is that's how you got all that bloated 1 pixel code.

Hope this helps as a start.

 

[dukebound85]

well you misspelled a ton of words
for instance: productos?? you mean products?
same with technologia? technology

then there are some words and sentences that make no sense what so ever. like a bunch of randomly joined letters

haha soooo kidding, i know its in spanish. looks pretty nice though! keep it up

 

[TwinCities Dan]

well you misspelled a ton of words
for instance: productos?? you mean products?
same with technologia? technology

then there are some words and sentences that make no sense what so ever. like a bunch of randomly joined letters

haha soooo kidding, i know its in spanish. looks pretty nice though! keep it up

You're kidding I hope!



Aren't all those "randomly joined letters" called THE SPANISH LANGUAGE?!?

 

[66217]

I guess the thread title ".... hand-coded site" is a bit misleading since a lot of the code seems to have been generated with Dreamweaver and Fireworks.

I would say the best thing from a coding stand point of view is to actually find a clean CSS / Javascript alternative to using the messy Dreamweaver menu code. Try "A List Apart" for great examples of CSS Menus.

I realize this is your first 'hand coded' site so I'm not sure to what level you would like feedback ... but little things like having your primary headings as <H1> tags instead of the <H3> tags you use is a start. I would also put all CSS in the external CSS file and put the Javascript code in an external JS file as well.

Since you have very few images / graphics I would suggest not letting Fireworks cut up the images and create the code ... my guess is that's how you got all that bloated 1 pixel code.

Hope this helps as a start.

It seems like the part from Dreamweaver is the vast majority of the code. But only the navigation bar was made with Dreamweaver. As for now I don't know how to achieve a similar effect with only xhtml and CSS. Can I achieve something similar to my menu bar with only CSS? I would really like to learn that, but it seemed out of my hands at the moment.

It is good you mention that thing of the <h1>. I want to notice all those things and start correcting them to make the code look cleaner and more easy to change in the feature. As for the Java that appears in the end, it is temporary, I was just curious about how many people are visiting the site, so I included the Site Meter service for now. Tho I'll try and put it in an external file.

What are you meaning with the 1px code?

Thanks for the comments. I appreciate them.

Aren't all those "randomly joined letters" called THE SPANISH LANGUAGE?!?

Yep, the whole site is in Spanish.

Tho, see the small white letters at the end of the post. It seems he is just joking.

 

[Fleetwood Mac]

I make the drop shadow in the flash intro a little smaller.

 

[one3]

As for the Java that appears in the end, it is temporary, I was just curious about how many people are visiting the site, so I included the Site Meter service for now. Tho I'll try and put it in an external file.

What are you meaning with the 1px code?

I actually meant all the Javascript at the top of the page ... all the many lines between the <script> tags. You can put all that in an external file, keeps the code cleaner and easier to update. (see this LINK for more)

The 1px code ... if you look at the menu code there are about 10 lines of code all loading a 'spacer.gif' image.... i guess it's something that Fireworks created.

Lastly, if you want to create a simple mouse over menu you can do it using simple CSS. There are a lot of tutorials out there (just google "CSS horizontal menu") ... here is just one example: LINK that looks similar to yours.

 

[66217]

I actually meant all the Javascript at the top of the page ... all the many lines between the <script> tags. You can put all that in an external file, keeps the code cleaner and easier to update. (see this LINK for more)

That's helpful. For the moment I'll think I better invest time to make a CSS menu bar, as you say, it makes thinks much neater. Tho first I am going to make sure this thing works correctly in the main browsers.

The 1px code ... if you look at the menu code there are about 10 lines of code all loading a 'spacer.gif' image.... i guess it's something that Fireworks created.

Oh, that one. Yes, Fireworks generated those by default. I know it is a mess and makes the code look ugly.


So this is the technical side. But what do you think about the design part? Does it looks nice?

My intentions were to create something elegant. Tho I do want to introduce some extra photos to give it a little more of color.

 

[cromwell64]

embedding flash

Since you removed the link I haven't been able to view the site, but I do have some advice on embedding flash.

This is how I embed flash and it validates. I think this is a common method for this also.

<object type="application/x-shockwave-flash" data="yourFlashFileName.swf" width="160" height="100">
<param name="movie" value="yourFlashFileName.swf.swf"/>
</object>

You just have to make sure you set the path to your flash file in both the object tag and param tag to make it work across browsers. Also make sure to set the width and height to the correct size of your file.

That being said, I don't know what you are using flash for. I hope it is not something that starts playing music automatically when someone loads the page or any number of other terrible things that people do with flash. If anyone uses flash they should do so responsibly, there is a reason why tons of people can't stand flash and disable it in their browser.