وبلاگ آموزشی پویاگستر

بهترین آموزش ها -کتب الکترونیک-اموزش آشپزی-آموزش فتوشاپ و ...

وبلاگ آموزشی پویاگستر

بهترین آموزش ها -کتب الکترونیک-اموزش آشپزی-آموزش فتوشاپ و ...

کد جدید نمایش وضعیت آنلاین یا آفلاین بودن

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

چند نفر از عزیزان این کد رو درخواست کردن . ما هم که بخیل نیستیم . هر چی داشته باشیم رو میکنیم . این کد رو هم میزارم که بردارید :

نمایش وضعیت آنلاین و آفلاینش هم به شکل زیره :

توجه : تو این کد هم شما باید در دو قسمت آیدی خودتونو وارد کنید . من توی کد ، این دو قسمت رو به صورت آیدی شما نمایش دادم که شما باید ID خودتونو بزارید جای این دو قسمت .

بعضی ها گفتن چرا موقعی که من آنلاین هستم این کد منو آفلاین نشون میده ؟ اشکال اونا این هست که فقط تو یه قسمت کد آیدی خودشونو وارد میکنن . باید آیدی خودتونو تو هر دو قسمتی که در کد تعیین شده قرار بدید .

موفق باشید .

مصطفی احمدی پنج‌شنبه 21 اردیبهشت‌ماه سال 1385 ساعت 01:00 ب.ظ
1 نظر

درس سوم: معرفی تگهای Meta و کاربرد آن

در ادامه ی بحث آموزش Html امروز تگ های Meta رو براتون آموزش میدم .

تگ های Meta بسیار فراوانند که ما در اینجا فقط به معرفی چند تا از اون ها که پرکاربرد هستند و شما به اون ها نیاز دارید می پردازیم :

جایگاه تگ Meta :  تو درس قبلی یه اشاره به جایگاه تگ های Meta کردم . اگه درس ها رو دنبال کرده باشید من گفتم که تگ های Meta در بین تگهای Head قرار میگیرند. به شکل زیر :

<head>

<Meta ....>

<Meta ....>

<Meta ....>
<title>عنوان صفحه</title>
</head>

همونطور که در بالا می بینید تگهای Meta بعد از تگ <head> و قبل از تگ <head/> اومدن .اگر چند تا تگ Meta به کار ببرید همشون در سطرهای زیر هم و در بین تگ های Head قرار میگیرن ...

انواع تگ های Meta : در اینجا من به سه نوع از تگ های Meta که بیشترین کاربرد رو دارن اشاره میکنم :

تگ متای توصیفی (Description meta Tags) :

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

<META NAME="Description" CONTENT="توصیفی در مورد صفحه "> 

 

تگ متای کلمات کلیدی (Keywords meta Tags) :

این تگ که کاربردی شبیه به تگ قبلی داره برای اینه که شما در اون کلمات کلیدی مربوط به صفحه ی وب خودتون رو وارد کنید . این تگ هم به شناسایی موضوع صفحه توسط موتورهای جستجوگر کمک می کنه . در این تگ باید از کلیدی ترین واژه های مرتبط با موضوع صفحه استفاده بشه . مثلا اگر وبلاگ یا سایت شما در مورد دانلود برنامه هست می تونید از واژه هایی مثل " دانلود ، دانلود برنامه های روز  ، دانلود برنامه به همراه کرک و ..." استفاده کنید . یا اگه در مورد موزیک مطلب می نویسید می تونید از کلمات " دانلود موزیک ، آهنگ و موسیقی ، جدیدترین آلبوم ها و ..." استفاده کنید . این تگ هم به صورت زیره :

<META NAME="Keywords" CONTENT="واژه ها و کلمات کلیدی "> 

 

تگ های متای HTTP-EQUIV :

این تگ ها از پرکاربرد ترین تگ های Meta هستند . اهمیت این تگ ها برای سایت های فارسی و کلا جاهایی که متن فارسی درون صفحه وجود داره  خیلی زیاده . چون این تگ های متا به مرورگر می فهمونن که این یک صفحه به زبان فارسی هست و مرورگر اونو درست نمایش میده . شاید بعضی جاها دیده باشید که متن های فارسی به صورت خرچنگ قورباغه نمایش داده میشن . دلیلش اینه که از این تگهای متا در صفحه استفاده نشده . دو تا از این تگ های مهم به شکل زیرن :

 <meta http-equiv="Content-Language" content="fa">
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">

 

