Jump to content
Sign in to follow this  
aj47

Building a website..where to start?

Recommended Posts

I'm currently trying make a website but html is scaring me a little bit. Do any of you know of any simple to use free software or templates that I could use to save time?

Share this post


Link to post
Share on other sites

I suppose I'd have to recommend nvu, but imo it's worth the time to learn xhtml and css if you want a nice looking site.

Share this post


Link to post
Share on other sites
I'm currently trying make a website but html is scaring me a little bit. Do any of you know of any simple to use free software or templates that I could use to save time?

 

I, too, recommend you learn the basics. HTML isn't hard at all, it's a presentation "language", it's very easy (same point as the 'BBCode' in the forum), and it will help you do a lot more than what the average template-site offers.

 

But anyways, what type of site are you talking about? Single page / database / dynamic / fixed-amount of pages? includes pictures? who is going to update it?

 

These might help me, at least, recommend either systems or templates for you to use.

For that matter, joomla is userfriendly even for non-htmlers (though, again, html is VERY recommended, at least), but it's an entire system for dynamic db-driven websites... if you require a 'static' site, there are much simpler solutions like googlepages or the likes..

 

what do you need, exactly?

Share this post


Link to post
Share on other sites

Thanks for the replies. I took your advise and sat down this morning and wrote my first piece of html which wasn't as daunting as I thought it would be. That said I just put it through a validator ( http://validator.w3.org/ ) and there's a ridiculous amount of errors that which i can't seem to fix.

 

One thing I can't work out is how to make the whole document a certain font. It only seems to work if i use the <font face="arial" font size="5.6"> </font> after every paragraph not just in between the <body> tags.

 

Also the validator seems to think theres something wrong with my image tags which are <img src="serotonin.png" width="80" height="60"> and

<img src="antidepressants.jpg" width="200" height="150">

 

Anyone know how it can be fixed?

Share this post


Link to post
Share on other sites

The first one you'll want to do with css...

 

in <head>

 

include something like:

 

<style type="text/css">

<!--

body { font-family: "New Century Schoolbook", serif }

-->

</style>

 

But using arial is NOT a good plan as it's a propitiatory font, you want to use font groups..

 

The issue with your img tags is probably that you're not closing them.

 

In the same way you do <p>text</p>

 

You need to do <img src="aslkjfsdf" alt="A dog" />

 

The final / closes the tag. You should also include an alt tag..

 

I think all of the above is correct but it's been over a year since I've written any html.

Share this post


Link to post
Share on other sites
Thanks for the replies. I took your advise and sat down this morning and wrote my first piece of html which wasn't as daunting as I thought it would be. That said I just put it through a validator ( http://validator.w3.org/ ) and there's a ridiculous amount of errors that which i can't seem to fix.

 

One thing I can't work out is how to make the whole document a certain font. It only seems to work if i use the <font face="arial" font size="5.6"> </font> after every paragraph not just in between the <body> tags.

 

Also the validator seems to think theres something wrong with my image tags which are <img src="serotonin.png" width="80" height="60"> and

<img src="antidepressants.jpg" width="200" height="150">

 

Anyone know how it can be fixed?

 

Try adding an alt="img desc" for each image. This just adds the text you see when an image doesnt open or if setting on the browser dont allow images to be displayed.

 

so it would be <img src="serotonin.png" width="80" height="60" alt="serotonin">

 

Some of the validators insist on this now.

 

I would also recommend learning css after you get a handle on the basics of html. It will make your formatting all pages so much easier and give you much more freedom to create.

Share this post


Link to post
Share on other sites

hey aj47, try out these "notepads" that highlight code and can help you complete your tags, so you do better HTML:

 

This one's a good one I know and like: http://notepad-plus.sourceforge.net/uk/site.htm

but there's also this one - http://notepad.com/

and probably others.

 

They'll help you out, even visually, to write HTML and other code. They also have auto-complete and suggest tags and closing-tags, so I hope you'll find them helpful.

 

~moo

Share this post


Link to post
Share on other sites
hey aj47, try out these "notepads" that highlight code and can help you complete your tags, so you do better HTML:

 

This one's a good one I know and like: http://notepad-plus.sourceforge.net/uk/site.htm

but there's also this one - http://notepad.com/

and probably others.

 

They'll help you out, even visually, to write HTML and other code. They also have auto-complete and suggest tags and closing-tags, so I hope you'll find them helpful.

 

~moo

 

I shall recommend scite, it's what I used to use on windows...

http://www.scintilla.org/SciTE.html

Share this post


Link to post
Share on other sites

Thanks for the help everyone. I think i've finally fixed all the problems with html but im having trouble finding a way to make borders and move pictures around etc. I've found a way to do it with css but im not sure if I can just add it to my html. Can you mix and match html and css?

Share this post


Link to post
Share on other sites
Thanks for the help everyone. I think i've finally fixed all the problems with html but im having trouble finding a way to make borders and move pictures around etc. I've found a way to do it with css but im not sure if I can just add it to my html. Can you mix and match html and css?

 

Yes, infact you're supposed to, css for layout and colours etc, html for content.

Share this post


