Shaho Toofani

iDevCenter دوباره آمد!

2008-11-23T04:58:32.0000000-05:00

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

نمایش صحیح تصاویر شفاف PNG در اینترنت اکسپلورر نسخه 6

2008-07-30T11:25:58.0000000-04:00

اکثر مرورگرهای مدرن امروزی از جمله فایرفاکس و سافاری تصاویر شفاف با فرمت PNG را بصورت صحیح و بدون مشکل رندر می کنند و نیازی به استفاده از روش های CSS Hacks ندارند، اما تا زمان ارایه Internet Explorer نسخه 7 مرورگرهای نسخه ی پایین تر IE بدرستی تصاویر Transparency PNG را که زمینه آن ها بصورت شفاف و به عبارتی بصورت شیشه ایی هستند را پشتیبانی نمی کنند. ممکن است بپرسید که آیا هنوز کسی از اینترنت اکسپلورر نسخه 6 یا پایین تر استفاده می کند؟ اگر نگاهی به آمار بازدیدکننده های وب سایت تان بیاندازید عده ایی هنوز هستند! بنظر می رسد طراحی Cross-Browser بودن سایت و سنجیدن جوانب مختلف یکی از مشخصه های کار حرفه ایی طراحان وب امروزی می باشد.

روش های مختلفی برای نمایش صحیح تصاویر شفاف PNG در اینترنت اکسپلورر نسخه 6 وجود دارند از جمله اسکریپت IE5.5+ PNG Alpha Fix، اسکریپت SuperSleight و استفاده از روش توضیح داده شده در ntlworld
از زمان انتشار اینترنت اکسپلورر 5.5 خصوصیتی ارایه شد بنام AlphaImageLoader که نوعی filter می باشد که می توان بصورت مستقیم در CSS یا جاوااسکریپت برای تگ های img تعریف کرد ( چه بصورت inline و چه بصورت background ).
یکی از مشکلات اساسی استفاده از این روش آنست که چون خصوصیت filter در CSS بوسیله کنسرسیوم جهانی وب W3C تعریف نشده است در نتیجه هنگام اعتبار سنجی ( Validation ) کد CSS نمی توان آنرا pass کرد و در نتیجه کد CSS معتبر شناخته نمی شود.

برای حل این مشکل می توان از اسکریپتی تحت عنوان Unit PNG Fix استفاده کرد، که از مشخصات بارز آن علاوه بر حل مشکل اعتبار سنجی کد CSS و نمایش صحیح تصویر شفاف PNG می توان به کم حجم بودن (کمتر از یک کیلوبایت)، اعمال به تگ img و خصوصیت background-image، فراخوانی آسان و سریع آن اشاره کرد.

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


<!--[if lt IE 7]>
        <script type="text/javascript" src="unitpngfix.js"/>
<![endif]-->

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

برای آگاهی بیشتر در مورد فرمت PNG می توانید نوشته "فورمت PNG پادشاه فورمت های تصویری در خلق صفحات وب" را مطالعه کنید.

چرا استفاده از جدول برای طرح‌بندی صفحات وب احمقانه است

2008-07-19T09:19:49.0000000-04:00

سابقاً جدول در HTML فقط به یک علت حضور داشت: نشان دادن اطلاعات با ساختار جدولی. اما بعدها جدول با خصوصیت border=0 بستری را در اختیار طراحان گذاشت که بتوانند طرح‌بندی تصاویر و متن را روی آن قرار دهند. استفاده از جدول‌ها که همچنان غالب‌ترین وسیله طراحی صفحات پرزرق‌وبرق وب است، در واقع اکنون با ساختن صفحات اینترنتی بهتر، و با قابلیت دسترسی، انعطاف‌پذیری وعملکرد بالاتر در تعارض قرار گرفته است.

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

چرا استفاده از جدول برای طرح‌بندی صفحات وب احمقانه است؟
مرور کلی: اینها به چه درد من می‌خورد؟
جدول‌های تودرتو و GIFهای فضانگهدار
مشکلات استفاده از جدول
راه‌حل: CSS و کد ساختاری
یک‌بار بنویسید، هرجایی استفاده کنید، برای همه‌کس
طراحی با CSS
کد معنایی
نوار منو چیست؟
مهاجرت از حقه‌های جدولی به استانداردهای وب
تجزیه کردن صفحات‌تان
تگ‌های نمایشی را با کدهای ساختاری جایگزین کنید

