having had this small intro we began to look at web standards and limitations -
WYSIWYG - what you see what you get - application for creating websites - what we see in dreamweaver is what we see live when the site goes live but that isnt always the case apparently.
SEO-search engine optimisation - cant always find site if its just gone live - ways to get your site on search engine recognisation - pay for placement on search
FTP - file transfer protocol
URL - uniform resource locator
XML - extensible mark up language
PHP- hypertext preprocessor
UX - user experience - really important in early stages of web design
Web limitations/designing for the lowest common denominator -
File size - people have limits to file size they can see - if too big they cant go on it, or couldnt go online at all after.
File size - how quick site uploads - may take ages to upload due to different web speeds
Web safe colours - 216 colours capable of being reproduced consistently on computer screens anywhere. a lot of designers still use these colours only. can see websafe colours and hexadecimal codes in photoshop.
CSS - can produce a wider range of colours than html - its limited whereas css has more power and capability - colour in css is (eg) 100% red - rgb (255, 0, 0).
Web safe fonts - for fonts to be displayed on different computers have to use a standard font. fonts desired to be used but that arent standard are made up by the computer using a 'fallback' font that is stored. specify a font family to guarantee similar fallback fonts are used.
CSS font face - css compatible allows to install fonts to website - can be seen despite not having font on users computer. but using font-face breaches licensing and copyright. there are many free font websites but only the license to be used in print not in web. look for fonts that include the font-face kit download too - use fontsquirrel.com
Size, dimensions, pixel res - computer res measured by width and height of screen.
File formats - uploading images have to use a lossy format - means it can be compressed. a digital camera photo too big for web so have to be compressed - use file formats like png, jpeg, gif, pdf.
useful to look at websites that already exist that have similar aims/markets to the target of the brief or reason for the website so you can see what works/doesnt and what that type of site is like.
DreamWeaver.
from the theory we went on to look at adobe dreamweaver and how that bit of software works in web design.
dont re open files from dreamweaver directly - open from own storage.
shortcuts usually good but not in web design.
line one is html so that the browser understanding the language format being used
line 9 says close html - there always has to be a close for every open, there cant be spaces between commands.
<head> tag isnt visible in design of site - things in between the head tag are for functionality not aesthetic.
on line 3 is a meta tag - to do with search engine optimisation - added a key word to be associated with search engine. arent essential for a working website but can be useful.
this is the bare minimum for a website to work -
<body> - open body - anything inbetween this command is design for the website
everything to do with the website design has to go in the root folder for it to work - makes it easy to keep everything together - only have to copy one folder if want to transfer it too.
web naming conventions - no capital letters and no spaces - use for actual name and all files and folders.
have to tell dreamweaver where my files for the site are installed (root folder>[images in]image folder) use site>newsite then imput the details.
when making a site live you go servers>+(add new server)>name it>
first page must always be called index.html - has to be in the root folder for the server to recognise it. other pages can be called anything though. should always be lower case no space as well and shouldnt be more than 8 characters long.
use the globe icon to check that commands written have taken effect successfully online -
to change the name of the site use the name box at the top of the page -
wer then went on to briefly look at css language sheets and how to create css files
No comments:
Post a Comment