email: vadamarachy@gmail.com

இணைய பக்கம் உருவாக்கல்

அறிமுகம்

எத்தனையோ இணைய தளங்களை பார்த்திருப்பீர்கள். நீங்களும் இணையதளம் உருவாக்கலாம். இதற்க்கு ஒரு விசேட தகமையும் வேண்டியதில்லை. ஆர்வமும் நேரமும் கணணியும் இருந்தால் போதும். பல வழியில் எழுத முடியும். இலகுவான HTML மொழியில் எழுதுவதை பார்ப்போம்.

சாதாரண இணைய பக்கத்தை உருவாக்க NOTEPAD TEXT EDITOR போதுமானது. NOTEPAD ஐ திறப்பதற்க்கு ALL PROGRAMS ► ACCESSORIES ► NOTEPAD ஐ அழுத்தவும்.

NOTEPAD இல் HTML கட்டளைகளை தட்டச்சிட்ட பின்
SAVE AS “anyname.htm” என்ற கோப்பை பதிவு செய்யவும். முக்கிய குறிப்புகள் பாட முடிவில் தரப்படும்.

பயிற்சி

எல்லா HTML கோப்புகளிலும் கீழ்காணும் HTML உறுப்புகள் கட்டாயமாக இருக்க வேண்டும்.

<!DOCTYPE html>
<html>
<head>
</head>
<body>
</body>
</html>
						

NOTEPAD ஐ திறந்து மேலே உள்ளதை தட்டச்சிடுங்கள் அல்லது நகலொட்டுங்கள்(COPY PASTE). அதன் பின் "mywebpage.htm" என்று சேமிக்கவும். இக்கோப்பை ஒரு வலை உலவியில் (eg.CHROME, INTERNET EXPLORER) திறக்கவும். கணணித்திரை வெறுமையாக தோன்றும்.

மீண்டும் NOTEPAD ஐ திறந்து <body>, </body> இடையே "HELLO - வணக்கம்" என எழுதவும்.

<body>
  HELLO - வணக்கம்		
</body>

மீண்டும் கோப்பை சேமித்து வலை உலவியில் திறக்கவும். கணணித்திரையில் தோன்றுவது வருமாறு:

HELLO - வணக்கம்

குறிப்பு: கணணித்திரையில் தோன்றுவதை வேறுபடுத்தி
                 காட்ட சிவப்பு நிறத்தை பாவிப்போம்.

NOTEPAD இல் கோப்பு கீழ்கண்டவாறு இருக்கும்.

<!DOCTYPE html>
<html>
<head>
</head>
<body>
  HELLO - வணக்கம்		
</body>
</html>
						

பாடம் 1

நீங்கள் இதுவரை செய்த பயிற்ச்சி உங்களுக்கு HTML இல் ஆர்வத்தை தூண்டுவதற்க்கும், மற்றும் HTML ஐ இலகுவான முறையிலும் செய்யலாம் என்று காண்பிப்பதற்க்கே.
பாடம் 1 முதல் ஒழுங்கான முறையில் பயிலுவோம்.

எல்லா HTML கோப்புகளிலும் கீழ்காணும் HTML உறுப்புகள் பொதுவாக இருக்கும். ஆரம்பத்தில் எல்லா உறுப்புகளை பாவிக்காவிடிலும் பின்வரும் பாடங்களில் பாவிப்போம்.

<!DOCTYPE html>
<html>
<head>
<title></title>
<link>
</head>
<body>
</body>
</html>
						

<title>, </title> இடையே எங்கள் இணைய தளத்திற்க்கு ஒரு தலைப்பு கொடுக்க வேண்டும். இத்தலைப்பு இணைய தள பாவனைக்கு மாத்திரமே. திரையில் தோன்றாது. ஆங்கிலம், தமிழ் அல்லது கலந்தும் கொடுக்கலாம். உ.ம். "HTML CLASSES வகுப்புகள்" என்ற தலைப்பை கொடுப்போம்.

<body>, </body> இடையே எழுதுவது மாத்திரம் திரையில் தோன்றும். கட்டுரை தலைப்பு, பந்தி களை உள்ளடக்கியது.
கட்டுரை ஒன்று எழுதுவோம்.

H1-H6 ஆறு தலைப்புகள் உண்டு. H1 பாவித்தால் பெரிய எழுத்தாகவும் H6 இல் சிறிய எழுத்தாகவும் தெரியும்.

"P" எழுத்து பந்தியை குறிக்கும்.

கோப்பு பெரிதாகும் பொழுது எமது வசதிக்காக விளக்கம் எழுதுவது மிக உபயோகமானது. இவ் விளக்கம் திரையில் தெரியாது. <!--, --> இடையே விளக்கம் எழுத வேண்டும்

<!DOCTYPE html>
<html>
<head>
<title>HTML CLASSES வகுப்புகள்</title>
<link>
</head>
<body>
  <h2>LESSON 1 in h2</h2>
  <h4>LESSON 1 in h4</h4>
  <p>Lesson 1 explains the usage 
  basic HTML elements.</p>
  <!--In Tamil தமிழில்-->
  <h4>பாடம் 1</h4>
  <p>பாடம் ஒன்று இலகுவான எச்.ரி.எம்.எல். 
  உறுப்புகள் பாவனையை விளக்குகிறது.</p>
</body>
</html>
						

குறிப்பு: நீண்ட வசனம் எழுதும் பொழுது உங்கள் வசதிக்கு
                 ஏற்ப உடைக்கலாம். திரையில் சேர்ந்தே தெரியும்.

மேலே உள்ளதை"mywebpage1.htm" என்று புதிய கோப்பாக சேமித்தபின் வலை உலவியில் திறக்கவும். கீழே உள்ளது போல் திரையில் தோன்றும்.

LESSON 1 in h2

LESSON 1 in h4

Lesson 1 explains the usage basic HTML elements.

பாடம் 1

பாடம் ஒன்று இலகுவான எச்.ரி.எம்.எல். உறுப்புகள் பாவனையை விளக்குகிறது.

 

பாடம் 1 முடிவுற்றது.

 



TOP

WEB PAGE DESIGN

 

HTML CODES

TOP








TOP