फ्लो इन डिझाइन - लेआउट व आर्टवर्क

01 ते 07

व्हिज्युअल फ्लो म्हणजे काय?

दृष्यप्रवाह पाहता दर्शकांच्या डोळ्यांतून कागदपत्रांद्वारे सर्व महत्वाचे घटक प्रामुख्याने मिळतात, आणि काही दृष्टीकोन सांभाळत नाही किंवा प्रेक्षकांना तुकड्यांच्या अर्थाने गमवावा लागतो. वेब डिझायनर प्रवाहाचा उपयोग करतात हे बाण किंवा नंबरसारखे स्पष्ट प्रवाह मूल्ये वापरणे सर्वात महत्वाचे मार्ग आहे, परंतु इतर प्रकारचे घटक वापरले जाऊ शकतात आणि आपल्या वाचकांना विशिष्ट पथाने हलविण्यास निर्देशित करण्यासाठी वापरले जाऊ शकतात. या ट्यूटोरियल मध्ये आपण आपल्या चांगल्या आणि वाईट प्रवाहाची उदाहरणे दर्शवू आणि डिझाइनमध्ये व्हिज्युअल प्रवाहाचा शब्दसंग्रह शिकण्यास मदत करू शकता.

दृकश्राव्य प्रवाह अनेक प्रकारे साध्य करता येते:

खालील प्रतिमा आपल्याला वेबपृष्ठांवर प्रवाहातील काही सामान्य चुका दर्शवतील आणि त्यांना कसे दुरुस्त करावेत.

02 ते 07

पश्चिम मजकूर प्रवाह डावीकडून उजवीकडे

अयोग्य प्रवाह प्रतिमा सौजन्याने एम Kyrnin

आपण पाश्चात्य भाषेचे वाचन करत असल्यास आपण हा मजकूर वापरत आहात याचा विचार करत आहात की मजकूर डावीकडून उजवीकडे म्हणून, जशी डोके मजकूर ओळीत फिरतात, ती डावीकडून उजवीकडे हलते आहे

वरील चित्रात, धबधबा एक उजवीकडून डावीकडे दिशेने वाहते आहे, आणि धबधबा धबधबा झरा आहे. आम्ही सर्व धबधबा खाली पडणे माहित असल्याने, मजकूर प्रवाह सह पाणी प्रवाह दिशेने एक डिस्कनेक्ट आहे वाचकांचे डोके मजकूर वाचण्यासाठी चुकीच्या दिशेने चालते.

03 पैकी 07

आपला मजकूर प्रतिमा सह फ्लो पाहिजे

योग्य प्रवाह प्रतिमा सौजन्याने एम Kyrnin

या प्रकरणात, प्रतिमा उलट केली गेली आहे जेणेकरून मजकूर त्याच दिशेने पाणी वाहते. सर्व घटक प्रेक्षकांच्या डोळ्याला पाण्याच्या प्रवाहाने आणि मजकूराचा प्रवाह घेऊन जातात.

04 पैकी 07

डावीकडून उजवीकडे उज्वल फास्ट

अयोग्य प्रवाह प्रतिमा सौजन्याने एम Kyrnin

या फोटोतील घोडा उजवीकडून डावीकडे चालत आहे, परंतु मजकूर इंग्रजी आहे आणि त्यामुळे डावीकडून उजवीकडे घोड्यांच्या शर्यतीचा दृश्यास्पद परिणाम संपूर्ण दस्तऐवजाची गती मंद करतो कारण हा मजकूर पेक्षा वेगळा दिशेने जात आहे.

पाश्चात्य संस्कृतींमध्ये, आपली भाषा डावीकडून उजवीकडे जाण्यासाठी, आम्ही डावीकडून उजवीकडे अग्रेषित आणि वेगानं एक दृश्य दिशा निर्देशित केली आहे, तर उजवीकडून डावीकडे अधिक मागे आणि मंद आहेत जेव्हा आपण वेगळ्या अर्थाने लेआउट तयार करता, तेव्हा आपल्याला हे लक्षात ठेवावे लागेल - आणि आपल्या प्रतिमांना त्याच दिशेने टेक्स्ट प्रमाणेच ठेवा.

