Code, code and more code and of course mark-up structure

Ahoy,

This week we have continued on with the code writing, with the addition of some new tags!!!

Also, we began using these tags to reproduce the layout of already created webpages. 

Some newbies we have learnt are;

<meta> which is how the page gets displayed in the SERP (search engine ranking pages)

<br/> the break tag which as is self explanitory, adds a break to the text

<div> the div tag adds a division into the page and an 'invisible box' around the information. This is only invisible until the CSS is added.

<span> span isolates the texts for individual styling, kinda like the <strong> tag giving bold, the span could be used to colourize a certain selection of text

The list tags:
<ul> this is for unordered lists which as default on most browsers is set as bullet points.

You can also create secondary lists under the main points

ie.

<ul>

<li>Home

<ul>

<li>Pages</li></ul>

</li>

</ul>

This would create a list like this

• Home
• Pages

There is also the <ol> tag (ordered lists) which gives numbered lists

1. Home
1. Pages

There is also a tag for when you want to leave notes on your code that wont appear on your webpage,

this is <!---description-->

This commenting can still be read in the source code of webpages unless deleted before publishing. 

On Google Chrome you can access the webpages source code by using Ctrl+U

Also using the <a> anchor tag we learnt last week we can add emails to our pages! 

ie.

<a href="mailto:ellejbrennan@gmail.com" target="_blank">email me at:</a>

This usually will open in a installed email program such and microsoft outlook (which noone really uses anymore) so it has little use 

We then went on to recreate a webpage that Philippa had already designed using ID tags to identify our individual <div> tags.

Camel case is one way to help make code IDs easier to identify, such as <div id="bigPicture">

This just makes the words a little easier to make out once the page is full of code and stops it all looking like mumbo jumbo and the capital P is like a camel hump gettit! aahhhaaaaaha

Lastly we learnt a little about using hexcodes to create flat colours on the pages and escape codes such as &copy; for the copyright symbol

On another note we learnt how to add the social media gadgets onto our pages, so get at me. Check out my slick as profiles =]

Elle out.