Trying to get back in the game... please review

[RDesignista]

Hi everyone!

I used to be a webpage-fanatic back in high school, when basic html and javascript were all you needed to know. Recently, I tried to brush up on this skill so that I could try some freelance work designing or editing people's webpages. Well.... it's been rough :-(. I am still trying to get used to css and it's tags and how priorities work.

I have learned CSS, learned a lil PHP, and made a site for this imaginary tax/gambling company called Quentin Cross LLP within several days. I did it all in notepad, so as to make editing and debugging much easier, as well as to help learn css-coding.

Issues I'm aware of:

1. Spacing and absolute measurements. Tables within tables. TD padding, img padding, P width... all lead to spacing problems and alignment problems. This is something I will be smart about going forward. Look under "Investing Info" to see my mis-aligned image, as an example.

I also used this to help me with spacing:
p {
width:475px; } to try and keep my words from scrunching or spreading out based on people's browser size.

1b. Is there a better way to make a layout than php include in tables?

2. My pictures suck. I saw some cool stuff at different pages, but when I tried it in Photoshop, it ended up looking like Floyd Mayweather's opponent after the fight :-\. Stuck to stock photos and a lame header.

3. Navigation bar looks lame. Not sure how to fix this. I want to make it minimalistic, but something seems missing.

Please take the time to just look through the design. I used a basic table (with header, left-side navigator, main portion, and footer) as my layout and used php include and put my table stylings in style.css so as to make page source codes shorter and make things more organized. I wanted to cool graphics, but I SUCK at graphics.

[Webzarus]

Without even looking at the site...

If you want to learn CSS... Get away from tables completely...

Reading through the forums here ( if you get a chance ) you'll see varying opinions on many topics including the use of tables for design.

Tables were implemented for tabular data ... Not for layout purposes, although many wysiwyg editors used tables as their framework... The trends are moving to use CSS positioning for your layout.

It's actually not that difficult, yes frustrating at times... But once you learn the basics of doing CSS layouts, you'll probably never look back.

Take the time... Before you get too far into it... Find some simple 2 column CSS layouts, see how simple it can be... Then start experimenting.

From basic layout to very complex structures... CSS is really the only way to go.

http://www.cssplay.co.uk/

http://www.stunicholls.com/

Are just 2 examples of what can be done with css

[RDesignista]

Thanks Webzarus. I used to use frames back in around '01. Then my friend started using shtml. And when I was starting this website up, I looked around for frame alternatives and someone mentioned tables w/ php. Versus regular html it's a time-saver. I'll definitely look at those sites though, because it seems CSS has a lot to offer.

[m3n0tu18]

I've just looked at your code. I definitely recommend what Web says, CSS will make your life a hell of a lot easier.
I suggest looking at w3c Schools to brush up on css and html or xhml, if you can get down the html5 route then that's good too, but start with xhtml as if you need to debug old sites etc that's the way to go

[Ashish Thakkar]

You can put up a decent site with html but you need to have a proper html code.

Your html code is pretty messed up.

You have used the head tag more than once which is wrong and u have also closed the body and html tag many times. You only have to do that once !

Regards.

[RDesignista]

Hi again,

After spending a couple of more days learning about CSS and how to use divs for layouts, I edited all the code so that I have an all-div-based layout (the code is so much easier to look at than tables). CSS truly is a godsend, making things I tried doing in HTML before so easy now. Thanks for the advice. I also added a little bit of swag to it as well, because no one likes to look at a boring website, right?

If anyone is still reading this, I would appreciate another look. My main objective is to make it look like a LEGITIMATE website for a small financial company. Any ideas on what I need? Or should take away (aside from the cheesy stock photos)?

A problem I am unsure of is mentioned right above me, by Ashish. I am still using <?php include(footer.html) ?> because it seems to make things even easier to mass-edit. Now, I have complete codes for my header, left/navi, main, and footer. Thus, when I include them all, I'll have excess html,body,head tags!! The funny thing though, is that it works! I haven't tried compatibility checks, but it works for me. So... should I remove all html, head, body tags from the HTML files I "include"?

Thanks.

[Webzarus]

Yup, no include files need the extra "HTML" tags... Yeah it works, but it's throwing the browser into quirk mode... "slowing things down rendering or ignoring the un needed objects"

Includes should only have the needed code... Some of my "footer" includes only contain the DIVS for the CSS... As a holding place... But then needed... All I have to do is add code to that one file... And it shows across the entire site.

[AlphaMare]

Think of it as if you are building the page from the top down with blocks of code (your includes).

If your header include has the DOCTYPE, <head><meta> etc in it, you won't need them in the content that will be built on underneath.

Same with the footer - if you have the </body> and </html< tags in the footer, they shouldn't be in the content above.

[Blogfreakz]

I agree in throwing away tables no not the real tables lol I mean tables you should substitute it for CSS it will load up faster in browser and a clutter free codes.