مجله الكترونيكي

تعداد و كيفيت لينكهاي موجود بين صقحات وب يك وبسايت – Internal Linking Structure

ميزان اهميت: 4/5

هر چقدر تعداد و كيفيت لينكهايي كه به يك صفحه ازداخل صفحات ديگر برقرار است، بيشتر باشد، به همان ميزان رنكينگ آن صفحه در صفحه نتايج جستجوي گوگل، افزايش پيدا خواهد كرد. بنابه اين دليل صفحه اصلي يك وبسايت در اكثر مواقع از رنكينگ بالايي نسبت به صفحات داخلي برخوردار است چراكه تمامي صفحات داخلي به صفحه اصلي لينك دارند. همچنين وجود لينك بين صفحات يك وبسايت، باعث مي شود كه اسپايدر هاي موتورهاي جستجوگر به صفحات عمقي دسترسي آسانتري داشته باشند و اين امر به افزايش تعداد صفحاتي كه در گوگل ايندكس ميشوند، كمك بسزائي مي كند. البته نبايد فراموش كرد كه سهولت دسترسي به صفحاتي كه در سطوح عميقتري نسبت به صفحه اصلي قرار گرفته اند رابطه تنگا‌تنگي با Page Rank صفحات دارد. نحوه برقراري لينك بين صفحات به ساختار وبسايت و Navigation آن بستگي دارد. بنابراين، نحوه طراحي سايت مي تواند تاثير زيادي بر روي جنبه هاي سئو داشته باشد.

كيفيت و تناسب لينكهاي موجود از صفحات داخلي به صفحات موجود در وبسايتهاي ديگر

ميزان اهميت: 3.5/5

ايجاد لينك به صفحات مهم و مرجع كه از لحاظ محتويات با محتواي صفحه وب برقرار كننده لينك تناسب معنايي داشته باشد، مي تواند تاثير مثبتي در افزايش رنكينگ صفحه برقرار كننده لينك داشته باشد. بنابراين به سايتي كه فكر مي كنيد هيچگونه ارتباطي با موضوع سايت شما ندارد، لينك ندهيد. موضوعي كه بيشتر در تبادل لينك مشاهده مي شود.

قدمت صفحات وب

ميزان اهميت: 3.4/5

صفحات و اسناد قديمي ممكن است از درجه اعتبار بالاتري در الگوريتم گوگل برخوردار باشند وممكن است رنكينگ آنها نسبت به صفحاتي كه جديدآ ايجاد شده است بالاتر باشد. اگرچه قدمت دامين بيشتر از قدمت صفحه وب مي تواند در تعيين رنكينگ صفحه تاثيرگذار باشد.

مقدارمتن قابل رويت صفحه كه قابل ايندكس شدن باشد (تعداد كلمات موجود در صفحه)

ميزان اهميت: 3.2/5

حجم اطلاعات نوشتاري موجود در صفحه وب نيز مي تواند در تعيين رنكينگ صفحه وب موثر باشد. اصولآ مقالات طولاني و مفصل كه درباره يك موضوع متمركز نوشته شده باشند رتبه بالاتري را نسبت به صفحاتي كه فقط از تعدادي تصوير و يا انيميشنهاي فلش تشكيل شده اند، خواهند داشت. بنابراين تكه تكه كردن يك مقاله طولاني و قرار دادن آنها در صفحات مجزا توصيه نمي شود.

كيفيت محتواي صفحات وب

ميزان اهميت: 3/5

اگر محتويات صفحات وب خود را از جايي كپي كرده باشد، منتظر نباشيد كه گوگل سايت شما را در صفحا اول خود نمايش دهد! نوشتن مقالات مفيد و با كيفيت مي تواند باعث افزايش ميزان اعتبار صفحات وب شما شود. مردم هميشه به مقالات و صفحاتي كه محتويات مفيد و با ارزش دارند لينك مي دهند كه اين به نوبه خود باعث افزايش رتبه صفحه در موتورهاي جستجوگر مي شود. البته اينكه موتور جستجوگر بتواند كيفيت محتواي صفحه وب را بصورت الگوريتميك بسنجد، كمي غير ممكن به نظر مي آيد!

بروزرساني محتويات صفحات وب

ميزان اهميت: 2.4/5

بي شك صفحاتي كه محتويات آنها بطور مداوم بروز مي شود، از اهميت بيشتري نسبت به صفحاتي كه اصلآ بروز نمي شود برخوردار هستند. اگرچه نوع صفحات وب و ماهيت آنها تعيين مي كند كه آيا اين عامل مي تواند در تعيين رتبه صفحه اثرگذار باشد يا نه. بسيار ديده شده است صفحاتي كه بسيار قديمي هستند و مدتهاست بروز نشده اند ولي با اين وجود از رتبه بالايي در گوگل برخوردارند.

فاصله صفحه وب از شاخه اصلي (Root) سايت.

ميزان اهميت: 1.9/5

اسپايدر هاي موتورهاي جستجوگرصفحاتي را كه در سطوح نزديكتري نسبت به شاخه اصلي سايت قرار گرفته اند، به آساني ايندكس مي كنند و هر چقدر صفحات وب درون ساختار پيچيده اي از دايركتوريهاي تو در تو قرار گرفته باشد، دسترسي به آنها سخت تر بوده و در صورتي كه صفحه از Page Rank بالايي برخوردار نباشد،‌ممكن است كه اين صفحات اصلآ ايندكس نشوند. البته ساختار لينكهاي داخلي موجود بين صفحات وب اگر بدرستي پياده سازي شده باشد، مي تواند ميزان اثرگذاري اين عامل درتعيين رتبه صفحات وب را به حداقل برساند.

منبع: سايت پرشيا سئو

يكي از وبسايتهايي كه در زمينه افيليت ماركتينگ (درآمد انلاين از طريق مشاركت در فروش) فعاليت مي كند، وبسايت ايران ماركت سنتر مي باشد كه در حدود 28 روز پيش با اين سيستم آشنا شدم. من خودم با شبكه هايي نظير Commission Junction و Linkshare قبلآ كار كرده بودم (در حال حاضر نيز كم و بيش با اين سيستمها كار مي كنم) و مي دونستم كه يكي از كانالهايي كه مي توان بصورت آنلاين درآمد داشت از طريق همين Affiliate Marketing است، با خودم گفتم كه چرا يك سيستم ايراني و بومي رو مورد بررسي قرار ندهم و آيا اصلآ ميشه تو كشور خودم از اين طريق به كسب درآمد پرداخت؟ همچنين مدتها بود كه مي خواستم يه فروشگاه اينترنتي ايجاد كنم (البته براي تست) و رفتار كاربران ايراني را در زمينه خريد آنلاين بررسي كنم ولي از اونجائيكه هميشه وقت كم داشتم، دنبال يه چنين سيستمي بودم كه با صرف كمترين زمان ممكن اين موضوع رو تست كنم.

