دسته Archives: طراحی وب

پیش نمایش عکس در html توسط jquery

با سلام

شاید شما هم دوست داشته باشید بعد از انتخاب یک عکس توسط کاربر و قبل از اپلود یک پیش نمایش از عکس انتخاب شده به کاربر نشون بدید

راحترین راه استفاده از کدهای جی کوئری هست

 

 

 

 

مثال:

 

گذشتن از بعضی موانع مثل نظر سنجی دانشگاه با inject jquery

مقدمه

امروز تو خونه بودم ساعت ۱۲ شب بود یکی دوستام زنگ زد گفت کارت آزمون منو پرینت میگیری من ازت بگیرم گفتم باشه اطلاعات ورود رو بده تا من ردیفش کنم. از اونجایی که خیلی وقته از قضیه دانشگاه ها خبر ندارم وقتی وارد سایت دانشگاه شدم متوجه شدم که برای دریافت کارت آزمون باید 8 تا فرم نظر سنجی که دارای ۲۵ تا فیلد بود رو پر کنم. حالا باید چی کار می کردم!!!!؟؟ گفتیم این موضوع رو بهانه ای برای یه یادداشت جدید بکنم.

 

استفاده از کنسول مرورگر

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

اطلاعات بیشتر

معرفی NetBeans قوی ترین IDE برای PHP و طراحی وب

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

 

مقدمه

 

ارسال این مقاله ممکنه چالش برانگیز باشه چرا که اولین مخالف فک کنم بچه های خوده Xmen باشند و با این موافق نباشند که NetBeans قوی ترین IDE برای PHP هستش اما ما دلایل خودمون رو قد می کنیم و ببینیم به این نتیجه میرسیم که NetBeans بهترین انتخاب برای برنامه نویسان هستش یا خیر.

 

NetBeans چیست؟

 

NetBeans یعنی «شبکه لوبیا ها» در نوع خودش جالب هستش این نقل و قول و این اسم گذاری اما نت بینز یه IDE فوق العاده برای حداقل برنامه نویسان وب هستش. اول یه شاره کوچیک کنیم IDE یعنی integrated development environment هستش یعنی محیط توسعه یک پارچه که از وظایف آن استاندارد سازی کد ها و جلوگیری از خطا و افزایش سرعت کدنویسی هستش که نت بنیز به نظرم همه اینا رو با هم داره. اما بحث ما در مورد نسخه جاوا ی اون و … نیست.  که در حال حاضر آخرین نسخه آن 8.0.2 می باشد.

 

netbeans

 

ویژگی های کلیدی

 

  • اولین و مهم ترین ویژگی  کلیدی NetBeans این هستش که Open Source هستش و توسعه اش هرگز قرار نیست متوقف شود.
  • ویژگی کلیدی بعدی این هستش که cross platform هستش یعنی برای یکی مثل من که از هر سه سیستم عامل Windows ، Linux و Mac استفاده می کنم حضور داره داخل همه سیستم عامل ها ولی بزرگترین مشکلی که داره این هستش که داخل MacOSX اشکالات فراوانی داره
  • ویژگی کلیدی بعدی گستردگی در امکاناتش هستش که توسط Plugin هایی که برای بوجود آمده میادش.
  • ویژگی کلیدی بعدی انعطاف پذیری بی نظیرش هستش
  • و از کلید های میانبر فوق العاده اش نمیشه گذشت
  • شعور و هوش مصنوعی بالا در تشخیص ها

 

چطور NetBeans ای شویم؟

 

برای این که بخوایم بیایم سمت NetBeans اول باید JDK رو روی سیستمتوناطلاعات بیشتر

طراحی صفحات واکنش گرا rtl در Twitter Bootstrap

تویتر بوت استرپ چیست؟

بوت‌استرپ مجموعه‌ای از ابزارهای رایگان برای ساخت وب سایت‌ها و برنامه‌های وب است. بوت‌استرپ شامل تمپلت‌های طراحی اچ‌تی‌ام‌ال و سی‌اس‌اس محور برای typography، فرمها، دکمه‌ها، نمودارها، اجزاء راهبری و دیگر اجزاء رابط کاربری و الحاقات اختیاری (JavaScript Extensions)، می‌باشد. بوت‌استرپ محبوب ترین پروژه در GitHub است که توسط NASA و MSNBC و دیگر سایتهای مطرح استفاده شده است.

