همه چیز درباره طراحی وب

*KhatKhati* · 18/9/20

امکانات
یک امکان رایج اغلب زبان‌های نشانه‌گذاری؛ این است که آن‌ها متن یک مستند را با دستورالعمل‌های نشانه‌ای در یک جریان داده یا فایل یک‌سان، ترکیب می‌کنند. این‌کار الزامی نیست، در واقع این ممکن است که نشانه‌گذاری را از محتوای متنی به وسیلهٔ نشانه‌گرها؛ افست‌ها و IDها، جداسازی کرد.

<h1>Anatidae</h1>
<p>
The family <i>Anatidae</i> includes ducks, geese, and swans,
but <em>not</em> the closely related screamers.
</p>

کدهایی که در بین دوعل‍امت کوچک‌تر و بزرگ‌تر محصور شده‌اند (مثل <این>)؛ دستورالعمل‌های نشانه‌گذاری هستند که به «تگ» شناخته می‌شوند. درحالی که متن بین این دستورالعمل‌ها در واقع عین متن مستند هستند. کدهای h1، p و em مثال‌هایی از نشانه‌گذاری معنایی هستند که معنی و منظور متنی را که شامل می‌شوند را منتقل می‌کنند. h1، به معنای عنوان سطح اول؛ p به معنای پاراگراف و em به معنای کلمه یا عبارت تأکید شده‌است. برنامه‌ای که چنین نشانه‌گذاری را تفسیر می‌کند، ممکن است قواعد و سبک خود را برای نشان دادن بخش‌های مختلف متن با استفاده از فونت‌های مختلف، ضخامت‌ها، ابعاد مختلف، رنگ‌ها یا سایر سبک‌ها اعمال کند. یک تگ با عنوان «h1» ممکن است با یک فونت بزرگ و به‌خصوص نمایش داده شود، یا با هر سبک و اندازهٔ دیگری نشان داده شود یا حتی تغییری با سایر اجزای متن نداشته باشد. درعوض، تگ i در اچ‌تی‌ام‌ال مثالی از نشانه‌گذاری نمایشی‌ست که برای مشخص‌کردن یک ویژگی خاص متن (در اینجا استفادهٔ فونت ایتالیک) بدون ذکر دلیل استفاده می‌شود.

*KhatKhati* · 18/9/20

استفاده‌های جایگزین
از آن‌جا که ایدهٔ استفاده از زبان نشانه‌گذاری، از مستندات متنی نشأت گرفته‌است، استفاده از زبان نشانه‌گذاری در نشان‌دادن و ارائهٔ سایر انواع اطل‍اعات مانند گرافیک برداری، خدمات وب و واسط کاربر در حال افزایش است. بیشتر این مثال‌ها؛ برنامه‌های اکس‌ام‌ال هستند، به این جهت که اکس‌ام‌ال یک زبان گسترده است و در عین حال به خوبی تعریف شده‌است.[۶]

از آنجا که زبان‌های نشانه‌گذاری و اغلب زبان‌های توصیف‌گر داده‌ای، زبان‌های برنامه‌نویسی نیستند[۷] و درحقیقت داده‌هایی بدون دستورالعمل‌ها هستند، نسبت به زبان‌های برنامه‌نویسی راحت‌تر دستکاری می‌شوند. برای مثال، صفحات وب به صورت مستندات اچ‌تی‌ام‌ال نمایش داده می‌شوند و نه کدهای C. به همین علت است که می‌توانند در سایر صفحات وب جای‌گذاری شوند، یا حتی درصورتی که قسمتی از آن‌ها بارگیری شود، باز هم نمایش داده می‌شوند.

*KhatKhati* · 18/9/20

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

در صفحات وب (ابرمتن) برای تبدیل یک متن یا عنصر دیگر (همانند تصویر یا فایل فلش) تنها کافی‌ست آن را میان دو تگ <a></a> قرار داده شوند.