اولی برای اینه که مرور گر زبان صفحه رو فارسی تشخیص بده . البته این تگ برای زبانهای مختلف کاربرد داره و من اینجا فقط فارسیشو گذاشتم . دومی هم نوع نمایش متون رو تعیین می کنه که اینجا به صورت UTF-8  هست که برای زبان فارسی مناسب ترینه .

این تگهای متا که من معرفی کردم مهمترین و پرکاربردترین اونها بودن . تعداد تگ های متا خیلی زیادن که من فعلا به معرفی همین ها بسنده کردم .

 

حالا در آخر یه شکل از کد یه صفحه ی Html رو که این تگ های متا توش به کار رفته در زیر میارم تا با جایگاه و نحوه ی قرار گرفتن تگهای متا در کدهای یک صفحه بیشتر آشنا بشید . تگ های متا در یک صفحه ی Html فارسی به شکل زیر قرار میگیرن :

 

<html>
<head>

<Meta http-equiv="Content-Language" content="fa">

<Meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<Meta name="Description" content="توصیفی در مورد صفحه ">

<Meta name="Keywords" content="واژه ها و کلمات کلیدی ">
<title>عنوان صفحه</title>
</head>
<body>
قسمتی که نمایش داده می شود
</body>
</html>

:: ترتیب قرار گرفتن تگهای متا زیاد مهم نیست .

خوب عزیزان درس سوم هم تموم شد . امیدوارم تا اینجا با این مباحثی که توضیح دادم یه آشنایی مختصری با Html پیدا کرده باشید . من سعیم بر اینه که شما رو اول با همه ی تگهای Html آشنا کنم و بعد آموزش فرونت پیج رو هم بدم .

دوستان عزیز من خوشحال میشم که شما هم در به روز کردن سایت نقشی داشته باشید . هر کدوم از شما عزیزان اگه مقاله ی آموزشی دارید که خودتون نوشتید می تونید اونو به ایمیل من بفرستید تا با نام خودتون بزارم تو سایت .

موفق و پیروز و سربلند و شاد و خوشحال و همیشه خندون باشید .

مصطفی احمدی سه‌شنبه 19 اردیبهشت‌ماه سال 1385 ساعت 06:17 ب.ظ
1 نظر

درس دوم : معرفی تنه و تگ های اصلی Html

همونطور که در پست قبلی گفته بودم امروز به معرفی تنه ی اصلی یک فایل Html و تگ ها اصلی اون می پردازم .

یه نکته اول در مورد تگ ها بگم . خیلی ها پرسیده بودن که اصلا تگ چی هست ؟

اینو بگم که یک تگ رو به صورت <Tag> یا <Tag/> نمایش میدن .

هر تگی که مثلا به شکل <Tag> وجود داشته باشه  حتما یه تگ پایانی به شکل <Tag/> داره . مثلا وقتی میگن فلان کد رو بزارید بین تگهای بادی ، یعنی اینکه بزاریدش بین تگ آغازی <Body> و تگ پایانیش که <Body/> هست .

خوب بریم سر اصل مطلب :

تنه ی اصلی یک فایل HTML :

بدنه ی اصلی یک فایل html از چند تا تگ اصلی بوجود میاد . من اول تنه ی اصلی رو براتون میزارم و بعد کاریرد هر جزء اونو براتون توضیح میدم :

تنه ی اصلی یک فایل Html به شکل زیر هست :

همونطور که میبینید هیچ تگی به صورت تنها وجو نداره .

یک صفحه ی Html با تگ آغازی <html> شروع میشه و با تگ پایانی <html/> تموم میشه . و بقیه ی کدها و تگ ها در بین این دو تگ قرار میگیرن .

خوب حالا من در زیر هر کدوم از این تگ هایی که تنه ی اصلی رو بوجود میارن براتون معرفی می کنم و کاربرد هر کدومو توضیح میدم  .

 

  

<html>
<head>
<title>عنوان صفحه</title>
</head>
<body>
قسمتی که نمایش داده می شود
</body>
</html>

 تگ های Html : این تگ با <html> شروع میشه و با تگ پایانی <html/> تموم میشه .

تمام کدها و تگهای Html و ... بین این دو تگ قرار می گیرن . کاربرد تگ <html> اینه که به مرورگر میفهمونه که این یک فایل Html هست و اینکه مروگر اونو چطور نمایش بده .

 

 تگ های Head : این تگ هم با <head> شروع میشه و با تگ پایانی <head/> تموم میشه .

