உள்ளடக்கம்

• படிகள்
• முறை 1 /1: ஒரு HTML பக்கத்தை எழுதுதல்
• குறிப்புகள்
• எச்சரிக்கைகள்
• உனக்கு என்ன வேண்டும்

HTML (Hypertext Markup Language) என்பது வலைப்பக்கங்களை உருவாக்குவதற்கான முதன்மை நிரலாக்க மொழி. எளிய மற்றும் வசதியான நிரலாக்க மொழியாக உருவாக்கப்பட்டது. இணையத்தில் உள்ள பெரும்பாலான பக்கங்கள் இந்த மொழியின் வடிவங்களில் ஒன்றைப் பயன்படுத்தி உருவாக்கப்பட்டன (ColdFusion, XML, XSLT). இந்த கட்டுரையைப் படித்த பிறகு, இணையத்தில் உள்ள மற்ற ஆதாரங்களைப் பயன்படுத்தி உங்கள் பயிற்சியைத் தொடரலாம். இந்த தலைப்பு தொடர்பான பிற கட்டுரைகளை இணையத்தில் தேட முயற்சிக்கவும்.

படிகள்

முறை 1 /1: ஒரு HTML பக்கத்தை எழுதுதல்

1. 1 இங்கே வழங்கப்பட்ட படிகளில் ஒன்றை நீங்கள் தெரிந்துகொள்ளத் தொடங்குவதற்கு முன், "உங்களுக்கு என்ன வேண்டும்" என்ற பகுதியைப் பார்க்கவும்.
2. 2 இந்த சிக்கலைப் புரிந்துகொள்ளத் தொடங்குவதற்கு முன் நீங்கள் தெரிந்து கொள்ள வேண்டியது:
3. 3 அடிப்படைகள். டேக் பற்றி நீங்கள் எப்போதாவது கேள்விப்பட்டிருக்கிறீர்களா? குறிச்சொல் கோண அடைப்புக்குறிகளால் சூழப்பட்டுள்ளது, உள்ளே வார்த்தை உள்ளது. இறுதி குறிச்சொல் அதே வடிவத்தில் எழுதப்பட்டுள்ளது, ஆனால் முதல் கோண அடைப்புக்குறிக்குப் பிறகு ஒரு ஸ்லாஷ் சேர்க்கப்பட்டுள்ளது. ஒரு பண்புக்கூறு என்பது குறிச்சொல்லில் உள்ள விருப்பமான சொல், குறிச்சொல்லில் விவரங்களைச் சேர்க்கப் பயன்படுகிறது.
4. 4 ஆவணத்தின் ஆரம்பம். நீங்கள் பயன்படுத்தும் எந்த உரை திருத்தியிலும் பின்வருவனவற்றை ஒட்டவும்:
   html> தலை> தலைப்பு> wikiHow / title> / தலை> உடல்> வணக்கம் உலகம் / உடல்> / html> பெரிய> / பெரிய>
   குறிச்சொல் அதே குறியுடன் மூடப்பட வேண்டும், ஆனால் முதல் கோண அடைப்புக்குப் பிறகு ஒரு சாய்வுடன். குறிச்சொற்கள் போன்ற விதிவிலக்குகள் உள்ளன META அல்லது DOCTYPE.
