Click to See Complete Forum and Search --> : Some criticism on my band site . . .
el doro
02-01-2006, 03:21 PM
Just finished a new website for my band. went into this with only a limited html knowledge, have learnt alot along the way!
The site can be found here (http://fourstarrock.bizhat.com)
But it breaks alot of 'rules'. Its a simple slice and dice aproach, all put together in tables by image ready. so i can't claim much of the coding as my own work.
Im happy with what i've achieved though.
It checks out fine in IE, but in firefox theres a problem with the backgrounds in my divs, there either not there or only partially there, can anyone offer some help with this? I've not checked it out with any other browsers.
The content its self is still being worked on, so some pages have duplicate texts of others, but the basic design and layout is what i'll stick with.
Any criticism or advice is welcome!
The Little Guy
02-01-2006, 03:24 PM
I would, but I don't know how to get there. Need a link
Kevey
02-01-2006, 03:25 PM
......
el doro
02-01-2006, 03:49 PM
Sorry i must have been off the ball earlier!
The sites here (http://fourstarrock.bizhat.com)!
Cheers
The Little Guy
02-01-2006, 04:16 PM
Looks good, one thing I would suggest is making the page all fit so there isn't a right hand side scroll bar, except for the content in the overflow.
This image: http://fourstarrock.bizhat.com/images/contact_12.jpg that is the background, I suggest that you cange it from fixed to scroll.
In the about section, under bands, Pete and Grant have the same picture.
In the gallery, there is a line behind your thubms, and it doesn't go to the bottom.
I validated your home page, and it doesn't validate: http://validator.w3.org/check?uri=http%3A%2F%2Ffourstarrock.bizhat.com%2Fhome.html
Validate all the pages, the all have errors on them.
el doro
02-01-2006, 04:30 PM
This is my problem, for some reason the background images in divs dont show up in full, in IE the image covers the full cell of the table. the way i designed it. thats why i fixed the background, because the images fit together and form a gradient accross the page.
If someone looks at the site in IE then in firefox they'll see exactly what my problem is.
Yeah the content in the about section isnt finished yet, some people still have the same bio aswell as photo. I had just copied pages to make the ones i needed, and im just editing the content once i get it.
What exactly is validating? just checking if the coding is correct? i should do this for every page yes?
ray326
02-02-2006, 12:00 AM
What exactly is validating? just checking if the coding is correct? i should do this for every page yes?Yes. It is using the W3C validators like so.
http://validator.w3.org/check?verbose=1&uri=http://fourstarrock.bizhat.com/home.html
You'll notice the first thing it will want is a valid doctype at the top of each page.
nice font in the index page. i feel the the brown bg in the iframe can go abit lighter. your site is about band, music..so I thought more graphics might be appropriate.
clean and easy to navigate.
The Little Guy
02-02-2006, 01:04 AM
This will fix your Firefox problem with the overflow:
<div style="
background-image: url('images/media_12.jpg');
background-repeat : no-repeat;
width: 490px;
height: 344px;
overflow: auto;
background-position: center;
background-attachment: fixed;
">
I tested it In my FireFox, and Internet explorer works great.
You should also consider making your css external, then you can just link to it, then change only one thing when making changes to your styles.
How to do it:
1. Insert the CSS into a doc with a .css extension.
2. Put this in the head of all your html files:
<link rel="stylesheet" type="text/css" href="mystyle.css" />
3. Your good to go
Note: don't put <style> and </style> tags in the css document
thewebman
02-02-2006, 07:31 AM
umm, the "You Are Under Our Control" thing might freak some people out. I'd also use some more graphics.
Dopple
02-02-2006, 09:47 AM
I'm at work and can't view flash....
el doro
02-02-2006, 12:32 PM
You should also consider making your css external, then you can just link to it, then change only one thing when making changes to your styles.
How to do it:
1. Insert the CSS into a doc with a .css extension.
2. Put this in the head of all your html files:
<link rel="stylesheet" type="text/css" href="mystyle.css" />
3. Your good to go
Note: don't put <style> and </style> tags in the css document
Sorry, Im not sure what you mean by this?
As soon as i get a chance over the weekend ill validate all the pages. As for the Doctype, i googled and found this (http://www.htmlhelp.com/tools/validator/doctype.html) but it doesnt really help someone like em who has no clue what it is. neither did any of the or pages i find, can anyone offer any advice with this?
The 'you are under our control' is the name of the new demo we've started recording, but yes i agree it might scare some!
The Little Guy
02-02-2006, 01:17 PM
Sorry, Im not sure what you mean by this?
http://www.tizag.com/cssT/external.php - This might clear things up.
As for the Doctype, i googled and found this but it doesnt really help someone like em who has no clue what it is.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
As for the Doctype, i googled and found this but it doesnt really help someone like em who has no clue what it is. neither did any of the or pages i find, can anyone offer any advice with this?
Document Type Declarations are used to define certain rules and then the web page states which of the rules it will follow using the !DOCTYPE tag.
The !DOCTYPE tag actually points to a Document Type Definition (DTD) which specifies the syntax or grammatical structure of a web page in SGML. The DTD is used by SGML applications, including XHTML, to specify rules that apply to the markup of documents. An XHTML DTD describes the allowed syntax and grammar of XHTML markup.
Let's use an example of an intelligent car. This car knows the traffic laws wherever it might be. So when it's in England, the car will only go on the left side of the road. If you're driving in Spain, the car will be on the right side, etc. It's the same car, it's just following different sets of rules.
In a similar fashion, the most current browsers are built with a certain amount of intelligence. If, through the !DOCTYPE tag, you tell the browser that there will be no inline styles, but the web page tries to use inline styles, they will be ignored. As we move forward in browser design, it will become ever more important to match the !DOCTYPE tag with the content of the web page.
XHTML 1.0 and HTML 4.01 had three document types. Each DTD may be recognized by a unique label called a formal public identifier, or FPI. The three types were:
* Strict
* Transitional
* Frameset.
Strict is used when you want really clean markup. You would use this when you know your readers are all using the latest browsers with more advanced features like Cascading Style Sheets. The HTML 4.01 version looks like
<!DOCTYPE
html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/DTD/strict.dtd">
Transitional is used when you need to take advantage of some of HTML's older features because you aren't sure how many visitors to the site will have the latest browsers that understand Cascading Style Sheets. This is probably the most common.
<!DOCTYPE
html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/DTD/transitional.dtd">
Frameset is a special DOCTYPE because Frames are depricated (going away). If you still wanted to use frames in HTML 4+, you would make use of something like the following
<!DOCTYPE
html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/DTD/frameset.dtd">
Note: You should always enter your tags as one uninterrupted line. NEVER use a carriage return to break up your tags into pieces. If you copy a tag from somewhere, remove any hard returns that creep into them.
The literal (i.e. quoted) text following the word "PUBLIC" is an FPI referring to the W3C's HTML4.01 DTD. You should always use the correct !DOCTYPE tag.
Starting with XHTML 1.1, we have only one DTD, Strict. This means web designers must only have the cleanest code and should not use frames any more. There are ways to create your own DTD.
el doro
02-02-2006, 06:54 PM
Ah i understand!
The external css seems like a good time saver if i make changes all round, and the validation and doctype are things i knew existed but was unsure of what they were and how to impliment them.
Thats some work for me to do over the weekend, once i've made those changes I'll post back and guage the opinion on the site.
Thanks for all the help
Dopple
02-03-2006, 06:21 AM
The external css seems like a good time saver
You'll soon see how much time it saves. Also, using css you can set the positions of Divs, meaning you can eradicate the use of tables (unless there the use of them is for tabular data). Like on my site (http://www.namik.co.uk).
Ness_du_Frat
02-03-2006, 03:39 PM
I didn't like the intro so much.
And it's really the first time I see a website with soooo much yellow..... which is so cool !!!!
I really like your site, no matter what coding problems you might have. Graphically speaking, it's cool !
You should just work a little more on the flash intro. It's a bit simplistic. How many frame per second do you use ? If it's less than 25, you should increase it.