نحوه متحرک ساختن متن با تگ marquee در HTML

در گستره تگ های وب (HTML)، بعضا به مواردی برمی خوریم که علی رغم کارایی و به اصطلاح کار راه انداز بودن، توسط کنسرسیوم جهانی وب یا W3C، غیراستاندارد ارزیابی شده اند، یکی از این موارد که مخصوصا در بین کاربران ایرانی بسیار مورد استفاده قرار می گیرد، تگ متحرک سازی متون در صفحات HTML یا Marquee است، مثلا در وبلاگ ها و سایت های مختلف برای به حرکت درآوردن لیستی از لینک ها در باکس های کناری یا نمایش عناوین اخبار و آخرین مطالب به صورت اسکرول افقی و خیلی ایده های جالب دیگر، از Marquee استفاده می شود، از اینرو با وجود غیر استاندارد بودن این تگ، ولی به جهت کاربرد بسیارش، قصد داریم در این آموزش به آن بپردازیم.

تگ marquee چیست و چه کاربردی دارد؟

marquee نام تگی است که اولین بار توسط مرورگر اینترنت اکسپلورر (Internet Explorer) معرفی شد، این تگ با هدف متحرک سازی متن، تصویر و... در صفحات HTML به صورت های مختلف، از جمله اسکرول در جهت عمودی، افقی، چپ و راست، با قابلیت تنظیم سرعت، رنگ و برخی ویژگی های دیگر ارائه گردید و در حال حاضر توسط اکثر مرورگرهای وب به خوبی پشتیبانی می شود، برخی آن را با تگ مشابه blink مقایسه می کنند که البته marquee با blink تفاوتهای زیادی دارد، چرا که از تگ blink صرفا جهت ایجاد متون و لینک های چشمک زن استفاده می شود، اما تگ marquee، گستره استفاده وسیع تری دارد و برای اسکرول متن یا تصویر با قابلیت های بیشتر، کاربرد دارد؛ با این وجود کنسرسیوم جهانی وب W3C، به دلایلی توصیه می کند که از آن در طراحی صفحات وب، استفاده نشود که خود جای تامل دارد.

نحوه قرار دادن جستجوی گوگل در سایت یا وبلاگ

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

پرس و جو از سرور گوگل

نحوه درج علامت های خاص در HTML

شاید تا به حال پیش آمده باشد که بخواهید حرف یا کاراکتر خاصی را در صفحات وب و کدهای HTML درج کنید ولی با وجود جستجو و دقت در صفحه کلید یا آزمون و خطای ترکیب کلید های مختلف، به نتیجه مورد نظر نرسیده باشید، به طور مثال علائمی مانند ©، ®، ♥، ♦، ← و... معمولا به صورت عادی در صفحه کلید دیده نمی شوند و برای درج آنها باید از ترفندهایی که در ادامه خواهیم دید استفاده نمائیم، البته این ترفندها نیز خود متکی بر ترکیب کلیدهای مختلف یا بر اساس کدهای عددی و حروفی استاندارد هستند که در ادامه با آنها بیشتر آشنا خواهیم شد.

استاندارد مرورگرهای وب

نحوه ایجاد لینک در HTML

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

ایجاد لینک با تگ a و href

اموزش نحوه قرار دادن آهنگ و موسیقی پس زمینه در وبلاگ و سایت

قرار دادن آهنگ و موسیقی پس زمینه در صفحات وب (وبلاگ و سایت) یکی از مرسوم ترین کارهایی است که معمولا مدیران وبلاگ ها و بعضا مدیران وبسایت ها انجام می دهند، البته آنهایی که در این رابطه تازه وارد تر هستند بیشتر ترجیح می دهند که از ابزار های رایگان وب استفاده کنند تا اینکه خود دست به کار شوند؛ از طرفی کاربران حرفه ای تر همیشه دوست دارند که کمترین وابستگی به سایت ها و ابزارهای سوم شخص (third party) داشته باشند، چون معمولا همراه ابزار، لینک ها و کدهای پنهان و تبلیغاتی نیز قرار دارد و حتی برخی اوقات تعداد زیاد این ابزارها در بارگذاری صفحه نیز اختلال ایجاد می کنند، به همین خاطر در این مطلب قصد داریم آموزش نحوه قرار دادن آهنگ و موسیقی پس زمینه در وبلاگ و سایت را به چند روش توضیح دهیم.

