ഉള്ളടക്ക ലേ .ട്ടിനായുള്ള ഗൈഡ്

വെബിൽ‌ ഒരു ഉള്ളടക്കം മ mount ണ്ട് ചെയ്യാൻ‌ ഞങ്ങൾ‌ താൽ‌പ്പര്യപ്പെടുമ്പോൾ‌, ഞങ്ങൾ‌ക്ക് ലഭിക്കുന്ന വലിയ പ്രശ്‌നങ്ങളിലൊന്ന്, എനിക്ക് ലഭിക്കുന്ന പ്രൊപ്പോസലുകൾ‌ വെബിൽ‌ വിജയകരമായി സംയോജിപ്പിക്കുമെന്ന് ഒരിക്കലും ചിന്തിച്ചിട്ടില്ല എന്നതാണ്. സാധാരണഗതിയിൽ പ്രശ്നം, മതിയായ ഘടനയില്ലാതെ രൂപകൽപ്പനയും ലേ layout ട്ടും സാധാരണയായി വളരെ മനോഹരമായി കാണപ്പെടുന്നില്ല, ഇത് തൃപ്തികരമല്ലാത്ത ഫലം നൽകുന്നു.

അതിനാലാണ് സൃഷ്ടിയെ പരമാവധി ലളിതമാക്കുന്നതിന് ഒരു ഉള്ളടക്ക ലേ layout ട്ട് എങ്ങനെ പരിഗണിക്കേണ്ടതെന്നും ഫലം ഒപ്റ്റിമൽ ആണെന്നും ഞാൻ ചില അടിസ്ഥാന വിശദീകരണങ്ങൾ നൽകാൻ പോകുന്നു.

പ്രോഗ്രാമിംഗിനെക്കുറിച്ചോ വെബ് ഡെവലപ്മെന്റിനെക്കുറിച്ചോ അറിവില്ലാത്ത ആർക്കും എനിക്ക് ഒരു ഗുണനിലവാരമുള്ള ലേ layout ട്ട് നൽകാൻ കഴിയുമെന്നതും ഒരു നിഗമനത്തിലെത്തുന്നതുവരെ ഒന്നിലധികം സംഭാഷണങ്ങളിലൂടെ ആശയം എക്‌സ്‌ട്രാക്റ്റുചെയ്യാൻ ഞാൻ വളരെയധികം സമയം ചെലവഴിക്കേണ്ടതില്ല എന്നതാണ് ഈ ഗൈഡിന്റെ ലക്ഷ്യം.

ഘട്ടം 1: ടെംപ്ലേറ്റ്

ഞങ്ങളുടെ നിർദ്ദേശം "വരയ്ക്കാൻ" കഴിയുന്ന ഒരു ടെംപ്ലേറ്റ് ലഭിക്കുന്നതിന്, ഞങ്ങൾ ചെയ്യാൻ പോകുന്നത് ഒരു A4 ഷീറ്റ് പേപ്പർ എടുത്ത് ഞങ്ങൾ അത് മൂന്നിലൊന്ന് നീളത്തിൽ മടക്കാൻ പോകുന്നു.

ഘട്ടം 2: ഉള്ളടക്കം തടയുന്നു

വീഡിയോ, ഇമേജ്, ടെക്സ്റ്റ്: ഞങ്ങൾക്ക് നിരവധി തരം ഉള്ളടക്കമുണ്ടെന്ന് സങ്കൽപ്പിക്കാം. ഓരോ ഉള്ളടക്കവും ഒരു ചതുരാകൃതിയിലുള്ള അല്ലെങ്കിൽ ചതുര ബ്ലോക്കാണ്. ഞങ്ങളുടെ ഇഷ്ടാനുസരണം ടെംപ്ലേറ്റിന്റെ മുകളിൽ നിന്ന് താഴേക്ക് ബ്ലോക്കുകൾ ഘടിപ്പിക്കണം. ഞങ്ങൾ മൂന്ന് തരം ഉള്ളടക്കങ്ങൾ വിശദീകരിക്കും.

വീഡിയോ ബ്ലോക്ക്

