Noobie web site build

juvenal

Hi people,

Long time reader, first time poster, and if someone can lend their expertise to me for a minute it would be very much appreciated.

I'm dabbling with a small, basic site for a friend's start-up business. I've little experience in site development, and while the layout looks fine on my scree (WUXGA 1920x1200), it's not replicating properly on screens of other resolutions.

I'm using frames, which I suspect is my first problem. I'm also using MS FrontPage 2000 (probably a pile of dung to the pros), but it's free and that's my only option at present.

The image at as it appears on my screen is attached, and the html file. I'm trying to get the page centred in the middle of the screen, with white borders on either side, but after four days I still haven't figured it out! I've searched google etc, but I think I'm just missing the basic idea.

Any help/advice is much appreciated.

axer

Yes, not great.

From what I can see you are using frames to centre the page.

Maybe start with the attached file.

It is a 750px centred layout with just a header and main content.

It uses CSS for layout. You can start learning CSS here.

If you get stuck just ask away here.

Bananna man

How big are the image files? You dont want them too large otherwise people on dialup are going to have problems with the site. Also, you want a bit of html text on the homepage so that search engines can find out what the site is about. I'd recommend ditching the frames and use the layout provided.

juvenal

Thanks for the prompt replies lads, very helpful

I've never used CSS before, so I'll give it a shot and see how I get on. That site looks very informative, so thanks again axer.


Bananna Man, the images are less than 170k each, so I don't think they'll be too problematic for a dial-up user. I just need to get my layout right and make sure it looks the same irrespective of the end user's screen resolution.

I'll be adding all the text once I get the layout right, it seems that's going to be the most difficult challenge. I'll keep you posted on how it goes.

Cheers. . .

axer

No worries m8, glad to help.

juvenal wrote: »

the images are less than 170k each

That is pretty high for images. Make sure they are optimised for the internet. I'm not sure if you are using jpgs or pngs but both of them can be drastically reduced in size. If you want more info maybe give us a sample of the types of images being used and I can tell you what you should do.

Anyway, good luck with the site.

juvenal

Cheers,

Am I right in thinking that CSS has to be designed in code, or are there WYSIWYG editors that make it a bit more "user-friendly" for novices such as myself?

The background and banner image I was sent are both jpegs, and I reckon if i reduce them any further they'll be useless to use across the whole page?

See attached....

axer

Your not trying to make them pixel-wise smaller. You are compressing them making the filesize smaller.

Attached are the files compressed.

You can use Dreamweaver but i'm sure there are free alternatives that someone else might be able to recommend here.

squibs

You could try kompozer for freeware wysiwig. You'll probably still find that you cant get stuff to appear how you want it, and you'll find that it generates pretty untidy source code which is a pain to work on. You're better off with html and a source editor like html kit if you want to develop more sites. Furthermore, as mentioned earlier it's better to use html for the content and css for the appearance.

juvenal

OK,

It's taken a while what with the distractions of Christmas etc.

So I have the page looking like I want it to on my screen, yet when I view it on another resolution it's all over the place?

I couldn't figure out the CSS at all really, and as it's a once off, I'm finding it difficult to motivate myself into learning a whole new "language" to get the styling right.

Try www dot accident dot ie and see if it's any better?

Any thoughts as always are appreciated. It feels like it's almost done, except for the scaling, or am I juut kidding myself!?

Gordon

juvenal wrote: »

OK,

It's taken a while what with the distractions of Christmas etc.

So I have the page looking like I want it to on my screen, yet when I view it on another resolution it's all over the place?

I couldn't figure out the CSS at all really, and as it's a once off, I'm finding it difficult to motivate myself into learning a whole new "language" to get the styling right.

Try www dot accident dot ie and see if it's any better?

Any thoughts as always are appreciated. It feels like it's almost done, except for the scaling, or am I juut kidding myself!?

There is a problem with your site on my computer. This is down to you using frames.

You should have checked out CSS, axer gave you some great code to get started. Now it will take you a while to sort out these bugs and wil get confused when you start putting in content and menu links.

It's also a shame you completely disregarded axers help of reducing your image sizes too. 164k background image, 140k banner image as opposed to axers 66k image TOTAL. Your images are 5times larger total than axers.

If you aren't going to listen to people trying to help you then do you expect people to keep helping you?

I apologise for my tone but it seems like you are trying to get other people to do your work for you and ignoring the good advice. This is a forum of many web designers that get paid to design websites and it can be rather annoying seeing someone design a badly designed webpage for their mate on the cheap while getting asked how to make it or fix it for them.

squibs

Gordon - go easy lad!