خوشبختانه با سايت Iran Market Center آشنا شدم و با خودم گفتم فرصت چه بهتر از اين! پس دست به كار شدم و در سيستم مشاركت در فروش اونها عضو شدم. اين سايت اقدام به راه اندازي يك پورتال فروشگاهي در ايران كرده، كه به نا به گفته اونها، در حدود 1000 فروشنده در فروشگاهشان عضو هستند و بيش از 100,000 محصول براي فروش وجود دارد.

مدل كسب درآمد، بر پايه همان مدل Affiliate Marketing كار مي كند يعني شما با معرفي كردن محصولات سايت، در صورتيكه كاربر معرفي شده توسط شما از سايت مزبور خريد كند، شما در سود فروش آن محصول (محصولات) سهيم خواهيد بود و فروشنده درصدي از قيمت كالا را به عنوان پورسانت همكاري شما، به شما اختصاص مي دهد.

موضوعي كه من رو متعجب كرد، درصد بالاي پورسانتها بود كه به ندرت در سايت هاي خارجي كه قبلآ باهاشون كار كرده بودم، ديده ميشد. بطوريكه حتي در برخي موارد ميزان پورسانت دريافتي به 50 تا 70 درصد هم مي رسيد.

بزرگترين مشكلي كه در كسب درآمد به روش همكاري در فروش وجود دارد، ايجاد ترافيك هدفمند به صفحه محصولات است كه البته من اين مشكل رو با استفاده از تبليغات در گوگل – Google Adwords و انتخاب كلمات كليدي متناسب با محصول حل كردم ولي بطور كلي، مي توان از روشهاي مختلف براي جذب و ايجاد ترافيك استفاده كرد، مثلآ استفاده از ايميل ماركتينگ، قرار دادن بنرهاي گرافيكي و لينك باكس در وبسايت و غيره. ولي به نظر من هيچكدوم از اين روشها به اندازه موتورهاي جستجوگر نمي تونند ترافيك هدفمند ايجاد كنند و از آنجائيكه با استفاده از تبليغات PPC – Pay Per Click مي توان در عرض كمتر از 15 دقيقه ترافيك مورد نياز خود رو بدست آورد، من براي بررسي سريع نتايج از اين روش براي تبليغات محصولات فروشگاه استفاده كردم. البته در اين روش شما بايد مراقب ضرر و زيان خود باشيد و اين مستلزم سعي و خطا و استفاده از كلمات كليدي مناسب و دقت در نوشتن متن آگهي است.

براي بررسي اين سيستم من چند تا محصول رو كه فكر مي كردم فروش خوبي داشته باشند رو از بين محصولات انتخاب كردم و براي اونها تو ادوردز گوگل آگهي تبليغاتي درست كردم و كاربران رو مستقيمآ به صفحه محصول هدايت كردم. جالب اينجاست كه شما در اين روش حتي لازم نيست كه وبسايت داشته باشيد و با قرار دادن آدرس صفحه محصول در Destination URL آگهي ادوردز مي توانيد كاربر را بطور مستقيم به صفحه محصولي كه تبليغ مي كنيد، هدايت كنيد. اگر كاربر معرفي شده از سايت مزبور خريد كند، به شما پورسانت همكاري اختصاص داده مي شود.

من در ادوردز يه Campaign ساختم و در داخل campaign چند تا adgroup براي تك تك محصولاتي كه مي خواستم معرفي كنم درست كردم. كلمات كليدي رو هم با استفاده از ابزار تحقيق بر روي كلمات كليدي ادوردز انتخاب كردم.

بعد از حدود 10 دقيقه، آگهي من در گوگل فعال شد و در صفحه اول گوگل براي كلمات كليديي كه انتخاب كرده بودم نمايش داده شد. جالب اينجاست كه پس از سپري شدن حدود 1 ساعت من اولين فروش خود رو تجربه كردم و در حدود 60% پورسانت در اكانت من منظور شد.

در داخل پنل Iran Market Center سفارشات مراحل مختلفي را طي مي كنند و تا زماني كه سفارش به حالت توزيع شده و يا وصول شده در نيامده باشد، پورسانت آن به شما پرداخت نمي شود و فقط در اكانت شما نمايش داده مي شود.

سفارشات در سيستم همكاري در فروش Iran Market Center مي تواند وضعيتهاي زير را داشته باشد:

سفارشات معلق: سفارشی که جدیدا در سیستم ثبت شده و فروشنده تاکنون اقدامی برای آماده کردن و ارسال آن نکرده است و یا اینکه خریدار به تماس تلفنی فروشنده برای تایید سفارش پاسخ نداده است.

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

سفارشات ارسال شده: سفارشی است که در سیستم پستی در حال ارسال است و یا به دست خریدار رسیده است. این تغییر وضعیت توسط پست شهر مبدا انجام می شود.

سفارشات توزيع شده: سفارشی است که خریدار آن را دریافت کرده و مبلغ ان را به مامور پست داده است. این تغییر وضعیت توسط پست شهر مقصد انجام می شود.
سفارشات وصول شده: سفارشی است که مبلغ آن توسط پست به ایران مارکت سنتر داده شده است. این تغییر وضعیت توسط سیستم ایران مارکت سنتر انجام می شود.

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

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

بررسي ميزان هزينه و درآمد و محاسبه سود ROI

من براي شروع، 5 موضوع مختلف (محصولات متنوع) رو انتخاب كردم و براي آنها در گوگل تبليغات درست كردم. تبليغات از تاريخ 11 اگوست به نمايش در آمد و تا حالا كه دارم اين مقاله رو مينويسم، هنوز در گوگل نمايش داده مي شود. شكل زير مقداري هزينه اي كه من در گوگل براي تبليغات محصولات در طول اين مدت 28 روزه پرداخته ام رو نشون ميده:

در جدول زير ميزان درآمد (پورسانت همكاري در فروش) نمايش داده شده است:

همانطور كه ملاحظه مي كنيد كل هزينه اي كه به گوگل پرداخت شده است در حدود 191 دلار بوده كه با حساب دلاري 940 تومان هزينه كل برابر 1,795,400 ريال خواهد بود. بنابراين با احتساب 3,856,017 ريال درآمد حاصل از همكاري در فروش، ميزان سود نهائي برابر با 2,060,617 ريال خواهد بود.