به طور مثال اگر قرار باشد ابرپیوندی به سایت Example Domain را روی متن مثال قرار دهیم بدین صورت عمل می‌کنیم:

<a href="Example Domain">مثال</a>

*KhatKhati* · 18/9/20

سی‌اس‌اس CSS
از ویکی‌پدیا، دانشنامهٔ آزاد
(تغییرمسیر از الگوهای آبشاری)
پرش به ناوبری پرش به جستجو
استانداردهای وب
HTML
RDF
CSS
DOM
XHTML
XML
SVG
W3C
DHTML

سی‌اس‌اس (به انگلیسی: CSS: Cascading Style Sheets) در کنار اچ‌تی‌ام‌ال هستهٔ فناوری ساخت صفحه‌های وب هستند. سی‌اس‌اس روشی ساده برای نمایش چیدمان و جلوه‌های تصویری (مانند نوع قلم، رنگ و اندازه‌ها) بر صفحه‌های وب است.[۱] سی‌اس‌اس از جنس زبان‌های نشانه‌گذاری، با ساختار متن سادهٔ رایانه هستند و درون هرکدام، دستورهایی آبشار مانند و پی‌درپی، برای چگونگی نمایش هر صفحه وب افزوده می‌شود. به گفته‌ای ساده‌تر، این دستورها روش نشان داده شدن قلم‌ها و اندازه‌شان، رنگ‌ها و پس زمینه‌ها، روش چیدمان موزاییک‌های دربرگیرنده داده‌ها (دیواره‌ها)، و بسیاری دیگر از عنصرهای ساختار هر صفحه وب را، درون خود جای می‌دهند.

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

*KhatKhati* · 18/9/20

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

*KhatKhati* · 18/9/20

برتری‌ها
با اینکه در سال‌های نخست پیدایش طراحی وب، طراح‌ها از جدول‌ها و ترفند پنهان‌سازی آن‌ها برای چیدمان کمک می‌گرفتند، روش مدرن طراحی وب، این روند را منسوخ کرده‌است. چیدمان اکنون، تنها با دیواره (یا DIV)، که برتری‌های فراوانی نسبت به جدول‌ها (یا TABLE) دارند، انجام می‌شود. هر دیواره، یک موزاییک مجازی بخش‌کننده صفحه‌است که کار چیدمان را آسان‌تر انجام می‌دهد. جدول‌ها به جایگاه نمایش داده‌های ستونی خود بازگشتند و دیگر از آن‌ها برای چیدن داده‌های صفحه‌های وب استفاده نمی‌شود. سی‌اس‌اس، افزون بر سبک تر کردن هر صفحه وب و پاک‌تر کردن آن، از داده‌های تصویری و نمایشی استاندارد، روش طراحی وب را به میزان فراوانی آسان تر و دسترسایی و کارایی وب را بهتر کرده‌اند.

*KhatKhati* · 18/9/20

پهنای باند
یک فایل سی‌اس‌اس معمولاً در حافظه پنهان مرورگر ذخیره می‌شود، بنابراین می‌تواند بدون نیاز به بازخوانی در چندین صفحه استفاده شود که این امر باعث کاهش تبادل اطلاعات در شبکه می‌شود.

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

*KhatKhati* · 18/9/20

نحوه استفاده
برای درج CSS در یک سند اچ‌تی‌ام‌ال از یکی از سه روش زیر می‌توان بهره گرفت:

شیوه‌نامهٔ خارجی

در این روش برای اتصال یک سند CSS که با پسوند .css شناخته می‌شود، از تگ <link> در قسمت <head> استفاده می‌شود. مثال:
<head>
<link rel="stylesheet" type="text/css" href="mystyle.css"/>
</head>

*KhatKhati* · 18/9/20

شیوه‌نامهٔ داخلی

