به‌عنوان یک توسعه‌دهنده وب، نمی‌توانم احساس کنم که همه این توصیه‌ها در سال 2015 بسیار گمراه‌کننده هستند.

البته تگ "p" در مقطعی قرار بود به عنوان یک پاراگراف استفاده شود ... اما در 100٪ از برنامه ها، طراحی ها و توسعه عمومی روزمره من چیزی جز محدودیت های اعمال شده توسط "p" ندیده ایم. برچسب ... در اینترنت امروزی هیچ فایده ای ندارد.

من می گویم «بله»، «پ» یک عنصر توصیفی است و به همین دلیل اگر همه اینها اتفاق می افتاد; "هر چیزی را توصیف کنید"، من برای آن همه کار خواهم کرد... اما این فقط محتوا را توصیف نمی کند، بلکه مستقیماً با تغییراتی جایگزین محتوایی می شود که در حالی که به خودی خود محدود است، نه همه آن، بلکه محتوا را نیز محدود می کند. اینکه چرا فردی با ذهن درست خود به طور هدفمند بلوک ساختمان نهایی را در مورد توسعه وب پوشش می دهد، فراتر از من است. از نقطه نظر طراحی، منطقی نیست. از نقطه نظر ساختاری، این هیچ معنایی ندارد. از هیچ یک از دستکاری های PERIOD DOM، این منطقی نیست.

ما مجموعاً استفاده از برچسب "p" را متوقف کرده‌ایم، مگر در مواقعی که کاملاً مجبور به این کار هستیم (مانند مطبوعات فرهنگ لغت سمت مشتری، موارد احمقانه مانند آن). هیچ بهانه‌ای وجود ندارد که چرا ما نمی‌توانیم تقریباً همه چیز را با کلاس‌ها و شناسه‌های نام‌گذاری شده توصیف کنیم، بنابراین دلیلی برای تعظیم به «استانداردهایی» که هیچ فایده‌ای ندارند، نمی‌بینیم، و در واقع هر قطعه از پازل را بشماریم، «p. برچسب "به توسعه دهنده کمک نمی کند، کاربر نهایییا مدرن موتورهای جستجو. به طور خلاصه ... تگ "p" در پیاده سازی های پیچیده حتی از راه دور تقریباً منسوخ شده است (و با دلایل بسیار خوبی)، اجازه ندهید نظرات آن کنترل های استاندارد نازی محتوای شما را نمایش دهد!

حتی در این سایت بسیار توسعه‌دهنده، آن را بسیار برتر از آن است صفحه خودیک قسمت پاپ کوچک وجود دارد که می تواند از تگ "p" استفاده کند، زیرا حاوی متن کافی برای اجرا به خط دوم است، اما به طور کامل در یک DIV (و فقط یک div، نه div → p) برای تقریباً ضبط می شود. یک عدد بی نهایتدلایل... اول از همه، اینکه امروزه "p" در مقایسه با هر بلوک خوب توصیف شده ایجاد شده از یک DIV که به خوبی توصیف شده است (بیشتر... من می گویم) مانند یک پاراگراف "p" با یک توصیف بسیار بد است. id = "تار" .

از stackoverflow:

دارم باهاش ​​حرف میزنم

و عمر طولانی

و بله، من از استانداردهای فعلی وب ما قدردانی می کنم و چیزهایی مانند آن هنوز وجود دارند، حتی توانایی انجام کارها را با برخی از آنها ارائه می دهند. مرورگرهای مدرنکه شما نمی توانید با یک ظرف انجام دهید، اما این فقط یک عنصر "p" شکسته است، به عنوان بخشی از یک HTML بازسازی شده و مدرن... باید در قبر جایی که به آن تعلق دارد رها می شد... این یک نسل است. از وب سایت هایی که پاراگراف ها دیگر برای همیشه پاراگراف نیستند. بلوک ها به معنای واقعی کلمه در حال تغییر هستند... این فقط قدیمی و غیر عملی است.

ارائه اطلاعات از طریق ایده مدرن ابرمتن اساساً پوچ است، اما نحوه عملکرد آن است. شما نمی توانید با این بحث کنید و باید با آن حساب کنید.

از دیدگاه زبان مدرنبرنامه‌نویسی، مهم نیست که چگونه داده‌ها نمایش داده می‌شوند: انواع سخت‌گیرانه و اجباری اعلام پیش‌رو، یا بدون نوع و توضیحات مورد نظرهنگام اجرای الگوریتم، زبان برای خودش "فکر می کند".

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

منطق صفحه HTML

مثال تاریخی - برچسب فونت HTML. مدت زیادی است که "توصیه نمی شود". انگیزه "توصیه نمی شود" - مشخصه برنامه نویسی مدرن. عدم سازگاری کد بالادستی در بین نسخه ها و عدم ثبات در توسعه نسخه متوالی اجزای نرم افزارو مفاهیم نیز

در واقع، تگ span در HTML بسیار کاربردی‌تر است: فقط مربوط به فونت نیست. Span می تواند بسیاری از ویژگی های نمایش و استفاده از یک محتوای خاص را تغییر دهد.

رشته ها همیشه نمایش اولیه هر داده ای بوده اند، اما زبان های برنامه نویسی همیشه این را با نحو تعریف نکرده اند و برنامه نویسان می دانند که عدد یا بولین استفاده شده همیشه یک رشته است.

پوچی و عینی بودن فرامتن در پیاده سازی های HTML: layout استفاده از مجموعه ای از برچسب ها (جفتی یا تکی) برای توصیف رسمی محتوا (داده) است. نه توضیحات و نه محتوا را نمی توان به طور منطقی اطلاعات نامید. اولین مورد نوعی قاب است که حاوی مقداری محتوا - داده است.

