What can you do by HTML
Page's Notes:
__If you want to see basic rules in HTML compiling follow this link
__Below you'll find a table that will guide you through the various sections of this page, and so you'll be able to see the news too.
Other links
HTML's Tags Dyn. Tags |
Base Target |
Frames |
Images in HTML pages:
< center><IMG SRC=test.gif ALT="this is test.gif"></center>
this line let you see test.gif and if your mouse passes onto test.gif text will appear as "this is test.gif".
I'll tell you about Sizing Images in HTML pages as soon as possible.
<IMG SRC=test.gif border=1>
About small sized images kind of image you've got to use is *.JPG, in fact it's the only one lets you choice and modify directly image quality, and this is more than other influencing image size factor (with size I mean physical space occupied by image, nor its height and width that are about resolution). You could say that *.GIF is a compressed image file too, but really with equal resolution GIF has only 16 - 256 colors, instead the JPG that developes 24 - 32bit/pixel, best for raster images as those you've seen in Images section in this site. Moreover with equal resolution, GIF medium-large images occupy more space than the corresponding JPG.
GIF
640x480
134
Well, let's see table's content; it reports results of a test done by three types of JPG rated to corresponding GIF in 256 colors. Image used in this test is raster and it's the drop you've seen in third gallery on this site, unfortunately I can't show you the four images used in this test 'cause I've got no web-space enough, but I'll tell you most important facts.
Tables in HTML:
A table lets you have a sure format of your text, by this I mean that if you put your text into a table it will not be affected by window's resizing nor by any kind of view. In fact it's possible that enlarging browser's window particular position of text will disappear, and you'll lose the effects you put. Tables are useful to divide window in some different parts too, i.e. with different background colors or images, or text's color, and so on.
<TABLE BORDER=n BACKGROUND=?????? ALIGN=? WIDTH=?% HEIGHT=?% VALIGN=?>
These are basic tags to develope a table in a web page. Now I'll briefly explain those to you, trying them you'll do the best thing to learn how to use them.
I'm writing the rest...
Base target:
As you've seen in the index, everyone link in the first column opens itself into another window, this is due to the tag <BASE TARGET= ...>. By this tag you can choice a new window in wich open the new page, giving a name to the new window. It's clear that it is useful when the site must be quickly readable, in this way you can keep in background your index, and let the sailing be faster and comfortable (there is at least another way to do this, but by now learn this). <BASE TARGET="nametarget"> These are the most important instructions to develop a dynamic link; nametarget is the name you've got to assign to the new window. After this tag put link's string (<A HREF=...>), and the link you specified will be opened into the window named nametarget.
<BASE TARGET="_self"> this tag will terminate opening links in new windows, and return to the default link's opening in the same page.
What's a frame? It's the way to divide a web page in two parts showing different pages at once, in fact as you can see from the sintax, <FRAMESET ROWS/COLS="x%,z%" BORDER=0/>0> you can show two different pages at once in a page developed by the FRAMESET tag. ROWS/COLS use ROWS if you wanna divide the page by rows, and COLS if you wanna divide the page by columns
A.N. Design
Tag you've got to use is <IMG SRC=nameimage>, where nameimge is location and name with extension of image you selected to show. With this tag you can use the same tags you use to format and give the position in page for text (i.e. <center>). But there is a problem when you want to put an image on the right of the page, to do this you've got to put your image in a table (see section below). Using tables to give a fixed position to your images, I think you'll do the best you can, in fact the table will mantain images in original position, let you put them everywhere you want, and doesn't care about size of window (every size bigger than one you're working in doesn't affect position of your images, it will do if you don't use a table).
An alternative to a table is the tag <P ALIGN=RIGHT>, by wich the browser start to show the things you put in the paragraph from the right instead of from the left as default; the problem is that the text is aligned to the right as in the right column in this site's index page. There isn't this problem using a table.
A tag to use within IMG SRC is ALT="text to show"; you must put it into the IMG SRC tag and you can specify a text will be shown when the mouse pointer will be on the image, you'll write this text between "..." after the string ALT=. Here it is an example:
It's possible to put a plain black border around your image by introducing tag BORDER=? into IMG SRC tag:
if you put 0 as ? you'll have no border, if you put a number different by 0 you'll have a border in various sizes, this is so for the link's border too (see my E-mail-link in the index, it has no border).
A tag as the one above will show test.gif rounded by a black border sized 2.
Let's have a look to some data about it:
Type
JPG Max
JPG -11.8%
JPG -15.7%
Resolution
640x480
640x480
640x480
Size (Kb)
184
50.9
42.9
Between the three types of JPG, first (Max) is the high resolution one (100% in quality), second (-11.8%) has a reduction in quality of 11.8% (quality = 88.2), third has a quality reduction of 15.7% (quality = 84.3%); I enphasize that all three JPG have a resolution in 24bit/pixel. After there is correspondig to JPG Max GIF (think about that GIF corresponding to reduced JPG was bigger in size than this one), and you can see that it's bigger in size than the reduced JPG, and moreover it has only 256 colors.
How do look like reduced JPG??? Well, all my images in the three galleries in this site are reduced by 11.8%, they are right, don't you think so?! Reduction by -15.7%, anyway, reduces just a little image's definition.
The only one application in wich is effectively necessary the GIF type is for vectorial images with 16 - 256 colors, in this case effectively GIF is smaller than corresponding JPG, that applies always 24bit/pixel, totally unuseful in these cases.
This is briefly what you've got to do to develope right in dimension and characteristics images to put in your site.
Let's have a look at the tags necessary to develop a web table:
___<TD WIDTH=x% HEIGHT=y% BACKGROUND=?????? ALIGN=? VALIGN=?>
Let's have a look to the sintax (I'll give you the basic rules, and then you'll get best results by trying).
You've got to write:
Remember that the BASE TARGET tag acts from the point in page you put (in tables and paragraphes too) to the one where you write
___<FRAMESRC=page1.htm SCROLLING=auto NAME="?1">
___<FRAMESRC=page2.htm SCROLLING=auto NAME="?2">
</FRAMESET>
Page containig the FRAMESET tag doesn't have the BODY, nor TITLE, nor HEAD and so on tag, there must be only the FRAMESET tag, if you want, only the <HTML> at top of page, and </HTML> at its end.
The variables are:
x% for the width of first column, or the height of the first row
z% for the width of second column, or the height of the second row
BORDER=0/>0 with 0 value you've got no border around the columns/rows, with a >0 value you've got a different sized border as function of the value (major number gives you major sized border)
FRAMESRC searches the page1.htm that's a web page as content of the first row/column, and the page2.htm as content for the second rows/column
SCROLLING=auto lets you have a scrollbar in each rows/column if their size is bigger than browser's window
NAME="?1/?2" lets you give a name to everyone row/column to use with BASETARGET (see the section).
Open Index
and you'll find new arguments about HTML, 3D images, and site's rest.