new to sitepoint and need help with finding diver-circle image

[lgwalker]

I am new at web designing and I bought the book "Building Your Own Web Site The Right Way, Using HTML & CSS, I think about four or five years ago (more or less). I am on chapter 2, at the place where you insert the diver-circle image. I went to your web homepage, scrolled down and clicked "Code Archive", clicked "open", clicked the folder "spbook-HTML3-76a6eb9", then chapter 2. The HTML document was in the folder but no images. Also I noticed that when I clicked "code archives" the below links is on the top of yor web page,
Books and Build Own Website the Right Way using HTML & CSS is accessible, but not Down the Code Archive

[ralph.m]

Hi lgwalker. Welcome to the forums.

I moved your post to the XHTML forum. It may be that the code archives for the current version of the book have changed, but in the ones I have, the file is in /chapter2/website_files/final_version_for_chapter/ (and a few other folders in that chapter). If you can't find it, I can post it here, too.

Edit:

I just checked the current files, and the image is in the same place (maybe I had the current ones anyway. The download page is here:

http://www.sitepoint.com/books/html3/code.php

Once the zip file is downloaded, double click to open it, and you should see folders inside with all the code bits and pieces. Is that not working for you?

[lgwalker]

Hi
I am very, very new at web design. I bought the book "Build Your Own Web Site The Right Way I guess about four or five years ago. So far, this book has been really simple to understand. I am on chapter 2 now, and I have working on the web site "BubbleUnder.com. I need to get the image called divers-cirle.jpg for this particular project. I scrolled down the web site to a box called "Code Archives". I clicked the Code Archives box; I click open; the files download; I click Allow on the Microsoft Windows Explorer box, because a message comes up saying a website wants to open web content using this program on your computer; I click the file folder spbooks-HTML3 76a6eb9 . Because I am in chapter 2, I click chapter 2; and the only folders in chapter 2 the following:

examples
website_files
index.html

The only folder with images are:
full_size
resized_400_pixels

And diver-circle.jpg is not in either of the two folders

What am I doing wrong, Ralph.m in the expert forum type me a link to where the images were. I clicked the link and it takes me back to the web page where I began with the "Code Archives". I must be looking in the wrong places. I'm sorry for being such a cluts, but if you don't know, it is what it is, YOU JUST DON'T KNOW!!. If you will, can you give me step-by-step directions to where the images for chapter 2 is located? I am usually great at following step by steps as long as nothing is omitted.

[ralph.m]

the only folders in chapter 2 the following:

examples
website_files
index.html

That's weird, because in website_files there are lots of other folders, including "final_version_for_chapter", which has the image in it. Do you see that folder? You are most of the way there! You just need to be able to access the folders inside website_files.

[lgwalker]

thanks, I see it now
lgwalker

[ralph.m]

Cool! Well, good luck with the book. Learning web design is a fun journey indeed. Don't hesitate to come back again if you have more questions.

[lgwalker]

like I said earlier, I found the image and now I am having difficulties importing it into notepad. I tried to copy & paste but it didn't work. As stated earlier, I really am good at following step-by-step directions as long as nothing is omitted. So if you would please tell me step-by-step how to get the picture from website_files folder to my notepad BubbleUnder.com website, I will be really happy.
lgwalker

[ralph.m]

OK, I don't have the book with me right now, but what you need to do, essentially, is to work out where you want to store your image file. E.g. let's say it's in the same folder as the page it appears in. So, for example, you might have a folder on your computer containing these two files:

diver-circle.jpg
index.html

The index.html file is the page you want the image to appear on. To make it appear on the page, you have to link to it in your page code, like so:

<img src="diver-circle.jpg" alt="A diver circle image">

Then, when you double click on the index.html file, it will open in your browser, and you will see the image on screen.

This isn't the exact code as in the book, but as I say, I don't have it with me now. I recommend you read through Chapter 2 again, because I'm sure it describes what to do here.

[lgwalker]

I tried to send you all a message and copy of the errors I was getting and the thread just closed without me submitting it. I hope I didn't cause anything to crash. Sorry!!!!!!

This is something similiar to what I was trying to tell you before it shut down; this time I will be brief. When I try to drag the image into note the error message is "Access denied"
when I try to file>open>desktop>then click the image folder of which I named "Images for Website.html. I get these monster codes such as:




3
!1AQa"q�2‘¡±B#$RÁb34r‚ÑC%’Sðáñcs5¢²ƒ&D“TdE£t6ÒUâeò³„ÃÓuãóF'”¤…´•ÄÔäô¥µÅÕåõVfv†–¦¶ÆÖæö7GWgw‡—§·Ç×ç÷ 
5
!1AQaq"2�‘¡±B#ÁRÑð3$bár‚’CScs4ñ%¢²ƒ&5ÂÒD“T£dEU6teâò³„ÃÓuãóF”¤…´•ÄÔäô¥µÅÕåõVfv†–¦¶ÆÖæö'7GWgw‡—§·ÇÿÚ 
 ? *
p†é<J³XÓÏÅPDZŽ°Ç¸Æ“ÂÐcýÛHö˜‘á>t�/!”§Õ;Y¦£àQväP°µ½»O%Xkd4?º¥¶œÍ#Û*'¿*h.„w
¶F‘à*C˜Âö·thñï¢6*A€ì×DàvŽhsÜѸƒ¡0F¿EIö Z߃|Êj6Gä¾�¼x©I±ž|ӇĨ8ÎdóªJ“§:÷?Á4–‰><( g]HUòrÒëÀí¢4ìð‰:åÑüP*µ*k§‡uQ¹›�´èîGš…¶Ü¯yóGˆtdöÍÑl5à—@'ãÙ;ݺ¡î:ANxÛíYÎË%í¬�ŸqÊ´ >@Lä¾XÌ@½-›H™äør¤m‰×�šîÝ‚AÄ»à�Ä€¹Í
õ'AÀŽJÈÊ´\\67¹í=–¶Cæ°Ö“´hYñïû‹ŸÌ²f`møè*Ï-¼¬l¿ÿÐçjpöŠ�é5€?Š¿‹{ÚHºZLãÇu�…’kt´ãï[X¶!ïq°ŽAÑká•ÓÎs0áÅŽÿ ¤ê6Ú‰sƒœØ�üU¶£ŸšÉ·-µ0½�<5ÃPÓü



can you please tell me what I am doing wrong?

[lgwalker]

I went back and read your website reply to me from last night and you said to:

To make it appear on the page, you have to link to it in your page code, like so:


Code:
---------
<img src="diver-circle.jpg" alt="A diver circle image">
---------
Then, when you double click on the index.html file, it will open in your browser, and you will see the image on screen.

The below codes is the <image> tag that I have typed in my notepad document for BubbleUnder.com
<p><img src="divers-circle.jpg" width="200" height=="162"
alt="A Circle of divers practice their skills"/></p>

I followed it directly from the book "Building Your Own Web Site The Right Way using HTML & CSS
What am I doing wrong? When I click on it nothing happens.

[kohoutek]

Is the image visible though? If you want something to happen on click, then you'd probably want it to be a link.

Also, there's an extra "=" in your code. So, with a link added, it'd be:

<p><a href="divers-circle.jpg"><img src="divers-circle.jpg" width="200" height="162"
alt="A Circle of divers practice their skills"/></a></p>

[Mittineague]

There are different kinds of files. PHP, html, css, js txt ..... are "text" files. i.e. human readable characters.
Others like jpg, gif, ..... are "binary" files. i.e. computer readable bits and bytes.

If you open a binary file in an editor meant for text files, you'll see "monster codes".

[lgwalker]

Thank you responding to my questions.

First let me apologize for not being in the right forum; you stated the following: There may also be other replies, but you will not receive any more notifications until you visit the forum again

I thought when I click forum and then Design that I was visiting the forum or do you mean looking through the questions that others have already posted and been answered.

I corrected the link as you directed me. This is what I have:
<p><a href="divers-circle.jpg"><img src="divers-circle.jpg"
width="200" height="162"
alt="A Circle of divers practice their skills"/><p>

Am I suppose to click on <p><a href="diver-circle.jpg"> area in notepad. I hope I don't frustrate you with these stupid questions.

[ralph.m]

I corrected the link as you directed me. This is what I have:

<p><a href="divers-circle.jpg"><img src="divers-circle.jpg"            
   width="200" height="162"
   alt="A Circle of divers practice their skills"/><p>

No, that code is not quite right. Try this instead:

<p><img src="divers-circle.jpg" width="200" height="162" alt="A Circle of divers practice their skills"/><p>

You don't need the link in there, and it was wrong anyway.

Am I suppose to click on <p><a href="diver-circle.jpg"> area in notepad. I hope I don't frustrate you with these stupid questions.

You are getting a bit muddled here, but the book is not that unclear, I believe (though I've not used it). So read this carefully:

- you need a web browser to display a web page. For example, Chrome is a web browser.
- you create a web page by writing code. You can use a program like Notepad to write that code.
- in Notepad, you create a document and save it as as a .html file. When you've finished writing code, save the page somewhere on your computer (say on the Desktop).
- when you are ready to view the web page you've created in Notepad, you need to open it in your web browser. There are various ways to do that. You can double click on the file you created. (That is, you see a file icon on your desktop called mypage.html or whatever and double click that.) Or you can right click on it and choose to open it in your browser that way.

OK, now, if you want to respond to this post of mine, click the Reply button at the bottom of this post. Don't post a new thread.

[lgwalker]

Thanks

I really don't remember what button I used to sign up. When you say sign up; do you mean signing in with a user name and password. If that is what you mean, I did that yesterday. I want to get the correct responding/posting thing correct. I dare not frustrate the experts who are helping to be a great wed designer. Tell me where on the page and what the buttons looks like that you expect me to correspond with you. I want to do this right!!!!

[ralph.m]

Thanks

I really don't remember what button I used to sign up. When you say sign up; do you mean signing in with a user name and password. If that is what you mean, I did that yesterday. I want to get the correct responding/posting thing correct. I dare not frustrate the experts who are helping to be a great wed designer. Tell me where on the page and what the buttons looks like that you expect me to correspond with you. I want to do this right!!!!

Whatever you did this time was perfect! Now, read the other comments above. They should help fix your real problem.