Recommended
More Related Content
What's hot
What's hot (20)
Viewers also liked
Viewers also liked (20)
Similar to HTML to FTP
Similar to HTML to FTP (20)
Recently uploaded
Recently uploaded (20)
HTML to FTP
- 1. HTMLtoFTP By: Keira Dooley
- 2. Doctype The doctype declaration should be the very first thing in an HTML document, before the <html> tag. It is an instruction to the web browser about what version of the markup language the page is written in. http://www.w3schools.com/tags/tag_doctype.asp
- 3. XHTML Transitional <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> HTML 4 XML 1 XHTML
- 4. HTML is Easy! It’s got a HEAD and a BODY. <html> <head> <title>Welcome to my web site!</title> </head> <body> Read my content ! ! ! </body></html>
- 5. <html> The <html> tag tells the browser that this is an HTML document.
- 6. <head> doctype keywords page title The head element contains the “brains” of the webpage: doctype page title meta data, like keywords & page description.
- 7. <body> The body element contains all the contents of an HTML document, such as text, hyperlinks, images, tables, lists, etc. text
- 8. Semantic Structure Assistive technologies allow users to navigate between sections of information if structure is used. Structured content is beneficial for sighted users as well.
- 9. <h1> = Heading The <h1> to <h6> tags are used to define HTML headings <h1> defines the largest heading and <h6> defines the smallest heading. Important! Headings should be used to determine hierarchical content structure, NOT to make text larger and bolder.
- 10. How “AT” Reads Headings Assistive technology (AT) devices allow users to navigate through a webpage using the various headings as "bookmarks" to jump from section to section.
- 11. A Good Example of Semantic Structure GOOD! <h1>Page Topic</h1> Content about this topic resides in this paragraph. <h2> Sub Topic Content about this topic resides in this paragraph. <h3> Sub-Sub Topic Content about this topic resides in this paragraph. <h2> Sub Topic Content about this topic resides in this paragraph. Note: Use only one “Heading 1 <h1> ” per page.
- 12. A Bad Example of Semantic Structure <h2>Page Topic</h2> Content about this topic resides in this paragraph. <h1>Topic</h1> Content about this topic resides in this paragraph. <h3>Topic</h3> Content about this topic resides in this paragraph. <h2>Sub Topic</h2> Content about this topic resides in this paragraph. Note: Headings should be used in order to present information in a logical way to all users.
- 13. <ol> = Ordered Lists Code View:<ol> <li>list item</li> <li>list item</li> <li>list item</li></ol> Tip: Change list type by using <ol type=“A”> or <ol type=“a”> Live View: List item List item List item
- 15. List item
- 17. <br /> = Break The <br> tag inserts a single line break. An HTML break is the <br> tag. An XHTML break is the <br /> tag, which is properly closed. Note: Use the break tag to insert line breaks, not to create paragraphs.
- 18. Images Image tag<imgsrc=“http://www.website.com/photo.jpg”> Your website
- 19. Data Tables vs. Layout Tables Data tables can be accessible! Layout tables should be replaced with more accessible layout techniques, like CSS.
- 20. Tables Tables<table> <tr> (table row> <td> (table column) </td> </tr></table>
- 21. Web Editors There are two types of programs that can be used to design basic web sites: WYSIWYG: What You See Is What You Get.“Drag and drop” web design program. (ie: DreamWeaver, Microsoft Frontpage) HTML Text Editor: You write the code. [ie: UltraEdit, Notepad/Windows, Simpletext/MAC]
- 22. FTP (File Transport Protocol) FTP is a way of transferring your website’s files to and from your computer and the web server Your computer WWW FTP
- 23. FTP Programs Filezilla – Used in class CuteFTP WSFTP
- 24. FTP Settings for CSULB
- 25. Web Design Rules to Remember Design your site to accommodate a 1024 x 768 pixel layout Use a standard web font families Use a browser-safe palette when possible Save graphics at 72 dpi (dots per inch)
- 26. References W3 Schools: Tags Ordered by Function: http://www.w3schools.com/tags/ref_byfunc.asp WebAIM: http://www.webaim.org/techniques/semanticstructure/
Editor's Notes
- Without a doctype, your web page will fail validation when you test it later.