FRIHOST FORUMS SEARCH FAQ TOS BLOGS COMPETITIONS
You are invited to Log in or Register a free Frihost Account!


Designing a website tips





dragonflame
Here are some things I've found to be very helpful.
1) Before you design a site go to template sites and browse around for 30 minutes, pick out the ones you like and ask yourself why you like them. Look at your favorites over and over. You should get your own ideas while conceptualizing your site.

2) Go to Photoshop (or similar tool) and play around with the layout/design. No such thing as a perfect design, but it's not a one day thing either. What you see today may look different tomorrow. Balance of the page (colors, sizes of objects, positioning) is important. When you make a new page, be sure to select 1024x768 or 800x600, whichever you prefer, just make sure it's the right dimensions. Choosing the wrong size might mean having to redo everything.

3) Layers are your best friend. Organize well. Helps with moving around things faster and reuse some graphics.

4) when youre happy with your design, copy merged or save a jpg then start cutting it up. Cutting up and writing the html is a precise thing. I rarely use width="75%" I always use width="200" (except placing main content area in the background, so people can resize their browser without destroying your html). This HELPS a lot with cross browser compatibility. DO NOT touch any html until youre finished with your site design completely. I cannot emphasize that enough. While cutting up, look out for sections you might be able to convert into flash later on.

I'm no expert, but these guidelines have helped me a bit (as well as taking me a few years to learn)
sprinqles
Very short and informative! Just the way I like it. Smile
Jack_Hammer
Quote:
While cutting up, look out for sections you might be able to convert into flash later on.


What is the need if you have highly optimised images?, surely unless it calls for flash there really is no need., I say only use flash when it is most appropriate, otherwise there is no point.
m_furquan36
Thnkx for the tips, even though i knew them, they are quick reminder of what i have personally achieved!!! Wink
dragonflame
Jack_Hammer wrote:
Quote:
While cutting up, look out for sections you might be able to convert into flash later on.


What is the need if you have highly optimised images?, surely unless it calls for flash there really is no need., I say only use flash when it is most appropriate, otherwise there is no point.


there are effects you can achieve with flash that you cant with simply javascript. I will not go into a repartee about whether it's good to use flash or not, but in any case, it's good to cut up your images in a way that it will accomodate either.
SamiTheBerber
That is a good way to beginners. That can success or not depending coder and browser. Must try myself that kind of layouting once Wink
Tom7
very informative forum, well done.
Monochrome
These informations were very helpful, thanks.
netsearcher2000
Hi,

It is very nice to hear your experiences. But one thing coming up to my mind is: IF we design lots of picture in one page, it will increase loading time and ...users will feel uncomfortable...

Do you have any tips of avoiding this problems?

Thanks.
Tieskevo
your avatar... did you made it yourself?? i saw it deviantart..
so i was wondering if you made it..
joshua_erceg
I agree with your advice... Smile
Image slicers in Paintshop (I presume Photoshop has them also) are a huge help! Very Happy
I design my web layouts in Paint Shop & the image slicer is just SOO convenient.
Its then only a simple matter fitting them together in a HTML table once you know all the dimensions etc.
I think that the Image Slicer is one of the best things about Paintshop.
Am I right in saying you can also get external programmes that serve the same purpose? Very Happy
charliehk
Thank you! Your ideas are useful! Cool

But IMHO, examples illustrating your ideas would be very great for especially for newbies!

For example, you could show us some examples of using Layers to make the website look good!
budazz
good tips i like it very useful Arrow Idea
dragonflame
Tieskevo wrote:
your avatar... did you made it yourself?? i saw it deviantart..
so i was wondering if you made it..


Good observation. Im a big deviantart fan, and I can only wish I made this avatar. I love the artist who made it and her works, Im trying to get exclusive rights to it, if she'll let me
dragonflame
Jack_Hammer wrote:
Quote:
While cutting up, look out for sections you might be able to convert into flash later on.


What is the need if you have highly optimised images?, surely unless it calls for flash there really is no need., I say only use flash when it is most appropriate, otherwise there is no point.


optimized images = smaller size. Better for smaller bandwidth.
dragonflame
netsearcher2000 wrote:
Hi,

It is very nice to hear your experiences. But one thing coming up to my mind is: IF we design lots of picture in one page, it will increase loading time and ...users will feel uncomfortable...

Do you have any tips of avoiding this problems?

Thanks.


very good question. The simple answer is you do want a lot of space on your site. It's better for peoples eyes when reading content. If you DO need to use graphics, it's good to cut it up, so it's a bunch of smaller downloads. Optimizing them makes them smaller. Also try to tile images if you can, be on the look out for images you can repeat or stretch. Light colored images also seems to tend to be smaller.

For example:
if you make a one pixel dot gif file, you can use <img height=5 width=5 source="dot.gif"> gives you a square.
dragonflame
charliehk wrote:
Thank you! Your ideas are useful! Cool

But IMHO, examples illustrating your ideas would be very great for especially for newbies!

For example, you could show us some examples of using Layers to make the website look good!


good idea! I will make one.
magic
nice
but i prefer to start coding straight away its easier for me
jarcelao
nice tips dude! way to go! keep up the good work! Cool

i'm looking forward in reading your layers tutorial... Smile
tkcy
Sweet! Keep it up dude!
dragonflame
Since I'm such a lazy bastard, here's someones elses good example that everyone can relate to. Notice how he used layers extensively. Look at his site for other good examples on how powerful photoshop is.

http://www.eyesondesign.net/pshop/matrix/text_effect.htm
Commando_Sondre
Thanks for that,
now I can really start making my homepage!!!
Related topics
Andermans Tips For Creating A New Website
Where to start?
Making Website in Photoshop
Sample CSS layouts
Site to help complete beginners with web design
to make web site
First version of Space.FRIH.net is live!!
Our Lady of Guadalupe Miraculous Image Studies
Guten Tag!
i will be posting new scripts
Hey, space.frih.net is now AstroTwister.com. cool, eh?
What jobs you like to do?
Weblineindia Software Development & Web Designing Compan
Who I am, My Questions and Any Website Tips?
Reply to topic    Frihost Forum Index -> Webmaster and Internet -> Design Tips

FRIHOST HOME | FAQ | TOS | ABOUT US | CONTACT US | SITE MAP
© 2005-2011 Frihost, forums powered by phpBB.