با اینکه نرمافزارهای مختلف و امکانات بصری (Visual) در سرویسهای وبلاگنویسی باعث استفاده کمتر از کدنویسی شده است اما هنوز هم در بسیاری مواقع برای ویرایش متن و اضافه نمودن دادههای جدید نیاز به کدنویسی هرچند جزئی داریم. در این مقاله سعی میکنم به صورت خلاصه کدها و برچسبهای پر استفاده در html را بیان کنم. مطالعه این متن به وبلاگنویسانی که آشنایی با HTML ندارند توصیه میشود.
HTML چیست؟
HyperText Markup Language زبان خلق صفحات وب است. وب سرور صفحات را در قالب زبان html برای مرورگر (Browser) ارسال میکند. این زبان شامل برچسبهایی (Tags) است که توسط کلیه مرورگرها قابل فهم بوده و برای آرایش متون، قرار دادن پيوند ميان صفحات، نمایش تصاویر و پخش فایلهای صوتی در صفحات وب مورد استفاده قرار میگیرند.
ساختمان فایلها در HTML
دستورات HTML در قالب برچسبهایی است که بین علامتهای <> قرار میگیرند. این برچسبها معمولا به صورت جفتی به کار میروند مثلا از برچسب <p> برای مشخص کردن شروع یک پاراگراف جدید و از برچسب <p/> برای مشخص کردن پایان پاراگراف مورد نظر استفاده میشود. اکثر صفحات HTML از دو قسمت تشکیل میشوند، به دلیل اینکه کدها برای آشنایی وبلاگنویسان آموزش داده میشود از توضیحات بیشتر اجتناب میکنم. برای کدنویسی در قسمتهایی که نام میبریم تنها کافیست از برچسبها استفاده شود.
میتوان در وبلاگنویسی، ثبت نظر (Comment)، شبکههای اجتماعی و … از زبان HTML استفاده نمود؛ در صورتی که در بسیاری از موارد دسترسی به آیکنهای بصری (Visual) برای تغییرات در دادهها وجود ندارد.
کدنویسی با استفاده از HTML
همانطور که اشاره شد دستورات HTML در قالب برچسبهایی است که معمولا به صورت جفتی به کار میروند. برای ویرایش متن و یا افزودن پیوند (Link)، تصویر و … کافی است برچسب شروع که بین علامتهای <X> قرار دارد را نوشته، سپس اطلاعات را وارد کنید (متن، آدرس تصویر یا پیوند) و پس از آن برچسب پایان را که به صورت <X/> میباشد ببندید. (در اینجا X، برچسب مورد استفاده است.
برچسبهایی برای آرایش متن
<b> , <b/> : متن قرار داده شده در بین این دو برچسب ضخیم (Bold) نمایش داده میشود.
<u> , <u/> : متن قرار داده شده در بین این دو برچسب به صورت زیرخط دار (UnderLine) نمایش داده میشود.
<i> , <i/> : متن قرار داده شده در بین این دو برچسب به صورت کج (Italic) نمایش داده میشود.
<p> , <p/> : از این دو برچسب برای مشخص کردن شروع و خاتمه یک پاراگراف استفاده میشود. با استفاده از ویژگی Align این برچسب میتوان پاراگراف مورد نظر را راستچین یا چپچین کرد:
<p align=”right”> Test </p>
<br> : از این برچسب تکی برای شروع یک خط جدید استفاده میشود.
<center> , <center/> : متن قرار گرفته در بین این دو برچسب در وسط خط نمایش داده میشود.
<font> , <font/> : از این برچسب برای تغییر نوع، رنگ و اندازه قلم (font) استفاده میشود. این برچسب دارای سه ویژگی است:
1. Face: از این ویژگی برای تغییر نوع قلم استفاده میشود.
2. color: از این ویژگی برای تغییر رنگ قلم استفاده میشود.
3. size: از این ویژگی برای تغییر سایز قلم استفاده میشود.
<font face=”Arial” size=5 color=”green”> Test For Font </font>
ایجاد پیوند (Link)
برای ایجاد پیوند از برچسب <a> استفاده میشود:
<a href=”URL”> Text </a>
URL به معنای آدرس اینترنتی است. در واقع برای استفاده از این برچسب به جای URL باید آدرس اینترنتی مورد نظر نوشته شود. عبارت Text برای قرار دادن واژه یا واژههایی است که پیوند روی آن قرار میگیرد.
قرار دادن تصویر
با استفاده از برچسب <img> میتوان یک تصویر را در یک صفحه وب قرار داد. در ویژگی src این دستور بایستی مسیر و نام فایل مورد نظر را قرار داد. مثلا اگر فایل JoobinIT.jpg در آدرس http://files.joobinit.wordpress.com/joobinit.jpg باشد باید از دستور زیر استفاده کرد:
<img src=http://files.joobinit.wordpress.com/joobinit.jpg”></img>
با استفاده از ویژگیهای width و height میتوان طول و عرض یک تصویر را تغییر داد. علاوه بر این با استفاده از ویژگی alt میتوان متنی را مشخص کرد که هنگام انتقال موس بر روی تصویر نمایش داده شود. به مثال زیر توجه کنید:
<img src=http://files.joobinit.wordpress.com/joobinit.jpg width=300″ height=”300″ <alt=”Joobin IT”></img
برچسبهایی که معرفی شد از برچسبهای پر استفاده در HTML بودند. تصاویر زیر نمونههایی از مکانهایی است که زبان HTML را پشتیبانی میکنند. البته میزان کدهای قابل قبول معمولا متفاوت است؛ برای مثال در نوشتن یک مطلب جدید در سرویس وبلاگنویسی معمولا بیشتر کدها قابل قبول هستند اما برای ثبت نظر و یا ارسال نوشته در شبکههای اجتماعی معمولا این دستورات محدودتر هستند.
نوشتن پست جدید در وردپرس
نوشتن پست جدید در بلاگر
نوشتن پست جدید در بلاگفا
نوشتن پست جدید در پرشین بلاگ
نوشتن نظر در وبلاگهای وردپرس
نوشتن Note در فیس بوک
نوشتن ScrapBook در Orkut
لینکهای مرتبط:
* این قسمت در طول زمان کامل خواهد شد. اگر شما هم اطلاعاتی در زمینه طراحی تحت وب با HTML نوشتهاید لطفا اطلاع دهید تا در این قسمت قرار گیرد. JoobinIT [at] Gmail [dot] com
** امیدوارم این مقاله مورد استفاده قرار گرفته باشد. سوالات و مشکلات خود را از طریق بخش نظرات و یا ایمیل مطرح کنید.
*** به کمک شما احتیاج دارم: بخش مطالب و پیوندهای منتخب (خوشمزه، del.icio.us) را از خوراک (Feed) وبلاگم برداشتم؛ حس میکردم نوعی مزاحمت برای خوانندگان است، هرچند بسیار با وسواس لینکهایم را انتخاب میکنم. اگر ممکن است نظرتان را در این مورد به من برسانید. این بخش در وبلاگم در بخش «دیدنیها و خواندنیها» در دسترس است.
**** از همه وبلاگنویسان عزیز که یک وبلاگنویس آماتور و تازه وارد را با این گرمی و مهربانی پذیرفتند و حمایت کردند بسیار بسیار سپاسگزارم. امیدوارم بتوانم جبران کنم.







بسیار خوب
By: اخبار ایران on فوریه 4, 2008
at 12:03 ق.ظ
[...] پایان پاراگراف مورد نظر استفاده میشود. اکثر صفحات HTML از دو قسمت تشکیل میشوند، به دلیل اینکه کدها برای [...]
By: آموزش html on فوریه 4, 2008
at 12:04 ق.ظ
[...] Germany Celtic Showing Van Buyten daniel. wrote an interesting post today on HTML Ø¨Ø±Ø§Û ÙØ¨ÙاگâÙÙÛØ³Ø§ÙHere’s a quick excerpt با اینکه نرمافزارهای مختلف و امکانات بصری (Visual) در سرویسهای وبلاگنویسی باعث استفاده کمتر از کدنویسی شده است اما هنوز هم در بسیاری مواقع برای ویرایش متن و اضافه نمودن دادههای جدید نیاز به کدنویسی هرچند جزئی داریم. در این مقاله سعی میکنم به صورت خلاصه کدها و برچسبهای پر استفاده در html را بیان کنم. مطالعه این متن به وبلاگنویسانی که آشنایی با HTML ندارند توصیه میشود. HTML چیست؟ HyperText Markup Language زبان خلق صفحات وب است. وب سرور صفحات را در قالب زبان html برای مرورگر (Browser) ا [...]
By: Facebook » HTML برای وبلاگنویسان on فوریه 4, 2008
at 2:42 ق.ظ
خیلی خوب بود مفید واقع شد …
By: محمد کشوری on فوریه 4, 2008
at 8:10 ق.ظ
اگه در رابطه به ساختن قالب برای بلاگر هم توضیح بدی خیلی ممنون می شم . اصلا نمی دونم برای ساختن قالب تو بلاگر چی کار باید بکنم . خیلی با بلاگفا و پرشین بلاگ فرق داره .
By: امیرحسین on فوریه 4, 2008
at 8:26 ب.ظ
مرسی. عالی بود. ادامه دارد دیگر انشاالله!؟
پاسخ: سلام، مرسی. اگه بخوام ادامه بدم html رو از اول شروع میکنم. البته نه اینقدر خلاصه
By: delzadeh on فوریه 6, 2008
at 10:35 ب.ظ