برای پخش یک آهنگ در صفحات وب در مجموع تقریبا دو راه وجود دارد:

- پخش آهنگ با کدهای ساده html و بدون استفاده از پلاگین و کدی اضافه.

- پخش آهنگ با پلاگین و کدهای جاوا اسکریپت یا فلش.

هر کدام از روش هایی که در بالا گفته شد دارای معایب و محاسنی هستند، پخش آهنگ بدون پلاگین و تنها با استفاده از کدها و تگ های ساده html اگرچه خیلی راحت تر و سریع تر است، اما متاسفانه مشکل سازگاری با برخی مرورگرها هنوز حل نشده باقی مانده و البته گویا در نسخه بعدی html یعنی HTML 5، قرار است  این مشکلات با استانداردسازی فرمت ها حل شود؛ روش پخش با استفاده از پلاگین اگرچه معمولا مشکل سازگاری با مرورگرها را حل می کند، اما به دلیل نیاز به بارگذاری عناصری مثل کد جاوا اسکریپت، فلش و... ممکن است برای همه به راحتی قابل استفاده نباشد، البته مشکل در حدی نیست که از آن صرف نظر کنیم؛ در این آموزش سعی می کنیم هر دو روش را توضیح دهیم و انتخاب را به خودتان واگذار می کنیم.

پخش آهنگ با تگ embed در html

کاربرد متاتگ refresh در صفحات وب (HTML)

همانطور که می دانیم، صفحات وب از استاندارد خاصی تحت عنوان کدهای HTML یا (HyperText Markup Language) پیروی می کنند، بدین معنی که فارغ از اینکه به چه زبان سمت سروری برنامه نویسی کنید، حاصل کار در وب، به صورت کدهای html نمایان خواهد شد، از طرفی گاهی مواقع به دلایل مختلف دسترسی به سرور محدود شده یا امکان پذیر نیست و برای اعمال دستورات و سلایق خود ناچاریم تنها دست به دامن این کدها شویم، نمود بارز این موضوع در سرویس های مدیریت وبلاگ خودنمائی می کند؛ مثلا اگر بخواهید کاربران را از وبلاگ قدیمی خود به وبلاگی جدید به صورت خودکار هدایت کنید، باید از متاتگی به نام رفرش (refresh) استفاده کنید که در این مطلب می خواهیم به تفصیل در رابطه با آن صحبت کنیم.

متاتگ refresh چیست؟

چگونه در وبلاگ و سایت، لینک دانلود قرار دهیم؟

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

استفاده از برنامه های فشرده ساز فایل

گام اول برای قرار دادن لینک جهت دانلود، فشرده کردن فایل مورد نظر است، البته این کار همیشه هم ضروری نیست، اما برای برخی از فایل ها انجام آن اجباری است، چرا که مرورگرها در حالت عادی نسبت به اجرای برخی از فایل ها در بستر خود اصرار دارند، مثلا اگر فایلی با پسوند mp3 داشته باشید و بخواهید آن را به صورت مستقیم دانلود کنید، با کلیک بر روی لینک دانلود، به جای ظاهر شدن پنجره دانلود، مرورگر تلاش می کند که آهنگ را در صفحه بارگذاری کند، البته راه حل این موضوع معمولا استفاده از گزینه موجود در کلیک راست (save target as) است؛ اما فشرده کردن یک فایل با فرمت zip یا rar می تواند از بروز این نوع مشکلات جلوگیری کند؛ این کار را با برنامه هایی نظیر winrar یا خود ویندوز انجام دهید.

چرا و چگونه از DOCTYPE در HTML استفاده کنیم؟

آیا تا به حال در مورد سایت یا وبلاگ خود به مشکلاتی حل نشدنی برخورده اید که با وجود صرف ساعت ها وقت و انرژی نتوانسته باشید آنها را حل کنید؟ البته که در بیشتر موارد این چنین بوده، صرف نظر از اینکه یک برنامه نویس با تجربه یا یک کاربر عادی وب باشیم، همه به نوعی با این نوع مشکلات روبرو شده ایم و کماکان می شویم، برخی از این مسائل به دلایلی مثل خطا در کدنویسی یا جا انداختن تگ ها به فرض در ترسیم یک جدول (table) ممکن است رخ دهند، یا گاهی خطا در کدهای جاوا اسکریپت، تنظیمات نادرست خاصیت ها در css، خطاهای سرور و... ممکن است باعث ایجاد اختلال در عملکرد مورد انتظار سایت یا وبلاگمان شود، اما از همه اینها گذشته یک مورد به ظاهر ساده اما بعضا دردسرساز را هم نباید از قلم انداخت و آن دستور <DOCTYPE> در صفحات html است، این یادداشت نگاهی خواهد داشت به چرایی و چگونگی استفاده از این دستور در صفحات وب.

