In order to make sure your website keeps up to date with the standards of attractive code, I have gathered a table which websites should follow and must include to keep the code neat and organized.
Doctype | An instruction that associates a particular document with a Document Type Definition, or a particular version of HTML |
Title | The title keeps the page's purpose clean, clear, and neat |
CSS | Gives different parts of the website rules, like colors, fonts, and sizes |
Descriptive Block | Things that describe the content they contain; header, section, article |
Hierarchy | The order in which the more important parts go first (header1) and the less imporant parts go after (header2) |
Image Attributes | The rules that an image importated to your website will follow (Width="400" Height="300") |
List Tags | Lists are marked up as lists, depending on the needs of the list: unorderd, ordered, and the underused definition list. |
Compound | Used when a styling only needs to be applied to one element |
Classes | Used any time similar styling needs to be applied to multiple elements |
IDs | Used only when an element appears once on a page and cannot be targeted any other way |
Javascript | An interpreted computer programming language that is used in many different websites |
Body | The space where the bulk of information on the page lies |
Indentation | Tabs or spaces are used to indent the code to indicate the hierarchy of the code and to keep the code looking neat |
File Paths | Site resources use these paths for efficiency when finding files and content |
Characters Encoded | Special characters are encoded |
Dynamic | If something needs to be dynamic, its code is dynamic |
Comments | Comments are included to direct the user, but do not effect the site (See below for directions) |
Free From Styling | Nothing on the page applies styling or implies what the styling might be. Everything on the page is either a required site resource, content, or describing. |
Includes | Used to insert things that are common across multiple pages |
Valid | The markup adheres to W3C validation. Tags are closed, required attributes used, etc. |
Attractive code is used for appearance and professionality. Without Attractive code, other may not be able to read it. Attractive code helps organize the code in a way that others can read, and can easily understand. When working on a big website, or even just an average website, you are usually working with other coders, and if your code is not organized, communication will be off. There are a few things to make code look "pretty". One is comments, a helpful tool to seperate code and label them.
Comments are useful for many reasons. They help label all code, and helps others be able to use and edit your code. By using comments, you are allowing yourself to be organized. This is a very looked over feature for most students, however it is easy to apply to your html code.