9569 views

 

45% kleeder

::|CONTENTS

1. Restrictions on submit
2. Tools
3. Accepted file format
4. See also

HTML

battles on BotB are about building a web page or multiple web pages from scratch. They are the precursor to HTML5 battles and, as such, are restricted to HTML 4 or lower standards.

Restrictions on submit

---

Only HTML 4 tags are allowed. If you're unsure of which tags to avoid, the HTML 5 page includes a list on which new tags were introduced.

Cascading Style Sheets (CSS) are allowed. Flash, Java, and anything else that requires a plugin are not. Similarly, JavaScript is banned to distinguish the html/css format from the html5 format, though it was permitted in the past.

Resources can be public domain or selfmade, depending on the bitpack rules. Generally, you can use everything as long as it is free-to-use. Hotlinking to files on the Internet however is prohibited, since it wastes bandwidth from the host, is prone to breaking, and would likely break one of the other rules as is. This means that resources utilizing server connections (such as PHP code) are forbidden.

DESIGN CONSIDERATIONS

• Consider readability of your web pages. If you want people to read your text, it is important to distinguish the foreground text from the background.
• Test your hyperlinks to ensure that all resources load correctly and that your site structure works as intended. Make sure to match the case of your hyperlink to the filename as some operating systems have case-sensitive filesystems.

Tools

---

There are two distinct types of HTML editors out there: plain text editors, and WYSIWYG (What You See Is What You Get) editors.

PLAIN TEXT EDITORS
Plain text editors are as described on the label; they're editors that rely on the code text of the document, rather than the layout of the document. They're the simplest tools to use out of the bunch and, as such, allow for greater amounts of freedom when it comes to the code of a page, especially when CSS is involved. However, as such, people will have to solely rely on their knowledge of HTML and CSS in order to create a website.

LIST OF POPULAR TOOLS
- Brackets

, the most modern example of a plain text editor. Built for developing HTML and CSS pages and has WYSIWYG previewing, not editing. Recommended for n00bs who know the language well. Previewing requires Google Chrome to work.
- Notepad++

, the most robust text editor out there. Has autofill and markup settings for most languages, HTML and CSS included.
- Your built in text editor, the most convenient option. Recommended for hardcore n00bs who love editing HTMLs like it's 1993. B)

WYSIWYG EDITORS
WYSIWYG stands for "What You See Is What You Get". In short, these are the Microsoft Word to the above's Notepad, allowing live document editing, drag and drop capabilities, and more intuitive controls that attract first-time developers. However, as such, that means that most of the people that use WYSIWYG editors are likely to be n00bs who don't know what they're doing. It'd be wise to get to know these programs first before going ahead and using them, lest ye dare to break one of the sacred considerations and incur the wrath of all who may see. It's also good to remember that most, if not all WYSIWYG editors, have a source tab that shows the code of your page.

LIST OF POPULAR TOOLS
- BlueGriffon

, the most popular out of all the choices for free WYSIWYG editor. Uses the Gecko Engine also used by Firefox and Netscape. Requires license to access all features, such as a more responsive design and EPUB support.
- Froala WYSIWYG Editor

, an editor made entirely in Javascript. Requires a proprietary license to use outside of free trial period.
- SeaMonkey

, the community run web suite originally developed by Mozilla. Includes a robust WYSIWYG editor known as the Composer with quick image resizing, CSS support, and a DOM Inspector for checking entries. It also has an IRC client.

There are tons of other ones -- such as CoffeeCup, Mobirise, Dreamweaver, and Frontpage -- however, these three are the most widely suitable and available tools for making entries with.

Accepted file format

---

The submitted file must either be a standalone .html or .htm file or, if the page contains external resources (such as images, videos, music, other pages, etc.) a .zip file containing the main .html file and assets. Keep in mind that your entry must be a maximum of 1,024KiB in size!

See also

---

W3schools

and the Mozilla Developer Network Web Docs

are both immensely extensive resources for HTML and CSS development that could help you get started. Be aware that some articles may not be relevant to this format (for example, if relating to JavaScript or HTML5 features).