شیوه‌نامهٔ داخلی در قسمت <head> در سند اچ‌تی‌ام‌ال، با استفاده از تگ <style> معین می‌گردد. مانند زیر:
<head>
<style type="text/css">
hr {color:sienna;}
p {margin-left:20px;}
</style>
</head>

*KhatKhati* · 21/9/20

جاوا و جاوا اسکریپت
این سیستم به سرورهای وب امکان می‌دهد تا برنامه‌های کوچکی (که اپلت (applet) نامیده می‌شوند) را مستقیماً در شبکه اطلاعات بازیابی شده قرار دهند و این اپلت‌ها که در کامپیوتر کاربر اجرا می‌شوند تعامل کاربر با اینترنت را سرعت می‌بخشد. در نهایت این سیستم به عنوان ابزاری برای تولید محتویات پیچیده طرف سرور مورد استفاده قرار گرفت. شرکت سان تلاش می‌کرد جاوا را به عنوان یک پلاتفرم برای اپلت‌های طرف مشتری مطرح کند اما به دلایلی مانند عدم وجود یکپارچگی با محتوا (اپلت‌ها به جعبه‌های کوچکی محدود می‌شدند که درون صفحه قرار داشتند) و عملکرد ضعیف (مخصوصاً شروع با تأخیر) ماشین مجازی بر روی سخت‌افزارهای PCهای آن زمان این امر هرگز محقق نشد.

با این وجود، جاوا اسکریپت یک زبان برنامه‌نویسی اسکریپتی است که برای صفحات وب طراحی شده‌است. نسخه استاندارد آن ECMAScript نام دارد. اگر چه نام آن شبیه جاوا است اما توسط شرکت ارتباطات نت اسکیپ (Netscape) طراحی شده‌است و تقریباً هیچ ارتباطی با جاوا که ساخت شرکت میکروسیستم‌های سان است ندارد. تنها شباهت آن با جاوا در این است که نحوه نگارش آن از زبان برنامه‌نویسی C گرفته شده‌است. جاوا اسکریپت مانند جاوا برنامه‌نویسی شیءگرا است اما شبیه سی پلاس پلاس و بر خلاف جاوا امکان استفاده از کدهای درهم (مخلوط) یعنی استفاده هم‌زمان از زبان برنامه‌نویسی شیء گرا و برنامه‌نویسی رویه‌ای را فراهم می‌آورد. جاوا اسکریپت در کنار مدل شیء سند به زبان برنامه‌نویسی بسیار قوی‌ای تبدیل شده که حتی طراحان آن چنین تصوری از موفقیت آن نداشتند. گاهی اوقات در مورد آن از کلمه HTML پویا (DHTML) استفاده می‌شود تا گذر از صفحات HTML «ایستا» بیشتر حس می‌شود.

(برنامه‌نویسی) ای‌جکس یک فناوری مبتنی بر جاوا اسکریپت است که تأثیر زیادی بر شکل‌گیری تور جهان گستر داشته‌است. در این روش در زمان‌های لازم، تنها بخشی از صفحه وب که مورد نیاز کاربر است به روز می‌شود تا سرعت کاربر بالاتر برود. ای‌جکس یکی از جنبه‌های مهم وب ۲٫۰ محسوب می‌شود.

خوش آمدید به رمان ۹۸ | بهترین انجمن رمان نویسی

ما را در شبکه‌های اجتماعی دنبال کنید

مدیر بازنشسته رمان ۹۸

مدیر بازنشسته رمان ۹۸

مدیر بازنشسته رمان ۹۸

مدیر بازنشسته رمان ۹۸

مدیر بازنشسته رمان ۹۸

مدیر بازنشسته رمان ۹۸

مدیر بازنشسته رمان ۹۸

مدیر بازنشسته رمان ۹۸

مدیر بازنشسته رمان ۹۸

مدیر بازنشسته رمان ۹۸

ما را در شبکه‌های اجتماعی دنبال کنید

درباره ما

لینک‌های پیشنهادی رمان ۹۸

آمار آنلاین