I am new to web design and am trying to get a website I have designed for a friend to validate both for CSS and for HTML but it comes up with some errors that I cant seem to fix.
In the W3C website validation service the CSS come up with:
39 Value Error : background attempt to find a semi-colon before the property name. add it
47 Value Error : padding -5.0 negative values are not allowed : 35px 15px -5px 0
I do understand the mistakes but I have rectified them and it still comes up with it. I even copied and pasted the “valid” CSS that it came out with into my file and uploaded it onto the web but it still keeps coming up. I know the files were downloaded correctly as I changed the title slightly and the new title came up. I dont know what else to do.
The HTML comes up with:
Error Line 1, Column 3: XML Parsing Error: Start tag expected, ‘<’ not found.
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” "http://www.w3.org/TR
and
Error Line 1, Column 0: character “” not allowed in prolog.
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” "http://www.w3.org/TR
Which I don’t understand. I don’t see where the error is and am using almost the same headings as another site that has validated.
The website is www.elisegur.es but if it makes it easier I can paste the markup directly here (I haven’t done it this time as it makes the post seem too long!!!)
It is also coming up very messed up in IE but shows up OK in firefox, any suggestions would be really appreciated!
If anyone can help with either problem I really would appreciate it as I am literally pulling my hair out and I don’t really want to go bald!!
The BOM is the character that is immediately before the < at the start of that line. Depending on what character encoding you are using to view it you may not be able to see it as it is not a displayable character.
The Byte Order Mark is a sequence of characters representing the Unicode code point U+FEFF. Its purpose is to indicate the byte order in UTF-16, which uses two octets per character. It’s completely unnecessary in UTF-8, which uses single octets only, but some editors (like Notepad in Windows) insist on putting it there anyway.
You won’t see it, normally, because it’s not a printable character. If the character encoding is incorrectly specified as, e.g., ISO 8859-1, the BOM will appear as three characters () in the browser.
I’m not saying it’s definitely a BOM, but there are some invisible characters before your doctype declaration, and BOMs are the usual suspects. Make sure to set your editor to save as UTF-8 without BOM (if it supports it) and make sure to declare the encoding to be UTF-8.
Also, put a space before the / on the end of this line for maximum browser compatibility and safety! In XHTML, elements that “close themselves” should be closed like <this />
There is definitely a BOM. In fact, there are two. (<!DOCTY…)
Open the file in your editor, then save-as. Select utf-8, not Unicode as the character encoding. Then save. That should fix things. You might also consider switching to a professional grade editor such as Emacs or Vi(m).
That is not quite correct. It only applies to pretend-XHTML that is served as text/html, because some ancient HTML parsers may choke on the ‘/’ (which doesn’t mean what an ‘XHTML’ author intended anyay).
In real XHTML, like any application of XML, the space is totally unnecessary.
First of all thank you very much for your help and suggestions.
gary, I have tried to save it as you said but it is already being saved as UTF-8, I also have several other choices in regards to which character codings to save it as but the most relevant seem to be the following:
UTF 16
UTF 16 LE
UTF 16 BE
UTF 32
But all of the above have a description of Unicode, would it help to save them as a different one? What I will do in the mean time is save them as ISO-8859-15 and then change them back to see if this helps.
Once again thanks Gary and everyone else that has givenm me suggestions. I will let you know how I get on.
I am using Linuxes Gedit as an editor, are Emacs or Vi(m) that you mentioned compatible with Linux? Also are they very expensive?
Yes, they are available for Linux. Vim is an improved version of the venerable old vi editor from Unix, and is usually included in Linux distros. I recommend gvim, which is the X Windows version, over the traditional variant that runs in an xterm window.
Both Vim and Emacs are open source and free. Both also has quite a learning curve, but once you master them they are extremely efficient.
I am using Linuxes Gedit as an editor, are Emacs or Vi(m) that you mentioned compatible with Linux? Also are they very expensive?
Lawlz! I’m using gEdit as well, and I’ve never gotten a BOM (you must have, just once, saved as Unicode instead of just UTF-8… the other ones, UTF-16 and 32, should always be avoided).
Compatible with linux? Both of them were written for UNIX systems! They were born there. They are both absolutely free as in beer and speech, but they cost time to learn (so pick just one and learn it). When not using gEdit, I use vi.
Emacs is for those who like kitchen sinks, because it practically comes with one. It does windows. It will do your taxes and take the dog for a walk. It might even clean up after your dog too.
In fact, I know you already have Vim, and you might possibly already have Emacs.
Go into the terminal and type vi NameOfYourPage.html and there it’ll be.
Bit of an old thread, but as far as boms go, in the site settings for frontpage, for the language, it says us/western european (windows). To avoid boms, what exactly should it say there please ?
For FP Win 2000-2003 the encoding options are under Language (character set). Go to: Tools > Page Options > Default Font tab (or Unicode (UTF-8) tab). You will notice an option that says “Multilingual (UTF-8).” That will set it to Unicode.
Though I suspect you want different, and are you actually having any visible BOM issue in the first place?
As I don’t have a copy of FP program I cannot tell you what to set it to but if it has an ANSI option it might remove the BOM. Also if you use templates they’d have to be edited.
The setting you should be looking for is called “Don’t use frontpage” – or dreamweaver, or Web Expression, or any other steaming pile of refuse that comes with a WYSIWYG.
Using such tools is part of why your layout is completely broken here in EVERY browser (I must not have that magical combination of small fonts and IE6)… The other part being the use of dynamic fonts over fixed-height design elements, the pinnacle of /FAIL/ at web design.
This is evident in the endless DIV and classes for nothing (even more surprising on a fixed width layout) , paragraphs around non-paragraph elements, presentational images in the markup, comment placement that could be tripping rendering bugs in IE7/earlier, etc, etc, etc…
Do yourself a huge favor, grab a programmers text editor - Crimson Editor, EditPlus, Notepad++, gEdit, there’s plenty of them… (just don’t go back to 1978 as Gary suggested - **** vi - I wanted that cryptic I’d still be using wordperfect commands… ctrl-K, F that)
You want a preview pane, do it in the real browsers.
Basically, throw that out as an example of how NOT to design a website, and start over with clean semantic markup.
and that’s just Opera. You don’t even want to know what IE6 is doing since the comment placement is tripping the double-render and dissapearing content bugs.
(the footer is messed up too, but you get the idea)
Frontpage - A blight upon the Internet that does nothing but make broken pages - there’s a reason M$ dropped it as a product years ago… NOT that their replacement is any better.