Link to post
Share on other sites
Thanks for the help everyone. I think i've finally fixed all the problems with html but im having trouble finding a way to make borders and move pictures around etc. I've found a way to do it with css but im not sure if I can just add it to my html. Can you mix and match html and css?

 

Yes, but for me it works best to call the style sheet from my html doc.

<link rel="stylesheet" href="looks.css" type="text/css">

 

But I like to use absolute path so if I move stuff, I dont have to change the stylesheet links.

<link rel="stylesheet" href="http://www.mySite.com/xtras/looks.css" type="text/css" >

Share this post


Link to post
Share on other sites

After a several days crying over my computer I've knocked up a basic website that seems to work ok. However one thing im yet to work out is how to get a caption for a picture when you hover over it?

 

Also im trying to create a roll over image which changes when you put the mouse over. Some people say I should use Javascript while others say use css. What do you guys think?

 

I tried using ..

 

<img src="rollover0.png" id="Phenylethylamine" onMouseOver="getElementById('Phenylethylamine').src='rollover1.png'" rollover0.png="getElementById('Phenylethylamine').src='rollover1.png'">

 

...which changes the picture when you hover over but not back when youtake the mouse off.

Share this post


Link to post
Share on other sites

I think you should use:

 

<img src="mean.jpg" alt="Droch looking angry" />

Share this post


Link to post
Share on other sites

The A:Hover tag is an easy way to do that, but of course it affects all anchors (hyperlinks) on the page.

 

As Klaynos said, you only need an Alt tag to mouse-caption an image.

Share this post


Link to post
Share on other sites

hmm i have an alt tag on all my pictures but none of seem to do anything when i hover over with a mouse.

Share this post


Link to post
Share on other sites
After a several days crying over my computer I've knocked up a basic website that seems to work ok. However one thing im yet to work out is how to get a caption for a picture when you hover over it?

 

Also im trying to create a roll over image which changes when you put the mouse over. Some people say I should use Javascript while others say use css. What do you guys think?

 

I tried using ..

 

<img src="rollover0.png" id="Phenylethylamine" onMouseOver="getElementById('Phenylethylamine').src='rollover1.png'" rollover0.png="getElementById('Phenylethylamine').src='rollover1.png'">

 

...which changes the picture when you hover over but not back when youtake the mouse off.

 

Its been a long time since I played with JavaScript, but I think you have to have a mouse off / out part too.

 

http://www.w3schools.com/jsref/jsref_onmouseover.asp

 

Heres a tool tip that can be adapted for images using dhtml:

http://www.dynamicdrive.com/dynamicindex5/dhtmltooltip.htm

 

hmm i have an alt tag on all my pictures but none of seem to do anything when i hover over with a mouse.

 

The alt tag is a compliance issue. Some verifiers require images to carry that tag for people who dont have pics load on page open. This gives them that text caption in the empty image box.

Share this post


Link to post
Share on other sites

Let me first stress that rollovers are a REALLY bad idea if you wish your content to be accessible so I would advise that you not use them.

 

The problem is with your JavaScript event handling; it could be more simple done as follows:

 

<img src="rollover0.png" id="Phenylethylamine" onmouseover="this.src='rollover1.png'" />

 

... because the code in the mouseover event handler will be interprited in the context of its parent element (in this case the image tag) it will work just fine to reference to the element as "this"

 

Hope that helps.

Share this post


Link to post
Share on other sites

I realise the thread has gotten a little more specific, but if you were looking for free templates, http://www.freecsstemplates.org has some fantastic templates you can use for free. You will have to know a little bit of HTML yourself to insert text properly, embed images and such, but you'll find it all quite trivial after you do it the first time. W3Schools.org is a maybe a good starting point to learn the basics of HTML.

Share this post


Link to post
Share on other sites

Yah, I've used those free CSS template sites before for small projects; they can be real time-savers.

Share this post


Link to post
Share on other sites

A good basic design, simple and fast, yet professional in appearance. Thumbs up.

Share this post


Link to post
Share on other sites

Looks good. My only criticism would be the red rollover on the blue background. Other than that, good job. Was this for a project or what?

Share this post


Link to post
Share on other sites

I know this is a bit late for the OPer's purposes, but has anyone used Google Sites yet? Apparently it's a webpage builder that lets anyone build webpages. IT doesn't require the builder to know any HTML.

 

Anyone tested this yet?

Share this post


Link to post
Share on other sites

hmm i wasn't sure about the rollover i'll probably change it and yea it was for a project im doing.

Share this post


Link to post
Share on other sites
I know this is a bit late for the OPer's purposes, but has anyone used Google Sites yet? Apparently it's a webpage builder that lets anyone build webpages. IT doesn't require the builder to know any HTML.

 

Anyone tested this yet?

It's actually pretty sweet, but I am having troubles analyzing it correctly, because I'm not used to letting go of code while building a site.. it is a bit limited, as is expected from a WYSIWYG editor (specifically an online one), but if your purpose is a basic site without too much hooha, it looks great.

 

I think it might be better that someone who is not a web developer check the site out too for ease-of-use and abilities.. from what I could see, it's very basic, but quite good, specifically since it's a free service.

 

Oh.. and there are really nice templates to google pages, too.. i was thinking of. uhm.. adapting... some.... :P

 

~moo

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.