വീഡിയോ സാധാരണയായി ഒരു YouTube വീഡിയോ ആയിരിക്കുമെന്ന് ഞങ്ങൾ അനുമാനിക്കും, ഞങ്ങൾ ഇത് ടെംപ്ലേറ്റിൽ ഇനിപ്പറയുന്ന രീതിയിൽ പ്രതിനിധീകരിക്കുന്നു:

ക്സനുമ്ക്സ ചിത്രം

ഇമേജ് ബ്ലോക്ക്

ചിത്രം ലാൻഡ്‌സ്‌കേപ്പ് അല്ലെങ്കിൽ പോർട്രെയ്റ്റ് ആണോ എന്നതിനെ ആശ്രയിച്ചിരിക്കും, കാരണം ഞങ്ങൾ സമ്മതിക്കും.

ടെക്സ്റ്റ് ബ്ലോക്ക്

ഇമേജ് ബ്ലോക്കിന് സമാനമാണ്, നമുക്ക് വാചകം എങ്ങനെ വേണമെന്നതിനെ ആശ്രയിച്ച് ഞങ്ങൾ ഒരു ബ്ലോക്ക് അല്ലെങ്കിൽ മറ്റൊന്ന് ഇടും. സമാന്തര വരികളിലൂടെ ഞങ്ങൾ അതിനെ പ്രതിനിധീകരിക്കുന്നു.

ടെക്സ്റ്റ് ബ്ലോക്കുകൾ ഉൾപ്പെടുത്തിയ ഖണ്ഡികകളോടുകൂടിയ ടെക്സ്റ്റ് ബ്ലോക്കുകളാകാം വാചക ഇന ലിസ്റ്റുകൾ

ഞാൻ രണ്ട് ഉദാഹരണങ്ങൾ നൽകാൻ പോകുന്നു: ലാൻഡ്‌സ്‌കേപ്പ് ഇമേജിന് അടുത്തായി ഒരു ബ്ലോക്ക് ടെക്സ്റ്റ്, പോർട്രെയിറ്റ് ഇമേജിന് അടുത്തായി മറ്റൊന്ന്:

ക്സനുമ്ക്സ ചിത്രം

ശീർഷക ബ്ലോക്ക്

ശീർഷകങ്ങൾ പ്രത്യേക ബ്ലോക്കുകളിൽ പോകുന്നു, സാധാരണയായി മുഴുവൻ വരിയും ഉൾക്കൊള്ളുന്ന നീളമേറിയ ബ്ലോക്കുകളാണ്.

ബട്ടൺ ബ്ലോക്ക്

ആളുകൾക്ക് ക്ലിക്കുചെയ്യാനും വെബിന്റെ മറ്റൊരു ഭാഗത്തേക്ക് കൊണ്ടുപോകാനും അല്ലെങ്കിൽ കുറച്ച് വിവരങ്ങളുള്ള ഒരു വിൻഡോ (അല്ലെങ്കിൽ ഒരു ഫോം) ദൃശ്യമാകാൻ ഞങ്ങൾ ഒരു ബട്ടൺ ഇടാൻ ആഗ്രഹിക്കുന്നുവെങ്കിൽ

മറ്റ് ബ്ലോക്കുകൾ

ആശയം സമാനമാണ്. ബ്ലോക്കുകൾ എങ്ങനെ പ്രവർത്തിക്കുന്നുവെന്ന് ഞങ്ങൾ മനസിലാക്കിയിട്ടുണ്ടെങ്കിൽ, മുമ്പത്തേതിന് സമാനമായി ചതുരാകൃതിയിലോ ചതുരാകൃതിയിലോ യോജിക്കുന്ന മറ്റൊരു തരം ബ്ലോക്ക് വ്യക്തമായി ഉൾപ്പെടുത്താമെന്ന് ഞാൻ കരുതുന്നു. ഉദാഹരണത്തിന്, ഉള്ളടക്കത്തിൽ ഉൾപ്പെടുത്തിയിരിക്കുന്ന ഒരു ഫോം ഇടാൻ ഞങ്ങൾ ആഗ്രഹിക്കുന്നുവെങ്കിൽ. ഇത് സാധാരണയായി ഏറ്റവും സാധാരണമായതാണെങ്കിലും, മുകളിൽ സൂചിപ്പിച്ച തരത്തിലുള്ളവയല്ലാത്ത പുതിയ ബ്ലോക്കുകൾ ഉപയോഗിക്കുന്നതിന് മുമ്പ് ചോദിക്കുന്നതാണ് നല്ലത്. എല്ലാവർക്കും താൽപ്പര്യമുണ്ടായേക്കാവുന്ന പുതിയ ബ്ലോക്ക് ആശയങ്ങൾ പുറത്തുവരുന്നതിനാൽ ഞാൻ ഈ ലിസ്റ്റ് അപ്‌ഡേറ്റ് ചെയ്യാൻ ശ്രമിക്കും.