خواندن و بکاربردن این ترجمه روان و کاربردی را به علاقه مندان و طراحان وب توصیه می کنم.

Spamming و مقابله با آن توسط Waegis

2008-07-11T16:33:31.0000000-04:00

Spamming این روزها یک بحث داغ است! از Spamهای سنتی email تا spam نظرهای یک وبلاگ، فروم، ویکی و ... که خواسته یا ناخواسته به سراغتان می آیند. نمونه های جدید آنرا همرا با پیشرفت صنعت موبایل شاهدیم و در حال حاضر برای خلاص شدن از شر! آنها راه حل مطلقی وجود ندارد. همچنان که در دنیای زندگی روزانه واقعی آنچه ناخواسته و مزاحم است را نیز می توان اسپم بحساب آورد. [مثل همین چهاربلندگوی مسجد محترم محل ما – که زندگانی صبحگاهی را برهرجنبنده ای در اطراف آن Spam-based کرده است!]. در دنیای مجازی مقابله با spam وارد مرحله ی تازه ایی شده است چنانچه Business های پررونقی شکل گرفته که خدمات و راه حل های مبارزه با آن را اعم از رایگان و غیر رایگان را ارئه می دهند.

spam کامنت ها، تراک بک ها و فرم های تماس و نتایج جستجو را هدف قرار داده است که این علاوه بر آنکه شناسایی و حذف آنها را وقت گیر و سخت کرده، حجم دیتابیس مورد استفاده سایتها را بالا برده و در اکثر موارد بر شکل ظاهری سایت ها هم تاثیر می گذارد. یکی از راه حل های مبارزه با Spam و طبعات آن استفاده از CAPTCHA است، که به تعبیری انداختن توپ از زمین دارنده سایت (صاحب سایت) به زمین شخص بازدید کننده سایت است. اما CAPTCHA علاوه برآنکه باعث هدر رفتن وقت بازدید کننده می شود دارای مشکلات زیادی اعم از Visibility، Readability و Accessibility است که این خود مغایر اصول اساسی استانداردهای طراحی وب نیز هست. از این گذشته راه های زیادی برای دور زدن CAPTCHA توسط اسپمرها دیده شده و استفاده از آنرا نامطمئن کرده است.

راه حل بهتر برای مبارزه با spam در سایت ها استفاده از وب سرویس های ارائه شده برای شناسایی و بعبارتی ف-ی-ل تر آنهاست
کاربران وردپرس احتمالا با سرویس ضد اسپم Aksimet آشنا هستند همچنانکه سرویس های دیگری مانند Typepad برای وبلاگ های مبتنی بر MovableType و Defensio برای پلتفرم Ruby on Rails وجود دارد. در این میان توسعه دهندگان ASP.NET تا چند روز پیش از داشتن یک سرویس اختصاصی برای سایت های مبتنی بر دات نت مایکروسافت بی بهره بودند.

Waegis – بخوانید وی جِس – یک سرویس ضد اسپم جدید است که توسط کیوان نیری ارائه شده و در حال حاضر نسخه ی بتای آن آماده استفاده است. Waegis در واقع یک API آماده با قابلیت سفارشی سازی برای سیستم های معروف حاضر وبلاگ نویسی اجرا شده توسط پلت فرم دانت نت است و از الگوریتم پیچیده ایی برای شناسایی، حذف و ف-ی-ل تر کردن عناصر ناخواسته بهره می گیرد. بعد از ثبت نام در Waegis و گرفتن یک API Key اختصاصی و خواندن راهنمای آن می توانید به سرعت از شر! Spam های سایت تان رهایی پیدا کنید.

به عنوان عضوی از تیم Waegis که طراحی Theme و گرافیک سایت بر عهده ام بود برای استاد کیوان نیری آرزوی موفقیت هر چه بیشتر می کنم.

راهنمای مصور نصب MySQL تحت ویندوز

2008-06-28T10:52:07.0000000-04:00

نوشته حاضر بخش دوم از سلسله مقالاتی است درباره چگونگی نصب
Apache-PHP-MySQL تحت ویندوز. جهت ادامه به دانسته ها و نصب Apache تحت ویندوز در بخش اول و همچنین دانسته ها و نصب PHP در بخش دوم نیاز دارید.

گام یک برای دانلود آخرین نسخه MySQL به آدرس زیر بروید.

http://dev.mysql.com/downloads

و روی گزینه دانلود نسخه Community Server کلیک کنید. (شکل زیر)

گزینه ای را که در شکل زیر با فلش مشخص شده انتخاب نمایید.

