07 ൽ 01
എന്താണ് വിഷ്വൽ ഫ്ളോ?
എല്ലാ പ്രധാനപ്പെട്ട ഘടകങ്ങൾക്കും പ്രാധാന്യം നൽകുന്ന വിധത്തിൽ കാഴ്ചാ പ്രേക്ഷകന്റെ കണ്ണിലൂടെ ദൃശ്യപ്രകാശ പ്രവണതകൾ വഹിക്കുന്നു, കൂടാതെ ഒന്നും ദർശനത്തെ തടസ്സപ്പെടുത്തുന്നില്ല അല്ലെങ്കിൽ കാഴ്ചക്കാരനെ കഷണം നഷ്ടപ്പെടുത്തുന്നു. അമ്പുകൾ അല്ലെങ്കിൽ അക്കങ്ങൾ പോലെയുള്ള വ്യക്തമായ ഒഴുക്ക് ഘടകങ്ങൾ ഉപയോഗിക്കുന്നത് വെബ് രൂപകൽപ്പകർ ഒഴുകുന്ന ഏറ്റവും സാധാരണ രീതിയാണ്, എന്നാൽ ഒരു പ്രത്യേക പാതയിലൂടെ നീങ്ങാൻ നിങ്ങളുടെ വായനക്കാരെ നയിക്കാൻ ഉപയോഗിക്കാവുന്ന മറ്റ് തെറ്റായ ഘടകങ്ങളുണ്ട്. ഈ ട്യൂട്ടോറിയലിലെ പടികൾ നിങ്ങൾക്ക് നല്ലതും മോശവുമായ ഒഴുക്കിന്റെ ഉദാഹരണങ്ങൾ കാണിക്കുകയും ഡിസൈനിലെ വിഷ്വൽ ഫ്ലോകളുടെ പദാവലി പഠിക്കാൻ സഹായിക്കുകയും ചെയ്യും.
പല വഴികളിലൂടെ ദൃശ്യപ്രവാഹം കൈവരിക്കാൻ കഴിയും:
- അമ്പടയാളങ്ങൾ
- തുടർച്ചയായ ചിത്രങ്ങൾ അല്ലെങ്കിൽ വാചക ഘടകങ്ങൾ
- കാഴ്ചപ്പാട്
- ഗ്രേഡിംഗ്സ്
- വലിപ്പം മാറ്റുന്നു
- കർവുകൾ
- ചിത്രങ്ങളിൽ ചലനം
- മുഖങ്ങൾ - പ്രത്യേകിച്ച് കണ്ണുകൾ
വെബ് പേജുകളിൽ ഒഴിയുന്ന ചില പിഴവുകളും അവ തിരുത്തിയെഴുതുന്ന താഴെ കാണിക്കുന്ന ചിത്രങ്ങളും നിങ്ങളെ കാണിക്കും.
07/07
പാശ്ചാത്യ പാഠം ഇടത്ത് നിന്ന് വലത്തേക്ക് ഒഴുകുന്നു
നിങ്ങൾ ഒരു പാശ്ചാത്യ ഭാഷ വായിച്ച് വളർന്നിട്ടുണ്ടെങ്കിൽ, ആ വാചകം ഇടത് നിന്ന് വലത്തേയ്ക്ക് നീങ്ങണം എന്ന് ചിന്തിക്കുകയാണ്. ടെക്സ്റ്റ് വരിയിൽ കണ്ണ് നീങ്ങുമ്പോൾ അത് ഇടതു നിന്നും വലത്തേയ്ക്ക് നീങ്ങുന്നു.
മുകളിലുള്ള ചിത്രത്തിൽ വെള്ളച്ചാട്ടം ഇടതുവശത്തേക്കുള്ള വലതുവശത്ത് ഒഴുകുന്നു. വെള്ളച്ചാട്ടത്തിന്റെ ടെക്സ്റ്റ് ഒഴുകുന്നു. വെള്ളച്ചാട്ടങ്ങൾ താഴേക്കിറങ്ങാമെന്ന് നമുക്കെല്ലാവർക്കും അറിയാമെങ്കിൽ, വാചകത്തിന്റെ ഒഴുക്കിനൊപ്പം വെള്ളത്തിന്റെ ഒഴുക്കിനെ തടസ്സപ്പെടുത്തുകയും ചെയ്യുന്നു. വായനക്കാരൻറെ കണ്ണുകൾ വായനയുടെ തെറ്റായ ദിശയിലേക്ക് നീങ്ങുന്നു.
07 ൽ 03
നിങ്ങളുടെ വാചകം ഇമേജുകൾ ഉപയോഗിച്ച് ഫ്ളോ ചെയ്യുക
ഈ സാഹചര്യത്തിൽ, ചിത്രം അതേപടി മാറ്റി, അതിനാൽ വാചകം വെള്ളം അതേ ദിശയിൽ ഒഴുകുന്നു. എല്ലാ ഘടകങ്ങളും കാഴ്ചക്കാരന്റെ കണ്ണിലൂടെ വെള്ളത്തിന്റെ ഒഴുക്കിനേയും വാചകത്തിന്റെ ഒഴുക്കിനേയും നയിക്കുന്നു.
04 ൽ 07
ഇടത് നിന്ന് വലത് സമം സമം
ഈ ഫോട്ടോയിലെ കുതിര വലത്തു നിന്ന് ഇടത്തോട്ട് പ്രവർത്തിക്കുന്നു, എന്നാൽ ടെക്സ്റ്റ് ഇംഗ്ലീഷാണ്, വലതുവശത്ത് ഇടത്. കുതിരയെ ഒരു ദിശയിലേക്ക് വീക്ഷിക്കുന്ന ദൃശ്യപ്രഭാവം മുഴുവൻ രേഖയുടെയും വേഗത കുറയ്ക്കുന്നു, കാരണം ഇത് ടെക്സ്റ്റിനേക്കാൾ വ്യത്യസ്ത ദിശയിലാണ്.
പാശ്ചാത്യ സംസ്കാരങ്ങളിൽ, നമ്മുടെ ഭാഷകൾ ഇടതുവശത്ത് നീങ്ങുന്നു, ഇടത് വശത്ത് നിന്ന് വലതുവശത്തേക്ക് വലതുവശത്തേക്ക് വലതു വശത്തേക്കും വലതുവശത്തേക്കും ഇടത്തേക്കും വലതുവശത്തേക്കും വലതു വശത്തേക്കും വലതുവശത്തേക്കും നയിക്കാൻ ഞങ്ങൾ എത്തിയിരിക്കുന്നു. വേഗതയുടെ ഉച്ചാരണം കൊണ്ട് നിങ്ങൾ ഒരു ലേഔട്ട് സൃഷ്ടിക്കുമ്പോൾ, നിങ്ങൾ ഇത് ഓർമ്മിക്കുകയും - നിങ്ങളുടെ ചിത്രങ്ങൾ ടെക്സ്റ്റായി അതേ ദിശയിലേക്ക് നീക്കുകയും വേണം.
07/05
കാഴ്ചക്കാരന്റെ കണ്ണിയെ പതുക്കെ താഴെയിറാൻ നിർബന്ധിക്കരുത്
കുതിരയും വാചകവും ഒരേ ദിശയിൽ പോകുമ്പോൾ, സൂചിപ്പിച്ച വേഗത വർദ്ധിക്കുന്നു.
07 ൽ 06
വെബ് ഫോട്ടോകളിലെ കണ്ണുകൾ കാണുക
ഫോട്ടോകളുമായി നിരവധി വെബ്സൈറ്റുകൾ ഈ തെറ്റ് ചെയ്യുന്നു - അവർ പേജിൽ ഒരു വ്യക്തിയുടെ ഒരു ഫോട്ടോ വെച്ചു, ആ വ്യക്തി ഉള്ളടക്കത്തിൽ നിന്ന് നോക്കുന്നു. ഇത് പഴയ ഡിസൈനിലുള്ള powered by വെബ് ഡിസൈൻ സൈറ്റിലും കാണാവുന്നതാണ്.
നിങ്ങൾക്ക് കാണാനാകുന്നതുപോലെ എന്റെ ഫോട്ടോ ചില വാചകത്തിന് അടുത്തായി സ്ഥാപിക്കുന്നു. പക്ഷേ, ആ പാഠത്തിൽ നിന്ന് ഞാൻ നോക്കുന്നു, എനിക്ക് ഏതാണ്ട് എന്റെ പിറകുവശമുണ്ട്. ഒരു ഗ്രൂപ്പിലെ രണ്ട് ആളുകൾക്കിടയിൽ നിങ്ങൾ ആ ശരീരം ഭാഷ കണ്ടെങ്കിൽ, ഞാൻ അടുത്ത വ്യക്തിയായതിനാൽ (ഈ സന്ദർഭത്തിൽ ബ്ലോക്ക് വാചകം) എനിക്ക് ഇഷ്ടപ്പെടുന്നില്ലെന്ന് ഊഹിക്കാൻ എളുപ്പമായിരിക്കും.
വെബ് പേജുകളിൽ ആളുകൾ മുഖം കാണുന്നത് പല കണ്ണുകൾ പരിശോധിക്കുന്ന പഠനങ്ങളും. ചിത്രങ്ങളെ നോക്കുമ്പോൾ ജനങ്ങൾ അബോധപൂർവ്വം കണ്ണുകൾ പിന്തുടരുന്നുവെന്നാണ് ചിത്രം കാണുന്നത്. നിങ്ങളുടെ സൈറ്റിലെ ഒരു ഫോട്ടോ ബ്രൗസറിന്റെ അഗ്രം പരിശോധിക്കുകയാണെങ്കിൽ, നിങ്ങളുടെ കസ്റ്റമർമാർ എവിടെയാണെന്ന് നോക്കാം, തുടർന്ന് ബാക്ക് ബട്ടൺ അമർത്തുക.
07 ൽ 07
ഏതെങ്കിലും ഫോട്ടോയിലെ കണ്ണുകൾ ഉള്ളടക്കം ദൃശ്യമാകണം
About.com പുതിയ ഡിസൈൻ, ഫോട്ടോ അല്പം മെച്ചപ്പെട്ടതാണ്. ഇപ്പോൾ എന്റെ കണ്ണുകൾ കൂടുതൽ മുന്നോട്ട് നോക്കുന്നു, എന്റെ ഇടതുവശത്തേക്ക് നോക്കുന്ന ഒരു ചെറിയ സൂചനയുണ്ട് - എവിടെയാണ് ടെക്സ്റ്റ് എന്ന്.
ആ സ്ഥാനത്തിനുള്ള മെച്ചപ്പെട്ട ഫോട്ടോയും എന്റെ തോളും ടെക്സ്റ്റിലേക്ക് ആകർഷിക്കപ്പെടും. എന്നാൽ ഇത് ആദ്യത്തെ ഫോട്ടോയേക്കാൾ വളരെ മികച്ച ഒരു പരിഹാരമാണ്. ചിത്രത്തിന്റെ ഉള്ളടക്കത്തിലും ഇടതുവശത്തും ചിത്രമെടുക്കുന്ന സാഹചര്യങ്ങൾക്ക് ഇത് നല്ല അനുരഞ്ജനമായിരിക്കും.
ജനങ്ങളുടെ മുഖചിത്രങ്ങൾ ഏറ്റവും ശ്രദ്ധ ആകർഷിക്കുന്ന സമയത്ത്, മൃഗങ്ങളുടെ ഫോട്ടോകളിൽ ഇത് സത്യമാണ്. ഉദാഹരണത്തിന്, ഈ സാമ്പിൾ ലേഔട്ടിൽ, എനിക്ക് എന്റെ പട്ടികൾ അവശേഷിക്കുന്നു, എന്നാൽ ചിത്രം നന്നായി ഫ്ലഷ് ആണ്. അതിനാല് അവര് ആ പേജ് നോക്കുന്നു. ഞാൻ നായ്ക്കളുടെ ദിശ മാറ്റിയാൽ ഈ ലേഔട്ട് മെച്ചപ്പെടുത്തും, അതുവഴി അവർ സ്ക്രീനിന്റെ മധ്യഭാഗത്തേക്ക് നോക്കുകയാണ്.