How's this code look? [Archive]

View Full Version : How's this code look?

Graft-Creative

01-09-2005, 02:51 AM

http://foxhill-bank.org.uk/mcs.html

What do you think?

Ther page is purely fo SEs at the mo, though I thought I'd try and prettyfy it a wee bit. The design can be altered to however we want later on, thanks to CSS :thumbsup:

But how does the xhtml look, and the CSS?

Not expecting any 'oohs' or 'aahhhs' as yet; but how does the code look?

Kindest regards,

Gary

_Aerospace_Eng_

01-09-2005, 03:11 AM

other than a few alt tags missing in the image tags it looks good; could maybe use more of the screen

gsnedders

01-09-2005, 03:51 AM

Well, it's sent as XHTML 1.0 Strict and text/html, you may want to look at my latest blog post: XHTML/HTML (http://blog.geoffers.uni.cc/archives/2005/01/07/xhtml-html/).

The rest of the code and the CSS look perfectly fine...

Graft-Creative

01-09-2005, 02:03 PM

gsnedders

01-09-2005, 04:13 PM

Thanks guys.

The narrowness is down to readability issues really. I was given quite a heavy, dense chunk of text to work with there, so it was a flip-up between short, easy to read lines, with lots of scrolling versus long, harder on the eyes, lines of text, but with less scrolling. But yeah it does look narrow, maybe some kind of background around the main divs to pad things out a bit.....

Error 404 (note the space :rolleyes: ) I was reading that very article just last night - and I'm going to implement it once the page is at it's proper server space.

As you know, my knowledge of PHP sucks, big time :o But what's involved in getting it to work?

Many thanks,

Gary

Basically dump all of the code above the <html> tag at the extreme top of the page (replacing the current doctype), then, adding the code in the <html> tag into your <html> tag (this deals with the XHTML namespace and the language), then drop the <meta> tag into <head>, then if needed, change the settings at the top of my script (those are commented to make it nice and easy)

Then, change the extension to .php and upload, really, it's not very complex...

chilipie

01-09-2005, 04:16 PM

Then, change the extension to .php and upload, really, it's not very complex...
For some people anyway... :rolleyes:

Scootertaj

01-09-2005, 07:11 PM

I agree with _Aerospace_Eng_ you could definetly use more of the screen. One thing, you wouldn't have to scroll as much (right?) and to me it just looks funky with one column down the whole page with tons of space on either side.

Graft-Creative

01-09-2005, 11:52 PM

Well, it's a bit wider, and I've tweaked the header a bit. Still a bit of a mess, but hey, the deadline was 10 minutes ago and I've got some zipping and sending to do :p

Still, a few nice touches that I'd like to develop further, what do ya think? http://myweb.tiscali.co.uk/garyhartney/mcs.html

Gary

Scootertaj

01-10-2005, 02:29 AM

IMO it looks better, one thing I noticed was:
some researchers are of the opinion that Multiple Chemical Sensitivity is due to immune system damage or malfunction, which could give rise to a sensitivity to all sorts of triggers rather than a specific reaction to one toxicant.
under "immune system damage" was not captilized.

Otherwise much better, you should be proud!

Graft-Creative

01-10-2005, 02:10 PM

heh, who was I kidding - finished indeed :rolleyes:

Had a bit more time to play around with it this morning - sometimes I really hate being such an obsessive-compulsive :p

Anyway, here it is, at it's proper home:

http://multiplechemicalsensitivity.org/

What do ya think?

Cheers,

Gary

Ryltar

01-10-2005, 02:15 PM

Looks pretty good. don't know about the code though... haven't looked at it yet

Graft-Creative

01-10-2005, 10:11 PM

Tadaaaaa..........now serving: as application+xml, ta Geoffers and readme.txt.

Everyone's happy, few design tweaks, add a nav etc. :thumbsup:

http://multiplechemicalsensitivity.org/

rmedek

01-10-2005, 10:31 PM

add a nav etc.
That was the one thing I was going to mention... maybe a navigation bar to skip to the goodies instead of scrolling all the way down to find what you need.

Also-- just my opinion-- it'd be nice to see a little more padding around the column. I don't find it's the width of the text itself that's too small, just the width of the "page" (i.e., the border around the text). So with more width on that container and more padding, you'd still be able to keep the text readable and give the page a sense of breathing room...

gsnedders

01-10-2005, 10:32 PM

You've made a mistake somewhere in there... The head of the file should be: <?php
// Charset
$charset = 'utf-8';

function fix_code($buffer) {
return (str_replace(" />", ">", $buffer));
return (str_replace("xml:lang", "lang", $buffer));
}
if ((stristr($_SERVER["HTTP_ACCEPT"], 'application/xhtml+xml')) || (stristr($_SERVER["HTTP_USER_AGENT"], 'W3C_Validator')) || (stristr($_SERVER["HTTP_USER_AGENT"], 'WDG_Validator'))) {
$mime = 'application/xhtml+xml';
} else {
$mime = 'text/html';
}
header ("Content-type: $mime");
If ($mime == "application/xhtml+xml") {
echo '<?xml version="1.0" encoding="' . $charset . '"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">';
} else {
echo '<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">';
ob_start("fix_code");
}
?>

<html <?php if ($mime == "application/xhtml+xml") { echo'xmlns="http://www.w3.org/1999/xhtml"'; } ?> xml:lang="en">
<head>
<title>Multiple Chemical Sensitivity. What IS Multiple Chemical Sensitivity? (MCS)</title>
<meta http-equiv="content-type" content="<?php echo $mime; ?>; charset=<?php echo $charset; ?>" />
<link href="sitestyles1.css" rel="stylesheet" type="text/css" media="screen, projection" />
</head>

