ach, I don't have much time to spare but here's some quick reactions:
It looks nice; I like the graphic.
You don't need to put the <html> tags in your css document. Your css might be better off like this:
body,html { background:url(buffygunn.jpg) top no-repeat #D18A92; margin-top: 317px; color: #D18A92 */here you have set the text colour and the background colour as the same; I'm not sure what that is for but I am flagging it as weirdness/* } h1, h2, h3, h4, h5, h6 { color: #D18A92 } table { border-collapse: separate } a:link { color: pink; text-decoration: none; } a:visited { color: pink; text-decoration: none; } table { background-color: black ; width: 679px; } table { margin-bottom: 10px; }
It's a bit of a hack to push the body down the page in that way. It might be a bit nicer and cleaner to pop the header graphic in its own division and style it in your css (<div id="header"></div> . #header{background url(buffygunn.jpg) center no-repeat; height:317px; width:YOURWIDTHHERE;} ) but that's totally up to you of course!
You ought to define a base size for your text in the body selector. Just font-size:1em will do.
Now, in your html there are several issues. Your div "hdr" is a menu, but it is not coded as a menu or list. It might be worth marking that up as an unordered list and then styling that list. So:
#hdr ul li { list-style-type:none; padding-left:5px }
COLOUR
Your colour scheme is pretty, but inaccessible to many readers. colorChecker returns:
Your colour combination of #ffc8cb and #D18A92 does not pass Checkpoint 2.2 Brightness The difference in brightness between your foreground and background colours is 57 and is therefore insufficient. The W3C recommends a standard of 125 or greater. Contrast The contrast between your foreground and background colours is 165 and is therefore insufficient. The W3C recommends a standard of 500 or greater.
![[personal profile]](https://www.dreamwidth.org/img/silk/identity/user.png)
ninetydegrees
no subject
on 2006-06-24 07:42 am (UTC)It looks nice; I like the graphic.
You don't need to put the <html> tags in your css document. Your css might be better off like this:
body,html {
background:url(buffygunn.jpg) top no-repeat #D18A92;
margin-top: 317px;
color: #D18A92 */here you have set the text colour and the background colour as the same; I'm not sure what that is for but I am flagging it as weirdness/*
}
h1, h2, h3, h4, h5, h6 {
color: #D18A92
}
table {
border-collapse: separate
}
a:link {
color: pink; text-decoration: none;
}
a:visited {
color: pink;
text-decoration: none;
}
table {
background-color: black ;
width: 679px;
}
table {
margin-bottom: 10px;
}
It's a bit of a hack to push the body down the page in that way. It might be a bit nicer and cleaner to pop the header graphic in its own division and style it in your css (<div id="header"></div> . #header{background url(buffygunn.jpg) center no-repeat; height:317px; width:YOURWIDTHHERE;} ) but that's totally up to you of course!
You ought to define a base size for your text in the body selector. Just font-size:1em will do.
Now, in your html there are several issues. Your div "hdr" is a menu, but it is not coded as a menu or list. It might be worth marking that up as an unordered list and then styling that list. So:
<div id="hdr">
<ul>
<li><a href="index.htm">Home</a></li>
<li><a href="fanfic.htm">Fanfic</a> </li>
<li><a href="meta.htm">Meta</a></li>
<li><a href="ficrec.htm">Fanfic Recs</a></li>
<li><a href="icons.htm">LJ Icons</a></li>
<li><a href="caps.htm">Screencaps</a></li>
<li><a href="graphics.htm">Other Graphics</a></li>
<li><a href="http://viciouswishes.livejournal.com">My Blog</a></li>
<li><a href="links.htm">Links</a></li>
</ul>
</div>
and then:
#hdr ul li {
list-style-type:none;
padding-left:5px
}
COLOUR
Your colour scheme is pretty, but inaccessible to many readers. colorChecker returns:
Your colour combination of #ffc8cb and #D18A92 does not pass Checkpoint 2.2
Brightness
The difference in brightness between your foreground and background colours is 57 and is therefore insufficient. The W3C recommends a standard of 125 or greater.
Contrast
The contrast between your foreground and background colours is 165 and is therefore insufficient. The W3C recommends a standard of 500 or greater.
I suggest choosing a darker colour for your text.