آموزش طراحی وب با زبان ساده بخش اول xhtml

[a.R.a.sh]

ممنون و خسته نباشید

[margan1]

من در فایل منیجر میخوام فایل ایجاد کنم ولی وقتی فایلا رو از کامپیوترم میارم در فایل منیجر قرار میدم تو وب سایتم کدها نمایش داده میشند چکار کنم

[big man]

بسیار کار پسندیده و خوبی هست ، منتها اگر آموزش html5 بود خیلی خوب بود. بنده هم اگر خواستید می تونم کمک کنم.

[tarenoco]

میشه اموزش تبدیل فایل psd به کد رو اموزش بدید

[tarenoco]

سلام میشه آموزش تصویری هم قرار بدید
منظورم بصورت فیلم هستش

[almanwebhost]

میشه تگ هارو هم یاد بدید اخه برای ترجمه قالب به وبلاگ باید تگ ها را بلد باشیم

[tarenoco]

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

انواع ورژن های html

1)
html0.0 : در حقیقت جنبه تجاری نداره و بیشتر برای آزمایش مرورگرها نسبت به زبان تازه تاسیس شده مورد استفاده قرار گرفت (1994)
2)
html2.0 : در این ورژن تنها می توانستند وب سایتهائی رو طراحی کنند که فقط در داخل آنها متن بوده است text-base 1995
3)
html3.2 : این ورژن به عنوان بزرگترین ورژن html تلقی می شود چرا که در آن طراحان میتوانستند از عکس ، صدا و تصویر در طراحی خود استفاده نمایند اصطلاحاً به صدا و تصویر تحت وب java applet گفته میشود در این ورژن بود که طراح می توانست از یک تکنیک طراحی برای صفحات وب خود استفاده نمایند ، در این ورژن روش طراحی table معرفی شد
table چیست؟قرار گرفتن اجزاءیک سایت در جای مناسب
4)
html4.0 و html4.01 : در این ورژن قابلیت های Table بهبود پیدا کرد و همچنین قابلیت (internationalization) جهانی سازی به صفحات وب اضافه شد ، یعنی میتوان با زبان های مختلف جهان طراحی کرد مانند زبان فارسی
5)
xhtml1.0 => extensible hypertext markup language => html4.01+xml
یعنی وقتی xhtml رو میخونید هم xml هم html رو میخونید (زبانی که در این دوره آموزش داده میشه اون هم به این دلیل هست رسمی ترین ورژن هست و تمام مرورگرها ساپورتش می کنند یکی از چالش های مهم یک طراح این است که تمام مرورگرها طراحی اون رو ساپورت کنند
6)
html5.0 : ورژن جدیدی هست که به وجود آمده که استاندارد نیست به این دلیل که هنوز تمام مرورگر ها ساپورتش نمیکنن و قابلیت های جدیدش رو ساپورت نمیکنن به اصطلاح استفاده ازش هنوز زوده
تنها نرم افزاری که در این دوره برای طراحی صفحات وب مورد استفاده قرار میگیره notepad هست ، از دوستان هم خواهش میشه فقط از همین نرم افزار استفاده کنن تا این زبان رو اصولی یاد بگیرن در دوره بعدی که آموزش css هست اون رو با نرم افزار Adobe Dreamweaver CS5 آموزش میدم و کار با اون نرم افزار رو هم یاد خواهید گرفت

تعریف وب سایت : به مجموعه صفحات وبی گفته میشود که از عنصر های مختلف تشکیل شده باشه web page , image , scripte , video , sound و غیره
مجموعه یک وب سایت باید در فولدر ویژه قرار بگیره که نامش rootfolder هست که تمام آبجکت های یک وب سایت در داخل اون قرار میگیره (برای متمرکز کردن فایل های یک وب سایت)

قوانین نام گذاری فایل ها در صفحات وب:
1) هرگز از گذاشتن space و special character در نام گذاری استفاده نشه ولی میشه برای فاصله داخل کلمات از underline و underscore استفاده کنید
2)از دادن نام های فارسی جداً خودداری کنید
3)نام مورد نظر نباید بیش از 255 کارکتر باشه

نکته:اگر بخواهیم زمانی داخل صفحه وب فارسی بنویسیم درست نشون داده نمیشه و باید encoding آن رو utf-8 بذارید (فقط تا زمانی که از notepad استفاده میکنیم)

مرورگر ها کد ها را تفسیر میکنند و به ما نشان میدن ، tag ها پارامتر اصلی برای رسیدن به آن هدف طراحی هستن
تگ ها با این علامت > شروع میشوند که اسمش opening angel braket گفته میشه و با علامت < بسته میشوند که به آن closing angel braket گفته میشه = > <tag>

چند نمونه تگ:
<p> تگ پاراگراف
<img> تگ عکس

انواع تگ ها :
تگ ها به دو دسته تقسیم میشوند
1 container 2 empty
کانتینر به تگ هائی گفته میشه که علاوه بر داشتن تگ باز (opening tag) تگ بسته (closing tag) هم دارند کلوزینگ تگ دقیقاً مانند اپنینگ تگ هست به همرا یک / اضافه یعنی

<b>object</b>
 

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

<object>

مثال :

<img>

نکته ائی که باید در نظر بگیرید تفاوت زبان html و xhtml است هر دوی این زبان هابرای طراحی وب هستن و تفاوت چندانی با هم ندارن البته درسته بعضی از تگ ها حذف و یا اضافه شدن ولی تفاوت اصلی این دو زبان در این هست که ما در زبان xhtml به هیچ وجه تگ های empty نداریم و همه تگ های باید بسته بشوند گذاشتن یک / در آخر تگ های empty باعث بسته شدن تگ های xhtml میشه

<img />

بازم اگر چیزی پیدا کردم قرار میدم

[yossef]

ممنون کی به مراحل پیشرفته میپردازید؟