لذت قرار دادن فایل‌های ویدیویی در طراحی سایت با تگ video

به لطف بالا رفتن پهنای باند اینترنت در سراسر دنیا و عم وجود مشکل طولانی شدن زمان بارگذاری سایت (loading time) ، استفاده از فایل های چند رسانه ای در طراحی سایت امروز تبدیل به امری مرسوم شده است. در بسیاری از طراحی وب سایت های امروزی تصاویر با کیفیت و رزولوشن بالایی بارگزاری می شوند که سبب شده تا پروژه ها علاوه بر قدرتمندی از لحاظ بهره بری از نرم افزارهای تحت وب، از جنبه ظاهری نیز چشم نوازی خاصی داشته باشند.
اما با گذر زمان پهنای باند به اندازه ای رسیده که نوبت به متداول شدن قرار دادن ویدیو در سایت برسد.

روش های قرار دادن ویدیو در طراحی سایت

بعد از افزایش محبوبیت فایل های چندرسانه امروز ابزارها زیادی بدین منظور توسط توسعه دهندگان برای استفاده سریعتر و راحت تر از آن ها ایجاد شده است. به عنوان نمونه برای قرار دادن یک عکس، تغییر اندازه و همچنین دادن شکل و شمایلی خاص به آن و همچنین لینک دار کردن آن و… نیازمند نوشتن چندین خط کد برای تفهیم به مرورگر برای نمایش صحیح هستید. در نظر داشته باشید دردسرهای قرار دادن یک فایل ویدیویی از این نیز بیشتر است.

screen-shot-2013-07-11-at-10-18-30-am
برای سیستم های مدیریت محتوای معروفی همچون جوملا و وردپرس ابزارهای رایگانی برای قرار دادن ویدیو در دسترس هستند که در ادامه به معرفی آن ها خواهیم پرداخت. اما پیش از آن اجازه دهید نحوه استفاده از ویدیو به روشی استاندارد و قابل استفاده در تمامی سیستم ها فارغ از نوعشان را بررسی کنیم.
۳ راه توسعه بلاگ در طراحی سایت برای جذب ترافیک

معرفی تگ ویدیو <video>

HTML نسخه ۵ ویژگی های زیادی در مقایسه با نسخه قبلی به خود دید که از جمله مهمترین آن ها می توان به تگ ویدیو و آئودیو اشاره کرد که قرار دادن فایل های این چنینی را به نوشتن چند خط کوتاه کد خلاصه کرد. پیشتر برای قرار دادن فایل های ویدئویی باید دست به گریبان چندین خط کد شاید پچیده جاوااسکریپت می شدیم اما اکنون به سادگی می توان فایل ویدئویی خود را در هر گوشه کناری از وب سایت قرار داد. به کد نوشته شده زیر توجه کنید:
<video width=”400″ controls>
<source src=”mov_bbb.mp4″ type=”video/mp4″>
<source src=”mov_bbb.ogg” type=”video/ogg”>
Your browser does not support HTML5 video.
</video>

همانند بسیاری دیگر این مورد نیز یک تگ شروع شونده و همچنن یک تگ پایانی دارد که بقیه اجزا بین آن دو قرار میگیرند. برای قرار دادن ویدیو خود نیازمند یک تگ source هستید. خوشبختانه این قابلیت وجود دارد که دو آدرس با دو پسوند برای ویدیو خود قرار دهید تا اگر به هر دلیل مورد اول نمایش داده نشد به راحتی با استفاده از لینک دوم فایل به تصویر کشیده شود.
مراقب ارتباط قدرتمند میان طراحی سایت و سئو باشید!

رفته رفته HTML و CSS به عنوان زبان نگارش صفحات وب و به وجود آوردنده بیس یک وب سایت، به سمت استقلال می رود تا بتواند بدون نیاز به زبان های برنامه نویسی مخصوصا جاوااسکریپت نیازهای خود را برطرف کند که این به نوبه خود پیشرفت خوبی محسوب می شود.

لذت قرار دادن فایل‌های ویدیویی در طراحی سایت با تگ video

hadi sharifi ۰ ۰
ارسال نظر آزاد است، اما اگر قبلا در بیان ثبت نام کرده اید می توانید ابتدا وارد شوید.
شما میتوانید از این تگهای html استفاده کنید:
<b> یا <strong>، <em> یا <i>، <u>، <strike> یا <s>، <sup>، <sub>، <blockquote>، <code>، <pre>، <hr>، <br>، <p>، <a href="" title="">، <span style="">، <div align="">
تجدید کد امنیتی
طراحی سایت ، بهینه سازی سایت و طراحی وب سایت
طراح قالب : عرفـــ ـــان قدرت گرفته از بلاگ بیان