Skip to main content

soulgrind r's Library tagged design   View Popular

19 Dec 09

Principles of Design: Color

  • Monochromatic Color Schemes


    The monochromatic color scheme uses variations in lightness and saturation of a single color. This scheme tend to look clean, elegant while producing a soothing effect.

  • Analogous Color Schemes


    The analogous color scheme uses colors that are adjacent to each other on the color wheel. One color is set as the dominant color, the other add richness. The downside again is that there can sometimes be a lack of contrast.

  • 6 more annotations...

30 Visually Appealing Corporate Website Designs

  • The layout, graphics, brand identity, url, and colors are essential to the design and must be carefully thought out and chosen. Corporate websites must attain a higher level of readability, clear presentation, ease of function and accessibility.
  • Being Clean, Well Organized and Engaging on a Visual Level
  • 4 more annotations...

Principles of Design: Value

Value, also sometimes referred to as tone, is the relative lightness and darkness of an object.

www.sitepoint.com/...principles-of-design-value - Preview

web design principles color colour graphic graphics

  • So to sum up, things to think about when using value in your designs.


    1. Value occurs in every design. Just by placing an element on a page, value is created. Have you chosen the values or is it an accident?


    2. If you want to achieve contrast, are the values of each element different enough?


    3. Are the values you’re choosing eye-catching? Do they help move the viewer’s eye through the design.


    4. Have you created the right mood with the values you’ve picked. Should the design be subtle or in your face?

  • So to sum up, things to think about when using value in your designs.


    1. Value occurs in every design. Just by placing an element on a page, value is created. Have you chosen the values or is it an accident?


    2. If you want to achieve contrast, are the values of each element different enough?


    3. Are the values you’re choosing eye-catching? Do they help move the viewer’s eye through the design.


    4. Have you created the right mood with the values you’ve picked. Should the design be subtle or in your face?

Using jQuery with ASP.NET: Part 2 - Making Ajax Callbacks to the Server

  • First Ajax Steps with jQuery


    One of the most obvious client side features of any
    Javascript client library is the ability to make AJAX calls to the server.
    jQuery includes a host of Ajax functions that make it easy to retrieve content
    from a Url starting with the low level and do-everything $.ajax() function
     plus a number of others that are simpler
    and more focused to specific tasks. Here’s a list of some of the functions
    available:

  • $.ajax(opt)

    This the low level Ajax function
    with many, many options that lets you create just about any kind of Ajax
    request.
  • 5 more annotations...
08 Dec 09

Principles Of Design: Contrast

  • Things to think about when adding contrast to your designs


    1. How are you creating contrast? Is it through texture, typography, color, or shape?


    2. If you want to achieve contrast through typography, which fonts are you using? Are they very different, or just a little bit different? Be bold with your font choices but remember to make sure the text is legible.


    3. Is contrast strengthening your design idea?

Elements of Design: Type

  • There is no simple answer to this but a good rule of thumb for using and choosing fonts is to stick to two or less typefaces per design. When it comes to fonts restraint is a good thing. Always remember LESS IS MORE. You can achieve interest by choosing two contrasting typefaces. For example on your website you might use a script or grungy font for your headings and contrast them with a sans-serif font in for your body text.

Elements Of Design: The Line

  • Guidelines For Using Lines


    1. Think about what kind of line you will use. Thick, thin, wavy, dotted, dashed, hand-drawn. Each type of line can convey a different feeling.


    2. What’s the purpose of the line? Is it to join related content or to separate unrelated content? Is it to add a border around an image?


    3. If you’re using a grid, are your lines helping to reinforce the grid, or are they breaking out of the grid? Either can be good, as long as you know what the lines are supposed to be doing and you’re making a conscious decision about it.


    4. Think about multiple lines to create texture. A repeating thin hairline can be used as a background texture, as can an elaborate hand-drawn pattern of lines.


    5. Don’t just put lines in for the sake of it. As with any design element, if you don’t need it take it away.

Elements Of Design: Shape

  • Guidelines For Using Shapes


    1. Think about what is the most appropriate way for you to use a shape. Is it a photograph, illustration, block of color or a block of text? Remember, less is more, don’t drag you viewers eyes all over the place by using too many shapes.


    2. If you have a large block of body text, will the design benefit if you break it up using shapes? It can be tiring for a reader to read long sentences that run the whole way across a web or printed page. Use columns if it’s appropriate.


    3. Are the shapes you’re using leading the viewers eye to the right places?


    4. Don’t add shapes purely for decorations purposes. They are a powerful tool in communicating a message.

05 Dec 09

Pushing Your Buttons With Practical CSS3 - Smashing Magazine

We’ll show you here how to create nice button styles without any hacks or cheats.

www.smashingmagazine.com/...ur-buttons-with-practical-css3 - Preview

css3 webdesign css html tutorial tutorials web design blog buttons

  • However, using RGBa we can create a black shadow that is transparent. This allows the shadow to work against any kind of background:
  • button.awesome, .button.awesome {

    -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
    -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
    text-shadow: 0 -1px 1px rgba(0,0,0,0.25);

    }
  • 4 more annotations...

24 ways: Working With RGBA Colour

CSS3 introduces a couple of new ways to specify colours, and one of those is RGBA. The A stands for Alpha, which refers to the level of opacity of the colour, or to put it another way, the amount of transparency.

24ways.org/...working-with-rgba-colour - Preview

html5 css3 webdesign css html tutorial tutorials web design forms color colors colour blog

  • color: rgba(255, 255, 255, 0.5);
  • Like a lot of the features we’ll be looking at in this year’s 24 ways, RGBA colour is supported by a lot of the newest browsers, but not the rest. Firefox, Safari, Chrome and Opera browsers all support RGBA, but Internet Explorer does not.
  • 3 more annotations...

24 ways: Have a Field Day with HTML5 Forms

How to style a beautiful HTML5 form using some advanced CSS and latest CSS3 techniques.

24ways.org/...e-a-field-day-with-html5-forms - Preview

html5 css3 webdesign css html tutorial tutorials web design forms blog

1 - 20 of 207 Next › Last »
Showing 20 items per page

Diigo is about better ways to research, share and collaborate on information. Learn more »

Join Diigo