لذت قرار دادن فایل‌های ویدیویی در طراحی سایت با تگ 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 به عنوان زبان نگارش صفحات وب و به وجود آوردنده بیس یک وب سایت، به سمت استقلال می رود تا بتواند بدون نیاز به زبان های برنامه نویسی مخصوصا جاوااسکریپت نیازهای خود را برطرف کند که این به نوبه خود پیشرفت خوبی محسوب می شود.

 

مشاوره رایگان طراحی سایت

مشاوره طراحی سایت

در صورتی که به دنبال راه اندازی کسب و کار خود در دنیای اینترنت هستید . عدد 21 را به شماره 09107585955 پیامک نمایید یا در لینک زیر فرم درخواست مشاوره را پر نمایید تا مشاوران اینتن با شما در تماس باشند . با اینتن بروز باشید.

بدون نظر
 

پیام بگذارید

(No Ratings Yet)
Loading...