HTML Thimble ஒட்டுப் புதிர்
Mozilla மற்றும் Digital Corps ஆல் CC-BY-SA
15 நிமிடங்கள்
கற்போர், இணையத்தில் படித்தல், எழுதுதல் மற்றும் பங்கேற்றல் குறித்து இந்த ஆறு பாகம் கொண்ட கூறுகளின் மூலம் நன்கு பழகிக் கொள்வர். இணைந்து உருவாக்குவதின் வழியாக, வலை என்னும் ஊற்றைக் குறித்து நன்கு அறிந்து கொள்ளுங்கள்.
செயல்பாடு 6 இல் 2
வலையைப் படித்தல்
21 ஆம் நூற்றாண்டுத் திறன்கள்
இணைந்து செயலாற்றல் தொடர்பாடல் தீர்வு காணுதல்வலையறிவுத் திறன்கள்
தொகுத்தறிதல்கற்றல் நோக்குகள்
- வலைப்பக்கத்தில் ஒட்டுகளைத் திறந்து மூடுவதின் மூலம் எவ்வாறு HTML உறுப்புகள் முழுமையடைகிறது என அறிந்து கொள்ளல்.
பங்கேற்போர்
- 13+
- ஆரம்ப நிலை இணையப் பயனர்
தேவைப்படுவன
p
,h1
,img
போன்ற பொது உறுப்புகளுக்கான திறந்து மூடும் (opening, closing) HTML ஒட்டுகள் (tags) குறிக்கப்பட்ட அட்டைகள்.
-
தயாரிப்புகள்
உள்ளடக்க அட்டைகள் அல்லது ஒட்டுப் பலகைகளில் "திறக்கும்(opening)" மற்றும் "மூடும்(closing)" ஒட்டுகளை எழுதிக் கொள்ளுங்கள் (ஒவ்வொரு இணைக்கும் வேறு வேறு வண்ணங்களைப் பயன்படுத்துங்கள், எகா:
<html>
ஒட்டுகளுக்கு நீலம்,<head>
ஒட்டுகளுக்கு ஆரஞ்சு,<body>
ஒட்டுகளுக்கு அடர்பச்சை,<p>
ஒட்டுகளுக்கு இளம்பச்சை,<title>
இளஞ்சிவப்பில்(pink) = 5 இணைகள்), மேலும் மாதிரி தாளாக (cheat sheet) ஒரு எளிய HTML கோப்பை அச்செடுத்துக் கொள்ளுங்கள். -
செயல்
10 நிமிடங்கள்முதலில், அட்டைகளை அறை முழுவதும் பரப்பி ஒவ்வொருவரையும் ஒரு ஒட்டை எடுக்கச் சொல்லுங்கள். 10 பங்கேற்பாளர்களுக்கும் குறைவாக இருப்பின், குறைந்த ஒட்டுகளைப் பயன்படுத்துங்கள் (முதன்மையல்லாதவற்றை விட்டுவிடுங்கள்,
<h1>
மற்றும்</h1>
, அல்லது<p>
மற்றும்</p>
) அல்லது ஒவ்வொருவரையும் "பொருத்தமான இணையைக் (perfect pair)" கண்டுபிடிக்கக் கூறுங்கள் (எகா:<head>
மற்றும்</head>
).அடுத்ததாக, பங்கேற்பாளர்கள் தாங்கள் வைத்திருக்கும் ஒட்டுக்கு "பொருத்தமான இணையைக் (perfect pair)" கண்டுபிடித்த பின் (எகா: நபர்1
<body>
மற்றும் நபர்2</body>
) அட்டைகளை வைத்திருக்கும் போது இருவரும் HTML கோப்புகளில் தங்கள் ஒட்டுகளின் பங்கு என்ன என்பது குறித்து அவர்களின் கருத்துகளைக் குழுவிலுள்ள மற்றவர்களுக்கு கூற வேண்டும் (அவர்கள் HTML "மாதிரித் தாளைப் (cheat sheet)" பயன்படுத்தலாம்). "பொருத்தமான இணைகள் (perfect pairs)" தங்கள் "பங்கு (role)" குறித்து கூறிய பின், மொத்த குழுவும் ஒட்டுகளைச் சரியான வரிசையில் பிரிக்க முடிகிறதா எனப் பாருங்கள். உங்களிடம் போதுமான பங்கேற்பாளர்கள் இருப்பின் அவர்களை வரிசையாக அறையில் இருக்கக் கூறலாம். அறையில் போதிய இடமில்லாவிட்டால் அல்லது ஒருவர் நிறைய அட்டைகளை வைத்திருந்தால், அட்டைகளைச் சரியான வரிசையில் (மேசை அல்லது தரையில்) பரப்பி வைக்கக் கூறலாம். மேலும் அவர்களைத் "திறந்த தலைகள் (floating heads)" மற்றும் "திறந்த உடலங்களைத் (open bodies)" தவிர்க்கும் படி நினைவுபடுத்துங்கள்.இறுதியாக, இம்முடிவுகளிலிருந்து, எண்ணியமாக்கப்பட்ட (digital) HTML ஒட்டுப் புதிரை Thimble இல் உருவாக்குங்கள், அப்படி உருவாக்கும் போது பங்கேற்பாளர்களிடம்
<p>
மற்றும்<h1>
(அல்லது<head>
மற்றும்<body>
) குறிமுறைகளாக என்ன எழுதுவது எனக் கேளுங்கள். -
எதிர்பார்க்கும் விளைவுகள்
5 நிமிடங்கள்பங்கேற்பாளர்களின் செயல்திறனைக் குழுவாக மதிப்பிடுக. அவர்கள் செயல்படக்கூடிய ஒரு HTML கோப்பை Thimble இல் உருவாக்கியுள்ளனரா? அவர்கள் வரிசைப்படுத்துதலில் ஏதேனும் பிழை இருப்பின், ஒட்டுகளின் இடம் குறித்து (placement of tags) குறிப்புகள் வழங்குவதின் மூலம் பங்கேற்பாளர்களை அவர்கள் குறிமுறையை "வழுநீக்கக் (debug)" கூறுங்கள். பங்கேற்பாளர்கள் செயல்படும் Thimble வார்ப்புருவை (template) உருவாக்கும் வரை தேவையான குறிப்புகளை வழங்கி வழுநீக்கலைத் தொடருங்கள்.