5. 5 DOCTYPE
   • பொதுவாக, பெரும்பாலான வலைப்பக்கங்கள் அமைக்கப்பட்டுள்ளன DOCTYPE ". இது இணைய உலாவிகளால் எப்படி உணரப்படும் என்பதைப் போலவே குறியாக்கத்தையும் தீர்மானிக்க உதவுகிறது. பெரும்பாலான பக்கங்கள் இது இல்லாமல் வேலை செய்யும், "ஆனால் நீங்கள் பொருத்த விரும்பினால் இது அவசியம்... HTML 4.01 க்கான DOCTYPE கீழே வழங்கப்பட்டுள்ளது:! DOCTYPE html PUBLIC "- // W3C // DTD HTML 4.01 // EN" "http://www.w3.org/TR/html4/strict.dtd"> இது ஒன்று மிகவும் பொதுவானது இணையம் முழுவதும் பக்கங்களில் DOCTYPE பயன்படுத்தப்படுகிறது.முதலில், அது 'html' ஐ விவரிக்கும் பக்கத்தின் வகையை சுட்டிக்காட்டுகிறது, பின்னர் அது குறியாக்க வகையை முன்னிலைப்படுத்துகிறது, இறுதியாக, DOCTYPE இன் இடம், இதன் விளைவாக, இணைய உலாவிக்கான பக்கத்தை விவரிக்கிறது.
   • பல்வேறு வகையான HTML (பல ஆண்டுகளாக உருவாக்கப்பட்ட பல்வேறு பதிப்புகள்) உள்ளன, எடுத்துக்காட்டாக புதிய குறிச்சொற்கள் அல்லது குறிப்பிட்ட குறிச்சொற்களைப் பயன்படுத்துதல். சில குறிச்சொற்கள் விலக்கப்பட்டுள்ளன (அதற்குப் பதிலாக வேறு பயனுள்ள குறிச்சொற்கள் பயன்படுத்தப்படுகின்றன).
   • b> மற்றும் i> - இதுதான் தற்போது குறிச்சொற்களில் திணிக்கப்பட்டுள்ளது, ஏனெனில் அவை உரையை மாற்றுவதற்குப் பயன்படுத்தப்படுகின்றன, ஆனால் குறிப்புகள் அல்ல, இதன் விளைவாக, மற்ற குறிச்சொற்கள் அவற்றை மாற்றுவதற்கு வருகின்றன. டேக் வலுவான> என்பதற்கு மாற்றாக உள்ளது b>, மற்றும் எம்>, ஒரு மாற்று i>.
   • முந்தைய குறிச்சொற்களை வடிவமைப்பதை விட அதிகமான குறிச்சொற்களால் மாற்றுவது முக்கியம். உரை மொழிபெயர்க்கப்பட்டால், வடிவமைத்தல் மட்டுமல்ல, அதன் அர்த்தமும் அப்படியே இருக்கும். இது சொற்பொருள் ரீதியாக சரியானது.
   • XHTML பதிப்பு 2.0 இல், b> மற்றும் i> HTML பதிப்பு 3+ போல பயன்படுத்தப்படவில்லை.
6. 6 HTML "இணைத்தல் விதி".
   • தற்போது பயன்பாட்டில் உள்ள மிக முக்கியமான குறிச்சொற்களைப் பார்ப்போம். பக்கத்தை உருவாக்கும் போது, ​​ஒரு எளிய அமைப்பு பயன்படுத்தப்படுகிறது. ஒரு டேக் திறந்திருந்தால், அதன் விளைவாக, அது மூடப்பட வேண்டும்... இது முழு அமைப்பிற்கும் பொருந்தும். XHTML தளவமைப்பு கட்டமைப்பின் சரியான உதாரணம் இங்கே:
   • ! DOCTYPE html PUBLIC "- // W3C // DTD XHTML 1.0 கண்டிப்பான // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
   • html xmlns = "http://www.w3.org/1999/xhtml">
   • தலை>
   • மெட்டா http-equiv = "Content-Type" content = "text / html; charset = utf-8" />
   • தலைப்பு> வணக்கம் உலகம்! / தலைப்பு>
   • / தலை>
   • உடல்>
   • h1> வணக்கம் உலகம்! / h1>
   • / உடல்>
   • / html>
   • ஒரு செய்தியை வெளியிடும் மாதிரி குறியீடு வணக்கம் உலகம்... இது சோதனை என்று அழைக்கப்படுகிறது வணக்கம் உலகம்.
7. 7 தலைப்பு
   • வலைப்பக்க தலைப்பு என்பது குறிச்சொல்லுக்கு இடையே உள்ள உள்ளடக்கம் தலை>... இந்த உள்ளடக்கத்தை பயனரால் பார்க்க முடியாது (பக்கத்தின் தலைப்பில் காட்டப்பட்டுள்ள தலைப்பு மட்டுமே). குறிச்சொற்களுக்கு இடையில் தகவல் தலை>, போன்ற பிற குறிச்சொற்களை இணைக்கலாம்:
     
     
     • தேடுபொறிகள் மற்றும் பிற பயன்பாடுகளுக்கு பயனுள்ளதாக இருக்கும் தகவல்களுக்கு META குறி பயன்படுத்தப்படுகிறது.
     • ஆவணங்களுக்கிடையே ஒரு இணைப்பை உருவாக்கும் LINK டேக், எடுத்துக்காட்டாக Styles (CSS).
     • SCRIPT குறிச்சொல், தொலைதூர அணுகல் திறனுடன் (மற்றொரு ஆவணத்திலிருந்து) கிட்டத்தட்ட எந்த வலை குறியீடும் இதில் அடங்கும்.
     • ஸ்டைல் ​​டேக், இது ஒரு பக்கத்திற்குப் பயன்படுத்தக்கூடிய ஒரு பாணி.
     • TITLE டேக் என்பது உங்கள் இணைய உலாவியில் ஒரு பக்கத்தின் தலைப்பாகத் தோன்றும் தலைப்பு.
   • இந்த வலைத்தளத்திலிருந்து எடுக்கப்பட்ட எடுத்துக்காட்டு தலைப்பில் இவற்றில் சிலவற்றின் டெமோவைப் பார்ப்போம் (இது சுருக்கப்பட்டது):
     • தலை>
     • தலைப்பு> ... / தலைப்பு>
     • மெட்டா பெயர் = "விளக்கம்" உள்ளடக்கம் = "..." />
     • இணைப்பு rel = "ஸ்டைல்ஷீட்" வகை = "உரை / css" href = "..." />
     • மெட்டா http-equiv = "content-type" content = "text / html; charset = UTF-8" />
     • பாணி வகை = "உரை / சிஎஸ்எஸ்" மீடியா = "அனைத்தும்"> ... / பாணி>
     • ஸ்கிரிப்ட் வகை = "உரை / ஜாவாஸ்கிரிப்ட்" src = "..."> / script>
     • / தலை>
       
       நீங்கள் கவனிக்கவில்லை எனில், தனிப்பட்ட குறிச்சொற்கள் முன்னிலைப்படுத்தப்பட்டு, உண்மையான தகவல்கள் அகற்றப்படும். உதாரணம் மிகவும் குறுகியதாக உள்ளது, அதில் காணக்கூடிய ஒவ்வொரு குறிச்சொல்லையும் காட்டுகிறது தலை>HTML கருத்தைத் தவிர (இதைப் பற்றி எளிய குறிச்சொற்களில் பேசுவோம்).
