1. Weebly and ECDL Software Introduction Links Click the DVD on the weebly home page. Click X to get out of pop up screens first. Click the DVD on the weebly home page. Click X to get out of pop up screens first. Click the DVD on the weebly home page. Click X to get out of pop up screens first. Click the DVD on the weebly home page. Click X to get out of pop up screens first. https://www.youtube.com/watch?v=mM9 uhe27YbA#t=23 https://www.youtube.com/watch?v=mM9 uhe27YbA#t=23 https://www.youtube.com/watch?v=mM9 uhe27YbA#t=23 https://www.youtube.com/watch?v=mM9 uhe27YbA#t=23 Beginners Guide Beginners Guide Beginners Guide Beginners Guide The basics about the internet The basics about the internet The basics about the internet The basics about the internet

2. Web Design Course This course is intended to give you an introduction into web design so that you can build upon this knowledge using the Internet into your futures. Websites and Apps are how products and services are being bought and sold more and more nowadays. It cuts down your costs when you sell directly to customers online 24/7. Setting up your own business and web presence is essential in the dynamic world Students are facing today and is a great life skill to be able to make money for yourself. Plus, if you loose your job, can’t find a job, want to impress your manager and improve his or her business model, want to promote anything or simply want to work in the area of business and computers this is for you.

3. The Aim of this course I’m a teacher but I’m not a web designer nor a web programmer who do this full time but I’ve taken this on, as I believe it will be very useful for my students and I think you’ll enjoy it once you put the extra effort in online furthering your own skills to your mixed level of abilities. I’m a teacher but I’m not a web designer nor a web programmer who do this full time but I’ve taken this on, as I believe it will be very useful for my students and I think you’ll enjoy it once you put the extra effort in online furthering your own skills to your mixed level of abilities. To be able to build your own first webpage. To be able to build your own first webpage. To learn about basic web design programming. To learn about basic web design programming. To be introduced to App development languages To be introduced to App development languages Your Project for the Year: Your Project for the Year: To further your research online and to build the best possible website or App to your ability. To further your research online and to build the best possible website or App to your ability.

4. Units 1-5 Overview and Software options Overview and Software options Hyperlinks will take you to the Unit you want by double clicking when in slide show view. Hyperlinks will take you to the Unit you want by double clicking when in slide show view. Unit One: Introduction and set up. Slide 8 Unit One: Introduction and set up. Slide 8 Unit One: Introduction and set up. Slide 8 Unit One: Introduction and set up. Slide 8 Unit 2: HTML Programming NotePad Slide 17 Unit 2: HTML Programming NotePad Slide 17 Unit 2: HTML Programming NotePad Slide 17 Unit 2: HTML Programming NotePad Slide 17 Unit 3: Unit 4: Graphics and Images 30 Unit 3: Unit 4: Graphics and Images 30 Unit 3: Unit 4: Graphics and Images 30 Unit 3: Unit 4: Graphics and Images 30 Unit 4: The Law and Security 33 Unit 4: The Law and Security 33 Unit 4: The Law and Security 33 Unit 4: The Law and Security 33

