Printable View
Regarding:
<IMG height=280 src="When Things Go To Hell_files/Jay%202-15-06%20Chart%201.jpg"
==============
I'm going through an looking at how various pages are referencing graphics on the page.
Can someone explain why you would want to have %20 (Hex for space) instead of just using a space?
Simply put, some browsers have issues accepting [unencoded] whitespace as a valid character in a URI, and you can't predict what they'll do as a result. For instance, some browsers may truncate your file path - e.g. you click on a link for "http://www.example.com/my file.jpg" but it tries to access "http://www.example.com/my" instead.
Thanks
I also notice some web pages don't use "img src=" but use php instead and they are able to load an image to the web page. What gives here -- (I'm not familiar with php) -- can you provide a simple explanation or example?
BTW looked for an example but could not readily find one.
========================
Lastly, is there anyway to step through "htm" or "html" line by line and get a visual as to what is happening?
I think you're misinterpreting something here. PHP is a server-side scripting language that is used to output HTML. the only other way to display images (besides using HTML and the <img> tag) would be with CSS. CSS stands for cascading style sheet, and is simply a (better) way to style your HTML. this would be a good place for you to learn about it.
and no, I've never heard of anything that stepped through an HTML file as if a debugger would in a compiled program. HTML is not a programming language, it's simply a mark-up language. w3schools.com would be a good place to start if you wish to familiarize yourself with HTML, CSS and the standards that go along with them.
PHP is just a server side language, anything a client computer ever sees is the output data it gives. HTML is for structure & content. CSS is for design. JavaScript is for additional client side interaction that is no otherwise possible with just HTML & CSS.
It is possible for PHP to output any file, but other than HTML isn't done very often. It is all about the reply header given by the PHP script before the actual stream of bytes is outputted. Just as a note, browsers and web servers alike respect the given meta information the most: if the file extension is .jpg but server tells you the file is image/x-png then the browser will attempt to deal the file as a PNG file and not a JPEG even if the extension in the filename says .jpg. The same holds true for PHP and you can output anything you want, as long as the stuff you output is valid data for the file format that you have on mind.
HTML & CSS are the most important things you need to know if you are ever to make a website and actually understand what you're dealing with :)
Thanks for input so far guys.
============================
This is what I may not get, am confused about, or don't understand.
My Logic says:
1) HTML is processed from line one to line N
2) Each line is then parsed and as "tags" are encountered , the information between each
tag is handled -- e.g. Font Italics or Backcolor property set -- until the "end tag"
is encountered which terminates that specific parsing process.
3) It appears CSS is a set of user predefined constants which when the CSS "keyword"
is encountered these are inserted at that point in the HTML to be processed (dealt with)
or parsed.
4) That lives php and js (java scripts) as I see it.
5) So (per Merri post ?) when the HTML parser encounters "php" or "js" a call is made (I assume by the webbrowser who is processing the HTML line by line) back to the server to run the "js" script or "php" that resides on the server. This then comes back down stream to the client and is inserted in the web page.
Is this basically correct?
Thanks
David
not really. PHP is not a dynamic language; it spits out static content. so, when you request a PHP page, the server executes that PHP script and that script sends all of the HTML to the user. this is when the browser starts to parse it. by this time, however, PHP's job is finished.
what you said may have been an okay way to describe JavaScript, though, but you have to realize that JavaScript is a client-side language and has nothing to do with the server. so, when the browser encounters JavaScript the browser runs that script itself.
the rest of your stuff on the order of how HTML and CSS are applied may or may not be correct; I don't know enough about the way a browser handles that to speak much about it.
Each of these technologies can be counted as totally separate. Each does a different purpose:
HTML is for representing content and structure. As such, it does nothing but that: it has the information, as such HTML doesn't have any style. When viewed in a web browser, some basic styles are applied, so that is why you see something even if you don't have CSS with the page.
CSS works with the design aspect. It allows you to tell web browser what each HTML element should look like, giving appearance to the structure. Even if it looks like HTML and CSS are tightly knit together, it is best not to confuse one with the other.
JavaScript gives extra behavior for the web browser. You can do animations, HTML content & structure manipulation, change styles and even full applications. You can use JavaScript to update just a portion of a web page. JavaScript works strictly within the web browser.
PHP is a server side programming language. It is specialized to outputting content in web server environment and it works strictly within the web server (for example, it can't access any information of your web browser). You can generate HTML and other files, and PHP is the language that can provide JavaScript just a portion of a web page. In that case JavaScript makes a call to specialized PHP script and the script serves what JavaScript asked for. However, JavaScript won't know that the information it got was from a PHP script (and it doesn't need to). Likewise, PHP won't know the request came from a JavaScript snippet running from a web browser.
I hope this helps to understand the separation and what each thing works for. Just for a sample on how things work in the background:
- Web browser makes a request for a page.
- Web server identifies the page. In case of a PHP page the server calls PHP to process the requested file.
- PHP then generates HTML and outputs it to web server for output.
- Web server transfers the HTML page to web browser.
- Web browser parses the HTML page.
- Other files required by the HTML page, such as CSS and JavaScript files, are requested.
- Web server transfers the requested files to web browser.
- Web browser handles the files as it receives them, rendering the page.
- Also, if required, even more files are requested (such as graphics files referred to in a CSS file).
- Once everything has been loaded and parsed then you see the final web page.
- Finally, at this point JavaScript may trigger more file requests to update portions of the web page.
Again thanks for responses. Merri -- especially appreciate order of processing -- helps quite a bit.
------------------------------------
Where I'm trying to ultimately get to with my questions (beside "Basic" understanding) is:
When I download a web page to Firefox or IE (how they deal with any particular page "MAY" vary)
and try to save it, sometimes it saves without issues, other times it errors on certain things and saves certain things.
More times than not, the page is saved, a directory is created with the "_files" extention and the images
are saved to the "_files" extention directory, but the HTML code reflects the server directory NOT the newly created "_files" directory reference to the images. So, I have to manually edit the HTML to put the correct directory image reference ("_files").
At other times because of the PHP or other things the HTML can't be corrected without a "lot" of effort.
I would like to automate this correction process, if possible -- OR -- if it is some setting on my system or browser, I like to know what I've toggled which is causing this issue?
David.
The browser should be doing that [changing paths to the relative "_files" directory] for you. On the page you're saving, are absolute paths being used for the images?
First let me thank kows for his input as I inadvertently forgot to thank him/her.
SambaNeko:
As I posted it seems to vary by web site. Some work fine others not.
Re:Sometimes they may appear to be a path to the server. Othertimes I can't even find a reference to the ".gif" or ".png" or whatever within the HTML. Yet the ".gif" or ".png" or whatever exist in the "_files" directory.Quote:
On the page you're saving, are absolute paths being used for the images?
BTW, I do have an extensive user file that screens out a lot of Junk (e.g. doubleclick for example) -- maybe this is causing some issues -- but it seems odd that the "doubleclick" junk doesn't appear on my browser web page (as it should Not), but the other images do, are saved, but the reference in the HTML is off or nonexistent.
Will try and get a couple of examples then post here.
do the image references exist in a stylesheet (CSS) file then, perhaps?
OK: Here's an example from a wood worker's site.
If the above reference doesn't work go to:
www.woodweb.com
choose galleries from SSTab
choose the 1st item which is "Eastern red cedar log bed"
====================
This page displays fine in my browser when I link to the site.
When I save the page it creates the "_files" directory and puts the images in that directory.
The image of the bed the person made shows fine when the image file is clicked in the "_files" directory.
However, when I try to bring the entire page back up from my saved directory, by double-clicking the saved "html" file, I get garbage and no images.
okay, but what is the image path that is being referenced on the file you save, in place of the bed3.jpg file on the website?
This is what is showing in my saved "html".
In this case the "_files" never got inserted for the reference when the file was saved from Firefox.
Sorry for the formatting, but wanted it as copied from the page.
Code:<!--IMAGE AREA -->
<A name="UP_26610"></a>
<a border=0 href="/galleries/project/images/2661/bed3.jpg" onClick="open(this.href,'_new','left=200,top=100,height=2448,width=3264,scrollbars=1,resizable=1');return false;">
<img border=0 width="400" height="300" src="/galleries/project/images/2661/bed3.jpg"></a>
<Br><span class=EX_text><a href="/galleries/project/images/2661/bed3.jpg" target="_blank" onClick="open(this.href,'_new','left=200,top=100,height=,width=,scrollbars=1,resizable=1');return false;">View Larger, Higher Quality Image</a><br></span><table width=80%><Tr><td>All our furniture is built from reclaimed wood</td></tr></table>
<br>
<!--END IMAGE AREA -->
I just tried saving the referenced page ( http://www.woodweb.com/galleries/pro...osts/2661.html ) from Firefox and it worked correctly for me. This may be a stupid question, but the procedure you're following is "File > Save Page As > Save as Type: Web page, complete", right? What version of Firefox are you using?
Using Firefox 3.6.
Yes doing: "File > Save Page As > Save as Type: Web page, complete"
If you saved the file and tried to bring it up by double-clicking the html file named saved in whatever directory,
-- and it worked -- then it must be some setting on my system. Finding which one may be @#$%^&