به نظر بد نمياد!!! من در حدود 3 ساعت براي اين كار وقت گذاشتم و در عرض 28 روز تونستم كه در حدود دويست هزار تومان درآمد داشته باشم! البته نگهداري كمپهاي تبليغاتي كه در گوگل درست مي كنيد كمي وقت شما رو ميگيره ولي به نظر مياد كه ميشه با افزايش تعداد محصولات به درآمد فوق اضافه كرد.

سيستم افيليت ماركتينگ – سيستم همكاري در فروش، يكي از روشهاي بسيار سودمند هم براي فروشنده و هم براي تبليغ كننده است كه هر دو طرف از اين مشاركت سود مي برند. فروشنده تنها زماني هزينه مي كند كه محصولاتش به فروش بره و از طرفي تبليغ كننده هم با در يافت پورسانت مي تواند درآمد خوبي از اين راه كسب كند.
يكي از بزرگترين معايب سيستم همكاري در فروش ايران ماركت سنتر اينست كه اگر كاربر معرفي شده توسط شما، در همان بار اول از سايت فروشنده خريد نكند و دفعه بعد مستقيمآ وارد سايت فروشنده شده و خريد نمايد، پورسانتي به شما تعلق نمي گيرد. (عدم استفاده از كوكيها)

اگر دقت كرده باشيد، هر استايلي كه در CSS تعريف مي شود، از دو قسمت تشكيل شده است:

Selectors
Property

Selector ها مشخص مي كنند قانون نعريف شده بايد بر روي كدام تگها و المانهاي صفحه اعمال شود و Property در واقع خود قانون را مشخص مي كند. مثلا اگر ما بخواهيم با استفاده از CSS رنگ متن سرتيترهاي اول صفحه، H1، را به قرمز تغيير دهيم، بايد قانون CSS را به صورت زير تعريف كنيم:

h1{ color:red; }

در استايل فوق، Selector همان تگ h1 بوده و property كه مي خواهيم تغيير دهيم همان ويژگي color مي باشد. در اين قسمت مي خواهم شما را با انواع Selector هايي كه در CSS از آنها استفاده مي شود، آشنا كنم.

سلكتورهاي تگ – Tag Selectors:

ساده ترين حالتي كه يك Selector مي تواند داشته باشد، هماني است كه در مثال بالا ذكر شد. مثلا اگر شما بخواهيد قانوني را براي همه برچسبهاي

صفحه اعمال كنيد بايد ازسلكتورهاي تگ استفاده كنيد. كافيست اسم آن برچسب را بكار ببريد و سپس در داخل آكولادها، هر قانوني را كه دوست داريد تعريف كنيد. اين قوانين به همه برچسبهاي

كه در صفحه وجود دارند اعمال خواهند شد. در مثال زير اندازه فونت و رنگ متني كه در داخل برچسب

نمايش داده مي شود، تعريف شده است.

p{ 
font-size:1.3em;
color:#666;
}

اگر بخواهيم مجموعه اي از قوانين را بر روي چندين تگ HTML بطور همزمان اعمال كنيم، كافيست نام تگها را با كاما از همديگر جدا كنيم:

h1,h2,h3{
font-family:Tahoma;
color:#ff0000;
}

در مثال فوق نوع فونت و رنگ متن تگهاي H1, H2, H3 بطور يكجا تنظيم شده است.

سلكتورهاي كلاس –Class Selectors:

براي اينكه مفهوم سلكتورهاي Class را به خوبي درك كنيد، از يك مثال شروع مي كنيم. فرض كنيد ما مي خواهيم رنگ متن كليه پاراگرافهاي صفحه را به آبي تغيير دهيم، براي اين منظور كافيست از سلكتورهاي تگ استفاده كنيم:

p{ 
color:#0000FF;
}

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

p{
color:#0000FF;
}

.sidebar{
color:#FFFFFF;
}

همانگونه كه مشاهده مي شود براي تعريف سلكتورهاي كلاس از علامت نقطه استفاده مي شود.
پس ار اينكه قانون را تعريف كرديم نوبت به استفاده از اين قانون در پاراگراف موردنظر مي رسد. براي اين منظور از ويژگي class در برچسب

استفاده مي كنيم. در واقع با اين كار مشخص مي كنيم كه اين پاراگراف متعلق به كدام كلاس مي باشد و خواص و قوانين آن كلاس بر روي اين برچسب اعمال مي شود.

اين متن سفيد رنگ خواهد بود

حال فرض كنيد كه در اين پاراگراف شما يك لينك هم داريد. همانطوريكه مي دانيد لينكها بطور پيش فرض به رنگ آبي نمايش داده مي شوند و از آنجائيكه رنگ پس زمينه نيز آبي است، اين لينك ديده نمي شود. براي حل اين مشكل مي توان از كلاس تعريف شده (رنگ متن سفيد) براي برچسب نيز استفاده كرد:

اين متن سفيد رنگ بوده
اين لينك نيز سفيد رنگ است

حال اگر بخواهيم لينك موجود در اين قسمت به صورت ضخيم و بقيه متن به صورت عادي نمايش داده شود، كافيست سلكتور تگ را با سلكتور كلاس تركيب كنيم. به مثال زير توجه كنيد:

p {
color: #0000FF;
}
.sidebar {
color: #FFFFFF;
}
a.sidebar:link, a.sidebar:visited {
font-weight: bold;
} 

مشاهده مي كنيد كه ما علاوه بر تركيب اين دو سلكتور، از كلاس نما (Pseudo-classes) هاي :link و :visited نيز استفاده شده است. بعدا در مورد سلكتورهاي كلاس نما توضيح داده خواهد شد.

نكته مهم: اگر شما در استايل سوم رنگي غير از آنكه در استايل دوم (رنگ سفيد) مشخص شده است، تعريف كنيد، رنگ دوم بر روي لينكها اعمال خواهد شد. چرا كه استايل دوم داراي تقدم و درجه اولويت بالاتري نسبت به استايل اول است. در واقع كلمه CSS كه مخفف كلمه Cascading Style Sheet مي باشد، اسمش را از همين موضوع اخذ كرده است. بعدا راجع به اين موضوع بحث خواهيم كرد.

 منبع: سايت پرشيا سئو

Page Class Suffix دقيقآ عملكردي شبيه به Module Class Suffix دارد با اين تفاوت كه Module Class Suffix بر روي ماجولهاي جوملا تاثير مي گذارد و شما با استفاده از آن مي توانيد استايلهاي مختلف براي ماجولها تعريف كنيد در حاليكه Page Class Suffix بر روي Main Body اثر مي گذارد بنابراين براي تمامي آنچه كه در Main Body نمايش داده مي شود (اعم از صفحات محتوايي و يا خروجي كامپوننتهاي جوملا) مي توان استايلهاي متفاوت تعريف كرد.