അവസാനമായി, മുകളിൽ സൂചിപ്പിച്ച എല്ലാത്തരം ബ്ലോക്കുകളുമുള്ള ഒരു ടെംപ്ലേറ്റിന്റെ ഒരു ഉദാഹരണം ഇതാ:

ക്സനുമ്ക്സ ചിത്രം

ബ്ലോക്കുകൾ വികസിപ്പിക്കുന്നു

ഞങ്ങൾക്ക് കൂടുതൽ ഇടം ആവശ്യമുണ്ടെങ്കിൽ, ചുവടെയുള്ള ബ്ലോക്ക് രൂപകൽപ്പനയിലേക്ക് ഞങ്ങൾ കൂടുതൽ പേജുകൾ ചേർക്കണം. എല്ലാം പൂരിപ്പിക്കേണ്ട ആവശ്യമില്ല, പക്ഷേ ഓരോ ബ്ലോക്കിന്റെയും മധ്യത്തിൽ മുകളിൽ നിന്ന് താഴേക്ക് ശൂന്യമായ വിടവുകൾ ഇടാതിരിക്കേണ്ടത് പ്രധാനമാണ്. ഈ രീതിയിൽ നമുക്ക് പേജ് വിപുലീകരിക്കാൻ കഴിയും:

ക്സനുമ്ക്സ ചിത്രം

ഘട്ടം 3: ഉള്ളടക്കം സൃഷ്ടിക്കുന്നു

ബ്ലോക്കുകളും തരങ്ങളും അനുസരിച്ച് ഉള്ളടക്കം ലേ layout ട്ട് ചെയ്തതിനാൽ ആ ബ്ലോക്കുകളിൽ പോകുന്ന ഉള്ളടക്കം സൃഷ്ടിക്കേണ്ടത് ആവശ്യമാണ്. 3 ഘട്ടം 2 ഘട്ടവുമായി പരസ്പരം മാറ്റാവുന്നതാണ്. മറ്റൊരു വിധത്തിൽ പറഞ്ഞാൽ, ഞങ്ങൾക്ക് മുമ്പ് ഉള്ളടക്കം സൃഷ്ടിക്കാൻ കഴിയും, തുടർന്ന് ഞങ്ങൾ സംയോജിപ്പിക്കാൻ ആഗ്രഹിക്കുന്ന ഉള്ളടക്കത്തിന്റെ അളവ് അറിയുക. ഇത് ഒരു തരത്തിൽ അല്ലെങ്കിൽ മറ്റൊന്നിൽ ചെയ്യുന്നത് വ്യക്തമല്ല, പക്ഷേ ഉള്ളടക്കം ഞങ്ങളുടെ ലേ layout ട്ടിനുള്ളിൽ കൃത്യമായി യോജിക്കേണ്ടതുണ്ടെന്ന് ഞങ്ങൾ അറിഞ്ഞിരിക്കണം

മുമ്പത്തെ ഉദാഹരണം ഞങ്ങൾ പിന്തുടരും. 4 ഇമേജിൽ നമുക്ക് ഇനിപ്പറയുന്ന ബ്ലോക്കുകൾ കാണാം:

  • 2 ശീർഷക ബ്ലോക്കുകൾ
  • 4 ടെക്സ്റ്റ് ബ്ലോക്കുകൾ
  • 1 വീഡിയോ ബ്ലോക്ക്
  • 2 ഇമേജ് ബ്ലോക്കുകൾ
  • 1 ബട്ടൺ ബ്ലോക്ക്
  • ആകെ: 10 ബ്ലോക്കുകൾ