تاریخچه

بوت‌استرپ از دل یکی از پروژه‌های تویتر، که برای توسعه آنالیز داخلی و ابزارهای مدیریت بود، بیرون آمد. در مقطعی از انجام پروژه از کتابخانه‌های مختلفی برای توسعه رابط کاربری استفاده شد، که منجر به عدم ثبات و زحمات زیاد برای نگهداری و توسعه شد. اولین گسترش پروژه تحت شرایط واقعی در زمان اولین Hackweek تویتر اتفاق افتاد. در آگوست سال ۲۰۱۱ تویتر اولین نسخه بوت‌استرپ را به صورت متن‌باز منتشر کرد.

 

قابلیت ها

بوت‌استرپ پشتیبانی نسبتاً ناقصی از HTML 5 و CSS 3 دارد، اما با تمامی مرورگرهای عمده سازگار است. از نسخه ۲٫۰، بوت‌استرپ از طراحی واکنش گرا (Responsive design) نیز پشتیبانی می‌کند. این بدان معنی است که طراحی گرافیکی صفحات وب به طور داینامیک با خصوصیات دستگاه مورد استفاده (کامپیوتر، تبلت و موبایل) تطبیق پیدا می‌کنند.

 

patch راست به چپ

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

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

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

عجایب هفتگانه زبان php – در ساختار و کدنویسی

به نام دانای بر حق

اولین یادداشت ۹۴ رو میزنم به افتخار همه اساتید xmen که ما شاگردشون هستیم، می خوایم در مورد 7 مورد از عجایبی که در زبان php وجود داره صحبت کنیم که برای کسایی که با زبان های دیگه دارن کار می کنند شاید بسیار عجیب باشه.

مقدمه

البته که php علاوه بر عشق یه زبان تحت وب نیز هست ; ) ,  باید به این مورد توجه کرد که php خیلی راه دست هستش و با هیچ زبان دیگه ای نمی تونین مقایسه اش کنین حتی Python من خودم اگر بخوام یه برنامه رو جدا از پلت فرمش بنویسم ۱۰۰٪ پایتون رو انتخاب می کنم چون خیلی راه دست هست و هلو برو تو گلو ولی خوب PHP واقعا یه چیز دیگه است چون اصلا این بچه مظلومه و بلد نیست به کد نویسش سخت بگیره و اذیتش کنه D :  , حالا اینا رو بی خیال شیم بیایم کمی در مورد ساختار این زبان صحبت کنیم چرا که برخی از این عجایب به ساختار این زبان بستگی داره، خب php عزیز یه زبان برنامه نویسی نیست یه زبان اسکریپت نویسی تحت وب هستش هستش که در تقریبا اکثر سیستم عامل های معروف قابل اجراست، حالا این یعنی چی یعنی این که کد های PHP هرگز کامپایل نمیشوند مثل یه برنامه دلفی و فقط و فقط تفسیر میشود، تفاوتی اصلی از اونجا ناشی میشود که وقتی کدی کامپایل میشود اطلاعت نامی و و متنی آن تقریبا از بین میره و فقط آدرس کلاس ها و توابع در برنامه باقی میماند ، اما چون در PHP همچین کاری نمیشه همه چیز به قوت خود باقی هستش که شما لذت ببرید و بعضی جاها هم حرص بخورید که مجبورید اصل سورس کد رو تحویل مشتری عزیز بدین : )

عجب اول – تعریف متغییر و آرایه

چیزی که اول هر برنامه نویسی رو متعجب می کنه این هستش که php چرا تعریف متغییر ندارد!؟ واقعا چرا؟ چراشو نمیدونم ولی خیلی خوبه که نداره شما رو درگیر کد نویسی می کنه نه قواعد سخت گیرانه خودش برای راحتی خودش برنامه نویس رو ناراحت نمی کنه، و نکته بعدی این که از   Associative array هم پشتیبانی می کنه که این خیلی خوبه و اما توضیحات:

