رشد چشمگير علم طراحي سايت و استفاده از تكنولوژي هاي مختلف در آن با عث شده تا طراحي سايت ، سليقه اي زيادي را بتواند برطرف كند . در اين مقاله قصد داريم تا شما را با نكات استفاده از بك گراند طراحي سايت آشنا كنيم . در ادامه همراه باشيد .
در ادامه به ده نكته استفاده از ويديو در طراحي سايت ميپردازيم :
۱) فايل ويديويي خود را تا جاييكه ميتوانيد فشرده كنيد
زياد بودن حجم ويديوي پس زمينه، زمان بارگذاري سايت را بالا مي‌برد. براي جلوگيري از اين مشكل بايد ويديو را با پايين ترين نرخ بيت فشرده‌سازي كنيد. البته ميتوانيد از ويديو هاي با كيفيت تري نيز استفاده نماييد. ولي نبايد سرعت بارگذاري صفحه را قرباني كيفيت ويديو كنيد. شرايط مورد نظر خود را به خوبي بسنجيد و بهترين فيلم را انتخاب نماييد. در انتخاب حجم ويديو سرعت اينترنت كاربران را نيز در نظر بگيريد.
۲) يك overlay مناسب روي ويديو پياده‌سازي كنيد
ممكن است براي بالا بردن سرعت بارگذاري سايت خود از يك ويديوي با كيفيت پايين استفاده كرده باشيد. در اينصورت از يك overlay براي پنهان كردن كيفيت پايين آن استفاده نماييد.
براي اينكار بايد يك div بعد از تعيين ويديوي خود بياوريد يا اينكه از شبه كلاس ::after استفاده كنيد. با استفاده از خاصيت pointer-events: none; اطمينان حاصل كنيد كه ويديو با كليك راست كاربر متوقف نمي‌شود. استفاده از يك Overlay مناسب باعث مي‌شود تا كيفيت پايين ويديو ديده نشود.
۳) طول ويديو را محدود كنيد
طول ويديو را كم انتخاب كنيد تا بدون توقف نمايش داده شود. البته طول ويديو نبايد به اندازه‌اي كم باشد كه پشت سرهم نمايش داده شده و كاربر را اذيت كند.
بهتر است مدت زمان ويديوي شما بين ۳۰ تا ۴۰ ثانيه باشد. سعي كنيد سايز ويديو نيز از ۲ مگابايت بيشتر نباشد. ميتوانيد ويديو هاي جالبي را از سايت html5backgroundvideo براي اين منظور انتخاب كنيد.
۴)از حركات بيش از اندازه اجتناب كنيد
همانطور كه از نام ويديوهاي پس زمينه بر مي‌آيد، اين ويديوها بايد در پس زمينه‌ي سايت اجرا شوند. به اين معني كه ويديوي انتخابي شما نبايد به گونه‌اي باشد كه توجه كاربر را از محتواي اصلي سايت دور كند. حركت‌هاي سريع و پرش‌هاي مداوم توجه كاربر را به خود جلب مي‌كند.
۵)متن با ويديو هماهنگي داشته باشد
اگر قرار است روي ويديوي پس زمينه متني نمايش داده شود، بايد قابل خواندن باشد. ميتوانيد با استفاده از يك لايه‌ي overlay متن را متمايز كنيد. يا اينكه رنگ متن را تغيير دهيد تا قابل خواندن باشد. مطمئن شويد كه متن و ويديو خيلي با هم متضاد نباشد و چشم كاربر را اذيت نكند.
۶)ابعاد مناسبي را براي ويديو انتخاب كنيد
درCSS3 ويژگي به نام ظرفيت پس زمينه براي تصاوير مطرح مي‌شود كه براي ويديو ها نيز صادق است. به اين معني كه سايز يك تصوير يا ويديوي پس‌زمينه بايد به اندازه‌اي باشد كه جايگاه خود را پر كند. خاصيت object-fit همين كار را براي شما انجام خواهد داد. با استفاده از اين خاصيت ميتوانيد مطمئن شويد كه ابعاد ويديو با ابعاد محلي كه قرار است در آن قرار بگيرد، همخواني دارد.
۷) ديوايس‌هاي كاربران را در نظر بگيريد
پس زمينه‌هاي ويديويي اغلب مورد پسند كاربران قرار مي‌گيرد. با اين وجود ممكن است اين ويديوها روي برخي از دستگاه‌ها اجرا نشود. براي همين بايد شرايطي را در نظر بگيريم كه دستگاه‌هاي مختلف قادر به پخش ويديوي شما باشند. معمولا طراحان عكسي را به صورت پيش فرض در نظر مي‌گيرند تا در صورتي كه فيلم قابل نمايش نباشد براي كاربر نماي داده شود.
۸) ويديو در يك حلقه نشان داده نشود
اگر ويژگي حلقه را در طراحي سايت خود در نظر بگيريد، ويديوي پس زمينه‌ي شما تا زمانيكه صفحه را نبسته‌ايد، پشت سر هم نمايش داده خواهد شد. اين كار به سي پي يو ديوايس كاربر آسيب مي‌زند و حتي ممكن است سرعت صفحات ديگر را پايين بياورد.
براي رفع اين مشكل ميتوانيد از يك قطعه كد كوتاه و ساده براي توقف ويديو استفاده كنيد. در واقع ويديو بعد از چندين بار كه نمايش داده مي‌شود، متوقف مي‌شود.
۹) يك دكمه مكث براي ويديو در نظر بگيريد
ممكن است كاربر بخواهد ويديوي در حال پخش را متوقف كند. براي پشتيباني از اين حالت ميتوانيد با استفاده از جاوا اسكريپت يك دكمه‌ي مكث / نمايش را به ويديوي خود اضافه كنيد و محل اين دكمه را بر اساس خواست خود تغيير دهيد.
۱۰) ابتداي فيلم را آهسته انتخاب كنيد
ويديو بايد به گونه‌اي باشد كه حواس كاربر را پرت نكند. يك حركت ناگهاني در ابتداي نمايش فيلم باعث مي‌شود تا كاربر محتواي اصلي سايت را نبيند! براي جلوگيري از اين مشكل ميتوانيد ويديويي انتخاب كنيد كه شروع آرامي داشته باشد يا اينكه از تكنيك محو شدن براي ابتداي فيلم استفاده كنيد.
نياز به طراحي سايت داريد ؟ قبل از آن با شماره تلفن هاي بالاي سايت تماس بگيريد و يا با مراجعه به صفحه تماس با ما شركت درخواست مشاوره كنيد . همچنين با رفتن به صفحه ثبت سفارش ميتوانيد سفارش خود را ثبت كرده تامشاورين سارين وب با شما تماس بگيرند .
طراحي سايت ، سئو و بهينه سازي سايت خود را با سارين وب تجربه كنيد .
رشد چشمگير علم طراحي سايت و استفاده از تكنولوژي هاي مختلف در آن با عث شده تا طراحي سايت ، سليقه اي زيادي را بتواند برطرف كند . در اين مقاله قصد داريم تا شما را با نكات استفاده از بك گراند طراحي سايت آشنا كنيم . در ادامه همراه باشيد .
در ادامه به ده نكته استفاده از ويديو در طراحي سايت ميپردازيم :
۱) فايل ويديويي خود را تا جاييكه ميتوانيد فشرده كنيد
زياد بودن حجم ويديوي پس زمينه، زمان بارگذاري سايت را بالا مي‌برد. براي جلوگيري از اين مشكل بايد ويديو را با پايين ترين نرخ بيت فشرده‌سازي كنيد. البته ميتوانيد از ويديو هاي با كيفيت تري نيز استفاده نماييد. ولي نبايد سرعت بارگذاري صفحه را قرباني كيفيت ويديو كنيد. شرايط مورد نظر خود را به خوبي بسنجيد و بهترين فيلم را انتخاب نماييد. در انتخاب حجم ويديو سرعت اينترنت كاربران را نيز در نظر بگيريد.
۲) يك overlay مناسب روي ويديو پياده‌سازي كنيد
ممكن است براي بالا بردن سرعت بارگذاري سايت خود از يك ويديوي با كيفيت پايين استفاده كرده باشيد. در اينصورت از يك overlay براي پنهان كردن كيفيت پايين آن استفاده نماييد.
براي اينكار بايد يك div بعد از تعيين ويديوي خود بياوريد يا اينكه از شبه كلاس ::after استفاده كنيد. با استفاده از خاصيت pointer-events: none; اطمينان حاصل كنيد كه ويديو با كليك راست كاربر متوقف نمي‌شود. استفاده از يك Overlay مناسب باعث مي‌شود تا كيفيت پايين ويديو ديده نشود.
۳) طول ويديو را محدود كنيد
طول ويديو را كم انتخاب كنيد تا بدون توقف نمايش داده شود. البته طول ويديو نبايد به اندازه‌اي كم باشد كه پشت سرهم نمايش داده شده و كاربر را اذيت كند.
بهتر است مدت زمان ويديوي شما بين ۳۰ تا ۴۰ ثانيه باشد. سعي كنيد سايز ويديو نيز از ۲ مگابايت بيشتر نباشد. ميتوانيد ويديو هاي جالبي را از سايت html5backgroundvideo براي اين منظور انتخاب كنيد.
۴)از حركات بيش از اندازه اجتناب كنيد
همانطور كه از نام ويديوهاي پس زمينه بر مي‌آيد، اين ويديوها بايد در پس زمينه‌ي سايت اجرا شوند. به اين معني كه ويديوي انتخابي شما نبايد به گونه‌اي باشد كه توجه كاربر را از محتواي اصلي سايت دور كند. حركت‌هاي سريع و پرش‌هاي مداوم توجه كاربر را به خود جلب مي‌كند.
۵)متن با ويديو هماهنگي داشته باشد
اگر قرار است روي ويديوي پس زمينه متني نمايش داده شود، بايد قابل خواندن باشد. ميتوانيد با استفاده از يك لايه‌ي overlay متن را متمايز كنيد. يا اينكه رنگ متن را تغيير دهيد تا قابل خواندن باشد. مطمئن شويد كه متن و ويديو خيلي با هم متضاد نباشد و چشم كاربر را اذيت نكند.
۶)ابعاد مناسبي را براي ويديو انتخاب كنيد
درCSS3 ويژگي به نام ظرفيت پس زمينه براي تصاوير مطرح مي‌شود كه براي ويديو ها نيز صادق است. به اين معني كه سايز يك تصوير يا ويديوي پس‌زمينه بايد به اندازه‌اي باشد كه جايگاه خود را پر كند. خاصيت object-fit همين كار را براي شما انجام خواهد داد. با استفاده از اين خاصيت ميتوانيد مطمئن شويد كه ابعاد ويديو با ابعاد محلي كه قرار است در آن قرار بگيرد، همخواني دارد.
۷) ديوايس‌هاي كاربران را در نظر بگيريد
پس زمينه‌هاي ويديويي اغلب مورد پسند كاربران قرار مي‌گيرد. با اين وجود ممكن است اين ويديوها روي برخي از دستگاه‌ها اجرا نشود. براي همين بايد شرايطي را در نظر بگيريم كه دستگاه‌هاي مختلف قادر به پخش ويديوي شما باشند. معمولا طراحان عكسي را به صورت پيش فرض در نظر مي‌گيرند تا در صورتي كه فيلم قابل نمايش نباشد براي كاربر نماي داده شود.
۸) ويديو در يك حلقه نشان داده نشود
اگر ويژگي حلقه را در طراحي سايت خود در نظر بگيريد، ويديوي پس زمينه‌ي شما تا زمانيكه صفحه را نبسته‌ايد، پشت سر هم نمايش داده خواهد شد. اين كار به سي پي يو ديوايس كاربر آسيب مي‌زند و حتي ممكن است سرعت صفحات ديگر را پايين بياورد.
براي رفع اين مشكل ميتوانيد از يك قطعه كد كوتاه و ساده براي توقف ويديو استفاده كنيد. در واقع ويديو بعد از چندين بار كه نمايش داده مي‌شود، متوقف مي‌شود.
۹) يك دكمه مكث براي ويديو در نظر بگيريد
ممكن است كاربر بخواهد ويديوي در حال پخش را متوقف كند. براي پشتيباني از اين حالت ميتوانيد با استفاده از جاوا اسكريپت يك دكمه‌ي مكث / نمايش را به ويديوي خود اضافه كنيد و محل اين دكمه را بر اساس خواست خود تغيير دهيد.
۱۰) ابتداي فيلم را آهسته انتخاب كنيد
ويديو بايد به گونه‌اي باشد كه حواس كاربر را پرت نكند. يك حركت ناگهاني در ابتداي نمايش فيلم باعث مي‌شود تا كاربر محتواي اصلي سايت را نبيند! براي جلوگيري از اين مشكل ميتوانيد ويديويي انتخاب كنيد كه شروع آرامي داشته باشد يا اينكه از تكنيك محو شدن براي ابتداي فيلم استفاده كنيد.
نياز به طراحي سايت داريد ؟ قبل از آن با شماره تلفن هاي بالاي سايت تماس بگيريد و يا با مراجعه به صفحه تماس با ما شركت درخواست مشاوره كنيد . همچنين با رفتن به صفحه ثبت سفارش ميتوانيد سفارش خود را ثبت كرده تامشاورين سارين وب با شما تماس بگيرند .
طراحي سايت ، سئو و بهينه سازي سايت خود را با سارين وب تجربه كنيد .
بزرگترين دوراهي كه در سئو وجود دارد را بشناسيد