8. 8 எல்லா இடங்களிலும் எளிய குறிச்சொற்கள்
   • மற்ற குறிச்சொற்களைப் பார்ப்போம். உங்கள் டேக்கிங்கில் கவனமாக இருங்கள் மற்றும் கட்டைவிரல் விதியை நினைவில் கொள்ளுங்கள்.
     
     
     • வலுவான> முக்கியமான உரையை வலியுறுத்துகிறது.
     • சிறிய> உரையை சிறியதாக்குகிறது. எழுத்துரு அளவு 1 முதல் 7 வரையிலான நிலையான அலகுகளில் அளவிடப்படுகிறது, 3 என்பது இயல்புநிலை உரை அளவு. ...
     • முன்> பணக்கார உரையின் தொகுதியை வரையறுக்கிறது. அது சரியானது என்பதால், அத்தகைய உரை அதே அளவின் எழுத்துரு மற்றும் சொற்களுக்கு இடையில் உள்ள அனைத்து இடைவெளிகளிலும் தட்டச்சு செய்யப்படுகிறது.
     • em> உரையை ஒரு சொற்றொடராகக் காட்டுகிறது.
     • டெல்> உரையைத் தாக்குகிறது.
     • இன்ஸ்> ஆவணத்தில் செருகப்பட்ட உரையை வரையறுக்கிறது.
     • h1> பல தலைப்பு குறிச்சொற்களில் ஒன்று. இந்த வகையான குறிச்சொற்கள் எண்ணிக்கையில் வித்தியாசத்துடன் 'h' உடன் தொடங்குகின்றன. அதே எண்ணுடன் குறிச்சொல்லை மூடுவதை உறுதி செய்யவும்.
     • ப> ஒரு பத்தியை வரையறுக்கிறது.
     • ! குறியீட்டைப் பார்க்கும்போது மட்டுமே இந்தத் தகவல் தெரியும்.
     • blockquote> மேற்கோளைக் காட்டுகிறது, மேற்கோள்> குறிச்சொல்லுடன் பயன்படுத்தலாம்.
     • மேலே உள்ள சில எடுத்துக்காட்டுகள் தற்போதுள்ள குறிச்சொற்களின் முழுமையான பட்டியல் அல்ல. மற்றவர்களைப் பற்றி அறிய, வருகை தரவும்.