05 ते 07

धूळ कमी करण्यासाठी दर्शकांच्या डोळाला सक्ती करू नका

योग्य प्रवाह प्रतिमा सौजन्याने एम Kyrnin

जेव्हा घोडा आणि मजकूर दोन्ही एकाच दिशेने जात आहेत, तर निहित गति वाढली आहे.

06 ते 07

वेब फोटोंमधील डोळे पहा

अयोग्य प्रवाह प्रतिमा सौजन्याने ज्योतिर्निन

फोटोंसह बर्याच वेबसाइट्स ही चूक करतात - त्यांनी पृष्ठावर एका व्यक्तीचा फोटो लावला आणि व्यक्ती सामग्रीपासून दूर जात आहे हे अगदी पूर्वीचे डिझाइनमधील About.com वेब डिझाइन साइटवर देखील पाहिले जाऊ शकते.

तुम्ही बघू शकता, माझा फोटो काही मजकूरापुढे ठेवलेला आहे पण मी त्या मजकुराकडे पाहत आहे, मी जवळजवळ माझ्या पाठीकडे वळलो आहे जर आपण त्या ग्रुपमधील दोन लोकांमधील शरीर भाषा पाहिली तर असे समजणे सोपे होईल की मी ज्या व्यक्तीच्या पुढे आहे (या प्रकरणात टेक्स्टचा ब्लॉक) मला आवडत नाही.

बर्याच डोळा ट्रॅकिंग अभ्यासांनी दर्शविले आहे की लोक वेब पृष्ठांवर चेहरे पहायला मिळतात. आणि संबंधित अभ्यासातून असे दिसून आले आहे की चित्रे पाहताना लोक अदृश्यपणे डोळ्यांना अनुसरून पाहतात की चित्र काय पाहत आहे. जर आपल्या साइटवरील एखादा फोटो ब्राउझरच्या काठावरुन दिसत असेल तर तो आपल्या ग्राहकांना दिसेल, आणि नंतर परत बटण दाबा.

07 पैकी 07

कोणतीही छायाचित्रे मध्ये डोळे सामग्री तोंड पाहिजे

योग्य प्रवाह प्रतिमा सौजन्याने ज्योतिर्निन

About.com साठीच्या नवीन डिझाइनमध्ये, फोटो थोडा चांगला आहे आता माझी दृष्टी अधिक अग्रेसर पाहत आहे, आणि एक डावा इशारा आहे जो मी माझ्या डाव्या बाजूला शोधत आहे - जिथे मजकूर आहे.

त्या स्थानासाठी आणखी एक चांगले फोटो असेल जेथे माझ्या कड्यांचा मजकूर दिसेल. परंतु हे प्रथम फोटोपेक्षा बरेच चांगले समाधान आहे. आणि, जिथे प्रतिमा सामग्रीच्या तसेच डाव्या बाजूच्या असेल त्या परिस्थितीसाठी, ही एक चांगली तडजोड असू शकते

लक्षात ठेवा की लोकांच्या चेहऱ्यावरील प्रतिमा सर्वात जास्त लक्ष वेधून घेतात, त्याचप्रमाणे प्राण्यांच्या छायाचित्रांविषयीही हेच सत्य आहे. उदाहरणार्थ, या नमुना लेआउटमध्ये, माझ्या कुत्र्यांकडे बाकी दिसत आहेत, परंतु प्रतिमा योग्य फ्लश आहे. तर ते पृष्ठ बंद होत आहेत. कुत्रीची दिशा बदलली तर हे लेआउट सुधारले जाईल जेणेकरून ते स्क्रीनच्या मध्यभागी बघत असतील.