نرگس چنگیزی

مطالب مرتبط با طراحی صفحات وب

تگ اسکريپت
جاوااسکريپت هم مانند زبان HTML از يکسري دستور و گرامر خاص خود پيروي مي کند. البته اين زبان به سادگي اچ تي ام ال نيست و بسيار هم حساس است، مثلاً در اچ تي ام ال فاصله بين تگها اهميتي ندارد و مرورگر آنرا ناديده مي گيرد اما در جاوااسکريپت فاصله بايد متناسب باشد که اگر رعايت نشود با پيغام خطا روبرو خواهيد شد. در قسمت بعد با چگونگي پيغامهاي خطا در جاوااسکريپت آشنا مي شويد. همانگونه که اطلاع داريد کدهاي جاوااسکريپت را بايد در ميان تگهاي HTML قرار دهيد. به همين دليل يک تگ براي آن در نظر گرفته شده است:


<script> ... </script>


که کليه دستورات جاوااسکريپت بايد مابين آنها قرار گيرد. اين تگهاي اچ تي ام ال به مرورگر مي فهمانند که در کجا اين زبان آغاز شده تا مفسر جاوااسکريپت مرورگر فعال شود و در کجا پايان مي پذيرد که برنامه مفسر هم کار خود را خاتمه دهد.
 
language
اما تگ script مانند بقيه تگها داراي خصوصياتي مي باشد، يکي از آنها language است که مقدار آنرا بايد برابر با javascript قرار دهيد،


k
<script language="javascript">
</script>
n


براي مقدار javascript مي توانيد نسخه آن را هم بنويسيد. اين زبان هم مانند اچ تي ام ال داراي نسخه هاي مختلفي است که هر کدام آنها با قابليتهاي جديدي در وب توسعه يافتند. نسخه هاي اين زبان عبارتند از 1.0 ، 1.1 ، 1.2 ، 1.3 ، 1.4 و آخرين نسخه حال حاضر هم 1.5 مي باشد که هم اکنون اين نسخه با مرورگر مايکروسافت يعني اينترنت اکسپلورر سازگاري ندارد. فعلاً مرورگر اينترنت اکسپلورر از نسخه 1.3 اين زبان پشتيباني مي کند.
 
type
تگ اسکريپت خصوصيت type هم دارد که براي اين زبان بايد آنرا برابر با text/javascript قرار دهيد. نکته قابل توجه اينست که اگر اين خصوصيت را به اين تگ اضافه کنيد، مرورگر اينترنت اکسپلورر نسخه 1.5 اين زبان را ناديده مي گيرد و کد را اجرا مي کند. شما مي توانيد با اجراي کد زير هم اولين اسکريپت خود را تجربه کنيد و هم خصوصيت type را در IE امتحان کنيد.
خب مانند زبان اچ تي ام ال مي توانيد از يک ويرايشگر متن مانند برنامه Notepad استفاده کرده و کد زير را در آن وارد کنيد:


n<html>
<head>
<title> My JavaScript </title>
</head>
<body>
<script language="javascript1.5" type="text/javascript">
document.write(" Hello my friends ")
</script>
</body>
</html>
n

اکنون اين فايل را با پسوند htm ذخيره کنيد و سپس آنرا در مرورگر اينترنت اکسپلورر اجرا کنيد که جمله Hello my friends را بايد در صفحه ببينيد. حالا خصوصيت type را حذف کنيد و دوباره فايل را ذخيره و مشاهده کنيد، هيچ متني در صفحه ديده نميشود که با تغيير نسخه 1.5 به 1.3 آن متن دوباره نمايان خواهد شد. نوشتن نسخه جاوااسکريپت اجباري نيست يعني مي توانيد آنرا ننويسيد.

 


0   |  0 امتياز: 0 | نظر شما: 1 2 3 4 5
برچسب ها: تگ,اسکريپت,HTML,script,language,javascript,آغاز,اسکريپت,نويسی,
نوشته شده در دوشنبه 28 / 9ساعت 2:36 توسط نرگس|

اکنون که يک مفهومي از زبان جاوااسکريپت را در ذهن داريد، بايد ببينيم که با آن چکار مي توانيم انجام دهيم يا بهتر بگويم که جاوااسکريپت چه کاري براي ما انجام مي دهد و چه قابليتهايي را در مرورگر ايجاد مي کند.


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


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


يکي از بهترين ويژگيهاي جاوااسکريپت، اعتبار بخشيدن به اطلاعات مي باشد مثلاً شما يک فرمي براي ارتباط با کاربر خود ساخته ايد و مي خواهيد قبل از اينکه آن اطلاعات به سرور فرستاده شود، بازبيني شده تا اگر مشکلي وجود داشته باشد به کاربر اطلاع داده شود تا در صدد رفع آن برآيد. چون جاوااسکريپت اصطلاحاً Client side است، يعني در سيستم کاربر اجرا شده و مستقل از وب سرور است مي تواند ترافيک روي سرور را کم کرده که اين موضوع يک امتياز مثبت براي ميزبانان وب محسوب مي شود.