در صفحه پدیدار شده نسخه ویندوز را انتخاب کرده و روی لینک Pick a mirror روبروی نسخه Windows Essential (x86) کلیک کنید.

در انتهای صفحه پدیدار شده گزینه : No thanks, just take me to the downloads! را انتخاب کنید.

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

سپس فایل را در پوشه Downloads واقع در درایو C ذخیره نمایید.

گام دو در پوشه Downloads واقع در درایو C روی فایل نصب MySQL دوبل کلیک کنید و گزینه Next را انتخاب کنید.

گزینه Typical را انتخاب کرده و Next را بزنید.

محل نصب پیش فرض را بدون تغییر قبول کرده و گزینه Install را کلیک کنید.

زمانی حدود 30 ثانیه طول می کشد که MySQL نصب شود.

سپس دو بار گزینه Next را کلیک کنید تا به پنجره پایانی Wizard برسید. دقت کنید که چک مارک

Configure the MySQL Server now

تیک خورده باشد. سپس گزینه Finish را کلیک کنید.

سپس در پنجره بعد (Configuration) گزینه Next را کلیک کنید.

دقت کنید حالت Detailed Configuration انتخاب شده و سپس Next را انتخاب کنید.

سپس حالت Developer Machine را انتخاب و Next را کلیک کنید.

سپس گزینه Multifunctional Database را انتخاب و Next را کلیک کنید.

مسیر پیش فرض نصب (Installation Path) را بدون تغییر به حال خود رها کرده و گزینه Next را کلیک کنید.

دقت کنید گزینه Decision Support (DSS)/OLAP انتخاب شده و سپس Next را کلیک کنید.

در پنجره بعد هر دو چک مارک را انتخاب شده باقی گذاشته و Next را انتخاب کند.

گزینه Best Support For Multilingualism را انتخاب کرده و Next را کلیک کنید.

در پنجره بعد دقت کنید که هر سه چک مارک تیک خورده باشد. سپس Next را کلیک کنید. (مانند شکل زیر)

سپس اطمینان یافته که چک مارک Modify Security Settings تیک خورده باشد و دو بار کلمه admin را برای قسمت Password وارد کنید. بعد گزینه Next را کلیک کنید.

در انتها گزینه Execute را کلیک کنید.

سپس چند ثانیه صبر کرده تا پنجره نهایی ظاهر شود. سپس گزینه Finish را انتخاب کنید.

گام سه برای ساختن یک دیتابیس نمونه در MySQL ابتدا از Start ویندوز گزینه Run را انتخاب کنید. عبارت cmd را تایپ کرده و OK را کلیک کنید.

در پای اعلان DOS عبارت mysql -u root -p را تایپ کرده و برای Password کلمه admin را تایپ کرده تا با خط فرمان MySQL مواجه شوید.

در خط فرمان کلاینت MySQL ابتدا یک دیتابیس بنام demo بسازید (مانند شکل)

سپس در دیتابیس demo یک جدول بنام members با دو ستون firstName و lastName بسازید.

سپس دو رکورد نمونه به جدول members اضافه کنید.

در انتها از جدول members با دستور Select یک کوئری برای نمایش رکورد ها گرفته و با دستور quit;.از خط فرمان کلاینت MySQL خارج شوید.

گام چهار برای پیکره بندی PHP5 و MySQL ابتدا فایل php_mysqli.dll واقع در c:\php\ext را به دایرکتوری ریشه php یعنی c:\php کپی کنید.

فایل php.ini واقع در c:\php\php.ini را در ادیتور دلخواه باز کرده و خطوط زیر را در آن از حالت توضیح (Comment) خارج کنید. در واقع بایستی علامت ; را از جلوی دو گزینه حذف کنید.

گام پنج برای اینکه تغییرات فوق روی سرور Apache اعمال شود بایستی یکبار سرور Apache را Restart کنید. برای اینکار روی آیکون سرور Apache2 واقع در Task bar کلیک کرده و گزینه Restart را انتخاب کنید. بعد از حدود بیست ثانیه سرور Restart شده و تغییرات اعمال می گردد.

گام شش برای تست پیکره بندی PHP5 و MySQL و ارتباط صحیح PHP5 با دیتابیس MySQL یک فایل با نام

testmysql.php

در مسیر

c:\webs\test\

بسازید. و خطوط کد زیر را - که برای نمایش رکوردهایی که قبلا به جدول members از دیتابیس demo اضافه کردیم – در آن تایپ کرده و آنرا ذخیره کنید.

