UI User Interface
UX User Experience
Always consider when web designing
Limitations
Web safe colours
12 shades of grey
or
216 colours
Not a good habit to type in the colour's name instead of the code
Never start designing while working in dreamweaver - always away from the computer.
Web safe colours
RGB is capable of reproducing nearly 17 million colours - 16,777,216
The 216 are web safe, the rest are not.
Colours are created by specifying the percentage of 255 per RGB.
100% red is: rgb(255, 0, 0)
Web safe fonts
For a chosen font to display consistently across different computers a standard font must be used.
Most computers will not have uncommon fonts installed so they will not show up.
A font with multiple words in the name need to be grouped together with speech marks, otherwise they will try to be identified as two separate fonts.
Fonts that you want to be chosen will need to be put in order of preference incase the first is not found or available.
eg Arial, Helvetica, sans-serif
using @font-face with CSS breaches copyright with font foundries, so be careful.
Size, dimension, pixel resolution
640 x 480
800 x 600
1024 x 768
2880 x 1800 (220 ppi)
1024 x 768 is recommended.
Be aware of different screen sizes when web designing.
File formats
PNG, GIF, PDF, JPEG
72ppi, RGB
lossy, compressed
JPEGs do not support transparency, while PNGs do.
PDFs for multiple page documents.
There is always a bandwidth limitation, which is cut into every time a web page is visited. Using 72ppi makes the file sizes a lot smaller, rather than say 90ppi.
Best to do 3 sketch designs initially.
If you sign a design that a client agrees to, they have to pay you even if they aren't happy with it when it's finished.
Make all measurement decisions on paper, which is called a wire frame.
User work
everything has to go in the same folder
Hard drive > Local > images
Dreamweaver
Site>New site>
 |
| save the home page as 'index' because the web is universal |
 |
| Add CSS as link to html, not import. |
Do not go File > Open. From the side bar.
HTML
Only things that affect the functionality of the website go in between <head> and </head>, nothing visible.
Content goes in between <body> </body>, and will only become visible this way.
(Sitemaps) -
HTML
index.html
>about.html
>contact.html
>gallery.html
>shop.html
coding has to be done on all separate pages.
CSS
>stylesheet.css
coding only has to be done once, it links to all of the pages.
CSS
/* notes here */
Anyone can see notes.
Never import a CSS file into a html file.
Useful books
Html & CSS - John Duckett
CSS Mastery
For next session
A scamp
Sitemap -
Wireframe - measurements
No comments:
Post a Comment