Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS .

  • This topic is empty.
Viewing 15 posts - 1 through 15 (of 16 total)
  • Author
    Posts
  • #36011
    artsibelle
    Participant

    .

    #94232
    chrisburton
    Participant

    I’m not really sold on the overall theme and color palette you have chosen. It doesn’t seem like there really is one. The logo seems like an outdated attempt. I would change the typography as a whole. I’m not sure what the gray background behind the content image is supposed to be? The banner under “Making your dream event come alive” serves no purpose.

    #94233
    davidlab.be
    Participant

    I want to be positive about something, but I would say try again. Take a look around the web and get inspiration form a site you like or multible sites and combine ideas. BUT DON’T STEAL ARTWORK!

    #94238
    snillor
    Member

    If I remember the previous incarnation of the site, congratulations on the redesign – I find this version much more attractive.

    Understanding that this is probably a preliminary design, my initial reactions…

    1) Regarding a color scheme, I like the rich brown and light yellow combination. Maybe make the scalloped header area the same rich brown. And when you get around to styling links, you could incorporate the same brown into, for example, hover states. On the other hand, the gold of the site name looks good against the black, so maybe you’ll want to keep that. You could play around with a gradient from black to the rich brown to see how that looks.

    The gray isn’t working for me; maybe it’s too neutral. If you want to stay with grays (and that’s not a bad thing to have behind photos) try some with just a hint of warm or cool color.

    2) I agree that the gray behind the main image isn’t very effective.

    3) Definitely think about your font choices.

    4) Congratulations on having your CSS validate. Your HTML has 3 inconsequential errors, but they’re easily fixed by replacing “&” with “&”.

    As I said, a big improvement over the first version.

    #94240
    chrisburton
    Participant

    I would have to disagree on most of what @snillor has just stated. The gold in the logo is very “old school” in choice of gradient style. I love gradients but the gold is “web 2.0ish”. By brown, I think snillor means maroon and I would have to say the maroon does not look right at this point because it doesn’t really go with the rest of the design. The lack of appropriate color scheme makes it hard to understand what exactly is happening.

    Edit: If you notice on Youtube, they have something similar for the “show more” section under the video except they do not angle the shadow.

    #94243
    artsibelle
    Participant

    .

    #94247
    tuckyhutsman
    Member

    The color scheme could work. It’s better than the last one I saw. What really bugs me now is the way the ‘Welcome’ message and the ‘BROWSE OUR GALLERY’ message dont line up vertically. Push down that Gallery link box, there needs to be some cream color showing above that to make the horizontal division of the page look clean.. While I’m talking about alignment, the top Nav, the ‘Making your dream…’ copy & the Gallery link should center align. I see you have them stuck to the edge of the window as users reize their browsers. I might suggest that that you don’t do so much min-width & percentage trickery since you are clearly pretty new to this. These are great techniques, but you need to work out the basics. I suggest you make a fixed-width design for now. Otherwise you are juggling way to may pins at once.

    Also, the Gallery link box is a very different border style from the photo. And not ‘good-different’. I suggest you simplify the Gallery link box but give it a dramatic :hover state.

    I suggest a bit of margin-left on your ul element to push those bullets in, but that’s just my stylistic preference.

    Pull your browser window open REALLY wide, notice your cream color fills the window outside the site? That is weird. Make sure that the background that extends behind the width of your site is at least slightly contrasting. You could go a little lighter or a little darker, I wouldn’t go too far from the cream, but there should be a visual boundary at the edge of the site container.

    Good Luck!

    #94249
    artsibelle
    Participant

    .

    #94251
    artsibelle
    Participant

    .

    #94269
    chrisburton
    Participant

    @artisbelle This is something I quickly threw together and is probably the approach I would take for a project theme like this – removed

    #94271
    artsibelle
    Participant

    . . .

    #94264
    chrisburton
    Participant

    If I created this in Illustrator it would look a lot better. I just wanted to create something quickly to show you the approach I would personally take.

    Just the indent or the shadow that goes with it?

    #94293
    artsibelle
    Participant

    The indent and shadow, please. Thank you.

    #94297
    chrisburton
    Participant

    Indent:

    1. Create a layer with a width of your choice and a height of 1px.
    2. Fill the layer with any color and set the fill to 0%.
    3. Double click the layer to create a style effect.

    • Inner Shadow: use roughly 5% opacity, 90 for the angle and 1px for distance (the rest leave 0)
    • Drop Shadow: change the blend mode to normal, #ffffff for the color, play with the opacity (you want it to just give a highlight of the background – I used 85%), 90 for the angle and 1px for the distance (the rest leave 0).

    Triangular shadow:

    I created another layer with the same width and height (you can just duplicate the indent layer and remove the actual indent afterwards). I added a drop shadow by double clicking the layer. I set the distance to 1px and size to roughly 30px-40px. Be sure to set the angle to -90 degrees this time. I set the opacity on the layer itself to about 35%. I then used two squares matching the background color on the ends with 45(-45) degree angles to give the shadow a shape of a triangle.

    #94299
    sayersteach
    Member

    As a start it looks nice. The font for U and I part of the page is hard to read. I think this is important because you want the user to remember what site they are at. This may sound dumb but it actually helps to put the words uandievents.com somewhere in a nice design that is memorable, you want people to remember the site so they can come back.

Viewing 15 posts - 1 through 15 (of 16 total)
  • The forum ‘CSS’ is closed to new topics and replies.