Website Makeover
Jun. 23rd, 2006 11:24 pm![[personal profile]](https://www.dreamwidth.org/img/silk/identity/user.png){kind=small}
viciouswishesI have done a makeover and general update on Sliver of Ice, my personal fic and fannish site. I spent about 2 days working non-stop on it, and now I'm very behind in the rest of my fannish life and my neck hurts. Let me know if any thing's wacky on your browser. There's still some issues with sizing as I need to tell it not to shrink.
It looked horrible with wrongly placed graphics on my outdated IE.
It looked horrible with wrongly placed graphics on my outdated IE.
![[identity profile]](https://www.dreamwidth.org/img/silk/identity/openid.png){kind=small}
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.
(no subject)
Posted by(no subject)
Posted byno subject
on 2006-06-24 07:47 am (UTC)(no subject)
Posted by(no subject)
Posted byno subject
on 2006-06-24 01:56 pm (UTC)Gabrielle
(no subject)
Posted by(no subject)
Posted by(no subject)
Posted by(no subject)
Posted byno subject
on 2006-06-24 10:12 pm (UTC)(no subject)
Posted by