نشانه گذاری یک نامه در HTML — راهنمای کاربردی

همه ما دیر یا زود یاد میگیریم که یک نامه بنویسیم. همچنین نوشتن نامه مثالی مفید برای بررسی مهارتهای HTML ما محسوب میشود. در این ارزیابی یک نامه به شما داده میشود تا آن را نشانه گذاری کنید و بدین ترتیب مهارتهای مقدماتی و پیشرفته قالببندی متن HTML خود را که شامل هایپرلینکها میشوند مورد ارزیابی قرار دهید. همچنین آشنایی خود با محتوای <head> در HTML را مورد بررسی قرار میدهید.
پیشنیازها
پیش از اقدام به ارزیابی باید قبلاً با مفاهیمی که در نوشتههای زیر ارائه شدهاند آشنا باشید:
- آشنایی مقدماتی با HTML — به زبان ساده
- مبانی کار با متن در HTML — راهنمای کاربردی
- Metadata در HTML — راهنمای جامع
- قالببندی پیشرفته متن در HTML — راهنمای کاربردی
هدف از این مقاله آزمودن مهارتهای شما در زمینه قالببندی مقدماتی و پیشرفته متن در HTML و دانش شما در مورد آن چه در بخش <head> در یک سند HTML قرار میگیرد است. همچنین برای مطالعه قسمت قبلی این مجموعه مطلب میتوانید روی لینک زیر کلیک کنید:
سرآغاز
برای آغاز ارزیابی متن خامی که قرار است نشانهگذاری کنید به صورت زیر است:
Dr. Eleanor Gaye Awesome Science faculty University of Awesome Bobtown, CA 99999, USA Tel: 123-456-7890 Email: no_reply@example.com 20 January 2016 Miss Eileen Dover 4321 Cliff Top Edge Dover, CT9 XXX UK Re: Eileen Dover university application Dear Eileen, Thank you for your recent application to join us at the University of Awesome's science faculty to study as part of your PhD next year. I will answer your questions one by one, in the following sections. Starting dates We are happy to accommodate you starting your study with us at any time, however it would suit us better if you could start at the beginning of a semester; the start dates for each one are as follows: First semester: 9 September 2016 Second semester: 15 January 2017 Third semester: 2 May 2017 Please let me know if this is ok, and if so which start date you would prefer. You can find more information about important university dates on our website. Subjects of study At the Awesome Science Faculty, we have a pretty open-minded research facility — as long as the subjects fall somewhere in the realm of science and technology. You seem like an intelligent, dedicated researcher, and just the kind of person we'd like to have on our team. Saying that, of the ideas you submitted we were most intrigued by are as follows, in order of priority: Turning H2O into wine, and the health benefits of Resveratrol (C14H12O3.) Measuring the effect on performance of funk bassplayers at temperatures exceeding 30°C (86°F), when the audience size exponentially increases (effect of 3 × 103 increasing to 3 × 104.) HTML and CSS constructs for representing musical scores. So please can you provide more information on each of these subjects, including how long you'd expect the research to take, required staff and other resources, and anything else you think we'd need to know? Thanks. Exotic dance moves Yes, you are right! As part of my post-doctorate work, I did study exotic tribal dances. To answer your question, my favourite dances are as follows, with definitions: Polynesian chicken dance A little known but very influential dance dating back as far as 300BC, a whole village would dance around in a circle like chickens, to encourage their livestock to be "fruitful". Icelandic brownian shuffle Before the Icelanders developed fire as a means of getting warm, they used to practice this dance, which involved huddling close together in a circle on the floor, and shuffling their bodies around in imperceptibly tiny, very rapid movements. One of my fellow students used to say that he thought this dance inspired modern styles such as Twerking. Arctic robot dance An interesting example of historic misinformation, English explorers in the 1960s believed to have discovered a new dance style characterized by "robotic", stilted movements, being practiced by inhabitants of Northern Alaska and Canada. Later on however it was discovered that they were just moving like this because they were really cold. For more of my research, see my exotic dance research page. Yours sincerely, Dr Eleanor Gaye University of Awesome motto: "Be awesome to each other." -- The memoirs of Bill S Preston, Esq
فایل CSS نیز به صورت زیر خواهد بود:
body { max-width: 800px; margin: 0 auto; } .sender-column { text-align: right; } h1 { font-size: 1.5em; } h2 { font-size: 1.3em; } p,ul,ol,dl,address { font-size: 1.1em; } p, li, dd, dt, address { line-height: 1.5; }
اینک باید یک فایل جدید html. با استفاده از یک ویرایشگر متنی بسازید تا روی آن کار کنید. همچنین میتوانید از وبسایتهایی مانند JSBin یا Thimble برای انجام این ارزیابی استفاده کنید.
خلاصه پروژه
در این پروژه وظیفه شما این است یک نامه را که باید روی اینترانت یک دانشگاه میزبانی شود، نشانهگذاری کنید. این نامه پاسخی از سوی یک همکار پژوهشی به یک دانشجوی PhD است که تقاضای کار در دانشگاه را دارد.
معناشناسی بلوکی/ساختاری
- شما باید سند کلی را با ساختار مناسب که شامل عناصر doctype ،<html> ،<head> و <body> است سازماندهی کنید.
- نامه به طور کلی باید با استفاده از یک ساختار پاراگرافبندی شده و عنوانبندی شده به استثنای نکات زیر نشانهگذاری شود:
- یک عنوان سطح بالا (یعنی خط Re:) و سه عنوان سطح دوم وجود دارد.
- تاریخ شروع ترم، موضوعات آموزشی و موارد مرتبط باید با نوع لیست مناسبی نشانهگذاری شوند.
- دو آدرس را میتوان درون پاراگراف قرار داد. عنصر <address> به این منظور مناسب نیست. به علاوه هر خط از آدرس باید در یک خط جدید قرار گیرد اما در پاراگراف جدید نباشد.
معناشناسی درونخطی
- نامهای فرستنده و گیرنده (و «Tel» و «Email») باید با تأکید قوی نشانهگذاری شوند.
- چهار تاریخ موجود در سند باید با عناصر مناسب مفروض که شامل تاریخهای قابلخواندن از سوی ماشین هستند نشانهگذاری شوند.
- آدرس اول و تاریخ اول در نامه باید دارای مقدار خصوصیت کلاس به صورت «sender-column» باشند، CSS که در ادامه اضافه میکنید موجب میشود که این موارد راست-چین شوند و این وضعیتی است که در یک نامه کلاسیک باید وجود داشته باشد.
- پنج اختصار/مخفف در متن اصلی وجود دارد که باید در نامه نشانهگذاری شود تا بسطی برای هر اختصار/مخفف ارائه شود.
- شش زیر/بالانویس باید به صورت صحیحی نشانهگذاری شوند. در فرمولهای شیمیایی و اعداد 103 و 104 مقدار 10 باید پایه و مقدار 3 و 4 به ترتیب نما باشند.
- دستکم دو کلمه مناسب در متن باید با اهمیت/تأکید قوی مناسبی نشانهگذاری شوند.
- دو مکان وجود دارند که در آن یک هایپرلینک باید اضافه شود. در این موارد لینک و عنوان مناسب را اضافه کنید. در مورد مکانی که لینک اشاره میکند، صرفاً از http://example.com استفاده کنید.
- شعار دانشگاه و استناد باید با عناصر مناسبی نشانهگذاری شوند.
بخش head سند باید به صورت زیر باشد:
- مجموعه کاراکتر سند باید با استفاده از یک تگ متای مناسب به صورت utf-8 اشاره شده باشد.
- مؤلف نامه باید در تگ متای مناسبی قید شده باشد.
- CSS اشاره شده باید درون یک تگ مناسب مورد اشاره قرار گرفته باشد.
سرنخها و نکات
از وبسایت اعتبارسنجی W3C (+) برای بررسی کدهای HTML خود استفاده کنید. در صورتی که کد شما به صورت درست اعتبارسنجی شود، نکات خاصی به عنوان جایزه ارائه میشود. لازم نیست در این ارزیابی هیچ گونه آشنایی با CSS داشته باشید. کافی است CSS ارائه شده را درون عنصر HTML قرار دهید.
مثال
در تصویر زیر نمونهای از نامهای را میبینید که نشانهگذاری شده است:
برای مطالعه بخش بعدی این مجموعه مطلب آموزشی روی لینک زیر کلیک کنید:
اگر این مطلب برای شما مفید بوده است، آموزشهایی زیر نیز به شما پیشنهاد میشوند:
- مجموعه آموزشهای طراحی سایت با HTML و CSS
- آموزش کدنویسی سریع HTML و CSS با Emmet
- مجموعه آموزش های برنامه نویسی
- آموزش طراحی وب با HTML – مقدماتی
- آموزش طراحی وب با HTML – تکمیلی
==