What does the target audience need from the website?
Who is the website for?
Think about if you want to be freelance - completely different from a studio based designer (with fun design)
http://www.themarvellousteadancecompany.co.uk/
http://www.vickiandlaura.co.uk/
http://gripittool.co.uk/
html and css design and build websites.buy it here the book's website
Every page is html, just text, very limited. Advanced coding is other languages plus HTML.
Tim Burns Lee - opening ceremony
72 pixels per inch on imacs
pc's where 96 pixels per inch.
apple mac book pro retina display 227 pixels per inch. same as ipads. Massive problem. Internet is evolving every day.
Create a new HTML document
3 ways of viewing: code / spilt / design.
<meta> tab: google uses to find websites. key words.
1. writing in a language called HTML (open)
2. NOT VISIBLE in the design. Adds to functionality. different languages, searchable by google. title
3. For the Vimeo website the title is Vimeo, also searchable.
4. close head
5.
6. everything that is visible (opening)
7. the closing of everything you can see.
8. </ (closed tag) html> no more HTML
Everything needs to be in ONE FOLDER! a website has everything in one folder.
Create a folder. It is called a Route folder. Name it anything you want. No caps or glyphs. any doc names have a short name (max 8 characters long).
create a sub folder. must be named 'images' in lower caps.
To make websites live:
have to buy space on the server. Send your folder to the computer.
You have to buy a domain name so people can view it.
You then link these two folders together.
Site > new site
rename and link to the folder made before.
This should show the folder and subfolder of images in the bottom right
Must save as index as it is global rules.
index html will show in the bottom right to view site click on the globe. No title . write title into line 3... shows in image below. Save and preview in globe.
Type is Times and 14 pixles. Have work it out in pixels.
Web typefaces.
Very limited.
Any font of you use CSS.
New document
ALWAYS start with a blank page. CSS (cant copy html, css means you have a base that can be applied o all pages quickly).
1. Language: typing.
2. /* */ start and end of a note.
We are going to create a global html
crate css for everything use body {
The traditional way it the write everything on one line, but it is easier to see if everything is on a separate line.
Changing the type. specify a font family. Used the font installed on the views computer.
Type f- font family- pick or type in your own, then you have to CLOSE IT with a ; }
File save as. name it anything: style sheet. See it bottom right.
Too link css to html it needs to go into the HEAD because it is a functionality.
It will automatically type in <link href .... (see below):
<title>Sarah Roberts Experiment</title>
<link href="stylesheet.css" rel="stylesheet" type="text/css">
</head>
Add font size
1 pt id nearly 1 px
We safe colour 6 hexadecimal code. Dreamweaver only 3 letters.
Copy right print colours. You cannot copy right colours on web, because there isn't a big enough range. Have to pick the nearest colour.
vertical 4 buttons
content 2 column layout
vertical colum. butons 100 px wide. 462 px and another 462 px width.
coding:
Containing box: name container or wrapper. name it anything.
Code placing into html.
<div id
Going to create 3 columns.
use tabs to separate the close and open divs from the over command.
NEED to position everything.
Relative positioning takes into account everything else.
Float is alignment of the divs
Closing divs you must use >
Next week are adding content.
Images and text and video.
Looking at changing to positioning.
No comments:
Post a Comment