reading-notes
Duckett HTML
Introduction
- This book for leaning to build website from zero point or to develop websites, the structure for this book divided to HTML in general, CSS, the dedicated coding HTML5 type.
- There are a way to access the web such as browsers, web servers, screen readers, and other devices, to create a small website we just need HTML and CSS usually.
- To visit website we should connect to Domain Name System (DNS) server in any where website in the world.
Structure
- In coding we have a tags describe the coding type, for example < !DOCTYPE HTML > is for HTML5 coding and so on, and for tags we have open tag < character attribute > also closing one < / the same character >, often we use this formula for most of them but not all, some of tags haven’t aclosing tag.
Extra Markup
| Tag | description |
|---|---|
| < !DOCTYPE HTML > | as we mentioned before for HTML5 coding |
| < !– comment – > | for comment it will not appear in web page it’s for coding just |
| < character id=”text” > | the bold italic sentence for giving for tag an id and call it when need that by hash tag sign (#) |
| < character class=”text” > | the bold italic sentence for giving for tag a class and call it when need that by dote sign (.) |
| < div > | for group of elements in a block |
| < span > | for group of element in a inline |
| < iframe > | to open another website in same website that you make |
- There are a block statement tage thats mean it will take the page in separate line like <p> tag, on the other hand we have inline statment tag it appears in the same line of other inline tages like < b > tag.
- escape charater
HTML5
- HTML5 define the header and footer tags in the body tag in coding page while the troditional HTML can’t.
| Element | discription |
|---|---|
| < header > | element represents a container for introductory content or a set of navigational links |
| < footer > | element defines a footer for a document or section |
| < nav > | element defines a set of navigation links |
| < article > | element specifies independent, self-contained content |
| < aside > | element defines some content aside from the content it is placed in (like a sidebar) |
| < section > | element defines a section in a document |
| < figure >/ < figcaption > | < figure > tag specifies self-contained content, like illustrations, diagrams, photos, code listings, etc <figcaption> and element can be placed as the first or as the last child of a < figure > element |
| < div > | tag defines a division or a section in an HTML document |
| < hgroup > | element represents a multi-level heading for a section of a document |
Process & Design
- make wirefram —-> apply this in code (the general form of web, colos, etc…)
Duckett JavaScript
Introduction
- JavaScript make web more interactive by:
1- Access content
2- Modify content
3- Program rules
4- React of event
The ABC of Programming
- Computers create models of the world using data. The models use objects to represent physical things.
- Objects can have: properties that tell us about the object; methods that perform tasks using the properties of that object; events which are triggered when a user interacts with the computer.
- Programmers can write code to say “When this event occurs, run that code.”
- Web browsers use HTML markup to create a model of the web page. Each element creates its own node (which is a kind of object).
- To make web pages interactive, you write code that uses the browser’s model of the web page.