یادآوری : تکنولوژی PHP یک زبان Case-Sensitive است. پس در وارد کردن قطعه کد زیر دقت لازم را به خرج دهید.


<?
$mysqli = new mysqli('localhost','root','admin');
$mysqli->select_db('demo');
$result = $mysqli->query("SELECT * FROM members");
while($row = $result->fetch_assoc()) 
{
print  $row['firstName'] . ' ' . $row['lastName'] . '<br/>';
}
$result->close();
?>

گام هفت در پایان در مرورگرتان آدرس http://localhost/testmysql.php را وارد کنید.

اگر خروجی شما مانند شکل فوق بود (البته شاید مقادیر دو رکورد شما فرق کند) بدین معنی است که PHP5 بدرستی با دیتابیس MySQL در ارتباط است.

از این به بعد می توانید صفحات php خود را در پوشه c:\webs\test ساخته و یا پکیج های آماده ایی که از PHP و MySQL استفاده می کنند را در سیستم خود نصب کنید.

ناهماهنگی مرورگرها در رندر مقادیر پیش فرض CSS و راه حل آن

2008-06-23T16:21:17.0000000-04:00

هر مرورگری عناصر (بخوانید تگ ها) html را براساس الگوریتم پیش فرض موتور خود رندر می کند و این سرآغازی است! بر مشکلی بنام دیده شدن صفحات سایت شما بصورت متفاوت در مرورگرهای مختلف، بعنوان مثال مقادیر padding، margin و border در مرورگرهای مختلف بصورت پیش فرض فرق می کند که این، یکی از مهمترین مشکلاتی خواهد بود برای طراحی یک صفحه – سایت Cross-Browser.

یکی از بهترین از راه حل ها استفاده از تکنیکی است بنام راه اندازی مجدد خصوصیات پیش فرض CSS. و به تعبیری قابل فهم تر Reset کردن استایل های CSS!. یک reset نمونه کد CSSی است که در ابتدای فایلهای CSS قرار می گیرد برای پاک کردن padding، margin و ... های مختلف در نسخه های متفاوت مرورگرها و و دوباره ساختن صفت های پیش فرض تگ های html با آنچه در اصل بوده است.

نسخه های متفاوتی از reset کردن استایلها وجود دارد اما پیشنهاد می کنم فایل reset، (از Eric Meyer ) را دانلود کرده و در ابتدای فایلهای CSS از آن بهره بگیرید و نتیجه را در مرورگرهای مختلف ببینید.

SEO برای طراحان وب

2008-06-09T10:05:50.0000000-04:00

موتورهای جستجو یکی از مهمترین ابزارهای ترویج و بازاریابی برای سایت ها هستند. روزانه درصد زیادی از افراد برای پیدا کردن سایتها، محصولات و خدمات از موتورهای جستجو استفاده می کنند. بنابراین لیست شدن در موتورهای جستجو برای هر سایت مهم است. اما ثبت شدن تنها، در موتورهای جستجو تضمینی برای موفقیت نیست. کاربران فقط چند صفحه اول نتیجه جستجو را می بینند و اگر چیزی را که می خواهند پیدا نکنند، با کلمات دیگری دوباره جستجو می کنند. بنابراین رقابت زیادی برای بالا بردن رتبه یک سایت ( Top Ranking ) در نتیجه جستجو وجود دارد.
نیما نیازمند - سایت جانانه

چرا به SEO نیاز دارید؟

1. SEO تنها یک business آنلاین و یک Package اضافی ارائه شده توسط خدمات hosting نیست. برای یک طراح وب و برنامه نویس در دنیای وب، بهینه سازی پروژه تحت وب جهت موتورهای جستجو امری حیاتی است.

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

3. کسب Ranking بالا برای یک سایت فواید زیادی در برخواهد داشت. برای مثال در یک سایت که بطور متوسط در روز 14000 بیننده دارد، براساس آمار 45% تا 60% ترافیک همین سایت بوسیله موتورهای جستجو ایجاد شده است. (پس داشتن Rank بالاتر یعنی شانس قرار گرفتن در صفحات ابتدایی موتورهای جستجو)
چنانچه سایت فاقد ورودیهایی از طریق موتورهای جستجو باشد بسیاری از ویزیتورهای روزانه را از دست خواهد داد. بعبارتی دیگر، ریسک از دست دادن پتانسیل موجود در جهت بدست آوردن تعداد ویزیتور بیشتر.