0   |  0 امتياز: 0 | نظر شما: 1 2 3 4 5
برچسب ها: جاوااسکريپت,ابزار ,وب,کد, HTML,Client side ,Client side ,قابليت,
نوشته شده در دوشنبه 28 / 9ساعت 2:36 توسط نرگس|

قبل از هر چيز براي يادگيري جاوااسکريپت، شما نياز به دانستن زبان HTML و درک کاملي از طراحي و ساخت صفحات وب بايد داشته باشيد چون جاوااسکريپت يک زبان مجزا از اچ تي ام ال نيست و بايد همراه با کدهاي HTML در يک صفحه بکار رود تا کارآيي داشته باشد.
همانطور که مي دانيد زبان اچ تي ام ال به تنهايي جوابگوي نياز بينندگان وب سايتها نمي باشد چون آنها علاقه خاصي به جذابيتها و ارتباط متقابل ميان خود و صفحات وب دارند که اچ تي ام ال نمي تواند جذابيت قابل توجهي به يک صفحه بدهد و يا با يک کاربر ارتباط برقرار کند. پس براي برطرف کردن اين مشکلات، صفحات وب نيازمند يک زبان قوي تر مي باشد که به همين منظور زبان جاوااسکريپت خلق شد.
جاوااسکريپت توسط شرکت Netscape اختراع شد و به عنوان اولين زبان اسکريپت نويسي در وب توسعه يافت که در حال حاضر پرکاربردترين و محبوب ترين زبان اسکريپت نويسي در دنيا مي باشد که يکي از دلايل آن، پشتيباني دو مرورگر معروف وب، Internet Explorer و Netscape Navigator از اين زبان مي باشد. نا گفته نماند که شرکت مايکروسافت هم براي اينکه از نت اسکيپ در اين زمينه عقب نماند، نسخه مربوط به خود را بنام Jscript توليد کرد.(البته همان نسخه جاوااسکریپت با اندکی تفاوت)

 

تفاوت جاوااسکريپت با جاوا

تقريباً در هر جا که آموزش جاوااسکريپت هست اين مطلب هم مشاهده مي شود چون خيلي ها فکر مي کنند که اين دو با هم يکي بوده يا حداقل اينکه جاوااسکريپت ساده شده زبان جاوا براي کاربرد در وب مي باشد که اصلاً اين چنين نيست.
همانطور که ميدانيد جاوااسکريپت متعلق به شرکت نت اسکيپ مي باشد اما زبان جاوا متعلق به شرکت Sun Microsystems است. جاوااسکريپت در اصل يک زبان اسکريپت نويسي است نه يک زبان برنامه نويسي کامپيوتر، شايد بتوان اسکريپتها را يک نوع زبان برنامه نويسي خيلي سبک و ساده ناميد اما جاوا يک زبان برنامه نويسي کاملاً پيچيده مانند زبان C است. تفاوت ديگر آنها اينست که جاوااسکريپت توسط يک برنامه مفسر يعني interpreter  در مرورگر تعريف و تفسير شده تا قابل اجرا باشد و حتماً هم اين کار در مرورگر انجام مي شود اما برنامه هاي جاوا بايد توسط يک کامپايلر Compiler ، کامپايل شده که کامپايل شدن يعني جمع آوري اطلاعات مورد نظر و ترجمه آن اطلاعات به زبان قابل فهم براي کامپيوتر و تبديل آن به يک برنامه کاربردي واحد و مستقل براي کاربر را گويند. به همين دليل برنامه هاي جاوا را که اپلت applet مي نامند، مستقل اجرا مي شوند. البته اپلتهاي جاوا را مي توان در صفحات وب هم گنجاند.


در يک جمله مي توان گفت که جاوااسکريپت فقط در صفحات وب تأثيرگذار است اما زبان جاوا براي خلق برنامه هاي پيچيده در کامپيوتر ساخته شده است.


 


0   |  0 امتياز: 0 | نظر شما: 1 2 3 4 5
برچسب ها: تفاوت,جاوااسکريپت,جاوا,Sun Microsystems ,Sun Microsystems ,Internet Explorer ,
نوشته شده در دوشنبه 28 / 9ساعت 2:37 توسط نرگس|

N<html>
<body style="font-size:20 ">
n

or

<body style="background-image:url(rat.jpg) ;font-size:20">

n<p style="color: red; margin-left: 50px">
HyperText Markup Language (HTML) is the predominant markup language for web

pages. HTML elements are the basic building-blocks of webpages.

</p>
<p style="color: lightgreen; margin-right: 20px">

HTML is written in the form of HTML elements consisting of tags, enclosed in angle

brackets (like <html>), within the web page content. HTML tags most commonly

come in pairs like <h1> and </h1>, although some tags, known as empty elements,