تعریف یه متغییر در php :

ببین ما فقط کافی نسبت بدی خودش نوعش هم مشخص می کنه : )

تعریف آرایه :

در خط اول ما به شرایط تعریف کردیم و در قسمت دوم با هر کلیدی دوست داشتیم آرایه رو تعریف کردیم بینیم که بعد از کلید ۰ و ۱ ما 99 استفاده کردیم و مشکل هم نیست

تعریف آرایه Associative (آرایه هایی که به جای عدد از حروف و اعداد به عنوان کلید استفاده می کند)

تازه یکیش هم دو بعدیه دیدی چقدر ساده اس بعد بگین php بده اَسپ ( asp ) خوبه : )

عجب دوم – شناخت زمان

در php یه عجب خیلی خفن وجود داره این که خیلی ساده هر زمانی رو بهش بگی میفهمه مثلا ازش بپرسی من کلاس اول کی املا رو صفر شدم و از بابام کتک خوردم بهت میگه باور کن ; )

میگی نه نگاه کن یه تابع داریم به نام strtotime یعنی تبدیل رشته به زمان باید قبل از این به یه چیزی توجه داشت اونم این که تو php از timestamp استفاده میشه یعنی زمان همیشه یه عدد بزرگ هستش که اون عدد برمیگرده تا شما باهاش کار کنید. این مثلا این شکلی هست1427614759 و تعداد ثانیه هایی که از این اولین لحظه1970/01/01 گذشته رو نشون میده پس ما این عدد رو مدام نیاز داریم حالا ببینم چطور اطلاعات بیشتر

ارسال اطلاعات فرم به آدرس دلخواه در Contact Form 7

به نام دانای بر حق

در سایت هایی که با وردپرس ساخته میشن Contact Form 7 یکی از بهترین راهکار برای قرار دادن فرم در سایت هست. شاید براتون مساله شده باشه که اطلاعات این فرم ها علاوه بر سایت در جای دیگه ای مثلا سامانه ارتباط با مشتریان هم ذخیره بشه یا ایمیل ؛ پیامک خاصی بعد از ارسال فرم فرستاده بشه.برای اینکار خود افزونه گزینه ی خاصی در اختیارمون قرار نمیده. اما ما می تونیم با یه هوک به توابع افزونه این کار رو انجام بدیم. این کار بر روی آخرین ورژن افزونه یعنی ۳/۹ جواب میده:

کد های زیر رو در فایل functions.php قالب فعال سایت قرار بدبد:

توضیحات کد:

۱- تابعی برای اجرا بعد از wpcf7_mail_sent مشخص میکنیم. wpcf7_mail_sent تابعی است که افزونه بعد از تمامی اعتبار سنجی و… برای ارسال اطلاعات فرم استفاده می کنه.

۴- این تابع با استفاده از cUrl اطلاعات رو به آدرس مورد نظر میفرسته.

۲۷- اطلاعات فرم رو به صورت آرایه بدست میاریم.

۲۸- عنوان فرم مورد نظر.

۲۹- فرستادن اطلاعات فرم به آدرس مورد نظر.

 

حالا کافیه که در mysite.ir/usersinfo.php اطلاعات رو آنالیز و دریافت کنیم. توجه کنید که ما اطلاعات فرم رو به صورت متد POST فرستادیم.

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

رمزنگاری و hash در جاوا اسکریپت

به نام دانای بر حق

 

مقدمه

یکی از مسائلی که کاربرد های امنیتی زیادی داره استفاده از سیستم های های رمزنگاری و hash و حتی encoding هستش، خب حالا یکی از مسائلی که میشه بهش اشاره کرد این هستش که جاوا اسکریپت یکی از زبان های خانواده اسکریپت هاس همونطور که از اسمش پیداس و اما یه تفاوت خیلی مهم بین javascript  و سایر زبان های اسکریپت نویسی دیگر مثل php و python هستش اونم این هستش که js یه زبان سمت کاربر هستش یعنی قسمت های کد اون در سمت رایانه های سرور اجرا نمیشود و بر روی سیستم بازدید کننده های وب اجرا میشود و اما یه نکته اساسی هستش که جاوااسکریپت هم در تشخیص داده های دودوی یا باینری ضعیف عمل میکنه واسه همین  پیاده سازی hash ها و encryption ها سخت هستش.

 

