OVERVIEW
STRUCTURE
Should be the first site
index.html
Standard structure in the html-file
# Define standard charset
# Description of the site
# Keywords of the site
# Viewport Definition
Techcrunch # Title of the site
# Use Google Font Style
# Use Google Font Style
# Normalizing the CSS-Browser-Styles
# External CSS-File-Link
# Use FontAwesome Icons
GROUPING, LAYOUT
grouping some html-area
main part of the homepage
part of the homepage – eg. the core middle of the site
part of the section – can be taken and dropped to another place
mostly on the side of the homepage – something you can take away and the page would still be working (eg. ads)
eg. menue at the title
...
Navigation info for the user (unordered ul list normaly)
bottom of the document
ELEMENTS
commentar in HTML
anker link element
X
form element
Normal Paragraph (long text)
text
Paragraph / Text with anchor link
Text X
Paragraph with a class
Hello
Short text
text
Header1-Tag with Text (most important on the page)
Import Header
Header2-Tag with Text (second important)
2nd important thing
Header6-Tag with Text (sixth important thing on the page)
6th important thing
Insert picture – no close tag (with alternative text – when img can´t be displayed)

Preserves whitespace (not good – should be done by CSS)
linebreak (not good – should be done by css)
,
htmlbreak (not good – should be done by css)
,
Emphasis some text – but only for accessibility reason (not styling!)
Stress Emphasis
Bold some text – but only for accessibility reason (not styling!)
Strong Importance
Insert / embedd video with iframe
Set JumpMark at a specific position in the html-file (jump to with index.html#1)
Insert video
Unordered List with anchor links
Ordered List
- One
- Two>
- Three>
Table Definition
First table header
Second table header
First row, first column
First row, second column
Second row, first column
Second row, second column
FORMS, BUTTONS
Different input fields can be arranged in a form tag
Label is shown before the element(for-name should be ident with the id-name or name-tag of the object)
Text-Inputfield – with id, name and value (default)
Telephon-Inputfield – with id, name and value (default)
EMail-Inputfield – with id, name and value (default)
Range/Slider-Inputfield with id, name, min/max-value for the slider, value (default) and data-sizing-definition (px)
Definition of a TextField for input with id, name, number of rows and columns
Define Button with id, name and text on the button