چگونه Page Class Suffix را به صفحات خود اختصاص دهيم؟

فرض كنيد كه ما صفحه اي داريم كه مي خواهيم از لحاظ ظاهري با بقيه صفحات متفاوت باشد. براي اين منظور بايد به آن صفحه Page Class Suffix اختصاص دهيم. براي اختصاص Page Class Suffix به يك صفحه مراحل زير بايد طي گردد:

ابتدا بايد منويي كه به صفحه مورد نظر پيوند ايجاد كرده است را از منوي Menus انتخاب كنيم. حال وارد صفحه Menu Item Manager مي شويم.

برروي آيتمي كه به صفحه مورد نظر لينك ايجاد كرده است كليك مي كنيم تا وارد صفحه تنظيمات آيتم منو شويم. در سمت راست صفحه، بر روي Parameters – System كليك مي كنيم تا منوي كشوئئ باز شود.

همانطور كه در شكل نشان داده شده است، شما مي توانيد پارامتر Page Class Suffix را در اين قسمت تنظيم كنيد. مثلآ مقدار -suffix1 را در اين فيلد وارد مي كنيم و بر روي Save كليك مي كنيم تا تغييرات اعمال شده در سيستم ذخيره گردد. با اين كار شما توانستيد كه به يك صفحه خاص Page Class Suffix اختصاص دهيد. حال بايد بررسي كنيم كه اين پسوند چگونه مي تواند خروجي توليد شده توسط جوملا را تغيير دهد. بعد از اضافه كردن Page Class Suffix بايد استايلهايي كه مد نظرمان هست را به فايل template_css.css اضافه كنيم ولي قبل از اينكه به اين موضوع بپردازيم، نحوه ايجاد خروجي صفحات توسط جوملا را بررسي مي كنيم.

در جوملا محتويات مقالات - Content Items درون يك جدول HTML بنام contentpaneopen نمايش داده مي شوند. هنگامي كه به يك صفحه Page Class Suffix اختصاص مي دهيم، پسوند تعريف شده، به انتهاي نام كلاس contentpaneopen اضافه مي شود و كلاس جديدي بنام contentpaneopen-suffix1 بوجود مي آورد. همين مساله در مورد كلاسهاي contentheading و blog نيز صادق است. بنابراين، جوملا بجاي اينكه محتويات صفحه مورد نظر را در داخل جدول table.contentpaneopen نمايش دهد، آنرا درون table.contentpaneopen-suffix1 نمايش مي دهد. همچنين عنوان مقاله درون سلول td.contentheading-suffix1 به نمايش در مي آيد.

بنابراين شما مي توانيد با تعريف استايلهاي مختلف براي كلاسهاي ايجاد شده، ويژگيهاي ظاهري المانهاي موجود درصفحه مورد نظر را تغيير دهيد:

table.contentpaneopen-suffix1{
	/* Put your css styles here */
}
td.contentheading-suffix1{
	/* Put your css styles here */
}

همين كار را ما مي توانيم به جاي اينكه برروي يك صفحه محتوايي – Content Item انجام دهيم، بر روي خروجي يك كامپوننت اعمال كنيم. مثلآ اگر بخواهيم استايل خاصي را فقط براي كامپوننت Contact us اختصاص دهيم، ابتدا از ليست منوها، منويي كه حاوي لينك به صفحه تماس با ما است را انتخاب كرده و بر روي آيتم منو كليك مي كنيم تا وارد صفحه تنظيمات آيتم منو شويم. دوبار مثل حالت قبل از قسمت Parameter – System مقدار پارامتر Page Class Suffix را وارد مي كنيم. جوملا محتويات كامپوننتها را درون div.contentpane و عنوان كامپوننت را درون div.componentheading نمايش مي دهد. هنگامي كه به يك كامپوننت Page class suffix اختصاص مي دهيم، اين پسوند به اسم كلاسهاي فوق اضافه مي شود و كلاسهاي جديدي را بوجود مي آورد. Div.contentpane-suffix1 و div.componentheading-suffix1 حال نوبت به تعريف استايل براي كلاسهاي فوق است. شما مي توانيد هر استايلي را كه دوست داشته باشد براي اين كلاسها تعريف كنيد.

بنابراين با استفاده از Page Class Suffix ما مي توانيم خروجي تك تك صفحات وب جوملا را سفارشي كنيم به گونه ايكه آنها ازلحاظ ظاهر با همديگر تفاوت داشته باشند.

منبع: سايت پرشيا سئو

شايد شما كلمه افيليت ماركتينگ – Affiliate Marketing و يا بازاريابي پورسانتي و يا سيستم همكاري در فروش را بار ها شنيده باشيد و از خود پرسيده باشيد كه آيا ميشود از اين راه درآمد كافي داشت و يا اصلآ اين مدل كسب درآمدي چگونه كار مي كند؟ دراين مقاله شما با نحوه عملكرد افيليت ماركتينگ و اينكه چگونه اين مدل بازاريابي هم مي تواند به فروشنده (Merchant) و هم به تبليغ كننده (Affiliate) در كسب درآمد و سود بيشتر كمك كند، آشنا خواهيد شد.

در اين روش كسب درامد انلاين، شما به عنوان Affiliate ، به سايت فروشنده و يا توليد كننده محصول كه ما اصطلاحآ آنرا Merchant خواهيم ناميد، ويزيتور ميفرستيد و اگر ويزيتور فرستاده شده توسط شما از سايت Merchant يا همان فروشگاه فرضي، خريدي انجام دهد و يا در برنامه هاي آنها عضو شود (بسته به نوع Affiliate Program) در اينصورت، شركت توليد كننده و يا همان Merchant به شما درصدي از فروش را پرداخت مي كند. شما در واقع در وبسايت خودتان، محصولات ديگران را تبليغ مي كنيد و اگر ويزيتوري كه در سايت شما است، ترغيب به خريد محصول شود، پس از كليك بر روي لينك محصول به وبسايت فروشنده منتقل مي شود و در آنجا خريدش را انجام ميدهد و شما پورسانت خود را از فروشنده دريافت مي كنيد.

در اين روش Marketing هم فروشنده (Merchant) و هم كسي كه محصولات فروشنده را تبليغ مي كند (Affiliate)، سود مي كنند.از يكطرف، فروشنده، تنها زماني هزينه ميكند كه جنسش فروش برود و در اين ميان از تبليغات و برندينگ مجاني كه affiliate ها براي او ايجاد مي كنند، استفاده مي كند. از طرف ديگر، affiliate ها، با معرفي محصولات فروشنده هاي مختلف، درآمدهاي خوبي كسب مي كنند. يعني در اين سيستم هر دو طرف از اين مشاركت سودآور بهره مي برند.