معرفی کتابخونه crypto js

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

مشکل فارسی در mysql

با سلام گاهی اوقات به دلیل تنظیم نبودن مناسب کلاسها و دستورات کار با دیتابیس روی set name UTF8 در php متون ذخیره شده در دیتابیس به صورت اجق وجق ذخیره میشن مثلا دیتابیس Movable Type که متون ذخیره شده پارسی به صورت زیر ذخیره میشود

چگونه بیل گیتس در دفترش کار می‌کند؟

خب برای درست کردن این متون در بانک اطلاعاتی باید چند تغییر انجام دهید کد زیر را در یک کوئری اجرا کنید تا متون پارسی ذخیره شده درست شود

به جای tablename نام جدول و بجای colname نام ستون مورد نظر خود را قرار دهید

موفق باشید

ترسیم طرح مبتنی بر دایره با استفاده مختصات قطبی – Delphi و Javascript

به نام دانای برحق

مقدمه

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

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

ما در این قسمت از دو زبان یکی زبان تحت وب کلاینت استفاده می کنیم javascript و یه زبان تحت ویندوز Delphi

مختصات قطبی و تفاوت آن با دکارتی

به زبان ساده ما با بیان تفاوت بهتر میتونیم این مسائله رو روشن کنیم ما برای آدرس دهی در روش دکارتی به دو نقطه نیاز داریم x و y که معادل طول و ارتفاع هستش خوب حالا متخصات قطبی تفاوت دارد و نحوه آدرسی بر اساس این است که مرکز صفحه مختصات میشود محور کار می برای آدرس دهی ما یک فاصله با یک زاویه میدهیم مثلا فاصله ۲۱۰ پیکسل با زاویه ۴۵ درجه از مبدا مختصات میشه آدرس دهی ما اما به نقل از ویکی پدیا این شکلی میتونیم تعریف کنیم:

دستگاه مختصات قطبی، یک دستگاه مختصات دوبعدی است که در آن مکان هر نقطه، با فاصلهٔ آن تا مرکز مختصات (r) و زاویه بین خط رسم‌شده از مرکز به آن نقطه و محور طول، (θ) مشخص می‌شود. این دستگاه در سه بعد به دستگاه مختصات استوانه‌ای و دستگاه مختصات کروی تبدیل می‌شود.

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

Polar_Coordinatesاطلاعات بیشتر

ساختن هاست و دامنه مجازی در آپاچی در ویندوز و لینوکس

به نام دانای بر حق

مقدمه

آپاچی معروف ترین و پر کاربرد ترین برنامه وب سرور هستش که با PHP به صورت خیلی خالصانه ای رفیق هستش 😀 و اما زمانی که شما بخواین روی هاست مجازی خودتون که مثلا با xampp یا wampp یا هر چیز دیگه وجود داره یه هاست مجازی با دامنه داشته باشید، شاید اول فک کنید این مورد غیر ممکن باشه اما اینطور نیستش یعنی شما مثلا میتونید یه سایت مجازی به اسم خودتون رو مدیریت کنید به همین سادگی و دیگر برای راهندازی یک وبسایت مجبور نباشید که بنویسد http://localhost/mysite میتونید اون رو تبدیل به این کنید: http://mysite.com , خیال خودتون رو راحت کنید، البته این کار یه سری درد سر هم داره که باید دقت داشته باشید که موجب بر هم ریختگی سیستم نشوید، چرا روی فایل حساس قرار هستش کار کنیم. اما ما چون xampp از همه سیستم های قوی تر، پر کاربرد تر و قابل اجرا در اکثر سیستم عامل ها هستش زمپ رو برای آموزش استفاده می کنیم. و از لینوکس نسخه ubuntu در این آموزش یاد می کنیم.

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