4. SEO برای خدمات وب، حکم ارزش افزوده یا Value–added را دارد. یک برنامه نویس و طراح وب، میتواند از مهارتهای خود در زمینه SEO بعنوان یک سرویس تخصصی، مکمل و دارای ارزش افزوده برای خدمات وب بهره مالی ببرد.

بدیهی است که منظور از نرخ - Rank - بالای هر صفحه در موتورهای جستجو، بیشتر دیده شدن و کشاندن تعداد ویزیتور زیادتری به آن سایت است ، یعنی همان هدف اصلی هر سایت و موضوع اصلی مبحث SEO یا بهینه سازی موتور جستجو .

اصول کلی : موتورهای جستجو چگونه کار می کنند؟

نخست باید بدانیم که موتورهای جستجو مبتنی بر روبوت های خزنده در صفحات چگونه کار می کنند. چگونه در اجزای صفحات پیشرفته و اصطلاحا در آن واکاری می کنند. (با این توضیح که هم Google و هم Yahoo در این دست موتورهای جستجو قرار می گیرند).

هر موتور جستجو بمنظور دسترسی، واکاوی و اصطلاحا خزیدن در صفحات وب دارای یک برنامه خودکار بنام "web spider" است. اصلی ترین هدف spider ، خزیدن در صفحات وب، خواندن آنها ، جمع آوری مطالب و تعقیب کردن لینکهاست. (هم لینک های داخلی و هم لینک های خارجی). سپس spider اطلاعات جمع آوری شده را به بانک اطلاعات موتور جستجو باز پس می فرستد تا به اصطلاح فهرست بندی -index- شود.

هر بار که فرد جستجوگر، کلمات مورد نظر خود را در کادر جستجوی موتور جستجو وارد می کند، کار موتور جستجو یافتن بهترین- نزدیکترین نتیجه ی موجود، واقع در فهرست خود است.

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

نقش شما بعنوان یک بهینه گر صفحات در موتورهای جستجو

هر موتور جستجو گر دارای الگوریتم خاص خود برای نرخ دهی (Ranking) صفحات وب است. آشنایی با فاکتورهای اصلی تاثیر گذار در این الگوریتم ها، تاثیر مستقیمی در رده بندی صفحه – سایت و نتایج پرس و جو شده دارد، و این دقیقا همان نقش اصلی متخصصین SEO است.

بطور کلی بایستی در تکنیک های مربوطه به SEO به دو جنبه ی Off-site و On-site توجه داشت.

1. On-site SEO : متدها و تکنیک هایی است که شما در سایت انجام می دهید. از قبیل روش نوشتن HTML و توجه به استانداردها، کلمات کلیدی ، لینک های درون سایت، چیدمان درون سایت و ...

2. Off-site SEO : مواردی هستند که کنترل بسیار کمتری بر روی آنها وجود دارد، از قبیل چگونگی و تعداد لینک های خارجی که به صفحات سایت شما وارد و داده می شود.

هدف اصلی این نوشته آن جنبه های On-site است که در کنترل شما یا بعبارتی، طراح – برنامه نویس سایت است. واضح است اگر طراح – برنامه نویس سایت، کار خود را به درستی انجام دهد و سایت طراحی شده زیبا و استاندارد می باشد و نیز مطالب سایت در زمینه خود معتبر می باشد. باز خورد گرفتن و فهرست شدن سایت بیشتر و بهتر بوده و این همان جنبه ی Off-site خواهد بود.

متداولترین اشتباهاتی که طراحان – برنامه نویسان در زمینه ی SEO مرتکب می شوند

1- صفحات Splash

هنگامیکه صفحه ی ورودی یا Home page یک سایت در برگیرنده یک بنر بزرگ گرافیکی شامل انواع و ارقام متنهای خوش آمد گویی و ... است و ویزیتور مجبور است یک یا چند کلیک اضافه تحت عناوین «برای ورود به سایت اینجا را کلیک کنید» یا «لینک ورود به سایت» و مواردی از این دست را اجرا نماید، پتانسیل بازگشت ویزیتور به سایت در همان ابتدایی کار به مقدار زیادی از دست خواهد رفت.

بدترین حالت هنگامی روی می دهد که در ورودی سایت، گرافیک یا انیمیشن "فلش" قرار گرفته که شامل لینک ورود یا enter در آن، در intro فلش است و دسترسی روبوتهای موتور جستجوها را به آن عملا غیر ممکن می سازد.
البته اگر به موتورهای جستجو اهمیتی داده نشود این تکنیک می تواند مورد استفاده قرار گیرد.

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

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

