Layout Help - PLEASE

  The Paul 09:15 29 Aug 04
Locked

Hi All - I have tried, using various programs to create the separators that you see on many web sites. The link shows you an example of what I mean. My own versions look weak, very amateurish and basically naff.

click here

This site belongs to a friend and shows you the type of thing I mean. I'm specifically interested in the blue and yellow (ish) lines and how they merge and wrap together. How is this done. Cheers - Paul

  The Paul 11:46 29 Aug 04

cheers for your great post. I've printed it off to spend time working through what you have said.

In the meantime, what I'm exactly looking for is how to create the yellow bar along the top with the blue curving bar above and to the right of it (where the buttons are) which then curls underneath the yellow bar. Is this produced using Fireworks or something like that.

Sorry if this sounds a bit thick but I just cant figure this out.

  The Paul 12:24 29 Aug 04

Cheers. I guessed so but when I do it using Photoshop and the like and then place them on my pages they look awful. I'll keep trying and see where I get. Thanks again.

  sitem 23:48 29 Aug 04

Looking at the link, a lot of the images seem to be unecessarily complicated.

As pointed out in the reply above, links should be text where possible and the kind of layout you are looking for should be created with tables or divs & css.

Often with this kind of design, most of the square areas are table cells/divs with coloured backgrounds and only the curved section is an image, which is inserted into a seperate cell.

  The Paul 07:30 30 Aug 04

Thanks for that. This makes a bit more sense to me. All I need now is to figure out how to create these images and then place them in the table cells.

I'll get there - eventually. Cheers

  Forum Editor 13:54 30 Aug 04

The way to make this type of graphic is to use table cells, and then add curved .gif images to get the effect you want. It's a learning curve, but with a little practice you'll soon be wondering what you found so difficult in the first place. Your friend has gone about it in an unnecessarily complicated way.

A neat way of creating rounded cell corners is to use your graphics program to create a rectangle with rounded corners. Make the rectangle the exact size and colour for your page and then, using the knife tool, cut the bottom half off - using a horizontal cut. Save the resulting graphic and put it into a table cell; you can flip it if you want a curved bottom cell.

There are various ways of achieving the same result - all based on creating graphics. Save them as .gifs and put them into tables.

  The Paul 21:25 30 Aug 04

Cheers FE. That is the kind of idvice I needed. I'll practice these points for the next fews weeks and upload some ideas for your views.

Good to see nothing has changed - good advice and support as always. Paul

This thread is now locked and can not be replied to.

Best phone camera 2016/2017: Galaxy S7 vs iPhone 7 vs Google Pixel vs HTC 10 Evo vs OnePlus 3T vs…

1995-2015: How technology has changed the world in 20 years

These are the Best Christmas Ads and Studio Projects of 2016

Super Mario Run preview | Hands-on first impressions of Super Mario Run: Mario's iPhone & iPad…