سايت بزرگ Amazon اولين وبسايتي بود كه سيستم Affiliate Marketing را در وبسايت خود در سال 1996 ارائه داد و با اين كار توانست اسم خود را بر سر زبانها آورده (Branding) و هزاران هزار تبليغ كننده براي محصولات خودش پيدا كند و در ازاي پرداخت پورسانتهاي ناچيز، فروش خود را چندين برابر كند.

انواع برنامه هاي مشاركت در فروش – Types of Affiliate Programs

سيستمهاي همكاري در فروش ار انواع مختلفي برخوردار است كه عبارتنداز:

پرداخت به ازاي هر فروش: در اين نوع، درصدي از كل فروش به Affiliate داده مي شود. ميزان پورسانت، بستگي به نوع محصولات و برنامه مشاركتي دارد. مثلآ پورسانت فروش محصولات نرم افزاري بيشتر از محصولات سخت افزاري است. به اين نوع برنامه ها، Pay Per Sale نيز گفته مي شود.

پرداخت به ازاي هر ثبت نامي كه كاربر انجام مي دهد: در اين مدل، بسته به نوع برنامه، افيليت ها زماني درآمد كسب مي كنند كه ويزيتوري را به سايت Merchant بفرستند و آن ويزيتور در وبسايت فروشنده ثبت نام كند (فرمي را پر كند) به اين نوع از برنامه افيليت، Pay Per Lead نيز گفته مي شود. منظور از Lead يعني يك كاربري كه از سايت شما (افيليت) به سايت توليد كننده (Merchant) مراجعه كرده ودر آنجا عملي را كه مد نظر Merchant بوده را انجام داده است (مثلآ پر كردن فرم ثبت نام و يا شركت در نظر سنجي و ...)

پرداخت به ازاي هر ويزيتور: در اين مدل، affiliate ها به ازاي هر ويزيتوري كه به سايت Merchant ميفرستند، پول مي گيرند. چه اين ويزيتور، خريد بكنه چه نكنه!

پرداخت به ازاي نمايش آگهي: در اين مدل، Affiliate ها به ازاي تعداد دفعات نمايش آگهي هاي Merchant در وبسايت خود، پول دريافت مي كنند، چه كاربر رو تبليغات كليك بكنه چه نكنه! وبسايتهايي كه ترافيك خوبي دارند از اين روش مي توانند درآمد خوبي كسب كنند.

هنگامي كه شما عضو برنامه Affiliate مي شويد، Merchant، پنلي را در اختيار شما مي گذارد كه در داخل اين پنل بتوانيد لينكهاي مخصوصي را كه با شماره اكانت شما كد شده است، ايجاد كنيد. حتي برخي از Merchant ها بنرهايي را ازقبل طراحي مي كنند و در اين پنل در اختيار Affiliate ها قرار مي دهند تا آنها بدون هيچ دردسري، بتوانند اين بنرها را در سايت خود قرار دهند. پس از اينكه اين بنرها، متنهاي لينكدار و ... را در سايت خود آپلود كرديد، كاربران وبسايت شما، با كليك كردن برروي آنها وارد سايت Merchant مي شوند و از آنجائيكه لينكهاي ايجاد شده شماره اكانت شما رو در داخلشان دارند، سايت Merchant خواهد فهميد كه كاربري كه وارد سايتش شده، از طريق كدام Affiliate معرفي شده است و بسته به نوع برنامه افيليت، در صورتي كه كاربرارسال شده توسط شما، از سايت فروشنده خريد بكند و سا ثبت نام كند، به اكانت شما پورسانت اختصاص داده مي شود. اين درصدهاي حاصله در پنل شما جمع شده و درصورتيكه از يك مقدار كمينه (Min Payout) بيشتر باشد، در بازه هاي زماني مشخص شده توسط Merchant ها به حساب بانكي شما واريز مي شود و يا اينكه براي شما چك بانكي ارسال ميشود (بسته به نوع برنامه)

منبع: سايت پرشيا سئو

مدهاي Quirks و Strict دو مد كاري مختلف هستند كه مرورگرهاي مدرن براي تفسير كدهاي CSS از آنها استفاده مي كنند.

هنگامي كه Netscape 4 و اينترنت اكسپلورر 4 تفسير قوانين CSS را در مرورگرهاي خود تعبيه كردند، پشتيباني آنها از CSS با استانداردهاي W3C مطابقت نداشت. پشتيباني از كدهاي CSS مطابق با استانداردهاي W3C در مرورگر نت اسكيپ 4 بسيار ضعيف بود ولي اينترنت اكسپلورر 4 توانست تا حدودي خودش را با استانداردهاي W3C مطابقت دهد ولي اين همخواني با استانداردها بطور ناقص بود. اگرچه اكسپلورر 5 توانست مشكلات و باگهاي اكسپلورر4 را تا حدودي برطرف كند ولي خود اكسپلورر 5 مشكلات جديدي را بوجود آورد. (مخصوصآ در مدل Box)

براي اينكه طراحان وب مطمئن شوند كه وب سايت هايشان به درستي در مرورگرهاي مختلف نمايش داده مي شود، مجبور بودند كه كدهاي CSS را مطابق با خواسته ها و استانداردهاي تك تك مرورگرها بكار ببرند. استفاده از CSS به اين شكل باعث مي شد كه صفحات وب بطور كامل با استانداردهاي W3C مطابقت نداشته باشند.

از اينرو، با مهمتر شدن مسئله پيروي از استانداردها، شركتهاي سازنده مرورگرهاي وب، با انتخاب سختي روبرو شدند. آنها بايد خودشان را با استانداردها مطابقت مي دادند و اين مستلزم بكاربردن قوانين استاندارد CSS در مرورگرهايشان بود. از طرف ديگر با تغيير اين قوانين در مرورگرهاي خود باعث مي شد كه وبسايتهايي كه قبلا مطابق با قوانين قديمي مرورگرها ساخته شده بودند با مشكل بزرگي مواجه شوند. چرا كه مرورگر ها قوانين CSS را به گونه اي ديگر تفسير مي كردند.

بنابراين نزديك شدن به استانداردهاي W3C و تعبيه كردن آنها در مرورگر ها باعث ايجاد مشكلات بزرگي ميشد. از طرف ديگر عدم تطابق با استانداردهاي W3C باعث چندگانگي در قوانين و سردرگمي طراحان وب گشت.