2- منوهای فلشی که قابل دستیابی توسط موتورهای جستجو نمی باشند

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

3- محتویات تصویری و متحرک (Image and Flash content)

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

4- استفاده بیش از حد Ajax

بسیاری از برنامه نویسان وب تلاش می کنند با استفاده بیش از حد از تکنولوژی Ajax، مخصوصا در سیستم Navigation سایت، ویزیتورها را تحت تاثیر قرار می دهند، اما این امر یکی از بزرگترین اشتباهات SEO محسوب می شود. توجه داشته باشید چون محتوی Ajax بصورت داینامیک Load می شوند، این محتوی، توسط spider موتورهای جستجو قابل رهگیری و فهرست بندی نخواهند بود. نکته ی دیگر آنکه چون آدرس – URL – در قسمت هائی که از Ajax استفاده شده است، تغییر نمی کند، ویزیتور نمی تواند از این دست محتوی صفحات را برای بازدید دوستان بفرستد.

5- نسخه گذاری قالب (theme) طراحی

بدلایلی برخی از طراحان وب دوست دارند که نسخه های طراحی شده سایت را، به ترتیب در زیر شاخه هایی از ریشه سایت قرار دهند (بعنوان مثال
domain.com/v2 , v3 , v4) و صفحه اصلی (Homepage) را هر از چندگاهی، به این زیر شاخه ها ارجاع دهند. تغییر مکان ثابت ریشه ی سایت موجب از دست رفتن لینک های ورودی دیگران به سایت و نیز واگرایی و عدم Rank مناسب برای صفحات سایت می شود.

6. متن «کلیک کنید» در لینک به صفحات

در بسیاری از مواقع عبارات «کلیک کنید» ، «بیشتر» ، «ادامه» در متن بکار گرفته شده لینک ها به صفحات آمده است. این می تواند برای دسته بندی عبارات فوق Rank بالایی در موتورهای جستجو کند!، اما اگر منظور شما آنست که به موتور جستجو بگوئید که کدام صفحه، برای یک موضوع خاص در سایت اهمیت بیشتری دارد و شامل کل مطلب آن موضوع است، می توانید عبارت موضوع صفحه را بعنوان متن لینک به آن صفحه بکار ببرید.

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

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

7- اشتباهات در عنوان دهی صفحات بصورت مشابه و یکسان

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

مثلا یکی از اشتباهات مصطلح، روش پیش فرض عنوان دهی صفحات درکل قالب سیستم مدیریت وبلاگ Wordpress است. روش پیش فرض عنوان دهی ورد پرس بصورت :

site name > blog archive > post title

می باشد. اما چرا این روش مفید نیست؟
چنانچه توجه نمائید، دیده می شود که کلیه صفحات دارای یک متن یکسان
«site name > blog archive» در ابتدای تگ title هر صفحه هستند. برای غلبه بر این مشکل و قرار دادن نام سایت علاوه بر عنوان صفحات، بهتر است نام سایت را در آخر عنوان مطالب با فاصله و یا یک کاراکتر خاص بکار ببرید، مثلا
عنوان پست / نام سایت
یا

post title / site name

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

استفاده از لغات مشابه و مترادف در عناوین
بیاد داشته باشید که تکرار لغات مشابه در عنوان صفحه می تواند آن صفحه را بعنوان spam به موتور جستجو معرفی می نماید. در چنین حالاتی می توان لغات مشابه و مترادف را به راههای گوناگون در عنوان صفحه بکار برد.

مثلا عنوان صفحه ایی : «روشهای عکاسی و نکات تصویر برداری برای گرفتن یک عکس حرفه ای» شامل واژه عکس در دو شیوه ی نوشتاری متفاوت است. و طیف وسیعتری از نتایج پرس و جوی انجام شده بوسیله موتورهای جستجو که بدنبال واژه هایی نظیر عکس، عکاسی، تصویر برداری هستند را در بر می گیرد.

8. تعریف نکردن خصوصیت Alt در تگ تصاویر

همیشه باید یک تعریف، هر چند کوتاه، برای خاصیت alt تصاویر بکار رفته در صفحه مشخص نمود. خصوصیت alt موضوع عکس را برای کاربران نابینا توصیف می کند. حقیقت آنست که موتورهای جستجو نمی توانند- مانند انسان- تصاویر را ببیند .توصیف و توضیح صحیح در مورد تصاویر می تواند نرخ- Rank – نتایج موتورهای جستجوی تصاویر را بالا ببرد

