 |
Как да направим WEB страница |
|
Как да направим WEB страница |
Нека научим повече за връзките (links).Това е нещо наистина много просто. Ще изградим връзка към Yahoo.
Започнете ето така...<BODY BGCOLOR="#FFFFFF">
Go to Yahoo!
</BODY>
Go to Yahoo!
След това добавете отварящ и затварящ таг за котвичка (anchor tag).
<BODY BGCOLOR="#FFFFFF">
Go to <A>Yahoo!</A>
</BODY>
Добавете адреса (URL) и сте готови! URL означава Universal Resource Locator. Модна и тежка фраза, която интернатаджиите употребяват. Ще го правят все повече и повече. A URL си е просто адрес.
<BODY BGCOLOR="#FFFFFF">
Go to <A HREF="http://www.yahoo.com/">Yahoo!</A>
</BODY>
Да направим още една връзка.
<BODY BGCOLOR="#FFFFFF">
Посетете Безплатна зона!
</BODY>
<BODY BGCOLOR="#FFFFFF">
Посетете <A HREF="http://eton.dir.bg/">Безплатна зона!</A>
</BODY>
Връзката за електронна поща се изгражда по подобен начин. Само, че използваме адреса на електронната поща вместо да пишем URL.
<BODY BGCOLOR="#FFFFFF">
Изпрати ми <A HREF="mailto:forrest@bubbagump.com">Е-Mail!</A>
</BODY>
Ако искаме да изградим графична връзка (дадена картинка да бъде връзка), поставяме между таговете самата картинка. Ако използваме примера от по-горе с 'Go to Yahoo!' поставяме <IMG> таг вместо думата Yahoo!
<BODY BGCOLOR="#FFFFFF">
Go to <A HREF="http://www.yahoo.com/"><IMG SRC="copper.gif" WIDTH=82 HEIGHT=68></A>
</BODY>
Винаги около графичните връзки се появява цветна ивица. Как да се отървете от нея е посочено в долния пример.
<BODY BGCOLOR="#FFFFFF">
Go to <A HREF="http://www.yahoo.com/"><IMG SRC="copper.gif" WIDTH=82 HEIGHT=68 BORDER=0></A>
</BODY>
Има още нещо за връзките... Абсолютно е допустимо и желателно да се изграждат връзки към други страници без да се пита за разрешение. Това е фактически идеята за хипертекста, и това е нещото, което прави от Интернет световна мрежа.
Когато включвате картинки в страницата си запомнете, че те са самостоятелни файлове които често съдържат прекaлено много информация, която ще забави зареждането на която и да е страница. Спасението е в намаляването на размерите (дължина и ширина) или рeдуциране броя цветове. А най-добре е да се направят и двете. Ето някои примери:
Разбира се първата картинка е най-голяма, най-хубава и с най-добро качество, но погледнете нещата от тази страна... ако я поставите на страницата си тя ще се зарежда прекалено дълго време, посетителите ви вероятно няма да могат да видят това което сте направили за тях защото ще им омръзне да чакат дългото зареждане и ще се прехвърлят на друга страница.
Размери 310 x 304
# брой цветове - 238
Големина на файла - 69 KbРазмери 207 x 203
# брой цветове - 238
Големина на файла - 34 KbРазмери 207 x 203
# брой цветове- 48
Големина на файла - 19 KbГорепосочените редукции са направени с Paint Shop Pro.
Друга възможност за по-бързо зареждане на дадена страница с картинки е когато се поставят умалени копия на тези картинки, представляващи връзка към по-голямата картинка. Да си представим, че искам да предложа три много хубави картинки на моята колекция от коли (иска ми се).
Щракнете на картинката за да видите уголемения образ.За тази цел е нужно да стартирате която и да е програма за обработване на картинки (Paint Shop Pro, Photoshop, Corel Drow, Corel Photopaint) и да направите копие на дадената графика с умалени размери. Именно тава ще бъде вашата връзка към големия файл-картинка.Да опитаме със синия корвет.Започва се с добре познатия <IMG> таг.
<BODY BGCOLOR="#FFFFFF">
<IMG SRC="car1a.gif" WIDTH=87 HEIGHT=60>
</BODY>
Добавяте добре известния ни <A> таг.
<BODY BGCOLOR="#FFFFFF">
<A><IMG SRC="car1a.gif" WIDTH=87 HEIGHT=60></A>
</BODY>
Добавяте URL и всичко е готово!
<BODY BGCOLOR="#FFFFFF">
<A HREF="car1.jpg"><IMG SRC="car1a.gif" WIDTH=87 HEIGHT=60></A>
</BODY>
Можете да се освободите от рамката около картинката ако искате. Така или иначе можете и да я оставите за да знаят посетителите ви, че това e връзка. От вас си зависи.
<BODY BGCOLOR="#FFFFFF">
<A HREF="car1.jpg"><IMG SRC="car1a.gif" WIDTH=87 HEIGHT=60 BORDER=0></A>
</BODY>
Друг начин за за съдаване на връзка към страница е като се направи връзка към точно определена част от дадена страница. Щракнете тук за да бъдете транспортирани до мястото, където за първи път споменахме за URL.
Зaпочнете първо с маркиране на мястото до което искате посетителите ви да бъдат транспортирани. Изберете дума и я заобиколете с <A> тагове.
Използваме цитат от по-горе.
<A>Добавете</A> адреса (URL) и сте готови!
След това давате на маркираното място някакво ИМЕ.
<A NAME="upabit">Добавете</A> адреса (URL) и сте готови!
Вече привършихте с маркирането на мястото. Остава само да изградите връзка към него.
Зпочнете изграждането на връзката.
Щракнете <A>тук</A> за да бъдете транспортирани...
Добавяте името на файла към който да се извърши прехвърлянето...
Щракнете <A HREF="lesson04.html">тук</A> за да бъдете транспортирани...
И най-накрая, добавяте котвичката NAME така...
Щракнете <A HREF="lesson04.html#upabit">тук</A> за да бъдете транспортирани...
Ами това е всичко по въпроса! Не е като мозъчната хирургия, нали??
<--ПРЕДИШЕН СЛЕДВАЩ-->
| Въведение | Урок 1 | Урок 2 | Урок 3 | Урок 4 | Урок 5 | Полезни връзки | Бърз html указател |
| БЕЗПЛАТНИ РЕСУРСИ ЗА ВАШАТА WEB СТРАНИЦА | |||||||
