viperfx07 is here to blog about hacking, cracking, website, application, android, and many more.

Tuesday, August 17, 2010

Week 3 Practical Exercise

11:37 PM Posted by viperfx07 No comments
This blog post was made to point the interesting parts of the exercises given on week 3.
To see fullpost, don't hesitate to click "Read More" :D


Exercise 1
- What's the difference between <strong> and <b> ?
=> Doing this exercise makes me know the answer


Use the <strong> and <em> tags when the content of your page requires that certain words or phrases be stressed. Use them sparingly or your page, much as you would use exclamation points ( ! ! ! ). If you are only highlighting words for a visual effect to assist in navigation use the <b> and <i> tags (http://www.think-ink.net/html/bold.htm).

One way of working out what is semantically most appropriate is to imagine what a screen reader would do. It will read a <b> tag in a normal voice, but it will emphasise a <strong> tag with a "bigger" voice. So now we know what each tag means. (http://www.webmasterworld.com/forum21/9181.htm)



Exercise 3
I've actually installed Web Developer add-ons years ago but never use it. I've just realized that it's REALLY a great tool.

– CSS > View Style Information. This is like an "Inspect Element" in Chrome.
- CSS > Edit CSS. This menu will let you edit the CSS on-the-fly.
- Information > Display Block size. This menu will let you know dimensions (block size) for div, form, etc
- Tools > Validate CSS. A shortcut to validate your CSS code using the W3C CSS validation service.
- Tools > Display page validation. Another cool feature that automatically validates your html code. If you change your HTML on-the fly using web-developer, it will validate your code straightaway after you finish editing.


I skipped exercise 2 & 4 because it's fairly easy. For exercise 4, I think it's a good exercise that shows how to modifying DOM using raw Javascript (without framework). However, if it's easier to use jQuery to accessing harder structured DOM.

0 comments:

Post a Comment