9. 9 ஒரு தெளிவான கட்டமைப்பை உருவாக்குதல்
   • எளிமையான குறிச்சொற்களில் தரவுகளை வைத்திருக்க பக்கங்கள் வடிவமைக்கப்பட்டுள்ளன, இதன்மூலம் தகவல்களை பத்திகளாக பகுக்க முடியும். கணினி தரவை அங்கீகரிக்கிறது; அது சூழல் அல்லது கருத்தியல் இணைப்பு பற்றி தெரியாது. கணினிக்கு ஏற்ற HTML பக்கங்களை நாம் உருவாக்க வேண்டும். டிவி டேக் பயன்படுத்தி இது அடையப்படுகிறது. இது அதிக எண்ணிக்கையிலான பக்கங்களை உருவாக்க உதவுகிறது. இது CSS உடன் வடிவமைக்கப்படலாம் மற்றும் தளவமைப்பிற்கான பெரிய குறியீடு அட்டவணைகளை உருவாக்குவதை விட எளிதானது.
     • டிவி> இந்த குறிச்சொல் சிறப்பு வாய்ந்தது, ஏனெனில் இது வடிவமைக்கப்பட்டு பயனருக்கும் கணினிக்கும் புரிந்துகொள்ளக்கூடிய தனித்தனி தகவல்களின் தொகுதிகளைப் பயன்படுத்தலாம்.
   • ஒரு டிவி டேக் பயன்படுத்தும் எளிய HTML அமைப்பைப் பார்ப்போம்.
     • ! DOCTYPE html PUBLIC "- // W3C // DTD XHTML 1.0 கண்டிப்பான // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
     • html xmlns = "http://www.w3.org/1999/xhtml">
     • தலை>
     • மெட்டா http-equiv = "Content-Type" content = "text / html; charset = utf-8" />
     • தலைப்பு> வணக்கம் உலகம்! / தலைப்பு>
     • / தலை>
     • உடல்>
     • h1> வணக்கம் உலகம்! / h1>
     • div id = "contentOne">
     • p> இது div # contentOne. / p> இல் உள்ள சில உரை
     • டிவி>
     • p> div # contentOne / p> இன் துணைப் பிரிவில் ஒரு பத்தி
     • / div>
     • / div>
     • / உடல்>
     • / html>
   • டிவி> குறிச்சொற்களைப் பயன்படுத்துவது சிஎஸ்எஸ் மற்றும் ஜாவாஸ்கிரிப்டுடன் பணிபுரியும் போது பாணிகளைக் கண்டறிந்து மாற்றியமைக்க உதவுகிறது. சிறந்த மற்றும் பதிலளிக்கக்கூடிய பயனர் அனுபவத்தை உருவாக்க சிஎஸ்எஸ் பாணிகள் மற்றும் ஜாவாஸ்கிரிப்ட் உடன் வேலை செய்ய HTML பல்வேறு குறியாக்கங்களைப் பயன்படுத்தும்.

குறிப்புகள்

• இந்த கட்டுரையைப் படித்த பிறகு, நிறுத்த வேண்டாம், நீங்கள் தெரிந்து கொள்ள வேண்டிய அனைத்தையும் கற்றுக்கொண்டீர்கள் என்று நினைக்காதீர்கள். குறிப்பாக இந்த தொழில்நுட்பத்தில் எப்போதும் கற்றுக்கொள்ள ஏதாவது இருக்கிறது.
• குறியீட்டை கற்றுக்கொள்ளவும், புரிந்து கொள்ளவும், எழுதவும்.
• சில குறிச்சொற்களை மட்டுமே பயன்படுத்துகின்றன என்பதை நினைவில் கொள்க>. பாரா மற்றும் பிஆர் சில உதாரணங்கள். இதனுடன் திறக்கப்பட்ட பிற குறிச்சொற்கள்> மேலும் மூடப்பட வேண்டும். உதாரணமாக, "div> / div>".
• மக்கள் புதிய கண்டுபிடிப்புகளை எதிர்பார்க்கிறார்கள், எனவே மறு கண்டுபிடிப்பு, வடிவமைப்பு அல்லது குறியீடு.
• நீங்கள் நிறைய கற்றுக்கொண்டவுடன், சர்வர் புரோகிராமிங் கற்றுக்கொள்ள முயற்சிக்கவும்.
• சிஎஸ்எஸ் மற்றும் ஜாவாஸ்கிரிப்டுடன் வேலை செய்ய கற்றுக்கொள்ளுங்கள்.

எச்சரிக்கைகள்

• நினைவில் கொள்ளுங்கள், HTML என்பது உள்ளடக்கத்தை திருத்துவதாகும். இதன் பொருள் அங்கீகரிக்கப்பட்ட வடிவத்தில் உள்ளடக்கத்தை சேமிக்க மட்டுமே HTML பயன்படுத்தப்படுகிறது. CSS போன்ற பிற தொழில்நுட்பங்களைப் பயன்படுத்தி மற்ற மாற்றங்கள் செய்யப்பட வேண்டும். இதன் பொருள் “சொற்பொருள் சரிமற்றவர்கள் அதை ஒப்புக்கொள்ளாவிட்டாலும் கூட. பிற நிரலாக்க மொழிகள் வலைப்பக்கங்களை உருவாக்க உதவுகின்றன (சிஎஸ்எஸ், ஜாவாஸ்கிரிப்ட் மற்றும் எக்ஸ்எம்எல்). HTML ஒரு உள்ளடக்க கட்டமைப்பாளர்.

உனக்கு என்ன வேண்டும்

• ANSI குறியாக்கத்தை ஆதரிக்கும் ஒரு உரை திருத்தி
• Internet Explorer அல்லது Mozilla Firefox போன்ற இணைய உலாவி
• (விரும்பினால்) அடோப் ட்ரீம்வீவர், அப்தானா ஸ்டுடியோ அல்லது மைக்ரோசாப்ட் எக்ஸ்பிரஷன் வெப் போன்ற வைசிவிக் அல்லது வைகிவிக் HTML எடிட்டர்