مختصر مراحل:

  1. تعیین ip برای دامین مجازی
  2. ساختن فولدر هاست در سیستم
  3. تغییر در تنظیمات آپاچی (فقط یک بار)
  4. اضافه کردن هاست مجازی
  5. و ریست کردن سرور آپاچی

تعیین ip برای دامین مجازی

خب دامنه ها در واقع نقش یک اشاره گر رو دارند، یعنی به یک آدرس ip اشاره می کنند، اون آی پی سیستم میزبان یا همون هاست هستش و اما به طور معمول وقتی شما به یک دامنه می خواید دسترسی داشته باشید، سیستم عاملتون آدرس ip رو به صورت خودکار در میاره برای این که این رو متوجه بشید میتونید از هر دامنه ای که می خواین ping بگیرید برای این کار تو ویندوز cmd رو باز کنید و تو لینوکس terminal رو با میانبر ctrl+alt+t که باز شد رشته زیر رو تایپ کنید:اطلاعات بیشتر

مقدمه ای بر smarty قوی ترین template engine حال حاضر

به نام دانای بخشنده

Smarty چیست؟

Smarty رو اگر بخواهیم توضیح بدهیم چیه باید بگیم در معنا یعنی ناقلا و یا هوشمند، اما اسمارتی یک موتور قالب و پوسته برای برنامه های مبتنی بر PHP می باشد، نباید اشتباه کرد که smarty یک framework یا چهارچوب نرم افزاری نیست فقط یک موتور قالب با ویژگی های گسترده و جالب هستش و مهم ترین مولفه اون که برنامه نویس ها رو ترغیب می کنه که ازش استفاده کنند این هستش که باعث میشه که کد های منتظقی برنامه و php به طور 100% از html و css جدا باشند این که میگیم ۱۰۰٪ واقعیت هستش چون اساس این template engine بر این است.

 

ویژگی های Smarty چیست؟

  • اسمارتی ویژگی های زیادی داره که بشع ازش نام برد اما مهم ترین اشون رو تو پاراگراف قبلی ذکر کردیم عاملی برای جدا شدن کد های برنامه php و منظقی از کد های طراحی  html و css و js که باعث میشه بروزرسانی کد های برنامه ها ساده تر و کد ها خوانا تر باشه.
  • ویژگی های دیگری که بشه از این موتور نام برد قابلیت های کد نویسی در این موتور وجود دارد یعنی شما هم متغییر دارید هم شرط هم انواع اقسام حلقه ها رو مثل for , foreach و …
  • ویژگی بعدی قابلیت پیوست کردن یا به انگلیسی include کردن فایل های دیگر رو داره که خیلی تو روند سرعت کند نویسی و اجرا کمک میکنه
  • سرعت اجرایی این تملیت انجین بسیار بالا تر از کد های خوب و ساده ی برنامه نویسان عادی هستش.
  • یادگیری اون به نسبت خیلی ساده هستش و نیاز به آموزش کمی داره.
  • قابلیت قابل ذکر دیگه که وجود داره توابع خیلی خوب و مناسب این سیستم هستش که تابع های کاربردی و جالبی داره مثلا تابعی های زمانی، ریاضی و …
  • اما یکی از نکات جالبی که در توانایی های اسمارتی خیلی برجسته هستش قابلیت cash کردن به صورت سفارشی یا همون customize هستش که دست شما رو باز می کنه و درگیر این موضوع نمی شید.
  • یکی از ویژگی های دیگه قابلیت debug و بررسی سرعت اجرا کد به طور پیش فرض در smarty هستش که جالب توجه هستش برای کسانی که خیلی رو Optimize و بهینه بودن کد هاشون حساس هستند
  • و اما یکی ویژگی دیگه قابلیت کنترل خطای بهتر برای جلوگیری از نمایش خطا برای بازدیدکننده هستش.
  • و ویژگی دیگه ای هم وجود داره برای اطلاع از اون به پایگاه سایبریش مراجعه کنید

 

اما نگارش های Smarty

