Wednesday, 25 April 2012

Dreamweaver Workshop-Session 2

-Adobe Dreamweaver


-Today we are going to look at HTML which is the language that is used within web design.


-HTML Tags
html- telling the web browser you are going to start talking in html, open html.
/html- close html
Anything between these two tags is visible on the website
/body
title- put the title between these two tags
/title
head- anything in the head tags cannot be seen in the design of the website
/head


-Correct Tag Order
<html>
<head>

<title>
</title>

</head>
<body>
</body>
</html>


-Always work in lower case and avoid using spaces or numbers.


 
-You can view the source of most websites, we are looking at different websites to see what tags they use within the html,


  

 

-You have to create a route folder to work from, every website has one, it has to be named all in lower case with no spaces.
And within that a sub folder named images,

 -Create new html,

-There are 3 different views,

-To set up your site you need to point Dreamweaver in the direction of the route folder you have set up.


-To set it up live on the internet you go to server,




-If it has worked there it will show up your route folder in the bottom right hand of the screen,


-When we save it we save it as index, not home.

-To test website click the globe,

-To change the name and body text of the website you type it into the html on Dreamweaver and re-save your work and it should show up,




-CSS is a different coding language to html.

-To add attributes to CSS you type body then add a {




-Type a ; to close attribute.

-You then need to save it and link it to your html code.



 -When you refresh your web page the changes should show up.


 

-alt + 3= hash tag which is a DIV id
You use this to define the background size and colour



-DIV id for navigation bar,

-When working on website add colour to see if it works.


- We create a space for the logo

-Go onto Photoshop to create logo, if you put it on a transparent background it will use the background colour you set on dreamweaver.



-You can type out instructions which don't show up or effects the website design










No comments:

Post a Comment