html

Tomas_S · 04-07-2011 3:27pm #1

Hi, i've just started to look at html for my own interest and i'm having few annoying problems:

when displaying in browser the text wouldnt align, links dont work, pictures dont show. the tags sub, strike,sup and u- work!
Wheres the problem?

heres a little example:

<html>
<head>
<title>problems</title>
</head>
<body>
<H1 align=''center''>LATEST NEWS</H1>

<p align=''right''>Regular text, <sup>Superscript text</sup><br>
regular text, <sub>Subscript text</sub><br>
<u>underlined text,</u> <strike>strikethrough</strike></p>

<p>paragraph</p>
<p>More information<a href=''http://fightclub.lt/>HERE</a></p>

<p><img src=''b_tan4.jpeg''></p>

</body>
</html>

Tomas_S · 04-07-2011 3:42pm

and then just found out if I use:

<center>
............
............
</center>

It works!
Am I using ancient book or something?:mad:

komodosp · 04-07-2011 4:26pm

I think you are using an ancient book!

Not sure how reliable that "align" attribute is, but all the cool kids are using CSS...

so something like

<p style="text-align:right">Look over this side!</p>

Also your link probably doesn't work because you didn't close the inverted commas...

And .jpeg? is the image really called that or is it b_tan4.jpg?

Malice · 04-07-2011 7:53pm

Sveiki!