نگارش یا همون ورژن های اسمارتی مانند سایر برنامه ها اسمارتی هم نگارش ها اصلی و ریز نگارش داره یعنی نگارش اصلی تفاوت بسیار زیادی به قبلی داره و ریز نگارش ها تفاوت کمی نسبت به نسخ قبلی و بعدی خود دارد اما ورژن های اصلی این برنامه 2 و 3 هستند که تفاوت زیادی دارند نسخ ۲ در php های ۴ و ۵ کامل جوابگو هستند اما نسخ ۳ فقط در php 5.2 به بالا اطلاعات بیشتر

acid تست و استاندارد جهانی سازگاری مرورگر

مقدمه

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

تاریخچه acid test

Acid که اکنون ورژن فعلی و مورد استناد آن acid3 می باشد یک پروژه استاندارد وب می باشد که و که توسط ارگانی با همین Web Standards Project می باشد این ارگان از سال ۱۹۹۸ بر استاندارد های وب نظارت دارد و استاندراد acid را از سال اکتبر سال ۱۹۹۸ در پهنه وب منتشر کرد که کارش فقط چک کردن باکس ها بودش (یادمه رو ویندوز ۹۸ من فقط بازی می کردم و تا حالا رنگ اینترنت هم ندیده بودم اینا استاندارد داشتن تعریف می کردن) ، و اما acid2 در سال از آپریل ۲۰۰۵ تا سال تا مارچ ۲۰۰۸ مورد استاندارد بودش که ویژگی های css 2.1 رو نیز در مرورگر ها نیز مورد بررسی قرار میدادش و از سال مارچ ۲۰۰۸ تا کنون اسید فعلی یعنی ۳ مورد استناد هستش.

Acid Test چیست؟

در قسمت های قبل مقاله توضیحی مختصری این مورد دادیم، در واقع اسید تست پروژه برای سازگاری مرورگر ها با استاندارد های تحت وب می باشد که در ورژن ۱ آن چیزی های که مورد آزمایش قرار میگرفت html4 و خصوصا css 1 بود و در نسخه دوم آن هان html4 و css 2.1  مورد بررسی قرار میگرفت و اما در نسخه سوم آن تقریبا تمامی ویژگی های مرورگر از جمله Document Object Model (DOM) و جاوا اسکریپت مورد بررسی قرار میگیرد.

عملکرد Acid از ابتدا تا کنون و کد های مورد تست:

کد های html و css1 رو مورد بررسی قرار میگرفت و با استناد به w3 این تست با عنوان زیر و خروجی زیر میبودش که اصل css1 و html4 بود:

و خروجی آن به صورت زیر بود:

Acid1_reference

و اما acid 2 که روی css 2.1 زوم کرده بودش ابز هم html 4 و این بار css 2.1 که دودمان Microsoft پس از انتشار آن به باد فنا رفت  اگر دوست داشته باشید میتوند به کدهاش نگاه کنید که چقدر ساده است اما خروجی اصل چی میبایست بود:اطلاعات بیشتر

مرتب سازی و ابهام زدایی فایل های وب js , css و و HTML و چگونگی فشرده سازی آنها

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

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

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

اما اول یاد بگیریم چطور فایل های خودمون رو minify یا فشرده کنیم که معمولا توام با obfuscate نیز میشود،اول از همه فایل های جاوا اسکریپت تو این زمینه اهمیت بیشتری دارند که اگر برای شما خیلی کم حجم بودن مهم هستش از سایت زیر میتونید استفاده کنید برای فایل js:

اما برای کسانی که به جز compress اول براشون مبهم کردن فایل های js مهم هستش میتونند از اطلاعات بیشتر

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

به نامش که در کنار ماست

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

خب حالا فایل های header , footer , sidebar و نهایتا index در اختیار ماست.

خب حالا چطور این هارو پر کنیم تا قالب تکمیل میشه.

قبل از این به این عکس یک بار دیگه نگاه کنید:

site-info

گام هفتم- ساخت استایل header این بخش رو ما کپی می کنیم از فایل HTML خام و در header.php کپی می کنیم و محتوای داخل فایل میشود:اطلاعات بیشتر

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