راه حل:
هر راه حلي كه براي اين مشكل ارائه مي شود بايد بتواند:
به طراحان وب امكان انتخاب اينكه مرورگردر چه مدي كار كند را بدهد.
مرورگرها بتوانند صفحات قديمي را كه مططابق با قوانين قديمي طراحي شده اند را نمايش دهند.

به عبارت ديگر، تمامي مرورگرها بايد بتوانند در دو مد مختلف كار كنند. مد Quirks براي قوانين CSS قديمي و مد Strict براي قوانين CSS استاندارد.
اولين مرورگري كه توانست در دو مد مختلف كار كند اكسپلورري بود كه در كامپيوتر هاي Mac نصب بود و اكسپلورر 6 و Saffari و Opera و Mozilla مرورگرهايي هستند كه در دو مد مختلف كار مي كنند. اكسپلورر 5 و مرورگرهاي قديمي نظير Netscape 4 براي هميشه در مد Quirks كار مي كنند و نمي توان مد كاري را در اين مرورگر ها تغيير داد.

براي تعيين اينكه مرورگر در چه مدي كاري كند، نياز به يك تريگر است و اين تريگر در DOCTYPE بوجود آمد. طبق استانداردهاي W3C ، هر سند XHTML بايد يك DOCTYPE داشته باشد كه به مرورگر بفهماند در چه مدي كار كند.

صفحات قديمي كه قبل از پديده استانداردشدن صفحات نوشته شده اند، DOCTYPE ندارند. بنابراين عدم وجود DOCTYPE با اين مفهوم است كه مرورگر بايد در مد Quirks كند. يعني صفحه وب را بايد مطابق با قوانين قديمي CSS نمايش دهد.

در مقابل، اگر طراح وب به اندازه كافي با DOCTYPE آشنا باشد، بي شك دقيقا مي داند كه چه كاري دارد انجام مي دهد. اكثر DOCTYPE ها مرورگر را در مد Strict قرار مي دهند. يعني نمايش صفحه كاملا مطابق با استاندارد هاي W3C

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

هر DOCTYPE جديد و ناشناخته اي مرورگر را در مد Strict قرار مي دهد.

مشكل ديگري كه وجود دارد اينست كه برخي از صفحاتي كه در مد Quirks نوشته شده اند نيز داراي DOCTYPE هستند. بنابراين هر يك از مرورگرها ليستي از DOCTYPE ها را دارند كه مرورگر را در مد Quirks قرار ميدهد.

دقت كنيد كه صفحه شما نياز ندارد كه حتمآ در DOCTYPE تعريف شده Validate شود. بلكه تنها ذكر DOCTYPE براي قرار دادن مرورگر در مد Strict كافي خواهد بود. (قرار گرفتن در مد Strict نياز به داشتن كد معتبر و Valid نيست)

مشكل بغرنج ديگر: Almost Strict Mode
در آزمايشها و بررسي هاي اوليه كه بر روي مد Strict انجام شد، به اين پديده پي برده شد كه تصاوير بكار رفته در صفحه داراي اندكي حاشيه خالي در قسمت پايين تصوير بودند كه قابل حذف هم نبود. علت اين مسئله در اينجا نهفته بود كه در مد كاري Strict، بر چسب بصورا يك المان درون خطي – Inline Level عمل مي كرد و از آنجائيكه براي المانهاي درون خطي به علت وجود كاراكترهايي نظير g,j و q مقداري فضاي خالي از سمت پايين رزرو مي شود (به علت ادامه دار بودن قسمت پاييني اين كاراكترها)، براي برچسب هم اين فضا اختصاص داده مي شد.

براي حل اين مشكل، برچسب بايد بصورت يك المان Block Level تعريف مي شد.

img{display:block;} 

با اين حال، اكثر سازندگان مرورگرهاي وب، مخصوصا شركت موزيلا، تصور كردند كه اين مسئله باعث سردرگمي طراحان مي شود. براي همين منظور آنها مد كاري جديدي را تحت عنوان مد Almost Strict را بوجود آوردند. اين مد دقيقآ مشابه مد Strict بوده با اين تفاوت كه برچسب به صورت يك المان Block Level عمل مي كند. لازم به ذكر است كه اغلب DOCTYPE ها مرورگر را در مد كاري Almost Strict قرار مي دهند.

XML PROLOG مخصوص اكسپلوررهاي ويندوز:
در اينترنت اكسپلورر 6 بر روي سيستم عامل ويندوز، مايكروسافت قانون جديدي را تعبيه كرد. اين قانون بصورت زير است:
اگر قبل از اعلان DOCTYPE كه مرورگر را در مد Strict قرار مي دهد، يك XML PROLOG قرار داده شود، صفحه در مد Quirks نمايش داده خواهد شد. اين قابليت به طراحان وب امكان ميدهد كه صفحه وب Valid داشته و با اينحال در مد Quirks باقي بمانند.

XML PROLOG لازم براي اينكار بايد قبل از اعلان DOCTYPE و در اولين سطر از سورس صفحه قرار گيرد.

توجه كنيد كه اين قابليت در اينترنت اكسپلورر 7 حذف شده است.

تفاوتهاي مدهاي كاري Strict و Quirks در نمايش المان هاي صفحه:
اول از همه، تمامي امكانات پيشرفته CSS در مرورگر IE 7 فقط در مد Strict كار خواهند كرد. تفاوتهاي ديگري نيز وجود دارند كه بطور خلاصه ذيلآ با آنها اشاره خواهم كرد.

تفاوت در ارائه مدل BOX:
دو نوع مختلف از BOX Model وجود دارد. نوع قديمي و نوع W3C . پر واضح است كه مدل W3C جزو استاندارد محسوب مي شود. در مدل W3C - مقادير padding و borders در محاسبه width منظور نمي شوند. به عبارت ديگر در مدل استاتدارد، اگر يك BOX با عرض 300 پيكسل تعريف كنيم و براي اين BOX مشخصات padding و border را به ترتيب برابر 20 و 5 پيكسل تعريف كنيم، عرض واقعي اشغال شده توسط BOX برابر خواهد بود با:

300+2*20+2*5 = 350

در اينترنت اكسپلورر، اگر مد كاري را بر روي Quirks قرار داده باشيم، مدل BOX قديمي بكار برده خواهد شد. يعني در محاسبه عرض المان مقادير Borders و Padding منظور خواهد شد. ولي اگر مرورگر در مد Strict قرار گرفته باشد، مدل BOX استاندارد براي نمايش صفحه بكار برده خواهد شد.

