1. Web Design And Development Week 1

2. Introduction To Module  Web Pages  How they are created  How they are used  What is needed to run a web site  What impacts the web has on business

3. Introduction To Teaching Team  First Point of contact – Ivailo Chakarov  Other points of contact – your personal Tutor

4. Module Layout  1 lecture  1 practical  Self Directed Reading / Learning

5. The Assignment  Individual  Design –Produce storyboards and a flow chart using the principles shown in the lecture.  Implementation –Implement the web site of 10 screens. –Graphics you have created yourself –Web pages compliant to at least XHTML 1.0 Transitional –A style sheet that is compliant to at least CSS Level 1 –Hosted on the intranet / internet –Validated using W3C Validator –Valid HCI for the target audience –At least one page that utilises server-side technology  Report –An introduction of your topic –Justification of your style and design choices –Where and how you have deployed your web site –A report on the history, present and future of the internet, mainly focusing on web pages and their use to local businesses.

6. Introduction To The Internet

7. What is The Internet ? “A big BIG world of information accessible to everyone! “ OR “A global network connecting millions of computers. Hundreds of countries are linked into exchanges of data, news and opinions.”

8. What is the Internet?  Interconnected set of networks –each network is considered independent –each is administered separately  Global connections –millions of users –massive spread of information –growing daily!

9. Putting It Simply….  The difference between a ‘standard’ computer network and the internet is …. SIZE ( there, you knew it mattered all along)  It’s special because of its size and because of its accessibility.  The Internet is Not the World Wide Web.  Host is a computer with information on it –not necessarily web pages –Could be email or file server  Web Site is a collection of web pages

10. What is an Intranet? Intranet – A connection of machines within an organisation such as the branch of a bank etc Branch of Local Organisation Branch Manager Central Accounts Customer Tellers

11. What is an Extranet? Extranet – A connection of machines between different corporations each with their own security protocols Local Bank Stock Brokers

12. The History Back In Time…..

13. The Beginning!  1957 - Launch of Sputnik. In response the USA form ARPA (Advanced Research Projects agency)  1962 - Used by the USA to look at controlling their bombers and nuclear missiles  1969 - First real “internet” between 4 universities in the USA

14. The First Nodes Node 1: UCLA (September) Node 2: Stanford Research Institute (SRI) (October) Node 3: University of California Santa Barbara (UCSB) (November) Node 4: University of Utah (December)

15. The 70’s and 80’s  1972 - From 4 to 30 hosts. First email program used  1976 - Ethernet developed. Now about 111 hosts  1980 – 213 hosts  1982 – TCP/IP became the standard  1983 – Birth date of the internet.  1984 - Domain name system created. (edu, gov, mil, com, org, net). No of hosts reaches 1,000. JANET is created.  1986 - Now 2308 hosts  1987 - 28,174 hosts  1988 - 60,000 hosts. Worm affects 6,000 of those hosts.  1989 – Hosts break 100,000

16. The 90’s!  1990 - Hypertext created. Archie created. Hosts now 313,000  1991 - WWW was born (Tim Bernes-Lee – CERN). Birth of HTML.  1992 - Internet society created. Hosts 1,136,000. World Bank on line  1993 - First browser created “Mosiac for X”. Hosts 2,056,000, 623 web sites  1994 - Commercial interest with Pizza Hut internet ordering. WWW becomes second most service on the net. Yahoo appears. Hosts 3,864,000, / 10,000 web sites  1995 - Charging for private domains. Real Audio appears. Hosts 6,642,000 / 23,500 web sites

17. The 90’s! Cont  1996 - Most traffic through ISP. Hosts 15,000,000 / web sites 603,000 and growing rapidly! Internet phones catch the attention of US telecommunication companies who ask the US Congress to ban the technology  1998 - Web size estimates range between 275 (Digital) and 320 (NEC) million pages (4 million sites). Compaq pays US$3.3million for altavista.com. Words like E-Commerce, E- Auctions, Portals and technologies such as E- Trade, XML, Intrusion Detection  1999 – Hacking, Melissa, Love Bug. Even Railtrack on 31 st Dec 1999 got hit. Denial of service attacks.

18. Twenty First Century….  2000 - Over 17,000,000 web sites and growing at an exponential rate (1 billion pages). Internet2  2001 – Napster, Code red virus, IE reaches 85%, mobiles, 3G released.  2002 – Internet2 now has 200 university, 60 corporate, and 40 affiliate members, blogs become the new thing.  2003 - The SQL Slammer worm causes one of the largest and fastest spreading attacks ever, taking roughly 10 minutes to spread worldwide. Impacted a multitude of systems ranging from banks, to air traffic control to emergency systems.

19. Twenty First Century….  2004 - Abiline, the Internet2 backbone, upgrade from 2.5Gbps to 10Gbps is completed. Network Solutions begins offering 100 year domain registration. CERNET2, the first backbone IPv6 network in China, is launched by the China Education and Research Network (CERN) connecting 25 universities in 20 cities at speeds of 1-10Gbps

20. The Growth Of The Internet

21. The Time Line

22. The Networks

23. The Growth and the Future  There are now millions of websites with over one billion web pages.  But as most people are well aware, the Web can be painfully slow – “World Wide Wait”  Some people still connect to the Internet using modems and telephone lines.  Connecting to the Internet using fibre optic lines and via cable TV will increase bandwidth dramatically, making the Web more powerful.

24. The Future – Internet 2  Formed in 1996 - administered by the University Corporation for Advanced Internet Development (UCAID)  A partnership of universities, corporations and government agencies.  Not a single network, but a consortium of hundreds of high-speed networks linked by fibre optic backbones.  Transmits data up to 10 gigabits per second

25. The Future  Already seeing other Internet-enabled devices, such as pagers and mobile phones (WAP), which can send and receive e-mail and access the Web.  Everything from your car to your refrigerator may be connected to the network, communicating with each other wirelessly. –Electrolux has developed the Screen Fridge, an Internet icebox that manages your shopping. –It can e-mail a shopping list to your cyber- supermarket and coordinate a convenient delivery time with your schedule.

26. Screen Fridge

27. Introduction To Creating Web Pages

28. Browsing  Internet Explorer  Netscape Navigator  Opera  Firefox  Zillions of others…… http://browsers.evolt.org/ http://browsers.evolt.org/

29. How to translate URL’s  HTTP - shows an WWW object  www.staffs.ac.uk - shows the server holding the info  /sands/arts - shows the directory  welcome.html - shows the file to be viewed HTTP://www.staffs.ac.uk/sands/arts/welcome.html

30. Web Pages – What we will look at  Creating web pages  Web Standards  Design, Security etc etc  Little bit of PHP

31. What is a Web Page / Web Site?  Web Page –A page that is viewable via a browser  Web Site –Collection Of Web Pages of similar content

32. Web Page Editors

33. How?  Use an editor – Web Authoring Tool  Code It Yourself - Scripting

34. Web Editors  Dreamweaver  FrontPage  Notepad  Etc…etc…..  All produce HTML…(or in our case XHTML)

35. What is Microsoft FrontPage  Web site creation and management that requires NO programming Knowledge.

36. What is Dreamweaver??  Adobe!  An established tool used for the creation of professional web pages.  A visual editor is used  Advanced in the terms of page design tools and site management  Remember - good practise to create / open a web site folder to store all your web files each time you open Dreamweaver