I'm still sick, I've been sick several days now since I got back to America, as the climate is much drier and colder here than in the Philippines, and I'm adjusting. I've been spending most of my day in bed and drinking a lot of water. Being back in America is a big change from the Philippines, and I've been spending time re-assessing my goals and how my time is spent. Web Development, becoming proficient at it, is my focus, and I'm even more motivated now to continue with it. Life's good, my cough not withstanding.
Today I'm starting on page 101 of "HTML and CSS." All right, let's go!
IMAGES:
O.k., when setting image sizes in our code, we should do so in pixels, not in inches. SVG and bmp file formats are used for saving vector images, which can be increased in size without losing any quality, because they are made up of lines with colors filling in the space between the lines (think of a logo).
This is all basic stuff that I already know, but it's a nice to refresh my knowledge. Oh, this is new, HTML5 has introduced a new <figure> element, it's used to wrap an <img> and a <figcaption></figcaption> element, so that the caption for an image can appear right below the image. Sometimes, browsers indent the contents of the <figure> element. If an image uses flat colors, saving it as a GIF is ideal, while photographs are for JPEG's.
TABLES:
All right, so these next sections deal with tables in HTML. I went over table headings <th></th>, table rows <tr></tr>, and table data <td><td>. We also used the colspan and rowspan attributes, like so, <td rowspan="2"></td> or like so, <tr colspan="3"></tr>. These are used to have a td element span several columns or rows. When you do that, you omit the unnecessary td elements. All these elements belong inside of a <table></table> element. That element then contains a <thead></thead> section followed by a <tbody></tbody> section. Here's an example:
<table>
<thead>
<tr>
<th>Date</th>
<th>Income</th>
<th>Expenditure</th>
</tr>
</thead>
<tbody>
<tr>
<th>10th of January<th>
<td>20</td>
<td>40</td>
</tr>
</tbody>
<tfoot>
</tfoot>
</table>
That's an example similar to the example in Mr. Duckett's book. Not that empty cells in the top left should still be inserted as a table head element, <th></th>. Note that th elements should have a scope attribute, like so:
<th scope="col"></th>
or
<th scope="row"></th>
These indicate whether the th is for a row or column.
FORMS:
With forms, the method attribute is used, and it will have a property of "get" or "post." Get is used for short forms and to retrieve data from the server (as opposed to sending information to add or delete from the server). Post is used for more complicated things, like when passwords are sent, to upload a file, or to add information to or delete information from a database.
O.k., that's enough for today, starting up again tomorrow.
SUMMARY OF CODING SKILLS
Total Treehouse Points: 5,503
Treehouse Points by Subject Matter (Miscellaneous not included):
HTML: 663
CSS: 1,599
Design: 1,193
Development Tools: 747
JavaScript: 1,239
Treehouse Ranking (%): "You have more total points than 93% of all students."
Treehouse Courses Completed:
How to Make a Website
HTML
CSS Foundations
CSS Layout Techniques
Aesthetic Foundations
Design Foundations
Adobe Photoshop Foundations
Adobe Illustrator Foundations (66% complete, switched focus from web design to web dev)
Console Foundations
Git Basics
Introduction to Programming
JavaScript Basics
Codecademy (& other) Courses Completed:
HTML and CSS (Codecademy)
Design Foundations
Adobe Photoshop Foundations
Adobe Illustrator Foundations (66% complete, switched focus from web design to web dev)
Console Foundations
Git Basics
Introduction to Programming
JavaScript Basics
Codecademy (& other) Courses Completed:
HTML and CSS (Codecademy)
Books Read or in Progress:
Completed: "Head First HTML and CSS," by E. Robson & E. Freeman
Completed: "A Smarter Way to Learn JavaScript," by Mark Myers
In Progress: "HTML and CSS," by Jon Duckett (On pg 155 of 490)In Progress: "JavaScript and JQuery," by Jon Duckett (on pg 0 of 622)
My Progress on The Odin Project:
1. Introduction to Web Development 100% Complete
2. Web Development 101 33% Complete
Note: Switched to FCC for the great online community and better updates/support.
Note: Switched to FCC for the great online community and better updates/support.
My Progress on Free Code Camp (FCC):
1. Get Started with Free Code Camp Complete
2. HTML5 and CSS Complete
3. Responsive Design with Bootstrap Complete
4. Gear up for Success Complete
5. jQuery Complete
6. Basic JavaScript Complete
7. Object Oriented and Functional Programming Complete
8. Basic Algorithm Scripting Complete
9. Basic Front End Development Projects On 4 of 5
10. Intermediate Algorithm Scripting On 4 of 21 (#13 and #14 also done)
11. JSON API's and Ajax
12. Intermediate Front End Development Projects
13. Claim Your Front End Development Certificate
14. Upper Intermediate Algorithm Scripting
15. Automated Testing and Debugging
16. Advanced Algorithm Scripting
17. AngularJS
18. Git
19. Node.js and Express.js
20. MongoDB
21. Full Stack JavaScript Projects
22. Claim Your Full Stack Development Certificate
After the 800 hours of FCC work above, there are 800 more hours of non-profit coding projects.
Hours Spent Coding Today: 3
Total Hours Coding: 727
No comments:
Post a Comment