پس براي اينكه در اينترنت اكسپلورر 6 تعيين كنيم ازچه مدلي براي BOX استفاده شود، تنها راه استفاده از DOCTYPE است. (قرار دادن مرورگر در مد Quirks يا Strict)

در مرورگرهاي Opera و Mozilla و اكسپلورر MAC مي توان با استفاده از ويژگي box-sizing نوع مدل مورد BOX را انتخاب كرد. مرورگر Saffari تنها مدل استاندارد BOX را پشتيباني مي كند.

استثناء: دكمه هاي HTML در مرورگر هاي اينترنت اكسپلورر و موزيلا، بر اساس مدل BOX قديمي نمايش داده مي شوند حتي اگر مرورگر در مد Strict باشد.


تفاوت در تفسير white-space: pre
طبق استاندارد W3C ويژگي white-space: pre بايد در همه مرورگرها عمل كند. اين ويژگي در مرور
گر اكسپلورر ويندوز تنها در مد Strict كار مي كند ولي در بقيه مرورگر ها هم در مد Quirks و هم در مد Strict عمل خواهد كرد.

تفاوت در تفسير margin: auto و width: auto
طبق استاندارد W3C براي اينكه الماني را در مركز صفحه قرار دهيم بايد از ويژگي margin: 0 auto استفاده كنيم. اين ويژگي در اكسپلورر ويندوز تنها در مد Strict عمل مي كند.

تفاوت در نحوه تفسير مقادير بدون واحد اندازه گيري:
طبق استاندارد W3C ، بايد در كنار مقادير، واحد اندازه گيري آنها نيز ذكر شود و اگر واحد يك مقدار مشخص نباشد، آن مقدار ناديده گرفته مي شود. تقريبآ همه مرورگر ها در مد Quirks براي مقادير بدون واحد از واحد پيكسل استفاده مي كنند ولي در مد Strict از استاندارد پيروي مي كنند.

تفاوت در نمايش تصاوير و تفسير برچسب
طبق استاندارد، تصاوير به صورت المانهاي Inline Level در نظر گرفته مي شوند.بنابراين كمي فضاي خالي در قسمت پايين تصاوير صفحه وجود خواهد داشت. (بنا به دليلي كه بالا توضيح داده شد.)
در مد Quirks تصاوير بصورت Block Level در نظر گرفته مي شوند. در اينترنت اكسپلورر چه در مد Quirks و چه در مد Strict، تصاوير بصورت المانهاي Block Level در نظر گرفته مي شوند (از استاندارد پيروي نمي كنند) در بقيه مرورگرها نظير موزيلا، در مد Almost Strict ، تصاوير بصورت المانهاي Block Level در نظر گرفته مي شوند و در مد Really Strict بصورت المانهاي Inline Level . براي قرار دادن مرورگر در مد Really Strcit از DOCTYPE زير استفاده مي شود.


تفاوت در نحوه تفسير overflow: visible
طبق استاندارد، اگر شما به يك المان، ارتفاع مشخصي را با استفاده از ويژگي height اختصاص دهيد، و ويژگي overflow را برابر با مقدار visible (حالت پيش فرض) قرار دهيد، اگر محتويات محصور در المان طولاني باشد به گونه ايكه در آن ابعاد نگنجد، از محدوده تعيين شده براي المان به بيرون سرريز مي شود.
اكسپلورر 6 همواره ارتفاع المان را بطور اتوماتيك به گونه اي تنظيم مي كند كه محتويات المان به بيرون سرريز نشود. يعني اكسپلورر 6 از استاندارد پيروي نمي كند چه در مد Quirks چه در مد Strcit.

در اكسپلورر 7 و Opera اين حالت فقط در مد Quirks اتفاق مي افتد. بقيه مرورگر ها چه در مد Quirks و چه در مد Strict از استاندارد پيروي مي كنند.

تفاوت در نحوه تفسير ويژگي width براي المان هاي Inline Level
طبق استاندارد، المانهاي Inline Level نمي توانند ويژگي width داشته باشند.
در مد Quirks اكسپلورر سعي مي كند با اختصاص ويژگي display: inline-blobk براي المان هاي درون خطي، از ويژگي width پشتيباني نمايد.
تفاوت در نحوه تفسير ابعاد فونت در خانه هاي جدول:
طبق استاندارد، قانون td { font-size: 80% } مشخص مي كند كه ابعاد فونت بكار رفته درون سلولهاي جدول مي بايستي، 80% ابعاد فونت بكار رفته در Body صفحه باشد.
با اين وجود در مد Quirks ، منظور از قانون فوق اينست كه متن موجود در داخل سلول جدول بايد با فونتي به ابعاد 80% سايز فونت تعريف شده بصورت پيش فرض در مرورگر كاربر نمايش داده شود. (سايز پيش فرض غالبا برابر 16 پيكسل است).

منبع: سايت پرشيا سئو

در CSS براي اندازه گيري، واحدهاي متعددي وجود دارد كه هر كدام براي مقاصد خاص استفاده مي شود. واحد هاي اندازه گيري در CSS عبارتند از:

واحد اندازه گيري Points و Picas:

اگر شما صفحه تان را براي نمايش براي مانيتور طراحي مي كنيد، نبايد از واحدهاي Points و Picas استفاده كنيد. چرا كه اين واحدها براي مقاصد چاپي بوجود آمده اند. هر Point معادل يك هفتادو دوم اينچ مي باشد. (1 Point: 1/72 Inch) و هر Pica معادل يك ششم اينچ مي باشد. (1 Pica = 1/6 Inch) بنابراين هر Pica معادل 12 point خواهد بود. اگر صفحه تان را براي چاپ طراحي مي كنيد (نسخه قابل چاپ) استفاده از واحد هاي نقطه و پيكا، بهترين انتخاب خواهند بود. بنابر اين براي طراحي صفحات وب نبايد از اين واحد ها استفاده شود. چرا كه در platform ها و مرورگر هاي مختلف، متون با ابعاد متفاوتي ظاهر خواهند شد.

واحد اندازه گيري پيكسل:

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

واحد اندازه گيري Ems:

واحد em يك واحد اندازه گيري نسبي براي فونت متون صفحه وب مي باشد. يك Em بنابر تعريف، معادل ارتفاع حرف M در فونت پيش فرض مي باشد. در CSS يك em در واقع معادل اندازه فونت پيش فرض كاربر مي باشد. به عبارتي ديگر، كاربر خواهد توانست اندازه فونت بكار رفته در صفحه وب شما را تغيير دهد.
به عنوان طراح وب، اين قابليت تغيير اندازه فونت توسط كاربر، ممكن است زياد خوش آيند نباشد. ولي از ديد كاربران اين امكان سودمند خواهند بود كه بتوانند صفحه وب شما را با فونت بزرگتر مشاهده كنند.