5. The Internet means The Internet means The physical structure (servers, routers, cables, fibre optics and satellite connections. The physical structure (servers, routers, cables, fibre optics and satellite connections. A global network of networks that allows people, business and communities to communicate with each other. A global network of networks that allows people, business and communities to communicate with each other.

6. Software used for web designing. Weebly is free for schools to use. Weebly is free for schools to use. Scoilnet blogs is free for schools to use Scoilnet blogs is free for schools to use Dreamweaver easiest to use and expensive Dreamweaver easiest to use and expensive Frontpage is arguably one of the best but difficult to use. Frontpage is arguably one of the best but difficult to use. Coffee Cup and Square Space is cheapest. (30 day free trial) Coffee Cup and Square Space is cheapest. (30 day free trial) Microsoft freeware/shareware can be researched. Microsoft freeware/shareware can be researched.

8. Different Devices use different types of coding for programming.

9. Unit 1 of ECDL Webstarter Introduction Introduction Uploading Web Pages Uploading Web Pages Advantages of Web Publishing Advantages of Web Publishing Registering web space Registering web space Unit One Quiz Unit One Quiz

10. -Web Concepts TCP/IP – stands for transmission control protocol/ internet protocol and is the method computers use to communicate on the internet. E.g www or ftp or email or chatrooms TCP/IP – stands for transmission control protocol/ internet protocol and is the method computers use to communicate on the internet. E.g www or ftp or email or chatrooms FTP- File Transfer Protocol – language that helps you upload and download files from the internet hosting company/ E.g Using File Zila to upload to Hosting365(Hosts Irish.ie web names) FTP- File Transfer Protocol – language that helps you upload and download files from the internet hosting company/ E.g Using File Zila to upload to Hosting365(Hosts Irish.ie web names) Hyperlinks clicks on them and they bring you other locations on the website. Hyperlinks clicks on them and they bring you other locations on the website. Webserver a type of server dedicated to storing web based files Webserver a type of server dedicated to storing web based files

11. Web Concepts Web page is a page that can contain a mix of text, images, sound and video. A number of webpages and the home(index page) together make a website. Browser E.g Internet explorer. Web page is a page that can contain a mix of text, images, sound and video. A number of webpages and the home(index page) together make a website. Browser E.g Internet explorer. HTTP/S: language that enables communication on the www and S adds higher security HTTP/S: language that enables communication on the www and S adds higher security URL: Uniform Resource Locater: Full web address in other words. URL: Uniform Resource Locater: Full web address in other words. HTML: Hypertext Mark Up Language – codes and programming language behind the web. Plain text but need software. E.g the Java programming language HTML: Hypertext Mark Up Language – codes and programming language behind the web. Plain text but need software. E.g the Java programming language

12. Todays Plan Outcomes Type letter of permission to principal to get started. Type letter of permission to principal to get started. Type a letter to parents for 10 euro funding each to become shareholder Type a letter to parents for 10 euro funding each to become shareholder Do up plan and timetable for class by class market research Do up plan and timetable for class by class market research Griffin do up timetable and location for sales time at lunch time Griffin do up timetable and location for sales time at lunch time Most will pay a euro on average Most will pay a euro on average Want quotes Want quotes 1-3 most common will buy 1-3 most common will buy Pens or T Shirts with St josephs on it. Pens or T Shirts with St josephs on it.

13. Copy codes from websites Click tools on a website and view source. Click tools on a website and view source. Word wrap and consider width of the browser or you’ll find your texts won’t fit on to your webpage properly so plan ahead. Wix.com Word wrap and consider width of the browser or you’ll find your texts won’t fit on to your webpage properly so plan ahead. Wix.com Free Web Design Free Web Design Free Web Design Free Web Design W3schools.com W3schools.com W3schools.com Shirenet.net Shirenet.net Shirenet.net Can copy and edit tags, tables and pages etc Can copy and edit tags, tables and pages etc

14. STEP ONE before you create a new website Check to see if your website name has been already taken by clicking on a domain registration website such as; Check to see if your website name has been already taken by clicking on a domain registration website such as; www.register365.ie or www.weebly.com www.register365.ie or www.weebly.com www.register365.iewww.weebly.com www.register365.iewww.weebly.com This website also gives you an option to pay for hosting. E.g about 180 per year annual service fee. However, there are free hosting companies available too. With some you may have to insert their address or advertise a banner for them. This website also gives you an option to pay for hosting. E.g about 180 per year annual service fee. However, there are free hosting companies available too. With some you may have to insert their address or advertise a banner for them.

15. Free Hosting Companies E.g www.eircom.net E.g www.eircom.netwww.eircom.net www.angelfire.com www.angelfire.com www.angelfire.com www.madasafish.com www.madasafish.com www.madasafish.com www.geocities.com www.geocities.com www.geocities.com www.tripod.co.uk www.tripod.co.uk www.tripod.co.uk www.biz.nf, www.000webhost.com www.biz.nf, www.000webhost.com www.biz.nf www.myownfreehost.net www.myownfreehost.net When uploading web pages you need a space on a hosting company e.g Eircom then an FTP e.g File Zila to upload and edit pages. When uploading web pages you need a space on a hosting company e.g Eircom then an FTP e.g File Zila to upload and edit pages.

16. Step Two Create your webpages maybe starting with a template from web software such as coffee cup. Or for a more basic website and to get used to writing code use notepad, with a browser(internet explorer) and next step is to save you’re work to a yellow folder on your own P.C before uploading. Create your webpages maybe starting with a template from web software such as coffee cup. Or for a more basic website and to get used to writing code use notepad, with a browser(internet explorer) and next step is to save you’re work to a yellow folder on your own P.C before uploading. When uploading web pages you need a space on a hosting company e.g Eircom then an FTP e.g File Zila to upload and edit pages. When uploading web pages you need a space on a hosting company e.g Eircom then an FTP e.g File Zila to upload and edit pages.

17. Step 3 Register with a Hosting company. Register with a Hosting company. There will be a step by step guide on most websites. There will be a step by step guide on most websites. You will need to create a new email account and also you will be creating a hosting account or mywebspace with a username and password. Always write down usernames and passwords so you don’t forget. In the username field type your website address or wherever it asks you to depending on the website you have entered. You will need to create a new email account and also you will be creating a hosting account or mywebspace with a username and password. Always write down usernames and passwords so you don’t forget. In the username field type your website address or wherever it asks you to depending on the website you have entered.

18. Test to see if registered It will say this is a test page if not registered or page cannot be found. It will say this is a test page if not registered or page cannot be found. You may need to go back to start and click update your site also click refresh on your browser or you’ve made a typo error somewhere and not followed their step by step guides properly so start again. You may need to go back to start and click update your site also click refresh on your browser or you’ve made a typo error somewhere and not followed their step by step guides properly so start again.

19. Unit Two

20. WebDesign Programming Click start, programs, accessories, notepad Click start, programs, accessories, notepad In notepad we will edit and type HTML code In notepad we will edit and type HTML code Open tag Close tag. Open tag Close tag. See notepad one.txt HTML tag goes in twice start and finish webpage See notepad one.txt HTML tag goes in twice start and finish webpage Head tag- Title, style and script. Only appears once Head tag- Title, style and script. Only appears once Title- Use Clear title for your page for search engines to find easily. Appears at very top and bottom. Once Title- Use Clear title for your page for search engines to find easily. Appears at very top and bottom. Once Body tag - Actual contents of the page, e.g this is my first webpage Body tag - Actual contents of the page, e.g this is my first webpage

21. Getting started Register your name with a hosting company e.g register365.ie and see if its new. www.angelfire.com Register your name with a hosting company e.g register365.ie and see if its new. www.angelfire.com www.angelfire.com To create a webpage you need an editor e,g notepad or more advanced software To create a webpage you need an editor e,g notepad or more advanced software Create programming codes and tags in notepad Create programming codes and tags in notepad Save sample in notepad as intro.html or index.html and click save as html file after you put your name instead of Mr Mc Garry in between the title tags from the programming I put up for you. Save sample in notepad as intro.html or index.html and click save as html file after you put your name instead of Mr Mc Garry in between the title tags from the programming I put up for you. Web pages only use 70% of a webpage to allow for pixels, monitor types etc Web pages only use 70% of a webpage to allow for pixels, monitor types etc

22. Getting started on your first web page Close notepad and now open this intro.html from webstarter folder using Windows or File Explorer. Also, save it as a text file so you can edit later. It may already have turned into a webpage and then to see the text code click view source on the menu bar. Right click and make sure menu bar is clicked on. Close notepad and now open this intro.html from webstarter folder using Windows or File Explorer. Also, save it as a text file so you can edit later. It may already have turned into a webpage and then to see the text code click view source on the menu bar. Right click and make sure menu bar is clicked on. To make text bold start and end with ….. Italics. Type other sentences between the two body tags using bold and save. To make text bold start and end with ….. Italics. Type other sentences between the two body tags using bold and save. Save changes to your html file and press FN with F5 to update your webpage Save changes to your html file and press FN with F5 to update your webpage

23. More advanced codes BR makes a new line break otherwise it will continue to write in one line across. BR makes a new line break otherwise it will continue to write in one line across. Pre for blank spaces but change font to Verdana. Pre for blank spaces but change font to Verdana. If you google codes e.g for color u ‘ll find shortcuts 000000 black FFFFFF white If you google codes e.g for color u ‘ll find shortcuts 000000 black FFFFFF white e.g H1 to H6 most important to least heading e.g H1 to H6 most important to least heading

24. Anchors Home page Home page tags make things link up. To link from one page to another. HREF means Reference for Hyperlink tags make things link up. To link from one page to another. HREF means Reference for Hyperlink To link jump from top to bottom of page type =“#top” To link jump from top to bottom of page type =“#top” directed to the name directed to the name

25. Software Editor E.G Download a free trial of coffee cup for 30 days at home etc. E.G Download a free trial of coffee cup for 30 days at home etc. Gifs are too big. Use PNG, JPEG instead Gifs are too big. Use PNG, JPEG instead HTM is docs. HTML is windows HTM is docs. HTML is windows Upload your webpages with FTP upload(e.g download File Zila for free) Upload your webpages with FTP upload(e.g download File Zila for free) Index or Intro page is usually your home page where all other webpages link to Index or Intro page is usually your home page where all other webpages link to

26. Order of how to insert tags/code

27. Key Terms HTML is a webpage HTML is a webpage Head is for titles, style and script Head is for titles, style and script Title tags go inside the head tags. Title tags go inside the head tags. Body or with tags open tag you must type before you add the main contents of your webpage and to close tag. Insert this tag right after the head tag. Body or with tags open tag you must type before you add the main contents of your webpage and to close tag. Insert this tag right after the head tag.

28. Go to webstarter folder Demonstrate the examples to the class starting with the easiest example. Demonstrate the examples to the class starting with the easiest example. EXAMPLE ONE EXAMPLE ONE

29. Unit 2 continued HTML Colour Codes – Black000000 – WhiteFFFFFF – RedFF0000 – Green00FF00 – Blue0000FF – YellowFFFF00 – PurpleFF00FF

30. Ordered Lists type=1(or A or I try here) start =0> This means that we’re going to start a number type list starting from 0 Monday Tuesday Means each line Means end number list

31. Code for bullet point lists (sq or circle either write here) Apples Oranges

32. Horizontal Rule/Alignment Check widths of webpages by clicking view source to get a feel for whats’s normal 70%. is used to draw a horiz line across the browser window It is possible to add attributes to this. E.g Align, size and or width Go to example 4

33. Unit 3 Images and Graphics Insert image using the software you chose. Insert table Save as a html webpage Keep in between the tags and change the width to suit the table PNG is an increasingly popular graphics format

34. Frames on a Webpage Borders and boxes so that everything doesn’t just merge together on your webpages. See website example ~ ecdlwebstarter Software like Coffee Cup come with Frame designers to make this easier. You can insert scroll bar to move up and down or across your frames You can also add forms by clicking insert forms, add buttons

35. Unit 4 The Law and Security You need permission from the owner before you can copy any part of a webpage. Copyright is the right of the owner to reproduce or permit others to reproduce their work. Have up-to-date Anti Virus software to combat ever present viruses Firewall is a combination of HW and SW to limit access to certain networks. A cookie – Text files about you saved to a local computer and your actions while online

36. To advance from this point You need web design software such as coffee cup. You can download it for a 30 free trial and use the self help guides. Also, you can download an FTP called File Zila for free to upload webpages onto a webserver as discussed previously. Publisher can be used for pictures. In class we are going to move on to Weebly which is the easiest way to build a website without a need for much HTML programming

37. Summary We learned about the Internet and its elements. We learned that there are many types of software to do Web Design and the easiest is weebly. We learned how to do HTML programming using NotePad as editor including programming for; – How to register and test Domain name – FTP transfers using FileZilla or Weebly – Home index/intro page – Tags and Anchors – line breaks and type as written codes – The order tags must come in – Linking pages – Ordered and unordered Lists – The horizontal Rule – Adding Colour-Fonts, Texts, Background,Bold – Graphics and Images – Law and Security

38. SEO Optimization DVD