قاب از آجرهای ثابت (برچسب) ساخته شده است که مکان های کاملاً مشخصی را در سازه اشغال می کنند و عناصر نسبی که "هنگام سقوط نقشه" قرار می گیرند.

می‌توانید صفحه را به بخش‌های نمایش داده با جداول یا عناصر بلوک تقسیم کنید، و می‌توانید ساختار حاصل را با داده‌ها با برچسب‌های دیگر «پر» کنید. معمولاً آنها را درون خطی می نامند، یعنی همانطور که فرصت فعلی و محتوای فعلی تعیین می کند مرتب می شوند.

مثال گستره HTML: چیست و چگونه آن را توصیف کنیم

کادر سبز نمونه ای از کدهایی است که مرورگر بر روی آن ارائه کرده است پس زمینه خاکستری. بلوکی عنصر divدر مرکز متنی که در کد دنبال می‌شود به پایان رسید. اولین عنصر تگ با کلاس scSpanLine بود. سپس متنی قرار گرفت که در آن دو قسمت از این متن با تگ span با کلاس scSimpleSpan انتخاب شد.

عناصر درون خطی دوم و سوم دقیقاً همانطور که در کد نوشته شده قرار دارند.

این مثالنحوه عملکرد span در HTML را نشان می دهد. واضح است که این فقط یک توالی داده است. چیز دیگری واضح نیست: توسعه دهنده می تواند این تگ را هر طور که دوست دارد توصیف کند، حتی می تواند قانون را اعمال کند:

• موقعیت: مطلق؛

تاثیری نخواهد داشت. تعیین مختصات و ابعاد نیز نقشی ندارد. وسط یا تراز کردن یک span در HTML بیهوده است. در ضمن، تگ در عمل بسیار کاربردی و مورد تقاضا است. این یک لفاف بسیار مفید برای برجسته کردن است نکته مهمدر جریان داده های عمومی

نکته اصلی این است که یک دامنه HTML راهی برای تغییر نمایش یک رشته یا اصلاح قوانین نمایش بخشی از یک رشته است.

منطق ارائه اطلاعات درون خطی

از زبان توصیف استفاده کنید داده های HTMLبا توجه به هدفش، یعنی توصیف داده ها، دیروز است. استفاده از زبان سمت سرور برای تشکیل بدنه یک صفحه مدرن است و "همه" توسعه دهندگان این کار را انجام می دهند. سیستم های مدیریت محتوا (CMS) به ویژه این مورد را دوست دارند.

تمرین و نیاز واقعی برای ایجاد سایت های زنده، مدیریت پویا اسکلت صفحه و محتوای آن است. به این معنا، تگ span در HTML (که فقط یک پویا است)، در نتیجه کار جاوا اسکریپت، به شما امکان می دهد محتوای پویا را در لحظه ایجاد کنید.

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

هرچه حرفه ای بودن توسعه دهنده بالاتر باشد، طرح بندی صفحه بلوک (یا جدول) بیشتر و حضور واقعی تگ های بازه ثابت در HTML کمتر می شود. چه چیزی می دهد؟ پویایی شناسی. جاوا اسکریپت الگوریتمی است که می تواند روی یک جریان ورودی از رشته ها کار کند و آن را همانطور که توسعه دهنده مد نظر دارد نمایش دهد. تگ های span در ظاهر می شوند جای مناسبو در زمان مناسب

در این پست به دو موضوع مهم می پردازیم - استفاده از عنصر span و ایجاد متن ایتالیک و پررنگ با استفاده از em و تگ های قوی. احتمالاً چیزهای جدید و مفیدی یاد خواهید گرفت. با یک بار به خاطر سپردن و گرفتن ظرافت ها، در آینده این عناصر را به درستی اعمال خواهید کرد.

با استفاده از عنصر span

عنصر دومین عنصر سوء تفاهم شده در فرهنگ لغت HTML، بعد از عنصر بلوک. فکر کردن به عناصر span مانند این می تواند مفید باشد: برچسب درون خطی، که مانند یک خط نجات در HTML است و تنها پس از حذف استفاده از سایر عناصر در این شرایط استفاده می شود. تقریبا همیشه راه حل های بهتری وجود دارد.

عنصر span فقط به عنوان اعمال می شود گزینه آخر، از آنجایی که معنای معنایی ندارد: هیچ راهی برای تشخیص محتوای آن وجود ندارد. عنصر بدون کد CSS اعمال شده روی آن کاملاً بی فایده است: به خودی خود، مطلقاً هیچ تأثیری بر نمایشگر ندارد. ترکیب این دو ویژگی باعث می شود عنصر دهانهدر سایت باید به ندرت، عمدا و با دقت استفاده شود.

یک مورد استفاده معمولی برای یک عنصر در یک عنصر بلوک، محتوایی را بسته بندی می کند که در غیر این صورت نمی توان آن را مشخص کرد سبک های css. مثلا:

بنا به دلایلی نیاز داریم کلمه خاصنمایش داده در غیر این صورت در این بند

البته، ابتدا لازم بود قبل از استفاده از عنصر span، همه احتمالات دیگر را رد کنیم تا استفاده از نشانه گذاری درون خطی مانند: (برای تعاریف استفاده می شود) و (برای اختصارات استفاده می شود) (برای ایجاد متن ایتالیک استفاده می شود) و (برای ایجاد متن پررنگ استفاده می شود)، که هر کدام می توانند کد CSS را اعمال کنند.