मैं एक HTML5 वीडियो पृष्ठभूमि के साथ एक वेबसाइट बनाना चाहता हूं।
मेरे पास एक छोटी 1080p mp4 क्लिप है जिसे मैं (20s) उपयोग करना चाहता हूं। मैं वीडियो को एक लेटरबॉक्स प्रारूप (5: 2 ish), पृष्ठ सामग्री के पीछे पूर्ण स्क्रीन (उदाहरण के लिए पेपैल की वेबसाइट देखें: https://www.paypal.com/uk/webapps/mpp/home ) पर चलाने का इरादा रखता हूं
इस उद्देश्य के लिए प्रीमियर सीसी में सर्वश्रेष्ठ निर्यात सेटिंग्स क्या होगी?
जवाबों:
आपको विभिन्न ब्राउज़रों के लिए समायोजित करने के लिए कई संस्करणों का निर्यात करना चाहिए। HTML5 के साथ, आप वीडियो के विभिन्न संस्करणों की पेशकश कर सकते हैं और ब्राउज़र स्वचालित रूप से पहले वाले को चुन लेगा जो समर्थित है। उदाहरण के लिए, आपके द्वारा उल्लिखित paypal वेबसाइट के स्रोत कोड पर एक नज़र डालें:
<video autoplay="autoplay" muted="muted" poster="none">
<source src="https://www.paypalobjects.com/webstatic/mktg/wright/videos/send-money.mp4" type="video/mp4">
<source src="https://www.paypalobjects.com/webstatic/mktg/wright/videos/send-money.webm" type="video/webm">
</video>
जैसा कि आप देख सकते हैं, वे एक mp4 (H264 कोडेक) और वीडियो का एक वेब संस्करण दोनों प्रदान करते हैं। वे आपके लिए भी अच्छे विकल्प होंगे।
इसके अलावा, आपको वीडियो को जितना संभव हो उतना छोटा रखने की कोशिश करनी चाहिए, ताकि धीमी इंटरनेट वाले साइट विज़िटर भी इसे देख पाएंगे। उस उद्देश्य के लिए, आपको 1080p के बजाय 720p के साथ वीडियो निर्यात करना चाहिए (कोई भी अंतर नहीं देखेगा, खासकर यदि वीडियो पृष्ठभूमि में है) और 1 Mbit / s से नीचे बिटरेट के लिए लक्ष्य करें। उदाहरण के लिए, पेपाल वीडियो लगभग 700 Kbit / s की बिटरेट का उपयोग करता है। यदि आपको ऑडियो की आवश्यकता नहीं है, तो आप ऑडियो के बिना या कम ऑडियो बिटरेट के साथ निर्यात कर सकते हैं, अर्थात 96 Kbit / s।
आप वेबसाइट से वीडियो को अपने कंप्यूटर पर भी सहेज सकते हैं और कोडेक, बिटरेट और अन्य मापदंडों जैसे कि MediaInfo या इसी तरह के अन्य कार्यक्रमों की जांच कर सकते हैं।
चूँकि यह प्रश्न अभी भी बहुत सारे देखे जा रहे हैं, मैं कुछ अद्यतन जानकारी जोड़ना चाहता था। अब तक, सभी आधुनिक ब्राउज़र MP4 (MPEG-4 / H.264) का समर्थन करते हैं , और एक लंबे समय के लिए किया गया है कि आप अधिकांश परियोजनाओं के लिए केवल MP4 की पेशकश कर रहे हैं। यह सुनिश्चित करने के लिए कि ब्राउजर को चलाने के लिए आपके प्रोजेक्ट की जरूरत के सभी ब्राउजर को प्ले करने के लिए एक ब्राउज़र कॉम्पिटिबिटी टेबल के लिए ऊपर दिए गए लिंक को देखें। ऑडियो ट्रैक के लिए AAC का उपयोग करने का ध्यान रखें, एमपी 3 का नहीं, क्योंकि यह कम ब्राउज़रों द्वारा समर्थित है।
फिर भी, आप पहले के रूप में एक वेबएम वीडियो की पेशकश कर सकते हैं <source>, क्योंकि इसमें बेहतर संपीड़न की सुविधा है, इसलिए सीमित डेटा योजना पर उपयोगकर्ता आपको धन्यवाद देंगे। मैं बस यह जोड़ना चाहता था कि यदि आप डिस्क स्थान के संदर्भ में सीमित हैं, तो समय या कुछ अन्य चर प्रस्तुत करें जो वेबएम को पेश करना मुश्किल बना देता है, MP4 आपको अब तक की आवश्यकता है।
इसके अलावा, चूंकि मेरे मूल उत्तर में ऑडियो के बारे में कुछ शामिल था, एक अतिरिक्त टेकअवे जो कड़ाई से संबंधित नहीं है: ब्राउज़र विक्रेता ऑटोप्ले वीडियो (वीडियो लोड करने के बाद स्वचालित रूप से खेलना शुरू कर देते हैं, जो उपयोगकर्ता की सहभागिता के बिना) शुरू होता है, खासकर यदि वीडियो में ऑडियो शामिल हो । उदाहरण के लिए, सफारी केवल ऑटोप्ले वीडियो की अनुमति देगा यदि वीडियो में कोई ऑडियो ट्रैक नहीं है, या वीडियो मौन है ( <video>तत्व पर संबंधित विशेषता का उपयोग करके )। इसलिए यदि आपको ऑडियो ट्रैक की आवश्यकता नहीं है, तो अपने वीडियो को एक के बिना निर्यात करें (ऑडियो के साथ वीडियो ऑटोप्लेइंग कर रहे हैं, वैसे भी अप्रिय UX हैं)। और अगर आपको ऑडियो की आवश्यकता है, तो ध्यान रखें कि कुछ ब्राउज़र ऑटोप्ले को अवरुद्ध करेंगे, इसलिए पोस्टर विशेषता का उपयोग करके एक प्लेसहोल्डर छवि को शामिल करना सुनिश्चित करें ।
जैसा कि मोरिट्ज़लोस्ट कहते हैं , डाउनस्केल। हो सकता है कि रुचि रखने वाले लोगों के लिए पूर्ण-गुणवत्ता वाले संस्करण में कहीं एक लिंक डालें। लोअर रेज भी क्लाइंट साइड पर संसाधन उपयोग को कम करेगा। यहां तक कि 640p, 576p या यहां तक कि 480p तक की सामग्री के आधार पर, यह कितना अच्छा हो सकता है, और यह आपके पेज के पाठ के पीछे अभी भी दिखाई देगा।
इसके अलावा, जब से आपकी साइट पर आने वाला हर व्यक्ति इस वीडियो को लोड कर रहा है, तो यह सुनिश्चित करने के लिए अतिरिक्त परेशानी उठाने लायक है कि आप जितना हो सके उतना बिटरेट प्रति क्वालिटी निचोड़ लें। Esp। यदि आप वीडियो को बहुत बार बदलने की योजना नहीं बना रहे हैं। H.264 के लिए, इसका मतलब है कि प्रीसेट = , (या 2-पास बिटरेट लक्ष्य) के साथ x264 को दोषरहित स्रोत खिलाना । x264 सबसे अच्छा h.264 एनकोडर है। (विभिन्न h.264 एनकोडर के स्वतंत्र परीक्षण ने इसकी पुष्टि की है।) इसमें वास्तव में बहुत छोटी फ़ाइल बनाने के तरीके खोजने के लिए बहुत सारे एल्गोरिदम हैं, जो कि बहुत अच्छा लगता है, पर्याप्त सीपीयू समय दिया गया है। (और यदि आप इसकी आवश्यकता है तो तेजी से चला सकते हैं, लेकिन इस उपयोग के मामले के लिए सांकेतिक समय वास्तव में प्रासंगिक नहीं है: एक बार सांकेतिक शब्दों में बदलना, MANY बार डाउनलोड और खेलना।)veryslowcrf = 26
जब आपका पृष्ठ लोड हो जाए तो डिफ़ॉल्ट रूप से ऑडियो न चलाएं। उम्मीद है कि समझदार लोग पहले से ही यह जानते हैं, लेकिन मोरिट्ज़लोस्ट ऑडियो के बारे में बात कर रहे थे। ऑटो-प्ले ऑडियो वाले पृष्ठ व्यापक रूप से शिथिल और बुराई के रूप में माने जाते हैं।
यदि आपके पास वीडियो के पूर्ण-गुणवत्ता वाले संस्करण का लिंक है, तो आप उस के साथ ऑडियो भी शामिल कर सकते हैं। उत्कृष्ट ध्वनि करने के लिए AAC स्टीरियो के लिए 96kb / s पर्याप्त है। 64kb / s अभी भी अच्छा लगेगा। (जब तक आप एक खराब एनकोडर का उपयोग नहीं करते, उदाहरण के लिए ffmpeg में कुछ भी libfdk-aac।
पेपाल के वीडियो पर मेरी नज़र थी। (देखें पृष्ठ की जानकारी -> मीडिया -> वीडियो ढूंढें -> इस रूप में सहेजें)।
mediainfo उत्पादन:
General
Complete name : /f/p/home-signup.mp4
Format : MPEG-4
Format profile : Base Media / Version 2
Codec ID : mp42
File size : 10.9 MiB
Duration : 1mn 11s
Overall bit rate : 1 276 Kbps
Movie name : Homepage SignUp - Alan Version
Album/Performer : Sorgel, Chase(AWF)
Composer : Sorgel, Chase(AWF)
Description : This video is about Homepage SignUp - Alan Version
Encoded date : UTC 2014-03-13 16:26:17
Tagged date : UTC 2014-03-13 16:26:29
Writing application : HandBrake 0.9.9 2013051800
Video
ID : 1
Format : AVC
Format/Info : Advanced Video Codec
Format profile : Main@L4.0
Format settings, CABAC : Yes
Format settings, ReFrames : 4 frames
Codec ID : avc1
Codec ID/Info : Advanced Video Coding
Duration : 1mn 11s
Bit rate : 1 273 Kbps
Width : 1 280 pixels
Height : 720 pixels
Display aspect ratio : 16:9
Frame rate mode : Constant
Frame rate : 30.000 fps
Color space : YUV
Chroma subsampling : 4:2:0
Bit depth : 8 bits
Scan type : Progressive
Bits/(Pixel*Frame) : 0.046
Stream size : 10.9 MiB (100%)
Writing library : x264 core 130 r2273 b3065e6
Encoding settings : cabac=1 / ref=1 / deblock=1:0:0 / analyse=0x1:0x111 / me=hex / subme=2 / psy=1 / psy_rd=1.00:0.00 / mixed_ref=0 / me_range=16 / chroma_me=1 / trellis=0 / 8x8dct=0 / cqm=0 / deadzone=21,11 / fast_pskip=1 / chroma_qp_offset=0 / threads=12 / lookahead_threads=4 / sliced_threads=0 / nr=0 / decimate=1 / interlaced=0 / bluray_compat=0 / constrained_intra=0 / bframes=3 / b_pyramid=2 / b_adapt=1 / b_bias=0 / direct=1 / weightb=1 / open_gop=0 / weightp=1 / keyint=300 / keyint_min=30 / scenecut=40 / intra_refresh=0 / rc_lookahead=10 / rc=crf / mbtree=1 / crf=23.0 / qcomp=0.60 / qpmin=0 / qpmax=69 / qpstep=4 / vbv_maxrate=20000 / vbv_bufsize=25000 / crf_max=0.0 / nal_hrd=none / ip_ratio=1.40 / aq=1:1.00
Encoded date : UTC 2014-03-13 16:26:17
Tagged date : UTC 2014-03-13 16:26:29
Color primaries : BT.709
Transfer characteristics : BT.709
Matrix coefficients : BT.709
इसलिए उन्होंने हैंडब्रेक के माध्यम से x264 का उपयोग किया, लेकिन वे एक उपयुक्त सीपीयू-टाइम बनाम दर-विरूपण ट्रेडऑफ़ चुनने पर चूसते हैं। पूर्व निर्धारित की ref=1,me=hex,subme=2तरह लग रहा है veryfast। ( x264 --fullhelpयह देखने के लिए कि प्रत्येक प्रीसेट कैसे भिन्न होता है medium, जो सब कुछ के लिए डिफ़ॉल्ट सेटिंग्स का उपयोग करता है।) सौभाग्य से उनके लिए, डिफ़ॉल्ट crf 23गुणवत्ता सेटिंग उनके उपयोग के मामले के लिए सही है। वे रक्षा कर सकता था मैं 1273kb से एक और 20% बिटरेट लगता था / वे बेहतर सेटिंग्स का उपयोग कर, की तरह से crf23 से मिला रहा है veryslow, या बस mediumया slow।
उन्होंने कुछ पुराने एंड्रॉइड / आईओएस डिवाइसों के साथ कॉम्पिटिटर के लिए खुद को h.264 मेन प्रोफाइल तक सीमित रखने का फैसला किया, जो दुख की बात है कि यह अभी भी एक अच्छा विचार है, मुझे लगता है। ( --profile Main)। वीडियो जो गुणवत्ता के लिए आवश्यकता से अधिक बिटरेट का उपयोग करता है वह एक पालतू जानवर की तरह है, इसलिए यह वास्तव में मुझे गुस्सा दिलाता है कि लोग अभी भी बेसलाइन प्रोफ़ाइल एनकोड वितरित करते हैं। मुख्य प्रोफ़ाइल में 8x8dct का उपयोग नहीं किया जा सकता है, जो काफी हद तक दर्द करता है, लेकिन कम से कम यह 15% बिटरेट बनाम CAVLC को बचाने के लिए CABAC का उपयोग कर सकता है, भले ही पूर्ण रेज / बिटरेट / किसी अन्य सेटिंग्स की परवाह किए बिना।
IDK अगर एचटीएमएल 5 वीडियो के साथ बेसलाइन, मेन और हाई प्रोफाइल स्ट्रीम उपलब्ध है। मुझे पता है कि आपके पास mp4 और webm विकल्प हो सकते हैं, लेकिन वे सिर्फ कंटेनर हैं।
मैं बहुत कुछ उस बात से सहमत हूं जो मोरिट्ज़लोस्ट कह रहा है ।
मैं सिर्फ प्रीमियर समर्थक पर मूल्यों को स्थापित करने में मदद करने के लिए निर्यात विंडो सेटिंग्स के स्क्रीन शॉट को जोड़ना चाहता था।
मैं आमतौर पर निर्यात स्क्रीन को लाने के लिए कमांड-एम (मैक) दबाता हूं और मैं इसे नीचे की तरह देखूंगा।
नोट करने के लिए महत्वपूर्ण सेटिंग बिटरेट सेटिंग्स है, मैं इसे 1Mbps वीबीआर पर सेट करूंगा, और दृश्यों के लिए 2.4 के रूप में उच्च करने की अनुमति देता हूं जो किसी विशेष समय में बहुत अधिक गतिविधि प्राप्त करते हैं।
1 एमबी फ़ाइल आकार के लिए लक्ष्य बनाने का प्रयास करें। (13 सेकंड के लिए पेपैल का सेंडमोनी वीडियो 1.2MB था, कोई ऑडियो नहीं)