അതിനാൽ ഞങ്ങളുടെ ഉള്ളടക്കം ക്രമീകരിക്കേണ്ടതിനാൽ ഈ ബ്ലോക്കുകളിൽ നിന്ന് പുറത്തുപോകാതെ തന്നെ ഇത് നന്നായി യോജിക്കുന്നു, ഒപ്പം ഫോണ്ട് വലുപ്പം എല്ലാവരിലും തുല്യമാണ്. അതിനായി സാധ്യമാണ് അത് വിലമതിക്കുന്നു ആദ്യം ഉള്ളടക്കം സൃഷ്ടിച്ച് അതിനെ തടയുക. ഇത് ഇതിനകം വ്യക്തിയെ വളരെയധികം ആശ്രയിച്ചിരിക്കുന്നു.

ഘട്ടം 4: ബ്ലോക്കുകളുമായി ഉള്ളടക്കം യോജിക്കുന്നു

പേപ്പറിൽ വരച്ച രൂപകൽപ്പനയും എല്ലാ ഉള്ളടക്ക ബ്ലോക്കുകളും ഇതിനകം ഞങ്ങൾക്കുണ്ടെന്ന് കരുതുക. ഇപ്പോൾ അവസാന ഘട്ടം ഇത് സംയോജിപ്പിക്കുക എന്നതാണ്. ഇതിനായി എല്ലാം സംയോജിപ്പിക്കാൻ ഞങ്ങൾ നിരവധി ഉപകരണങ്ങൾ ഉപയോഗിക്കും ഇത് വെബ് ഡിസൈനർക്ക് അയയ്ക്കുക.

വീഡിയോ ബ്ലോക്കുകൾ

വീഡിയോകൾ രണ്ട് തരത്തിൽ കൈമാറാൻ കഴിയും:

  1. പോലുള്ള ഒരു ഉപകരണം വഴി MP4 വീഡിയോ ഫോർമാറ്റിൽ വീട്ട് ട്രാൻസ്ഫർ.
  2. തിരഞ്ഞെടുത്ത ഓപ്ഷൻ: അവ YouTube മാർച്ച് ചാനലിലേക്ക് അപ്‌ലോഡുചെയ്യുകയും വീഡിയോയിലേക്ക് YouTube ലിങ്കിൽ കൈമാറുകയും ചെയ്യുന്നു.

ലേ layout ട്ടിൽ ഒരു വീഡിയോ മാത്രമേ ഉള്ളൂവെങ്കിൽ ഒരു പ്രശ്നവുമില്ല. എന്നാൽ നിരവധി വീഡിയോകൾ‌ ഉണ്ടെങ്കിൽ‌, ഞങ്ങൾ‌ അവ പേപ്പറിൽ‌ ചെയ്‌ത ലേ layout ട്ടുമായി ഏതെങ്കിലും തരത്തിൽ‌ ബന്ധപ്പെടുത്തേണ്ടതുണ്ട്.

ഉദാഹരണത്തിന്. മൂന്ന് വീഡിയോകൾ ഉണ്ടെന്ന് സങ്കൽപ്പിക്കുക. ലേ video ട്ടിൽ ഞങ്ങൾ ആദ്യ വീഡിയോയിൽ ഒരു എക്സ്എൻ‌യു‌എം‌എക്സ് നമ്പറും രണ്ടാമത്തെ വീഡിയോയിലെ ഒരു എക്സ്എൻ‌എം‌എക്സ് നമ്പറും മൂന്നാമത്തെ വീഡിയോയിൽ ഒരു എക്സ്എൻ‌എം‌എക്സ് നമ്പറും വരയ്ക്കും. എല്ലാ ഡോക്യുമെന്റേഷനുകളും അയയ്‌ക്കുമ്പോൾ ഞങ്ങൾ ഇതുപോലൊന്ന് ഇടും:

  • വീഡിയോ 1: "അഹിംസയുടെ ഏറ്റവും പ്രധാനപ്പെട്ട വാക്യങ്ങൾ" എന്ന തലക്കെട്ടോടെ അഹിംസയുടെ വാക്യങ്ങൾ കൈകാര്യം ചെയ്യുന്ന വീഡിയോ
  • വീഡിയോ 2: "അഹിംസയുടെ പതാക" എന്ന തലക്കെട്ടോടെ പതാകയുടെ നിറങ്ങൾ കൈകാര്യം ചെയ്യുന്ന വീഡിയോ
  • വീഡിയോ 3: "അർജന്റീനയുടെ അടിസ്ഥാന ടീം" എന്ന തലക്കെട്ടോടെ അർജന്റീനയിൽ മാർച്ച് ചെയ്യാൻ പോകുന്ന ഗ്രൂപ്പുമായി ഇടപെടുന്ന വീഡിയോ