Graft-Creative

01-10-2005, 11:17 PM

Thanks Richard, I see what you mean; keep the paragraphs the same width, but increase the width of the dotted container, now you've said that - it seems obvious :o

Error 404 (note the space :rolleyes: ) My, yer a fussy bugger, but a helpful one at that :thumbsup:

How's it look now http://multiplechemicalsensitivity.org/mcs.php (not fixed the padding yet, but have implemented Geoffers' script)

Ta,

Gary

gsnedders

01-11-2005, 12:24 AM

Fussy bugger sees this: Internal Server Error, this is an error with your script, check your error log for more information.

Graft-Creative

01-11-2005, 01:14 AM

only error in my error logs is regarding: /public_html/favicon.ico

Try the link without the /mcs.php ? Just the domain name.....

mindlessLemming

01-11-2005, 03:37 AM

Graft-Creative

01-11-2005, 04:13 AM

Nice work, interesting that the client went for the grungy look, but you've done it tastefully; so all is well ;)

One point though, your content text is very light. On my main LCD it's fine, but on the old one next to it I can't read a thing :( On my CRT at work it's somewhere between the two LCDs, but still very difficult to read...

Thanks Andrew - the previous iteration was a lot more grungy - this one is less so - and the next one will be even less so......It's the typography that gets me at the moment; you know sometimes - you get that great feeling, when you look at your work own , and it kind of looks like a 'proper' designer did it? And you think: heh, did I do that? Well I'm not getting that with this design at the moment, dunno if that makes sense?

Yup, the text needs to be darker I agree, was just trying to avoid black-on-white, while also using 'web-safes'

EDIT: I can't believe you went to the trouble of testing it on your various monitors, at work etc.........thanks geezer :thumbsup:

ronaldb66

01-11-2005, 08:56 AM

Chiming in late here:

... just trying to avoid black-on-white
Very good, but it could indeed do with a little more contrast. Stick with the grey text, just use a slightly darker one; experiment with greys between #333 and #666 or thereabouts, you don't really need to confine yourself to the web safe palette anymore these days.

On the coding side: very nice work, you could probably get it to validate like XHTML 1.0 strict with not too much fuss (closing non-container elements would be something); proper use of elements, interesting application of a definition list.

Graft-Creative

01-26-2005, 05:42 PM

Well, here's the re-design, wasn't really happy with the first one ( http://multiplechemicalsensitivity.org )- hopefully this looks a lot more *together* ?

http://multiplechemicalsensitivity.org/test.html

Just a flat visual as yet (gawd knows how I'm going to code it!?)

What do you think?

BTW the background will obviously tile all the way accross the page when I code it up.

Many thanks,

Gary

bazz

01-26-2005, 09:47 PM

....you know sometimes - you get that great feeling, when you look at your work own , and it kind of looks like a 'proper' designer did it? And you think: heh, did I do that? Well I'm not getting that with this design at the moment....

Just caught this thread and in one go, saw the transformation from beginning to end (?) You not getting that 'proper designer' feeling yet? I think it's very good but your php page threw up the error a few moments ago. Maybe your still working on that bit.

bazz

Graft-Creative

01-26-2005, 11:25 PM

Hey Bazz, thanks mate ;)

Yes, starting to feel like a *designer* again - nice to get back into playing around in Photoshop again, after many months of focusing on code.

Anyone else care to chime in? :)

Gary

rmedek

01-26-2005, 11:43 PM

hmmm... I like it all except for the header. It seems out of place somehow; the rest of the elements look much better, though.

One idea-- how getting rid of the header "block" and working the image into the background image for the site? Then move the content blocks over just a bit to the right. I dunno, just an idea... in my head it looks fantastic but who knows what it'd really look like :)

My two cents...

bradyj

01-27-2005, 03:20 AM

It's good, and you're doing much better with your typography I must say:)

Your problem seems to be unity... the form doesn't flow easily.

First off, I like the header (though the quotes would look better a smaller size, and only use three ... to trail, not so many), I think it adds color and imagery to the piece. I don't mind the top white bar and the shadow element, but I don't like the shadows for the rest of it... it's too much shading, and looks forced to me. It also 'breaks' up the header image, and that gives off the feeling that everything is not unified. If you're going to go with a block structure, and minimalist design -- I'd stick straight to that then. Let everything be block divided, get rid of the stripped backgrounds and let the white (or some extra colors) come into play.

I also think the second 'ghost' silohuette above each header is too much -- I like it in the top, and I think the top should take priority over the look then.

What I feel is that you are going in the right path, but you're veering off a bit. If it goes boxy, let it be boxy, sorta like this:
http://weightshift.com/

I'm being general (and I've attached a wireframe) -- but the point is I feel that you're breaking the elements away from each other too much, when the design looks like they want to play off of each other. Don't worry so much about drop shadows and textures, lay this one out with the strong header, images, text, color... then add all the pretty stuff if you feel it's needed -- but it isn't always needed.

Graft-Creative

01-27-2005, 11:11 PM

Thanks BradyJ :thumbsup:

Your problem seems to be unity... the form doesn't flow easily.
..........gives off the feeling that everything is not unified...I feel that you're breaking the elements away from each other too much, when the design looks like they want to play off of each other.

Very fair comments - I kind of felt that way myself, but didn't know if it was just a case of me being finicky. I'll work on your suggestions, and the similar ones Richard made too. Thanks for the sketch too, much appreciated :)

Many Thanks

Gary