شما با استفاده از واحد EM مي توانيد ابعاد فونت را با اعداد اعشاري نيز تعريف نماييد. مثلا اگر بخواهيد ابعاد فونت متنتان 10%   كوچكتر از مقداري كه توسط كاربر در مرورگرش تنظيم شده است نمايش دهيد، كافيست از قانون زير استفاده كنيد:

font-size:0.9em;

و اگر بخواهيد ابعاد متن شما 10%  بزرگتر از ميزاني كه توسط كاربر در مرورگرش تنظيم شده است، باشد از قانون زير مي توانيد استفاده كنيد:

font-size:1.1em;

 واحد اندازه گيري Exes:

واحد ex يك واحد اندازه گيري نسبي براي فونت متون صفحه وب مي باشد. يك Ex بنابر تعريف، معادل ارتفاع حرف كوچك x در فونت پيش فرض تنظيم شده توسط كاربر مي باشد. متاسفانه مرورگر هاي مدرن هنوز از اين واحد اندازه گيري به طور كامل پشتيباني نمي كنند. لذا استفاده از اين واحد اندازه گيري توصيه نمي شود.

واحد اندازه گيري درصدي – Percentage:

مشابه واحد هاي اندازه گيري Ems و Exes ، واحد درصدي به كاربران اجازه مي دهد كه ابعاد فونت را تغيير دهند. براي نمايش متن با ابعادي كه بطور پيش فرض توسط مرور گر كاربر تنظيم شده است، كافيست ابعاد فونت را برابر با 100%  دهيد. (100%  معادل 1em مي باشد(.  با افزايش و كاهش ميزان درصد، مي توان متن را بزرگتر و كوچكتر نمايش داد:

font-size:100%; 

استفاده از كلمات كليدي رزرو شده:

شما همچنين مي توانيد با استفاده از كلمات كليدي رزرو شده ابعاد فونت را هم بصورت مطلق و هم بصورت نسبي تغيير دهيد.

كلمات كليدي براي تغيير ابعاد فونت بصورت مطلق:
در CSS براي تغيير ابعاد فونت بصورت مطلق از هفت كلمه كليدي استفاده مي شود:

xx-small
x-small
small
medium
large
x-large
xx-large 

اين كلمات نسبت به همديگر تعريف مي شوند و در مرورگر هاي مختلف بطور متفاوت تعبير مي شوند. بيشتر مرورگرها سايز Medium را مشابه متني كه قانوني براي ان تعريف نشده است نمايش مي دهند. و بقيه سايز ها را نسبت به سايز Medium بزرگتر و يا كوچكتر نمايش مي دهند. اينترنت اكسپلورر 5 (و اينترنت اكسپلورر 6 بسته به نوع سند تعريف شده در DOCTYPE ) سايز small را مشابه متني كه استايل براي آن تعريف نشده است نمايش مي دهند و بقيه سايز ها را نسبت به small بزرگتر و يا كوچكتر نمايش مي دهند.

اين واحد ها از آنجائيكه از المان پدر هيچ چيزي را به ارث نمي برند، مطلق خوانده مي شوند ولي بر خلاف واحدهاي پيكسل و پوينت، به كاربر اين امكان را مي دهند كه سايز متن را در مرورگر خود افزايش و يا كاهش دهند. مشكل عمده اي كه در رابطه با استفاده از كلمات كليدي براي واحد هاي اندازه گيري مطلق وجود دارد اينست كه بطور مثال متني كه سايز آن برابر x-small قرار داده شده است ممكن است در يك مرورگر به خوبي قابل مشاهده باشد ولي در مرورگر ديگر قابل خواندن نباشد.

كلمات كليدي براي تغيير ابعاد فونت بصورت نسبي:
كلمات كليدي كه براي اندازه گيري نسبي از آنها استفاده مي شود عبارتند از larger و smaller . كه ابعاد خود را از المان پدر – Parent Element اخذ مي كنند. (مشابه واحد هاي اندازه گيري em و % ). بنابراين اگر شما اندازه متن موجود در برچسب

را به small تنظيم كرده باشيدو بخواهيد قسمتي از متن را با تاكيد بيشتري نمايش دهيد، كافيست قوانين زير را تعريف كنيد:

p{ font-size:small;}
em{font-size:larger}

در كد HTML زير متن موجود بين برچسبهاي با فونت بزرگتر نسبت به بقيه متنهاي موجود در پاراگراف نمايش داده مي شوند. (در اين مثال المان

در واقع پدر – Parent المان مي باشد)

This is a sample text which shows how relative keywords are used in css
  

واحد هاي اندازه گيري نسبي و مسئله وراثت – Inheritance:
هنگامي كه شما از واحد هاي اندازه گيري نسبي استفاده مي كنيد، به اين نكته توجه داشته باشيد كه المان مربوطه سايز خود را از المان پدر به ارث مي برد. (همانگونه كه در مثال فوق مشاهده كرديد) اين موضوع به راحتي در ساختارهاي ساده به راحتي قابل درك است. اما اين وراثت در Layout و چيدمانهاي پيچيده و تو در تو كه در آنها المان پدر براحتي قابل تشخيص نمي ياشد ممكن است كمي مشكل ساز باشد. براي روشن شدن موضوع به ذكر يك مثال اكتفا مي كنيم.

فرض كنيد شما مي خواهيد متني كه درون سلولهاي يك جدول (در HTML براي مشخص كردن يك خانه از برچسب استفاده مي شود) نمايش داده مي شود به اندازه 80% سايز پيش فرض تعيين شده در مرورگر كاربر باشد. براي اين منظور قانون CSS را بصورت زير تعريف مي كنيم.

td{ font-size:100%;} 

در صفحه اي كه از جداول تودرتو خبري نيست، متن كمي كوچكتر از حالت پيش فرض نمايش داده خواهد شد. ولي در ساختاري كه از جداول تودرتو استفاده شده است، موضوع كمي عجيب به نظر مي رسد.

بطور مثال در كد زير، متن رفته رفته كوچكتر نمايش داده مي شود چرا كه هر المان ابعاد فونت المان پدر را به عنوان سايز پايه در نظر مي گيرد. به عبارتي ديگر در ساختر فوق متن اول به اندازه 80%  سايز پيش فرض و متن دوم به اندازه 64%  پيش فرض و متن سوم به اندازه 51.2% سايز پيش فرض نمايش داده مي شود.

	
		
	
 
جدول اولي
			



				
					
جدول دوم
						



							
								
جدول سوم
							
						

					
				
			

		
 

منبع: سايت پرشيا سئو