Webb-/HTML-programmering
I den här kursen lär du dig programmera med HTML. Du lär dig också att skapa anpassade ikoner, lägga till CSS och JavaScript på sidor och annat. Utöver detta lär du dig även om HTML-teckenentiteter, escape, Unicode och annat. Kursen passar både nybörjare och personer som vill utöka sina kunskaper inom HTML och webbprogrammering.
Getting Started with HTML.
Elements, Nesting Elements, Block versus inline elements, empty elements;
Attributes, boolean attributes, single or double quotes;
Anatomy of an HTML document; Whitespace in HTML; Entity references/special characters; HTML Comments;
What’s in the head? Metadata in HTM. Topics covered
Title, Medtadata, character encoding, description and SEO
Custom icons, adding CSS and JavaScript to the page, document language
HTML text fundamentals. Topics covered:
Structure in web pages. Headings and Paragraphs
Lists: Unordered, Ordered, (they don’t cover description lists), nested lists.
Emphasis and Importance, but not style…
Creating hyperlinks. Topics covered:
Anatomy of a link,the title attribute, block level links.
URLs and paths, block fragments and ids, absolute and relative URLs.
Link best practices, download attribute, email links.
Advanced Text Formating. Read this, will only skim in class. Topics covered
Description lists, Blockquotes, Inline quotations
Citations, Abbreviations, Address, Super/sub-script
Computer code markup, times and dates.
HTML Character Entities, escaping, Unicode and such
HTML Entities
Official Reference
Wikipedia on Unicode
Guide to using special characters in HTML
Fun! Try some unicode emoji
Foolproof HTML escaping in Javascript
Document and website structure. Topics include:
Basic sections of a web page. Structuring a page.
<main>, <article>, <section>, <aside>, <header>, <nav>, <footer>.
Non-semantic wrappers: <span>, <div>.
HTML Forms
Your first form. Basics of the <form> element, action, and submit button.
How to structure a form. How to use fieldsets, legends, labels, and such.
The native form widgets. Includes: all sorts of text input fields, select boxes, checkable items, buttons, and more.
Sending form data
Multimedia and Embedding
Images in HTML
Video and audio content.
Other embedding techniques. We’ll probably just mention this…
Adding vector graphics.
Responsive images
Custom data attributes. Defines the format of data-* attributes and how to use them from JavaScript and CSS.