The original poster is helping out a mate as a self confessed amateur on a one off project, looking for a quick fix.

Original Poster - the unfortunate fact is you are unlikely to be able to create something modern, universal and professional looking without skill in xhtml, css, photoshop, possibly javascript, and maybe AJAX, mysql, php, ruby on rails, python,asp.net, etc.. . Oh, and knowledge of W3C, accessibility and browser quirks.

I do this for a living now - and I still get confused and frustrated with the minutae every day. Having said that - best job ever....

If you want a quick chat for some pointers PM me

Reesy

A propos, would youse like to recommend me a WYSIWYG HTML editor? I'd like to use CSS too. I'm just starting out with web design but I've committed to setting up a site for a club I'm a member of.

(Maybe I'm biting off more than i can chew...)

Thanks

juvenal

Gordon wrote: »

It's also a shame you completely disregarded axers help of reducing your image sizes too. 164k background image, 140k banner image as opposed to axers 66k image TOTAL. Your images are 5times larger total than axers.

If you aren't going to listen to people trying to help you then do you expect people to keep helping you?

Yes, this is my fault. I thought I'd used axer's files, but I still had the originals there.

I've changed it now.

I don't mean to belittle anyone's career, but as I mentioned before I'm a novice, and this is a favour. If he could afford to go and get the very best he would, but it's a start up business so he's being prudent as I'm sure you'll understand.

Ideally I want a complete WYSIWYG solution, as I don't understand the concept of CSS for layout and HTML for content, and as I'm sure you'll understand I haven't the time to invest in learning what is, in essence, a brand new language. I'll try my best and all I was asking for here was a little help/advice.

Thanking you again for your previous time...

juvenal

squibs wrote: »

Original Poster - the unfortunate fact is you are unlikely to be able to create something modern, universal and professional looking without skill in xhtml, css, photoshop, possibly javascript, and maybe AJAX, mysql, php, ruby on rails, python,asp.net, etc.. . Oh, and knowledge of W3C, accessibility and browser quirks.

I do this for a living now - and I still get confused and frustrated with the minutae every day. Having said that - best job ever....

If you want a quick chat for some pointers PM me

Cheers squibs. I'm sure you'll appreciate that it's once again something that looks somewhat easy, until you go and actually try to do it.

As I have no skill in any of the disciplines you outlined above, I may just try to get a basic information page up and running and let him take it from there.

Goodshape

Are the links supposed to work? They don't.

And the page title is chopped in half for some reason : http://img.skitch.com/20080218-n5s5kx3g9piwebxgen6dd22sug.jpg

And I don't see why you're using frames at all.

I can only advise that you start with something much, much, simpler. You seem to have gotten way ahead of yourself here when really a fairly simple straight forward website would have been easier for you to produce and possibly looked less amateurish as a result.

Try and stay away from the HUGE graphics, the fancy fonts and the web frames. For some reason it often seems to be the first thing people go for when they don't have a notion how to make websites.

Remember 'KISS' : Keep It Simple, Stupid.

juvenal

Goodshape wrote: »

Are the links supposed to work? They don't.

And the page title is chopped in half for some reason : http://img.skitch.com/20080218-n5s5kx3g9piwebxgen6dd22sug.jpg

And I don't see why you're using frames at all.

I can only advise that you start with something much, much, simpler. You seem to have gotten way ahead of yourself here when really a fairly simple straight forward website would have been easier for you to produce and possibly looked less amateurish as a result.

Try and stay away from the HUGE graphics, the fancy fonts and the web frames. For some reason it often seems to be the first thing people go for when they don't have a notion how to make websites.

Remember 'KISS' : Keep It Simple, Stupid.

No the links were inactive.

I think the reason it was 'chopped' was because I'm working on a 1920x1200 screen, and made the mistake of using frames to centre the page. So even though it looked fine on my screen, on a smaller, "normal" screen it's all over the place.

I'm trying something a little different now.

Gordon

Sorry for going off the handle, that was a bit ott

Goodshape

juvenal wrote: »

I think the reason it was 'chopped' was because I'm working on a 1920x1200 screen

Keep your designs optimised for 1024x768, as this is what most people use today.

Your content area's shouldn't be wider than around 950px.

juvenal

Can someone tell me if they banner I have there now is ok for 1024x768 resolution?

I've no idea how to "contain" my content in the space below. It's really only text, with a few small pictures if possible, but I can't even insert a text box.

Sleepy

It looks fine in 1024 x 768 size wise at least.

One thing that grates even on the little you have up at present is the 'CONTACT US' button using wrapped text. just put a space between the two words, it'll give a much cleaner look.

As for containing your content in the space below the graphic, in a word: tables.