Transcript of "Web design"

2.
How Web Pages work (background)<br />You first create a website “locally” or on your own machine.<br />Organize your files on your machine first, then upload to a server.<br />Websites are physically saved on computers. These are special computers called servers which “serve” up the websites they have saved on their hard drives on demand. Servers are usually run by web hosts, but can also be run by individuals or companies.<br />Domain (hosting)<br />A domain name is a word or words separated by dots (e.g. www.realfreewebsites.com), and which corresponds to a number, known as an internet protocol (IP) number. This IP number or address is used by computers to locate other computers and servers on the internet. A domain name is used because it is easier for humans to remember and work with words rather than numbers.<br />

3.
How Web Pages work<br />Can use any simple text editor to design a web page<br />HTML code is behind the scenes (view source code on any web page.) *<br />HTML=Hyper Text Markup Language<br />Code used to create a web page<br />CSS (Cascading Style Sheet)<br />Used to separate the presentation of a page from its structure. <br />Presentation=how the page looks<br />Structure=meaning of the page’s content<br />You can use CSS to specify the font used for the text on the page, to lay out an entire Web page, and much more.<br />Much more popular in web development today than it was years ago.<br />

4.
Let’s take a look<br />Website I designed for a class at WIU:http://www.wiu.edu/users/jog100/250Project/Georges_Project/start.html<br />Here’s the file structure:http://www.wiu.edu/users/jog100/250Project/Georges_Project/<br />I created the files “Locally” and uploaded them to the server. *<br />

8.
Helpful Tips<br />Get your page to load quickly and efficiently<br />Compress images for the web<br />Use JPG, GIF or PNG image types. On the web, JPG is the best choice (smallest file, with quality being less important than size)<br />Sock photos *<br />When naming files=NEVER use spaces!!!<br />Always use underscore (e.g. imc_home_banner)<br />Be VERY careful of file-naming conventions (pay special attention when working with code.)<br />Always close statements with code *<br />Firebug (for Firefox) *<br />

9.
Sites to get you started<br />Look at other sites for ideashttp://www.edustyle.net/<br />Look for free CSS siteshttp://www.oswd.org/<br />Guide I created for WIU about locating Media on the web:http://wiu.libguides.com/content.php?pid=52532&sid=385448<br />Good website planning site:http://www.realfreewebsites.com/articles/website-planning-guide/<br />Free website building tutorials:http://www.w3schools.com/<br />Learning HTML:http://htmldog.com/<br />