در واقع مشخصات ، خصوصیات و تنظیمات یک فایل Html در بین تگ های <head> و<head/> قرار می گیره . مواردی که در بین این دو تگ قرار میگیره در صفحه نمایش داده نمیشه .  از جمله تگ هایی که بین این دو  قرار میگیرن تگهای meta و  Style هستن که بعدا به موقش در مورد اونا هم بحث می کنم .

 

 تگ های Title : کلمه یا متنی که بین تگ <title> و <title/> قرار میگیره عنوان صفحه رو مشخص میکنه . همون عنوانی که در بالای پنجره ی اینترنت اکسپلورر نمایش داده میشه . پس اگه خواستید عنوان صفحه ی خود رو عوض کنید باید متن بین این تگ رو تغیر بدید و عنوان مورد نظر رو بین این دو تگ بزارید  .  منظورم از عنوان مثل زیره :

 

 تگ های Body : شاید بشه گفت اساسی ترین تگ Html همین تگ های بادی هستن که با <body> شروع و با تگ <body/> به پایان میرسه .

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

 

امیدوارم با تنه ی اصلی یک فایل Html آشنا شده باشد . در هر صورت من سعی کردم که هر چقدر می تونم ساده تر و خودمونی تر  توضیح بدم . ضمنا من سعی میکنم چیزایی رو که بدردتون میخوره آموزش بدم و از تعریف و توضیح اصطلاحات و ... بپرهیزم .

 

ضمنا دوستان عزیز برای اینکه از به روز شدن سایت مطلع بشد و آموزش های جدید رو داشته باشید حتما در خبرنامه ی سایت عضو بشید . خوشحال میشیم زودتر از مطالب و آموزش ها خبردار بشید .

موفق و پیروز باشید .

مصطفی احمدی دوشنبه 18 اردیبهشت‌ماه سال 1385 ساعت 08:38 ب.ظ
0 نظر

درس اول: معرفی Html و Frontpage

خوب دوستان عزیز امروز اولین پست رو در مورد آموزش طراحی میدم . اول یه کم در مورد Html و بعد در مورد برنامه ای که بهش نیاز دارید و بهتره که از اون استفاده کنید.

HTML چیست ؟

همونطور که می دونید Html یک زبان برنامه نویسی صفحات وب هست که از عبارت Hyper Text Markup Language گرفته شده .

یک فایل Html یک فایل متنی است که شامل تگ های این زبان می باشد و از کنار هم قرار گرفتن این تگ ها و کدها یک صفحه ی وب ایجاد میشه . مرورگرها هم با خوندن این تگ ها و کدهای Html می فهمند که صفحه رو چجور باید نمایش بدن .

فایل های Html با دو فرمت htm. و html. وجود دارند .

از مزیت های Html اینه که فایل های اون با هر ادیتور ساده ای قابل ساختن هستند . مثلا اگر از ویندوز استفاده می کنید می تونید با Notepad که برنامه ی خیلی ساده ای هست یک فایل Html ایجاد کنید . فقط لازمه در هنگامه ذخیره ی فایل در Notepad به آخر اسم اون html. یا htm. اضافه کنید و اونو Save کنید . به همین راحتی می تونید یک فایل Html ایجاد کنید .

اما برای راحتی کار و صرفه جویی در زمان بهتره که از برنامه ی پیشرفته تری که برای این کار ساخته شده استفاده کنید . برنامه های زیادی برای ایجاد صفحات وب وجود دارن که من به شما پیشنهاد می کنم که از برنامه ی Microsof Front Page استفاده کنید .

این برنامه که از کارای خود مایکروسافت هست یک برنامه ی بسیار کاربردی و کامل برای ایجاد صفحات وب و Html هست . در هر صورت اگه دوست دارید که یک طراح بشید یا در این مورد یاد بگیرید این برنامه خیلی می تونه به شما کمک بکنه .

مصطفی احمدی دوشنبه 18 اردیبهشت‌ماه سال 1385 ساعت 08:36 ب.ظ
1 نظر

جستجوگر گوگل

چند تن از عزیزان کد جستجوگر گوگل رو درخواست کردن . منم این کد رو براتون آماده کردم ، البته به این ترتیب که با این کد هم میشه تو کل اینترنت جستجو کرد و هم اینکه میشه تو همون وب خودتون جستجو رو انجام بدید .

کد رو از زیر بردارید :

اینم نمایش کد :

 

در دو قسمت از کد باید آدرس وب خودتون رو وارد کنید تا امکان جستجوی گوگل در سایت شما فراهم باشه .

 

موفق و پیروز باشید .

مصطفی احمدی جمعه 15 اردیبهشت‌ماه سال 1385 ساعت 08:05 ق.ظ
1 نظر