خزنده گوگل و صفحات ajax

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

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

<a href="ajax.htm?foo=32" onClick="navigate('ajax.html#foo=32'); return false">foo 32</a>

در لینک بالا هدف (target) صفحه ajax.htm است و پارامتری که به صفحه منتقل میشود، foo=32 میباشد. اما اگر به ادامه تگ توجه کنید یک رویداد کلیک جاوااسکریپت به تگ اضافه شده است که دقیقا همان کار هدف لینک را انجام میدهد اما به وسیله جاوااسکریپت و بدون پارامتر (پارامتر مقادیری است که بعد از علامت ؟ قرار میگیرند). در رویداد کلیک مقدار foo=32 توسط fragment منتقل شده است (مقادیر بعد از علامت #).

—-

برای مطالعه بیشتر میتوانید به این لینک مراجعه کنید.

حقایق کوچک فوتبال!

knowledgeسه هفته است در اوقات فراغتم روی پروژه ای به نام “حقایق کوچک فوتبال” یا به انگلیسی Football Small Facts کار میکنم که به صورت مخفف FSF نامیده ام. فعلا به عنوان یک پروژه کوچکِ صرفا تحقیقاتی و اولیه در نظر گرفته ام که برایش زیر دامنه ایجاد نکرده ام اما اگر به یک نقطه عطف مورد نظر برسد حتما برایش یک زیر دامنه نیز ایجاد خواهم کرد. چون پروژه در مراحل اولیه است فعلا برای کاربران عمومی فقط قابلیت مشاهده و جستجو را فعال کرده ام.

این پروژه یک پروژه معمولی صرفا دیتابیسی نیست، در این پروژه سعی دارم که آخرین روشهای بازنمایی دانش (Knowledge Representation) در زمینه هوش مصنوعی (Artificial Intelligence) را به صورت کارا (Efficient) و نه معمولی اعمال کنم. ببینیم چه از آب در خواهد آمد.

لازم به ذکر است که در این پروژه از برخی از خصوصیات CSS3 استفاده شده است و تنها در مرورگرهای مدرن و بروز به درستی نمایش داده میشود.

—-

پ.ن.: لینک فراموش شده بود! : ) http://tagland.ir/fsf

وردپرس

wordpress-logo-stacked-rgbداشتم به این فکر میکردم که آیا با وجود سیستمهای مدیریت محتوای قوی و آزمون پس داده مانند وردپرس، آیا باز هم نیاز هست که یک سایت از صفر تا صد توسط زبانها و ابزارهایی مانند ASP.NET یا PHP نوشته شود؟ شاید نتوان جواب قطعی و صدر در صدی داد که برای همه قانع کننده باشد یا حتی در شرایط یکسان درست باشد. اما من به شخصه فکر میکنم که با وجود این گونه سیستمهای بسیار کامل مانند وردپرس دیگر نیازی به نوشتن یک سایت از صفر توسط زبانهای برنامه نویسی/طراحی وب (تقریبا) همه منظوره نیست. دلیل این را هم می توان در موارد زیر جستجو کرد:

1- اولا اینکه طراحی یک سایت نیاز به چندین تخصص دارد، و امروزه سخت میتوان فردی را پیدا کرد که همه تخصص های لازم را با جزئیات کافی داشته باشد.

2- در ثانی حتی اگر چنین فردی وجود داشته باشد زمان و انرژی مورد نیاز برای طراحی یک سایت نزدیک به نسخه وردپرسی (توجه شود که از عبارت “دقیقا شبیه وردپرس” استفاده نکردم) و قابل قبول اصلا قابل مقایسه نیست…!!!

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

—-

در پست های بعدی سعی خواهم کرد که بیشتر در مورد وردپرس و قدرت آن بنویسم.

سیستم گرید 960 (2)

همانطوری که از اسم چارچوب معلوم است، همه صفحاتی که با استفاده از 960gs طراحی شوند، دارای بخش اصلی به عرض 960 پیکسل خواهند بود که بقیه عناصر صفحه را در بر می‌گیرد و سپس این بخش اصلی به 12 یا 16 ستون مساوی تقسیم می‌گردد. به عنوان مثال به شکل 1 که صفحه اصلی یک سایت است توجه کنید، این سایت برای ترازبندی عناصر صفحه خود از سیستم گرید 960 با 12 ستون استفاده کرده است. در شکل 2 ستون‌ها به طور واضح نمایش داده شده است.

example_formalize
شکل 1: صفحه اصلی سایت فرمالایز
example_formalize_grids
شکل 2: صفحه اصلی سایت فرمالایز با ستون‌ها، که برای درک بهتر 960gs نمایش داده شده است.

چرا عرض 960 پیکسلی؟ زیرا 960 پیکسل، عرض مناسبی برای بازه وسیعی از پلتفرم‌ها است که توسط آنها صفحات وب مرور می‌شوند. اساسا عرض 960 پیکسلی اجازه می‌دهد که مانیتورهایی با عرض 1024 پیکسل، سایت را به طور دقیق و بدون اسکرول بار افقی نمایش دهند. با این عرض همیشه فضایی به اندازه 10 پیکسل در سمت راست و چپ ستون اصلی موجود می‌باشد، به این معنی که نمایش‌گرهای کوچکتر نیز قادر خواهند بود محتوا را از سمت چپ‌ترین بخش تا سمت راست‌ترین بخش بدون اشکال نمایش دهند. بعلاوه، همه اعداد در 960gs اعداد کامل هستند که مبتنی بر نسبت طلایی می‌باشند – یعنی مسئله فاصله غیر عادی و مسئله نقطه ممیزی دیگر وجود نخواهد داشت.

سیستم گرید 960 (1)

سیستم گرید 960سیستم گرید 960 (960gs) یک چارچوب CSSای است که کمک می‌کند توسعه دهندگان سایت، الگوی اولیه طراحی‌ها را خیلی سریع ایجاد نمایند. چارچوب‌های زیادی برای بخش طراحی موجود می‌باشد که همگی کمک می‌کنند که بخش دشوار طراحی اولیه الگو و تنظیم موقعیت عناصر HTML نسبت به یکدیگر خیلی سریع و بدون هیچ مشکلی انجام گیرد. سیستم گرید 960 نیز یکی از این چارچوب‌ها است.

1 – مسئله دقیقا چیست؟
دو الگوی اولیه زیر را در نظر بگیرید، در شکل زیر الگوی اولیه دو صفحه را مشاهده می‌کنید که هر دو صفحه از 6 بلوک مشابه تشکیل شده است. همانطورکه از شکل واضح است طراحی بالایی بدون عیب و نقص می‌باشد اما در طراحی پایین عناصر با یکدیگر تراز نیستند و الگوی اولیه بسیار نامناسب می‌باشد. با کمک سیستم گرید 960 می‌توان به سادگی عناصر صفحه را دقیقا در موقعیت پیش بینی شده قرار داد.

مقایسه ترازبندی صحیح و غیر صحیح
شکل 1: مقایسه ترازبندی صحیح و غیر صحیح [1]

2 – روش کار کردن با سیستم گرید 960
در سیستم گرید 960 تعدادی کلاس از پیش تعریف شده موجود می‌باشد. کافی است که فایل CSS سیستم گرید 960 را در بخش header صفحه اضافه کنید تا به کلاس‌ها دسترسی داشته باشید و سپس هنگام طراحی اولیه صفحه/سایت از این کلاس‌ها استفاده نمایید.

3 – منابع

 [1] http://sixrevisions.com/web_design/the-960-grid-system-made-easy/