دستور DOCTYPE چیست؟

پیش از هر چیز بد نیست تعریفی از این دستور داشته باشیم، دستور DOCTYPE در واقع جزئی از تگ های html نیست، بلکه یک دستور راهنما برای مرورگرهای وب است، از آنجایی که کنسرسیوم جهانی وب (w3c) استاندارد های مختلفی از زبان پایه ی وب یعنی HTML یا (HyperText Markup Language) را ارائه نموده که هر کدام از آنها در مقایسه با هم دارای تفاوت هایی هرچند اندک هستند، اما این موضوع سبب می شود که مرورگرهای وب، در برخورد با صفحات مختلف نتوانند در حالت عادی، استاندارد صحیح را شناسایی کنند و لذا به جای پردازش متناسب با استاندارد اصلی، عملیات پیش فرض خود را برای نمایش صفحه انجام می دهند که این موضوع ممکن است با آنچه مورد نظر شما بوده باشد، فرق کند و یا از مرورگری به مرورگر دیگر، صفحات شما به چند شکل مختلف پردازش شوند، لذا برای جلوگیری از بروز چنین مشکلاتی، از دستور راهنمای DOCTYPE استفاده می شود تا نوع نسخه HTML استفاده شده را برای مرورگر مشخص کند.

آموزش نحوه قرار دادن فیلم و ویدئوهای FLV در وبلاگ و سایت

همان طور که می دانیم، امروزه فیلم ها و کلیپ های ویدئویی جزء جدایی ناپذیر از دنیای وب شده اند و بیش از پیش کاربران و مدیران وبلاگ ها و سایت ها تمایل دارند که از این نوع محتوا در صفحات خود استفاده کنند و کلیپ هایشان را با دیگران به اشتراک بگذارند، اما برای اکثر افراد، انجام این کار به راحتی ممکن نیست و بیشتر کاربران ترجیح می دهند از شبکه های اشتراک گذاری فیلم و کلیپ استفاده نمایند؛ از این رو در این مطلب قصد داریم روش های درج فیلم و ویدئوهای FLV یا Flash Video را در وبلاگ و سایت، برای این دسته از دوستان آموزش دهیم.

پخش ویدئو در وب چه مسیری را طی کرده و به چه سمتی در حرکت است؟

پیش از فراگیر شدن فرمت FLV یا همان Flash Video به عنوان فرمتی استاندارد برای پخش ویدئوها در وب، کاربران ناچار بودند از ویندوز مدیا پلیر (Windows Media Player) یا کیوک تایم (Quick Time) و فرمت های پشتیبانی شده توسط آنها استفاده کنند که هر کدام مشکلاتی را برای بازدیدکننده گان صفحات به وجود می آوردند، از جمله اینکه این برنامه ها حجم، کیفیت و قابلیت سازگاری کم تری با مرورگرها داشتند؛ اینچنین بود که به مرور FLV جای خود را بین کاربران باز کرد و سایتهای زیادی از آن به عنوان فرمت استاندارد استفاده نمودند، اما همچنان مشکل درج و پخش مستقیم ویدئو در صفحات وب حل نشده باقی مانده بود، یعنی برای پخش کلیپ های FLV ناچاریم از پلاگین ها و پلیرهای جانبی استفاده نمائیم؛ به همین خاطر در نسخه جدید HTML که به HTML5 معروف است، این مسائل تا حدود زیادی حل شده است، اما مشکل این است که هنوز بسیاری از کاربران از مرورگرهای قدیمی استفاده می کنند (که از HTML5 پشتیبانی نمی کند) و این امکان را نمی توان در مرورگر آنها مورد استفاده قرار داد، لذا تا فراگیر شدن HTML5 ناچاریم از همان پلاگین ها استفاده نمائیم؛ در این آموزش سعی می کنیم هر دو روش را بیان کنیم.

درج و پخش فیلم با کدهای HTML5 و تگ video