🙎🏽 🖖🏾 🐞 नौसिखिए कोडर के लिए एक दर्जन लानत सुझाव। एक भाग 👑 🧣 🌾

आपका दिन शुभ हो!

परिचय

मैं एक फ्रीलांसर हूं। मैं वास्तव में यह नहीं सोचता था कि कैसे और क्या टाइपसेटर्स करते हैं। मैं सर्वर साइड कर रहा था, और मेरा मित्र सामग्री टाइप कर रहा था। हाल ही में, मैं क्या और कैसे करना चाहता था। कुछ दिनों पहले मुझे एक ऐसी सामग्री मिली, जो मुझे बहुत पसंद आई। उन्होंने स्पष्ट रूप से बताया कि क्या और कैसे लिखना है। दुर्भाग्य से, मैं एक लिंक नहीं दे सकता, क्योंकि मुझे यह याद नहीं था कि यह मैनुअल कहाँ स्थित है, लेकिन ... ऐसा लगेगा कि आप इसे याद कर सकते हैं, लेकिन मैं एक और रास्ता गया - उसने इस मामले को रेखांकित किया। वास्तव में, मेरे नोट में आपका स्वागत है।

नया सिद्धांत

क्या आप अभी भी इस पुराने, विघटित, झुर्रीदार सिद्धांत का उपयोग कर रहे हैं?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"  
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

, ? , HTML5:

<!DOCTYPE html>

(, , ). HTML5 , . , . !

figure

    <img src="path/to/image" alt=" ?     !" />  
    <p>Image of Mars. </p>

, , . HTML5 figure. figcaption . , :

    <figure>  
        <img src="path/to/image" alt=" ?     !" />  
        <figcaption>  
            <p>  -  .</p>  
        </figcaption>  
    </figure>

script link

    <link rel="stylesheet" href="path/to/stylesheet.css" type="text/css" />  
    <script type="text/javascript" src="path/to/script.js"></script>

. , , . .

    <link rel="stylesheet" href="path/to/stylesheet.css" />  
    <script src="path/to/script.js"></script>

—

, . , HTML5 — XHTML. , . , , « »:

<p class = myClass id= someId>,  ,   ?</p>

HTML5 web- , . . , , - (, ). ~~« »~~ . :

    <!DOCTYPE html>  
     <html lang="en">  
    <head>  
        <meta charset="utf-8">  
        <title>untitled</title>  
    </head>  
    <body>  
        <h2> To-Do List </h2>  
         <ul contenteditable="true">  
            <li> . </li>  
            <li>  . </li>  
            <li>  - ! </li>  
         </ul>  
    </body>  
    </html>

    <ul contenteditable = true>

E-mail

. , . ( , ) . . , :

<!DOCTYPE html>  
  <html lang="en">  
<head>  
    <meta charset="utf-8">  
    <title>untitled</title>  
</head>  
<body>  
    <form action="" method="get">  
        <label for="email">Email:</label>  
        <input id="email" name="email" type="email" />  
        <button type="submit"> Submit Form </button>  
    </form>  
</body>  
</html>

. …

, e-mail . , ( IE ), .

aka placeholders

, JavaScript . . — placeholders.
, . :

<input name="email" type="email" placeholder="  - !" />

id, , ( , ), — . :

   <div id="header">  
     <p></p>  
   </div>  
  <div id="footer">  
     <p>  </p>
   </div>

, , , . .

    <header>  
     3000   .
    </header>  
      
    <footer>  
     -3000  .  .
    </footer>

. , , .

Internet Explorer HTML5 —

IE HTML5. , Microsoft. — .
— JavaScript CSS. . , :

header, footer, article, section, nav, menu, hgroup {  
   display: block;  
}

, , IE - . , . JavaScript:

document.createElement("article");  
document.createElement("footer");  
document.createElement("header");  
document.createElement("hgroup");  
document.createElement("nav");  
document.createElement("menu");

~~, .~~ . , , IE. :

<!--[if IE]>  
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>  
<![endif]-->

IE Developer Preview , HTML5 Internet Explorer. , , — HTML5.

hgroup

. , , . , . , . ~~, —~~ .
, , . :

    <header>  
        <hgroup>  
            <h1> ... </h1>  
            <h2>     . </h2>  
        </hgroup>  
    </header>

Required

, . , , .
: , «», , - , .
. required . , :

    <form method="post" action="">  
        <label for="someInput"> : </label>  
        <input type="text" id="someInput" name="someInput" placeholder="Bill" required>  
        <button type="submit"></button>  
    </form>

? !

web-, , .

!

नौसिखिए कोडर के लिए एक दर्जन लानत सुझाव। एक भाग