9. آدرس (URL) های نامفهوم برای موتورهای جستجو

بسیاری ازسیستم های مدیریت محتوی – CMS – دارای ویژگی پیش فرض برای آدرس دهی صفحات بصورت دوست کاربر – User friendly – هستند. آدرس های User friendly علاوه بر خوانایی بهتر، قابلیت بخاطرسپاری آسانتر، و منطبق بودن بر استانداردهای وب، یک کلید اصلی برای موتورهای جستجو بشمار می روند. بدین ترتیب که یکی از فاکتورهای اصلی spider موتورهای جستجو در ارزش گذاری و فهرست بندی صفحات آدرس های User friendly صفحات هر سایت و کلمات کلیدی بکار برده شده در آنهاست.

مثلا آدرس domain.com/page–title ، خواناتر، بخاطر سپاری آن آسانتر و User friendly تر از آدرس domain.com/?p=123456 خواهد بود.

فاکتورهای عمومی که برای انجام دادن یا ندادن در SEO باید در نظر گرفت

مخاطبان را در نظر بگیرید

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

میتوان از هزاران ابزار رایگان در وب استفاده کرد، بعنوان مثال، سرویس کلمات کلیدی Google یا SEO book's keyword می تواند انتخاب خوبی باشد. با یک جستجوی ساده می توان ایده های کلی و حتی خلاقانه در این مورد را بدست آورد.

پتاسیل کلمات کلیدی را در نظر داشته باشید

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

در عنوان مناسب و صحیح تگ title صفحه
در آدرس دهی درست بصورت User friendly صفحه
در عنوان دهی به تیترهای اصلی مطالب که معمولا در تگ های h1 و h2 پدیدار می شود.
در پاراگراف ابتدایی مطلب اصلی صفحه – topic sentence –
حداقل سه بار در کل متن صفحه (البته کمتر یا بیشتر بودن آن به نوع مطلب شما بستگی داشته و نیز بتواند به کل مطالب معنی صحیحی بدهد.)

نکته مهم آنکه همیشه این مورد را در نظر داشته باشید که ابتدا برای مخاطبان سایت می نویسد نه برای موتورهای جستجو هر گاه نکات مطرح شده در این نوشته را رعایت نمائید، برای مخاطبانتان نوشته اید و مخاطب بیشتر یعنی نرخ – Rank - و ترافیک بیشتر.

هشدار : با وجود توصیه های بالا در نظر داشته باشید که استفاده مکرر و بعبارتی پر کردن صفحه با کلمات کلیدی جهت فریب spider موتورهای جستجو، امکان بلاک کردن و شناخته شدن صفحه – سایت را توسط روبوت جستجو بالا بوده و طبیعتا نتیجه ای معکوس بهمراه خواهد داشت. (Keyword stuffing)

کلمات مرتبط با موضوع در نوشته را در نظر داشته باشید

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

به موتورهای جستجو در شناسایی صفحات سایت کمک کنید

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

لینک های شکسته در سایت را بشناسید

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

حالتی وجود دارد که شما بعد از مدتی صفحه ای یا بخشی از سایت را بنا دلایلی حذف می کنید، در این مورد می توانید با استفاده از فایل robot.txt (بزودی نوشته ای در مورد اختار فایلهای robot.txt و چگونگی کار با آن را در همین سایت خواهید خواند) از ایندکس شدن و دسترسی spider موتورهای جستجو به بخش های حذف شده جلوگیری کنید. در حالتی دیگر بسته به نوع تکنولوژی که سایت شما براساس آن بر پا شده است ، می توانید از امکانات آن تکنولوژی برای redirect کردن بخش ها و صفحات جابجا شده و حتی کل یک سایت به آدرس جدید بهره ببرید. مثلا بوسیله فایل htaccess. در php و در قسمت 301 آن مبادرت به این امر بورزید.

یک حالت دیگر برای سایت هایی پدید می آید که به مرور زمان و افزایش صفحات و بخش های سایت، پیدا کردن دستی و چک کردن کلیه لینک های داخلی و تهیه لیستی از صفحاتیکه وجود ندارند و یا جابجا شده اند، به امری وقت گیر و گاه ناممکن تبدیل می شود. برای انجام اتوماتیک پروسه بالا ابزارهای بسیاری اعم از رایگان و یا مستلزم پرداخت هزینه یافت میشود . اما باز هم سرویس رایگان ابزار وب مستری گوگل به صحنه می آید. یکی از ویژگیهای سرویس رایگان Google Webmaster Tools پیدا کردن لینک ها شکسته و صفحات یافت نشده 404 در وب سایت است.