are unpaired, for example. The first tag in a pair is the start tag, the second tag is the

end tag (they are also called opening tags and closing tags). In between these tags

web designers can add text, tags, comments and other types of text-based

content.The purpose of a web browser is to read HTML documents and compose

them into visible or audible web pages. The browser does not display the HTML

tags, but uses the tags to interpret the content of the page.
</p>
<p style="position:fixed;top:150;left:400; color:blue">
This is example
</p>
<p style="border-color:pink; border-style:outset;border-width:15">
HTML elements form the building blocks of all websites. HTML allows images and

objects to be embedded and can be used to create interactive forms. It provides a

means to create structured documents by denoting structural semantics for text such

as headings, paragraphs, lists, links, quotes and other items. It can embed scripts in

languages such as JavaScript which affect the behavior of HTML webpages.
</p>

<p style="border-color:purple; border-style:inset;border-width:15;padding:15;">

The first publicly available description of HTML was a document called "HTML

Tags", first mentioned on the Internet by Berners-Lee in late 1991.[5][6] It describes

20 elements comprising the initial, relatively simple design of HTML. Except for the

hyperlink tag, these were strongly influenced by SGMLguid, an in-house SGML

based documentation format at CERN. Thirteen of these elements still exist in HTML

4
</p>
<p style="border-color:lightskyblue; border-style:inset;border-

width:25;wigth:100;hieght:100;overflow:scroll">

Hypertext markup language is a markup language that web browsers use to interpret

and compose text, images and other material into visual or audible web pages. Default

characteristics for every item of HTML markup are defined in the browser, and these

characteristics can be altered or enhanced by the web page designer's additional use

of CSS. Many of the text elements are found in the 1988 ISO technical report TR

9537 Techniques for using SGML, which in turn covers the features of early text

formatting languages such as that used by the RUNOFF command developed in the

early 1960s for the CTSS (Compatible Time-Sharing System) operating system: these

formatting commands were derived from the commands used by typesetters to

manually format documents. However, the SGML concept of generalized markup is

based on elements (nested annotated ranges with attributes) rather than merely print

effects, with also the separation of structure and processing; HTML has been

progressively moved in this direction with CSS.

</p>
</body>
</html>N

 

 

 


0   |  0 امتياز: 0 | نظر شما: 1 2 3 4 5
برچسب ها: تمرین,نمونه,کد, css,HTML ,elements,
نوشته شده در 4 / 9ساعت 2:53 توسط نرگس|

ویژگی position به ما اجازه می دهد تا تعیین کنیم که آیا می خواهیم موقعیت یک عنصر در صفحه مشخص شود یا نه. اگر می خواهیم آن عنصر موقعیت مشخصی داشته باشد موقعیت عنصر را در صفحه تعیین می کند. چندین مقدار را می توان برای این ویژگی قرار داد. در اینجا می توانید این مقادیر را با کمی توضیح در مورد هر کدام ببینید:

    * static :
      این مقدار پیش فرضی است که در صورت تعریف نشدن position در صفحه استفاده می شود. با این مقدار اجزا در همان جایی که کد آنها را می نویسید دیده می شوند.
    * absolute :
      این مقدار به ما اجازه می دهد تا یک عنصر از صفحه را در هر موقعیتی نسبت به بالا، راست، پایین یا چپ صفحه که بخواهیم نمایش دهیم.
    * fixed :
      این گزینه به ما اجازه می دهد تا موقعیت یک عنصر صفحه را در پنجره مرورگر مشخص کنیم. در صورتی که برای یک عنصر از این ویژگی استفاده کنیم، موقعیت آن عنصر حتی در صورتی که به بالا و پایین صفحه برویم یا اندازه پنجره مرورگر را تغییر دهیم به همان صورت قبلی باقی می ماند. البته 
نسخه های قدیمی اینترنت اکسپلورر در ویندوز از این ویژگی پشتیبانی نمی کند ولی اینترنت اکسپلورر در مکینتاش ، همچنین مرورگرهای نت اسکیپ و مرورگر های دیگر از این ویژگی پشتیبانی می کنند.


0   |  0 امتياز: 0 | نظر شما: 1 2 3 4 5
برچسب ها: پشتیبانی, Fixedمرورگر,absolute,position,اینترنت,اکسپلورر,نت اسکیپ,
نوشته شده در 4 / 9ساعت 2:50 توسط نرگس|

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

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

مثال:

n<link rel=”stylesheet” type=”text/css” href=”/body.css” />
<link rel=”stylesheet” type=”text/css” href=”/side.css” />
<link rel=”stylesheet” type=”text/css” href=”/footer.css” />
n


تبدیل کنید به:


<link rel=”stylesheet” type=”text/css” href=”/style.css” />

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

 


0   |  0 امتياز: 0 | نظر شما: 1 2 3 4 5
برچسب ها: استفاده,چند,فایل, css,سند, html,link,
نوشته شده در 4 / 9ساعت 2:49 توسط نرگس|