Color Scheme (56k warning)

It doesn't matter if you do all the error checking in the world, or if you have the most beautiful graphics, if your site or application design isn't usable, it's not going to do well. Get input and advice on usability and user interface issues here.

Moderator: General Moderators

Post Reply
User avatar
onion2k
Jedi Mod
Posts: 5263
Joined: Tue Dec 21, 2004 5:03 pm
Location: usrlab.com

Color Scheme (56k warning)

Post by onion2k »

How's this for a lovely color scheme then? It's supposed to be big and bold..

Image
User avatar
jayshields
DevNet Resident
Posts: 1912
Joined: Mon Aug 22, 2005 12:11 pm
Location: Leeds/Manchester, England

Post by jayshields »

Nice :)

I hope it's CSS :)

If so, how did you do the gradient & circle in the background?

Is it just a big image?

It would be perfect if the circle peaked in the centre of the layout instead of being off to the right a little.
User avatar
onion2k
Jedi Mod
Posts: 5263
Joined: Tue Dec 21, 2004 5:03 pm
Location: usrlab.com

Post by onion2k »

jayshields wrote:Nice :)

I hope it's CSS :)

If so, how did you do the gradient & circle in the background?

Is it just a big image?

It would be perfect if the circle peaked in the centre of the layout instead of being off to the right a little.
Currently it's in photoshop.. however, the final version will be CSS, with a semi transparent PNG background (and IE hack for alpha) for the gradient.
User avatar
jayshields
DevNet Resident
Posts: 1912
Joined: Mon Aug 22, 2005 12:11 pm
Location: Leeds/Manchester, England

Post by jayshields »

Why make it on Photoshop first? Planning?

I would find it easier to plan/design/create in CSS and use trial and error.

I reckon I could make something like that quicker in CSS then in Photoshop - lol, it takes about a minute for Photoshop to load!
User avatar
onion2k
Jedi Mod
Posts: 5263
Joined: Tue Dec 21, 2004 5:03 pm
Location: usrlab.com

Post by onion2k »

jayshields wrote:Why make it on Photoshop first? Planning?
I know approximately what I want, and that includes the gradient .. hence Photoshop. If I just wanted the boxes I'd have gone straight to HTML.
User avatar
pickle
Briney Mod
Posts: 6445
Joined: Mon Jan 19, 2004 6:11 pm
Location: 53.01N x 112.48W
Contact:

Post by pickle »

Pretty good. I don't know about the green though - I'd make it a little more blue and a little less yellow.
Real programmers don't comment their code. If it was hard to write, it should be hard to understand.
User avatar
neophyte
DevNet Resident
Posts: 1537
Joined: Tue Jan 20, 2004 4:58 pm
Location: Minnesota

Post by neophyte »

That sings! I like it.
User avatar
feyd
Neighborhood Spidermoddy
Posts: 31559
Joined: Mon Mar 29, 2004 3:24 pm
Location: Bothell, Washington, USA

Post by feyd »

8O the green seems to be pushing the boundries of eye strain, I guess it depends on how much is exposed, but overall.. very nice.
matthijs
DevNet Master
Posts: 3360
Joined: Thu Oct 06, 2005 3:57 pm

Post by matthijs »

8O is it for some web 2.0 wake-up service which pops up in the morning when starting up ones pc? Just kiddin, maybe it's only my monitor's brightness...
User avatar
Benjamin
Site Administrator
Posts: 6935
Joined: Sun May 19, 2002 10:24 pm

Post by Benjamin »

onion2k wrote:however, the final version will be CSS, with a semi transparent PNG background (and IE hack for alpha) for the gradient.
What is the IE hack for alpha in PNG's?
Roja
Tutorials Group
Posts: 2692
Joined: Sun Jan 04, 2004 10:30 pm

Post by Roja »

agtlewis wrote:
onion2k wrote:however, the final version will be CSS, with a semi transparent PNG background (and IE hack for alpha) for the gradient.
What is the IE hack for alpha in PNG's?
Ask google.

http://www.google.com/search?sourceid=m ... pha+in+PNG
User avatar
onion2k
Jedi Mod
Posts: 5263
Joined: Tue Dec 21, 2004 5:03 pm
Location: usrlab.com

Post by onion2k »

matthijs wrote:8O is it for some web 2.0 wake-up service which pops up in the morning when starting up ones pc?
Close. It's a "Web 2.0" (scriptaculous effects and AJAX) multi-user portrait gallery.
darryladie
Forum Commoner
Posts: 62
Joined: Thu Mar 02, 2006 6:14 pm
Location: East Sussex, UK

Post by darryladie »

feyd | Please use

Code: Select all

and

Code: Select all

tags where appropriate when posting code. Read:  [url=http://forums.devnetwork.net/viewtopic.php?t=21171]Posting Code in the Forums[/url][/color]

Code: Select all

function correctPNG() // correctly handle PNG transparency in Win IE 5.5 & 6.
{
   var arVersion = navigator.appVersion.split("MSIE")
   var version = parseFloat(arVersion[1])
   if ((version >= 5.5) && (document.body.filters)) 
   {
      for(var i=0; i<document.images.length; i++)
      {
         var img = document.images[i]
         var imgName = img.src.toUpperCase()
         if (imgName.substring(imgName.length-3, imgName.length) == "PNG")
         {
            var imgID = (img.id) ? "id='" + img.id + "' " : ""
            var imgClass = (img.className) ? "class='" + img.className + "' " : ""
            var imgTitle = (img.title) ? "title='" + img.title + "' " : "title='" + img.alt + "' "
            var imgStyle = "display:inline-block;" + img.style.cssText 
            if (img.align == "left") imgStyle = "float:left;" + imgStyle
            if (img.align == "right") imgStyle = "float:right;" + imgStyle
            if (img.parentElement.href) imgStyle = "cursor:hand;" + imgStyle
            var strNewHTML = "<span " + imgID + imgClass + imgTitle
            + " style=\"" + "width:" + img.width + "px; height:" + img.height + "px;" + imgStyle + ";"
            + "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader"
            + "(src=\'" + img.src + "\', sizingMethod='scale');\"></span>" 
            img.outerHTML = strNewHTML
            i = i-1
         }
      }
   }    
}
window.attachEvent("onload", correctPNG);

feyd | Please use

Code: Select all

and

Code: Select all

tags where appropriate when posting code. Read:  [url=http://forums.devnetwork.net/viewtopic.php?t=21171]Posting Code in the Forums[/url][/color]
User avatar
Benjamin
Site Administrator
Posts: 6935
Joined: Sun May 19, 2002 10:24 pm

Post by Benjamin »

Roja wrote:
agtlewis wrote:
onion2k wrote:however, the final version will be CSS, with a semi transparent PNG background (and IE hack for alpha) for the gradient.
What is the IE hack for alpha in PNG's?
Ask google.

http://www.google.com/search?sourceid=m ... pha+in+PNG
No Thanks.
Post Reply