Print Reseller Scheme
  1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

CSS3 technquie feedback

Discussion in 'Website Design Critique:' started by Jazajay, Jan 2, 2010.

  1. Jazajay

    Jazajay Active Member

  2. Kevin

    Kevin Senior Member

    Well Safari supports some transitions, so I opened it in Safari and took a look and I saw an instant shadow appearing and your color transitioning from white to green. When I updated my Firefox I saw the opposite effect, fading shadow and instant color-transition.

    Either way, I don't think it's necessary and not worth the effort right now with the limited cross-browser support, I doubt that many people looking for window cleaners are using the latest nightly build of Firefox (or Safari for that matter).

    Visually, I think it would be more appealing if color and shadow would transition simultaneously and not like in solely Firefox or Safari. ;)
  3. Jazajay

    Jazajay Active Member

    Cheers for taking a look Onartis.
    Yeah it's a FireFox only selector so it will only show up in the latest nightly build of FireFox.
    I've taken the shadow out in Safari my fault cheers for noticing it though.

    If it's not to over powering I will add it to Opera and Safari as well though, just want feedback at the mo. As in ~
    Too much, okay, nice or just crap.

    I do disagree though just because it wont be used, hardly at all, IMO doesn't mean it shouldn't be done, that and it took me less than 30 seconds to implement so not a load of time trying to do it either. :)
  4. Levi

    Levi Moderator Staff Member

    I've got drop shadows (can't say I like them to be honest) on the link text etc using plain old firefox 3.5 :p
  5. Jazajay

    Jazajay Active Member

    yeah 3.5 will give u basic drop shadows, 3.7 which is the latest nightly build basically animates it hard to explain without seeing it in the nightly build. The nightly build wont override your version of firefox. Once u download it though close firefox before u load the nightly build. If u try to load the nightly build with firefox open it just reopens firefox n not the nightly build.

    But cheers for the feedback, don't u like all of the links, the ones on the nav and on the text links? :)
  6. Levi

    Levi Moderator Staff Member

    I'm not keen on the links, I think they're a little too dark at present and make the text a little difficult to read. Can you lighten them up a bit?
  7. Ben

    Ben Junior Member

    I'm not a big fan of animation on web pages. Before I updated firefox I had a look and I liked the instant shadow on the navigation bar. I think the animation is too slow to be used on a link though. I would find myself clicking the link before it had time to do anything.

    I'm using some CSS3 a little bit on my new site. I think people who have up to date browsers should be rewarded with prettier sites as long as it still looks ok in old browsers.
  8. tbwcf

    tbwcf Active Member

    Hi Jazz, I only looked in ff 3.5 but for me the shadows are far too spread. Personally I would tighten them up more like text-shadow:1px 1px 3px #666666;

    I came from a print background and have built up a hate of shadows that are too big, so many people used to just use indesigns default settings and now its spreading onto web...... ahhhhhhh

    Maybe even lighten the shadow up a little too. Also I think it could be argued that the shadow should be a darkened/tint of the text/background colour rather than black/grey - using black/grey sometimes just makes it look a bit dirty.

    Looked in safari and saw the glow, I don't see a problem with using this but for me it is a little slow for people to really notice... doesn't mean it shouldn't be there I guess. You can also do this with javascript (you probably already know that) I think jquery has a neat plugin called 'glow' or similar.
  9. Harry

    Harry Senior Member

    I don't think the animations or shadows add anything here, they're a little pointless IMO.

    Also, regarding:
    A shadow is never a colour, it's just a translucent black of varying opacity through which the background shows. Ergo, use text-shadow:1px 1px 1px rgba(0,0,0,0.4); to just use a translucent black. Voila!
  10. tbwcf

    tbwcf Active Member

    That's basically what I was trying to get at... a translucent black would be like the web equivalent of the 'multiply' effect in photoshop/indesign.

    I still think a darker version of the actual colour could look better than mixing with black. but in the interest of not having to work out new colour references for every shadow - transparent black works for me.
  11. Harry

    Harry Senior Member

    Sorry, I was agreeing with you lol. But the shortcut to finding a darker colour is to add black to it via overlaying some translucent black. Voila!
  12. Jazajay

    Jazajay Active Member

    Thanks for all your feedback sorry I haven't been back to this just done a mega load of overtime so haven't had chance. I've currently removed it and just added shadow on the nav on hover now.
    I'll go through your comments in a min and see if that was the right thing to do.

    Thanks again to all.

    As this technique has now been removed this thread can now be closed. :)

Share This Page