HTML

Everything About Fiction You Never Wanted to Know.
Revision as of 21:49, 21 November 2022 by Ilikecomputers (talk | contribs) (missing parenthesis)


  • Main
  • Laconic
  • Wikipedia
  • All Subpages
  • Create New
    /wiki/HTMLwork


    HTML, or HyperText Markup Language, is one of the three basic building blocks of all webpages.

    Where Javascript handles fancy interactive elements and CSS handles styling, HTML handles how the page content is organized. It can take the place of CSS for many general features, but this is not considered good web page design in modern day since CSS is much more efficient. Note that HTML is not a programming language, rather, it is simply a markup language, designed to create websites. You can incorporate Javascript into HTML via the use of the <script> tags, but if you do that, you're writing in Javascript, not HTML. You cannot 'hack NASA' using only HTML! It's designed so you can quickly and easily make the basic layout for a website, which you can build upon using other web technologies.

    HTML is designed to be really simple to use and pick up, and you won't have much trouble picking it up. To get started, to go your favourite text editor (notepad is fine!) and start a new file. Save it as a file with the extension .html. For the file type, select the entry that says (any) that contains a period and only a period, which ensures that your file will be recognised as being an HTML file instead of a regular text file. One good way to check that you've done this properly is to turn on display of file name extensions and checking that your file ends in .html.

    There, you'll be able to start writing HTML. We'll gloss over some essential boilerplate that you should always include like a <!DOCTYPE html> tag and a <body> tag (you're here to have fun and read about tropes, not learn about the basic principles of web development). You can just write text into the document and they'll be rendered in the browser, but it's good practice to include the text between <p> and </p> tags (p for paragraph). The <p> tag opens the set, and tells the rendering engine that everything starting from that tag should be considered as a paragraph. The slash (/) in front of the </p> that the paragraph tags have finished, and that any text beyond that point should no longer be considered as a paragraph. Thus, the only text considered to be paragraphs are between the <p> and </p> tags. The <em> tag is used for italics (em for emphasis), and can be nested in <p> tags. For example,
    <p>This is a paragraph! This is <em>italics</em>.</p>
    will produce:
    This is a paragraph! This is italics.

    The paragraph tags span across the entire text, so the entire text is to be considered as a paragraph. The emphasis tag only spans across the word italics, opening before the word, and closing after the word, therefore it is the only thing put in italics. You can also use the <b> tags to put words in bold.

    Headings are denoted with <h1> through <h6> tags, opening and closing in the same way as the above paragraph and emphasis tags. <h1> denotes the largest page heading, and should be used for the title of your page. <h2> can be denoted for the subsections in a page. For example, if you head over to the page for any trope, the trope name and title should be put in a <h1> tag. The headings for the medium of examples, like Anime and Manga or Video Games should be in an <h2> tag. The smaller the number by the 'h', the smaller (and less important) the tag.

    You can make bullet points with <ul> tags (ul for unordered list). List elements are denoted with <li> (list item), and regular opening and closing rules still apply. For example,
    <ul>
    <li>This is a list element.</li>
    <li>This is another element.</li>
    <li>Why is there an entry about HTML on a <b>trope website</b>.</li>
    <li>I expected to learn about tropes, not markup languages.</li>
    </ul>

    Will produce:

    • This is a list element.
    • This is another element.
    • Why is there an entry about HTML on a trope website.
    • I expected to learn about tropes, not markup languages.

    So, how is HTML relevant to tropes? Well, without HTML, All the Tropes probably won't be a thing. We actually use PHP, which isn't HTML but incorporates some elements of HTML. HTML tags are used, but the tags can be broken to run code and logic. The point is that HTML is a fundamental aspect of any website — including this one. Also, if you're a page editor, then the source editor actually recognises some HTML tags, such as the <br> tag for a line break or the heading tags (remember <h1> and <h2>?). To view the site's HTML, press F12 or Ctrl + Shift + I to open developer tools. The 'Inspector' tab should be open by default, if not, click on it.