PDA

View Full Version : Writing and opening a HTML code




tue
Jan 28, 2010, 01:18 PM
Hi :apple:-people.

I have been experimenting with creating a website. I want to make it from the bottom - no fancy editor, just real html codes. I have tried to write the codes in textedit. I have saved the file as: .htm, .html, .txt, .rtf, but when I open the file in a browser (firefox/safari), the code is shown as it is written, not as a website. I have tried TextWrangler but can't figure it out? Can anyone help finding a proper program for html writing?

In advance thank you :)

Tue, Denmark



MacDawg
Jan 28, 2010, 01:22 PM
You can try Smultron, but you really need to take the time to figure out TextWrangler

If you can't use TextWrangler, you aren't likely to find anything else to suit your needs

Woof, Woof - Dawg http://homepage.mac.com/k.j.vinson/pawprint.gif

viggen61
Jan 28, 2010, 01:37 PM
Ok, are you sure you have all the syntax correct? There are also various tags that are required to tell the browser that it is really looking at an HTML file.

Here's good old "Hello World" in HTML:

<html>
<head>
<title>Hello World example</title>
<!-- Title that appears on the window -->
</head>
<body>
Hello World
<!-- Text that will appear inside the window -->
</body>
</html>

(btw - <!-- and --> are HTML comment delimiters. You need both)

The Second thing that you may need to do on your Mac is to check the name of that file... Sometimes, even though you say to save your file as "myFile.html", the Mac actually saves it as "MyFile.html.txt", and so Safari sees it as a ".txt", not a ".html". Make sure that "hide extensions" is turned OFF in the save dialogs, so you see the actual, full file name.

Do a "Get Info" on the file to check.

Good luck!

:apple::apple:

design-is
Jan 28, 2010, 02:36 PM
You also need to make sure, when you're using TextEdit, that you are typing you're code in 'plain text' rather than rich text. If you're typing code in rich text and you save it as HTML, you will see the tags in the browser.

I've attached a screenshot of the 'plain text' format option in the menu for you.

/Doug

snouter
Jan 28, 2010, 02:57 PM
Hi :apple:-people.

I have been experimenting with creating a website. I want to make it from the bottom - no fancy editor, just real html codes. I have tried to write the codes in textedit. I have saved the file as: .htm, .html, .txt, .rtf, but when I open the file in a browser (firefox/safari), the code is shown as it is written, not as a website. I have tried TextWrangler but can't figure it out? Can anyone help finding a proper program for html writing?

In advance thank you :)

Tue, Denmark

Do you have the finder set up to show you the file extensions?

I bet you think are calling the file index.html

but the real name is index.html.rtf

I've seen textedit do that.

Try:
http://www.barebones.com/products/TextWrangler/
or
http://www.aptana.org/

design-is
Jan 28, 2010, 04:01 PM
<snip>
Try:
http://www.barebones.com/products/TextWrangler/
or
http://www.aptana.org/

Another one which I find quite nice is Komodo Edit (http://www.activestate.com/komodo_edit/)(also free)

/Doug

tue
Jan 29, 2010, 04:21 PM
Thank you for all your answers. Much appreciated! I have got it now by using the plain text in textedit.

If anyone have got the time and the passion, I really need help with this z-index. I have learned it from a web site, where the html + the css is described but the syntax is wrong. I am not sure how to get it straight:

Just as an example I have used some album covers. (the homepage isn't public). The covers are shown on the web site, but not as a z-index:confused:
HTML:
<div id="iwillnotlisten">
<img src="iwillnotlisten.jpg" alt="iwillnotlisten">
</div>

<div id="thereisabeatinallmachines">
<img src="thereisabeatinallmachines.jpg"
alt="thereisabeatinallmachines">
</div>

<div id="iknowthatyouknow">
<img src="iknowthatyouknow.jpg" width="114" height="114"
alt="iknowthatyouknow">
</div>

<div id="crushingdigits">
<img src="crushingdigits.jpg" alt="crushingdigits">
</div>

<div id="wht">
<img src="wht.jpg" width="114" height="114" alt="wht">
</div>

<div id="blck">
<img src="blck.jpg" width="114" height="114" alt="blck">
</div>

CSS:
#iwillnotlisten.jpg
{
position: absolute;
left: 100px;
bottom: 100px;
z-index: 1;
}

#thereisabeatinallmachines.jpg
{
position: absolute;
left: 115px;
bottom: 115px;
z-index: 2;
}

#iknowthatyouknow.jpg
{
position: absolute;
left: 130px;
bottom: 130px;
z-index: 3;
}

#crushingdigits.jpg
{
position: absolute;
left: 145px;
bottom: 145px;
z-index: 4;
}

#wht.jpg
{
position: absolute;
left: 160px;
bottom: 160px;
z-index: 5;
}

#blck.jpg
{
position: absolute;
left: 175px;
bottom: 175px;
z-index: 6;
}

angelwatt
Jan 29, 2010, 04:51 PM
Don't add .jpg to the CSS selectors. You only put the id attribute, not the src path. Your selectors are actually looking for elements with the class name of jpg that have the id of the name you give. For example, #iwillnotlisten.jpg is looking for a tag like,

<div id="iwillnotlisten" class="jpg"></div>

tue
Jan 30, 2010, 05:00 AM
Got it right now!

Thanks for your time and support :)

/tue