web design and jquery introduction in persian
DESCRIPTION
web design and jQuery introduction in persian presented at Aran and bidgol payam nour universityTRANSCRIPT
طراحی وب ودرآمدی برنقــش جـی کوئـری در
تحــول آن
مرجع همایش رونمایی از کتاب آموزشی جی کوئری
پیام نور مرکز آران وبیدگل دانشگاه
1391پاییز
می فرمایند:)علیه السالم( امام علی
هرگاه خداوند بخواهد بنده ای را
به رذالت برساند، او را از علم
و دانش و یادگرفتن محروم
می سازد.
فهرست
اهمیت طراحی وب
جایگاه طراحی وب در ایران و جهان
2012نگاهی بر بهترین مشاغل جهان در سال
نگاهی بر بهترین مشاغل حوزه آی تی
ویژگی های شغل طراحی وب و درآمد تقریبی طراحان وب در
ایران
در آمدی بر طراحی وب و تکنولوژی های آن
معرفی جی کوئری، ویژگی ها،برتری ها و دالیل محبوبیت آن
نسبت به سایر تکنولوژی ها
اهمیت طراحی وب
اینترنت؛ ارزان و دردسترس
وب؛ مؤثرترین راه برای برقراری ارتباط در دنیای امروز
مطرح شدن مباحثی همچون:آموزش الکترونیکی–
دولت الکترونیکی–
تجارت الکترونیکی–
همه ما یک طراح وب هستیم.
طراحی وب محدود به دانستن روشهای طراحی کامل یک سایت نمی باشد.
جایگاه طراحی وب
در جهان
جایگاه طراحی وب در جهان
2012بهترین مشاغل جهان در سال
ITبهترین مشاغل حوزه مهندسی و
بهترین شغل های جهان در سال 2012
جایگاه طراحی وب در جهان
2012بهترین مشاغل جهان در سال
ITبهترین مشاغل حوزه مهندسی و
بهترین مشاغل حوزه مهندسی و IT
متوسط درآمد هاشغل انداز استخدامچشم
25.02 $90,000 افزارمهندسی نرم
22.58 $78,000 های کامپیوتریتحلیلگر سیستم
21.49 $75,000 گر وبطراح و توسعه
مهندسی نفت 114,000$ 17.48
مهندسی عمران 77,000$ 18.73
11.78 $71,000 نویس کامپیوتربرنامه
نویسنده فنی 63,000$ 15.93
10.32 $99,000 ایمهندسی هسته
مهندسی هوافضا 97,000$ 4.24
مهندسی مکانیک 78,000$ 9.03
جایگاه طراحی وب
در جهان در ایران
وضعیت طراحی وب در ایران
اطالعات دقیقی از میزان درآمد طراحان وب در ایران در دسترس نیست:
عدم وجود صنف مستقل
عدم وجود نظم و قاعده در بازار این شغل
میزان تقریبی درآمد طراحان وب
در یک شرکت:
میلیون 1.5 هزار تا 600حقوقی معادل تومان ماهانه بابت کار در یک شرکت
به صورت فردی:
هزار تومان 600 تا 400قیمتی معادل برای طراحی هر سایت پویا
ویژگی های شغل طراحی وب
عدم وابستگی جغرافیایی
عدم نیاز به سرمایه اولیه
بازاریابی پویا
قیمت تقریبی طراحی سایت در ایران
رنج تقریبی قیمت طراحی سایت
میلیون 5هزارتومان تا 500 میلیون و 2تومان
روزنامه
میلیون تومان15 تا 5بین خبرگزاری
خبرگزاری های حساس و پربیننده میلیون تومان500 تا 100
میلیون تومان28 تا 2 پورتال های سازمانی و شرکت ها )بدون پشتیبانی(
میلیون تومان5هزارتومان تا 150 سایت های شخصی
هزارتومان30 تا 20صفحه ای سایت های استاتیک
آموزش های موجود در وب
طراحی و توسعه وب
75%
سایر علوم
25%
الیه های تشکیل دهنده یک صفحه وب
الیه های تشکیل دهنده یک صفحه وب
الیه محتواساختار صفحه و هرآنچه به کاربر ارائه –
می شود را مشخص می کند.
یک صفحه وبHTMLساختار
<html><head>
<title>This is a web page<title></head><body>
<div><p>I m a paragraph 1</p> <p>I m a paragraph 2</p> </div><p>I m another paragraph</p> </body>
</html>
الیه های تشکیل دهنده یک صفحه وب
الیه های تشکیل دهنده یک صفحه وب
الیه محتواساختار صفحه و هرآنچه به کاربر ارائه –
می شود را مشخص می کند.
الیه نمایشنحوه ظاهرشدن و نمایش هریک از عناصر –
را مشخص می کند.
یک صفحه وبHTMLساختار
<html><head>
<title>This is a web page<title><style>p{color:red;font-family:tahoma;}</style>
</head><body>
<div><p>I m a paragraph 1</p> <p>I m a paragraph 2</p> </div><p>I m another paragraph</p>
</body>
</html>
الیه های تشکیل دهنده یک صفحه وب
الیه های تشکیل دهنده یک صفحه وب
الیه محتواساختار صفحه و هرآنچه به کاربر ارائه –
می شود را مشخص می کند.
الیه نمایشنحوه ظاهرشدن و نمایش هریک از عناصر –
را مشخص می کند.
الیه رفتارامکان تعامل کاربران را با صفحه فراهم –
می کند.
کتابخانه چیست؟
مجموعه ای از کدهای با قابلیت استفاده مجدد که برای انجام کارهای متداول از
آنها استفاده می شود.
کتابخانه های رایج جاوااسکریپت
میزان کاربرد کتابخانه های جاوااسکریپت
jQuery
MooTools
Proto
type
ASP.N
ET Ajax
Scirp
t.acu
lo.us
YUI Librar
ySp
ryDojo
Ext JS
0
10
20
30
40
5052.5
5 3.8 3 2.9 1.5 0.6 0.2 0.1
های جی کوئریویژگی
کم حجمی نسبت به سایر کتابخانه ها
های جی کوئریویژگی
سازگاری با تمامی مرورگرها
های جی کوئریویژگی
سادگی سینتکس و یادگیری
های جی کوئریویژگی
YUIfunction handleClick)e( {Y.log)e(;}YUI)(.use)‘node-base’, function)Y( {Y.on)“click”, handleClick, “#foo”(;}(;
Prototype$)“foo”(.observe)“click”, function)( {alert)‘Clicked!’(;}(;
MooTools$)‘foo’(.addEvent)‘click’, function)( {}((;
DojofooNode = dojo.byId)“foo”(;fooConnections = [];fooConnections.push)dojo.connect)fooNode, ‘onclick’, foo((;
jQuery$)‘#foo’(.click)function)( {}(;
های جی کوئریویژگی
کوتاه بودن دستورات نسبت به جاوااسکریپت
خط کد جاوااسکریپت را 20عموما می توان با یک خط کد جی کوئری پیاده
کرد.
مقایسه یک قطعه کد جاوااسکریپت با جی کوئری
Javascriptvar p=
document.getElementByTagName)‘p’(;
for )i = 0; i < p.length; i++( {
p[i].style.display = ‘none’;}
jQuery$)‘p’(.hide)(;
یک نمونه دیگرif (!document.ELEMENT_NODE) { document.ELEMENT_NODE = 1;
document.ATTRIBUTE_NODE = 2; document.TEXT_NODE = 3;
document.CDATA_SECTION_NODE = 4; document.ENTITY_REFERENCE_NODE = 5;
document.ENTITY_NODE = 6; document.PROCESSING_INSTRUCTION_NODE = 7;
document.COMMENT_NODE = 8; document.DOCUMENT_NODE = 9;
document.DOCUMENT_TYPE_NODE = 10; document.DOCUMENT_FRAGMENT_NODE = 11;
document.NOTATION_NODE = 12; } document._importNode = function(node,
allChildren) { switch (node.nodeType) { case document.ELEMENT_NODE: var
newNode = document.createElement(node » .nodeName); /* does the node have
any attributes to add? */ if (node.attributes && node.attributes » .length >
0) for (var i = 0; il = node.attributes.length; » i < il)
newNode.setAttribute(node.attributes » .nodeName,
node.getAttribute(node.attributes[i++] » .nodeName)); /* are we going after
children too, and does » the node have any? */ if (allChildren &&
node.childNodes && » node.childNodes.length > 0) for (var i = 0; il =
node.childNodes.length; » i < il) newNode.appendChild(document._importNode »
(node.childNodes[i++], allChildren)); return newNode; break; case
document.TEXT_NODE: case document.CDATA_SECTION_NODE: case
document.COMMENT_NODE: return document.createTextNode(node.nodeValue);
break; } };
$)“#content”(.load)“page.html #content”(;
شعار رسمی جی کوئری
ویژگی های جی کوئری
شرکت های بزرگ از جی کوئری استفاده می کنند.
http://docs.jquery.com/Sites_Using_jQuery
ویژگی های جی کوئری
جامعه گسترده آموزشی و متن باز بودن
میزان محبوبیت جی کوئری در جهان
http://www.google.com/trends/explore#q=jquery,mootools,dojo,yui,prototype
میزان محبوبیت جی کوئری در ایران
http://www.google.com/trends/explore#q=jquery,mootools,dojo,yui,prototype&geo=IR
میزان محبوبیت جی کوئری در استان اصفهان
http://www.google.com/trends/explore#geo=IR-04&q=jquery,mootools,dojo,yui,prototype
ویژگی های جی کوئری
پالگین ها
سؤال؟؟
www.1stwebdesigner.ir
www.learningjquery.ir
https://plus.google.com/106253854893238129636
تماس با من