ഓരോ വിഭാഗത്തിനും യോജിക്കുന്ന വീഡിയോ എന്താണെന്ന് അറിയുന്നത് ഇത് എളുപ്പമാക്കുന്നു.

ഇമേജ് ബ്ലോക്കുകൾ

ഈ സാഹചര്യത്തിൽ, എല്ലാ ചിത്രങ്ങളും IMGUR പ്ലാറ്റ്ഫോമിലേക്ക് അപ്‌ലോഡ് ചെയ്യണം: https://imgur.com/upload

എന്നിട്ട് ആ ചിത്രങ്ങളിലേക്കുള്ള ലിങ്കുകൾ കൈമാറുക. 1, എ 2, എ 3 എന്നിങ്ങനെ അടയാളപ്പെടുത്തിയിരിക്കുന്ന വീഡിയോകൾ പോലെ തന്നെ ചിത്രങ്ങളും ഇടുക എന്നതാണ് ഏറ്റവും അനുയോജ്യം. ഉദാഹരണത്തിന്, ദക്ഷിണാഫ്രിക്കയിൽ പറക്കുമ്പോൾ നമുക്ക് 4 ചിത്രങ്ങൾ ഉണ്ടെന്ന് സങ്കൽപ്പിക്കുക. നാലുപേർക്കും ഒരേ പേര്: "sudafrica.jpg". ശരി, അവ ലേഔട്ടിൽ ആയിരിക്കുന്ന സ്ഥലത്തേക്ക് ഞങ്ങൾ തുടർച്ചയായ പേരുകൾ ഇടുകയും അവയുമായി പൊരുത്തപ്പെടുന്ന പേപ്പറിൽ നമ്പർ വരയ്ക്കുകയും ചെയ്യുന്നു. ഉദാഹരണം:

  • sudafrica-1.jpg
  • sudafrica-2.jpg
  • sudafrica-3.jpg
  • sudafrica-4.jpg

ബട്ടൺ, ശീർഷകം, വാചക ബ്ലോക്കുകൾ

അവസാനമായി, ഈ ബ്ലോക്കുകൾ ഒരു വേഡ് ഡോക്യുമെന്റിലോ അല്ലെങ്കിൽ Google ഡോക്സിലോ എഴുതണം.

ഫോർമാറ്റ് വളരെ ലളിതമാണ്: വേഡ് ഡോക്യുമെന്റിൽ ഞങ്ങൾ ബ്ലോക്ക് തരം (ശീർഷകം, ബട്ടൺ അല്ലെങ്കിൽ വാചകം), തുടർന്ന് ലേ .ട്ടിൽ യോജിക്കുന്ന സംഖ്യ എന്നിവ ഇട്ടു.

ഉദാഹരണങ്ങൾ:

  • ശീർഷകം 1:….
  • ശീർഷകം 2:…
  • വാചകം 1:…
  • വാചകം 2:…
  • ബട്ടൺ 1:…
  • ബട്ടൺ 2:…

എക്സ്എൻ‌യു‌എം‌എക്സ് ചിത്രത്തിന്റെ ഉദാഹരണം പിന്തുടർന്ന് ഇത് എങ്ങനെ ക്രമീകരിക്കപ്പെടുമെന്ന് കാണാൻ കഴിയുന്ന തരത്തിൽ തികച്ചും റാൻഡം ടെക്സ്റ്റുകളുള്ള ഒരു ഉദാഹരണ പ്രമാണം ഞാൻ ഇട്ടു:

ഓരോ വിഭാഗത്തിനും അനുയോജ്യമായ അക്കങ്ങൾ‌ ഞങ്ങൾ‌ നൽ‌കിയാൽ‌ ലേ layout ട്ട് എങ്ങനെ കാണപ്പെടും:

ക്സനുമ്ക്സ ചിത്രം

4 ഘട്ടം: എല്ലാം അയയ്‌ക്കുക

ഞങ്ങൾ‌ എല്ലാം ചെയ്‌തുകഴിഞ്ഞാൽ‌, നിങ്ങൾ‌ അത് ലേ .ട്ടിന്റെ ചുമതലയുള്ള വ്യക്തിക്ക് അയയ്‌ക്കേണ്ടി വരും

ഇത് ലളിതമായി എടുക്കും

  1. ലേ with ട്ടിനൊപ്പം പേപ്പറിൽ രേഖാചിത്രങ്ങൾ
  2. ഉള്ളടക്കം
    • YouTube അല്ലെങ്കിൽ WeTransfer- ലേക്ക് വീഡിയോ ലിങ്കുകൾ
    • ചിത്രങ്ങളുടെ IMGUR ലിങ്കുകൾ
    • Google ഡോക്സിലെ അല്ലെങ്കിൽ വേഡ് ഫയലിലെ പ്രമാണത്തിലേക്കുള്ള ലിങ്ക്

നോട്ടറി പ്രധാന ഫൈനൽ

പേജിന്റെ ശീർഷകം 1 തലക്കെട്ടിനൊപ്പം വരുന്ന ഒരു മികച്ച ഇമേജ് ഉൾപ്പെടുത്തുന്നതാണ് അനുയോജ്യമായത്. അതിനാലാണ് ശീർഷകം 1 എല്ലായ്പ്പോഴും തുടക്കത്തിൽ ദൃശ്യമാകേണ്ടത്.

തലക്കെട്ട് ചിത്രത്തിന് 960 x 540 പിക്സലുകളുടെ വലുപ്പം ഉണ്ടായിരിക്കണം. IMGUR വഴി ഈ ചിത്രം ബാക്കി ചിത്രങ്ങൾ പോലെ അയയ്ക്കാൻ കഴിയും

അന്തിമഫലം

ഒടുവിൽ ഈ വിവരങ്ങളെല്ലാം ഉപയോഗിച്ച് പേജ് സജ്ജീകരിക്കും. ഈ ഉദാഹരണം പിന്തുടരുകയും പൂർത്തിയാക്കുകയും ചെയ്യുന്നതിന്, ഞങ്ങൾ മുമ്പ് ഉയർത്തിയ എല്ലാ പാരാമീറ്ററുകളും പിന്തുടർന്ന് അന്തിമ ഫലമുള്ള പേജ് ഇതായിരിക്കും:

അവസാന പേജ്
ഈ വെബ്‌സൈറ്റ് അതിൻ്റെ ശരിയായ പ്രവർത്തനത്തിനും വിശകലന ആവശ്യങ്ങൾക്കും സ്വന്തം, മൂന്നാം കക്ഷി കുക്കികൾ ഉപയോഗിക്കുന്നു. മൂന്നാം കക്ഷി സ്വകാര്യതാ നയങ്ങളുള്ള മൂന്നാം കക്ഷി വെബ്‌സൈറ്റുകളിലേക്കുള്ള ലിങ്കുകൾ ഇതിൽ അടങ്ങിയിരിക്കുന്നു, അവ ആക്‌സസ്സുചെയ്യുമ്പോൾ നിങ്ങൾ സ്വീകരിക്കുകയോ സ്വീകരിക്കാതിരിക്കുകയോ ചെയ്യാം. അംഗീകരിക്കുക ബട്ടൺ ക്ലിക്കുചെയ്യുന്നതിലൂടെ, ഈ സാങ്കേതികവിദ്യകളുടെ ഉപയോഗവും ഈ ആവശ്യങ്ങൾക്കായി നിങ്ങളുടെ ഡാറ്റയുടെ പ്രോസസ്സിംഗും നിങ്ങൾ അംഗീകരിക്കുന്നു.    കാണുക
സ്വകാര്യത