Okay, the first problem I noticed when I copied what you posted into a HTML file was that you have two single-quote characters (')instead of one double-quote character (")in your <h1>, first <p>, <a> and <img> tags. I'm not sure why that has happened but they are the first things to fix.

The next thing to fix is that you need to close your link correctly. Where you have

<a href=''http://fightclub.lt/>HERE</a>

You need

[noparse]<a href="http://fightclub.lt/">HERE</a>[/noparse]

komodosp wrote:

And .jpeg? is the image really called that or is it b_tan4.jpg?

As far as I know both extensions are valid, similar to ".mpg" or ".mpeg". It's important to check the location of the image relative to the HTML file though. If they aren't in the same folder then you will need to specify the path. For example if your files are saved as:

C:\Website\index.html
and
C:\Website\images\b_tan4.jpeg
then your image link will be

<img src="/images/b_tan4.jpeg">

Tomas_S · 05-07-2011 9:40am

still nothing works when i fixed it!:mad: but thanks lads.

so is there a point looking at html or should i just start with xhtml and css?

Malice-sveiki

komodosp · 05-07-2011 10:39am

Post your code again after the fix...

Malice · 05-07-2011 11:02am

Tomas_S wrote: »

still nothing works when i fixed it!:mad: but thanks lads.

Like komodosp wrote, post what you've got now. It's probably just something small.

Tomas_S wrote:

so is there a point looking at html

Absolutely. It's the foundation of most websites on the Internet after all. Start here and work through the examples and that should help a bit.

Tomas_S wrote:

Malice-sveiki

That's the extent of my Latvian unfortunately

.

Tomas_S · 05-07-2011 2:39pm

Ok i'm gonna leave it as it is for now coz ive got a newer book:

http://www.qservice.lt/ebooks/IT/Programming/Brilliant%20HTML%20and%20CSS_0273721526_Pearson.pdf

so gonna study that a bit and see the differences. Will get back here later.
Thanks a lot for info!

Tomas_S · 06-07-2011 10:13am

So finally figured it out. It was my own mistake:

I was using ' ' instead of ". A well live and learn:D

06-07-2011 10:59am

hi,

over the last semester we had to ensure our assessments were W3C compliant,
so we had to used an online validator.

http://www.w3schools.com/site/site_validate.asp

it can be handy starting out as it'll point you towards errors.

edit: theres also a link where you can upload your page
http://validator.w3.org/#validate-by-upload

Tomas_S · 06-07-2011 11:28am

ed1604 wrote: »

hi,

over the last semester we had to ensure our assessments were W3C compliant,
so we had to used an online validator.

http://www.w3schools.com/site/site_validate.asp

it can be handy starting out as it'll point you towards errors.

edit: theres also a link where you can upload your page
http://validator.w3.org/#validate-by-upload

Thanks ed, heard about it before so will be handy when I start my course in Sept.

Malice · 06-07-2011 11:45am

Tomas_S wrote: »

So finally figured it out. It was my own mistake:

I was using ' ' instead of ". A well live and learn:D

Did you miss the part of my post from Monday where I told you that?

Malice wrote: »

you have two single-quote characters (')instead of one double-quote character (")in your <h1>, first <p>, <a> and <img> tags.

One last tip: A List Apart is an excellent resource for a variety of design-related topics. I found it quite heavy going when I was starting to learn HTML and CSS but once you get your head around the initial learning curve there are some very useful articles on there.

Tomas_S · 06-07-2011 4:35pm

Malice wrote: »

Did you miss the part of my post from Monday where I told you that?

I didnt I just thought it was like that on my note pad:D

Thanks for the info mate

Razzuh · 06-07-2011 8:55pm

What text editor are you using? Since you seem to have a few typos I suggest you start using one with syntax highlighting such as Notepad++ (free). That way at least you will be able to see more easily if there is something simple causing a problem and save you some frustration.

Go through the HTML tutorials first and just learn the basic elements like <p>, <img>, etc. without paying any attention to positioning attributes like 'align', because they're out of date. When you want to start moving things around, go through tutorials on CSS.

Malice · 06-07-2011 9:16pm

Razzuh wrote: »

I suggest you start using one with syntax highlighting such as Notepad++

Funnily enough I was about to suggest the same thing. Definitely give Notepad++ a go. I've been using it for a few years and I find it very useful.

Tomas_S · 07-07-2011 9:33am

well the mistake was I started with very old book. So found something newer now which starts with html and simple tags and explaining whats outdated and can be done with css. so at the moment am just taking it easy and looking at simple tags like links, paragraphs, images etc.

As Ive no experience at all in this I dont think Its hard just to remember all them tags:D

I'll defo have a look at notepad++

Thanks for your time lads I'll probably be back here soon:D

Malice · 07-07-2011 1:42pm

While table-based layouts are rightly frowned upon, they are still quite common so it would be no harm to be familiar with them. You will appreciate the power of CSS and separating the style of a page from the content more then.

tricky D · 07-07-2011 3:17pm

Tomas_S wrote: »

well the mistake was I started with very old book. So found something newer now which starts with html and simple tags and explaining whats outdated and can be done with css. so at the moment am just taking it easy and looking at simple tags like links, paragraphs, images etc.

Learning old style html first as an introductory step isn't really a mistake as such. It is still relevant for html emails which rely on what are now bad pratice like tables for layout and font tags for type. It is is also good for seeing how practices have developed. Just don't put too much effort into it before moving on to learning xhtml with css.

Malice · 07-07-2011 3:36pm

Something I left out of my post but is worth bearing in mind as well is that tables aren't something to be avoided at all costs. They are pefectly fine when used for their intended purpose namely displaying data in table form.

Tomas_S · 08-07-2011 11:04am

What about the links? Are they still being used html? Like absolute,relative anchors etc.?

Razzuh · 08-07-2011 12:01pm

Yes they are. Almost everything you click on the web is going to be an <a> element with a href. The only possible exception would be where something clicked activates JavaScript instead of a page link. Don't worry about that for now though.

I suggest you find a few fairly basic pages on the web and take a look at the html code for them. You can right-click and choose 'view source' on any page to see the HTML. That can be a bit intimidating though. Do you have firebug? It's an extension for firefox that will let you highlight parts of a page and show you the relevant HTML for just that piece. Hover over almost any link and you'll see a <a ... >. I suggest you give it a try.

Tomas_S · 08-07-2011 2:34pm

Yeah I was looking at the source before. It shows you source of 1 page does it?

Razzuh · 08-07-2011 3:20pm

Firebug or view source? They will show the source of whatever page you're on, which I suppose is a maximum of one page. Firebug will also show you the CSS relevant to that page.

html

Comments