سلام

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

پیش فرض من از شما:

  • شما HTML و CSS رو به خوبی میشناسید
  • حداقل آشنایی با PHP رو دارید
  • تا حالا با خوده وردپرس کار کردید
  • یک قالب با فرمت HTML و CSS در اختیار دارید که دارای index و صفحه های داخلی هست می خواهید اون رو به وردپرس ببرید.

در غیر این صورت خوندن این آموزش برای شما مفید نیستش خب برای آموزش HTML و CSS به اینجا مراجعه کنید و برای آموزش PHP در حد ابتدایی به اینجا و برای حداقل کار با ورد پرس اون رو نصب کنید و باهاش کار کنید.

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

و اما حالا ما اولین گام رو برای طراحی قالب برمیداریم.اطلاعات بیشتر

فیکس کردن قالب ها و css در مرورگر مایکروسافت IE یا همان Internet Explorer

به نام پرودگار یکتا

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

در این نوشته قصد داریم ابتدا بگیم چطور میشود ورژن های مختلف IE را همزمان تست کرد و سپس چطور میشود قالب های IE را استاندارد کرد.

1) برنامه ای وجود دارد به نام IE tester که کار این برنامه تست کردن قالب روی ورژن های مختلف IE هست تا قبل از این برنامه من هم نخسه های IE رو به صورت قابل حمل portable  داشتم و کلی اذیت میشدم اما نسخه حال حاضر این برنامه از IE 5 تا IE 10 رو ساپورت می کنه به این صورت که شما آدرس مورد نظر رو میدهید و نمایش آن در هر نسخه از IE رو میتونید، برآورد کنید یه اسکرین شات از این برنامه:اطلاعات بیشتر

JSON چیست و نحوه استفاده آن در دلفی Delphi و پی اچ پی PHP

سلام

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

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

اما Javascript چون یه زبان اسکریپت نویسی هستش و مستقل برای خودش عمل نمی کنه یعنی سمت کلاینت (کاربر) هستش برای همین نیاز شدیدی داره که با زبان های سمت سرور ارتباط برقرار کنه از همین رو یه استاندارد جدید هم عرضه شد به نام JSON تعریف JSON طبق اونچه سایت مرجعش نوشته:

جی‌سان یا JSON (JavaScript Object Notation) یک فرمت تبادل داده سبک (lightweight) می‌باشد که خواندن و نوشتن آن برای انسان و تولید و پارس کردن آن برای ماشین‌ها آسان است. این زبان بر مبنای یک زیر مجموعه از زبان برنامه‌نویسی JavaScript ، استاندارد ECMA-262 ویرایش سوم – دسامبر 1999‌، است. JSON بصورت متنی (text) بوده و کاملاً مستقل از زبان بکار رفته است، اما از قوانینی استفاده می‌کند که برای برنامه‌نویسان زبان‌های خانواده C (شامل C ، C++ ، Java ، JavaScript ، Perl ، Python ، و بسیاری زبان‌های دیگر) آشنا می‌باشد.‌ این خصوصیات JSON را یک زبان تبادل‌داده‌ای ایده‌آل کرده است.اطلاعات بیشتر

گراواتار یا gavatar چیست و نحوه استفاده از آن

گراواتار یا gavatar چیست و نحوه استفاده از آن
گراوارتار مخفف این جمله است A Globally Recognized Avatar به معنی این یعنی یک آواتار رسمی سراسری است که چندین سال هستش داره خدماتی ارائه میده که برخی از سیستم و سایت های بزرگ مثل وردپرس و stackoverflow از این سیستم پشتیبانی برای شما شاید جالب باشه این سایت کارش این هستش که شما بعد از ثبت نام در این سایت با توجه به ایمیل خودتون میتونید عکس avatar خودتون روآپلود کنید و در سراسر دنیای وب هر کجا که از این امکان پشتیبانی میکنه بدون آپلود مجدد آوتارتون رو توی اون سایت لود کنید یعنی یک بار آپلود استفاده در همه جا.

اطلاعات بیشتر