از یک آدرس واحد برای domain سایت بهره بگیرید

از نظر موتورهای جستجو، آدرس های همراه www در ابتدای نام domain و بدون www بعنوان دو آدرس متفاوت تعبیر می شوند . بخاطر داشته باشید که همیشه ساختار آدرس domain سایت را بصورت ثابت در همه جا بکار ببرید. مثلا اگر در معرفی سایت خود در جاهای مختلف از آدرس بدون www استفاده کردهاید، از آن قاعده مشخص در همه جا (چه لینک های داخلی و چه لینک های خارجی) استفاده کنید و برعکس.

برای مطالعه در این زمینه نوشته "نشانی هایی بدون www" را از علی ستاری بخوانید.

از کاربرد کدهای معنایی – semantic – در سایت پرهیز نکنید!

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

مکان صفحه – سایت در نتایج جستجو

بطور یقین کدینگ و برپایی صفحه- سایت براساس تکنیکهای SEO Friendly می تواند در بهبود جایگاه آن صفحه- سایت در نتایج و ارزشگذاری بهتر در موتورهای جستجو کمک شایانی کند. با این وجود گارانتی مطلقی برای آنکه صفحات سایت درصدر نتایج صفحه ی جستجو نمایش داده شوند نیست. (SERP)

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

بعضی از معیارهای پایه ای موتورهای جستجو برای رتبه بندی و نمایش سایت عبارتند از :

Page Rank

بسیاری از متخصصین SEO برای Page Rank سایت گوگل اهمیت زیادی قائلند. Page Rank گوگل از الگوریتم پیچیده ایی برخوردار است. با این توصیف، با دنبال کردن حداقل باید و نبایدهای آورده شده در این نوشته می توانید Page Rank صفحه – سایت را بهبود بخشید. در این زمینه می توانید نوشته ی ارزشمند مجله ی Smashing را در مورد Page Rank مطالعه نمایید.

مدت زمان فعالیت یک آدرس وب – domain –

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

صبور باشید!

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

استیل دهی تگ hr بصورت Cross Browser

2008-05-27T17:23:12.0000000-04:00

معمولا بکار بردن تگ hr در طراحی صفحات وب دردسرهای مختص به خود را داراست از جمله مهمترین آنها نشان دادن شکل و شمایل آن بصورت یکسان است در انواع مرورگرهای وب (Cross Browser) با اِعمال انواع و اقسام عمگرها CSS.

روش زیر یکی از راه های سریع و ساده ایست که می توان برای استیل دهی به یک تگ hr بکار برد. ابتدا تگ hr را در داخل یک تگ div نوشته و یک کلاس مثلا بنام hrDiv به آن نسبت دهید:


<div class=”hrDiv”>
	<hr />
</div>

سپس در CSS کلاس hrDiv خاصیت clear آن را به both ست کنید. این نکته بخاصر آن است که اطمینان حاصل کنیم که div به هیچ عنصر دیگری در طرفین چپ و راست اجازه شناور شدن (float) نمی دهد.

سپس از یک تصویر یک پیکسلی (یک نقطه) بعنوان زمینه برای اِعمال افکت یک خط ممتد در راستای افق برای div استفاده کرده و برای پنهان کردن hr خصوصیت display آن را به hidden ست می کنیم. توجه داشته باشید که با وجود پنهان کردن تگ hr هنوز آن تگ در کد html پابرجاست.


.hrDiv
{
    clear:both;
    height: 1px;
    background: url(images/dot.gif) top left repeat-x;
    margin: 1em 0;
    width:100%;
}
.hrDiv hr
{
    display: none;
}

وضعیتتان را مشخص کنید!

2008-05-25T19:10:44.0000000-04:00

برای اطلاع از تیمهای شرکت کننده در یورو 2008 به سایت یوفا بروید.

کتاب رایگان فتوشاپ

2008-05-15T05:42:41.0000000-04:00

سایت Sitepoint نسخه ی PDF کتاب
The Photoshop Anthology: 101 Web Design Tips, Tricks & Techniques را به مدت 30 روز بصورت رایگان در دسترس قرار داده است.

می توانید از اینجا دانلود کنید.