User:Vtaylor/CIS89A Learning Web Design/Beyond HTML



Beyond HTML
 * Tools are central to the web developer toolkit. They help make development work more efficient, code more robust, and teamwork easier. CSS preprocessors and postprocessors are available for writing CSS efficiently and accurately. An introduction to the building blocks of JavaScript serves as a good starting point for further exploration.

Learning outcomes
 * understand usability
 * follow design guidelines
 * understand the design process
 * transfer files to a web server
 * understand search optimization

Keywords
 * usability, audience, FTP
 * preprocessor, postprocessor, JavaScript, client-side, scripting language, loop, if statement

Reading guide
 * 1) What types of development tools are available?
 * 2) What is GitHub? Why do developers use it?
 * 3) What is JavaScript?
 * 4) How can you use JavaScript to improve your visitors' experience?
 * 5) What are some of the basic blocks and functions?

== Assignments== Coding assignment
 * cis89revisitbasics * head title keywords description * comments in html and css * lists links tables * css fluid layout * scalable images * viewport


 * 1) Review the Keywords and Reading guide questions at the top of this page. These will help you look for important ideas in the rest of assignments for this module.


 * 1) Textbook - Learning Web Design - Chapters 19-22 - 19. More CSS Techniques, 20. Modern Web Development Tools, 21. Introduction to JavaScript, 22. Using JavaScript


 * 1) Programming - the functionality of a web site can be extended by adding some programming, usually in Javascript.
 * If you are new to programming, write your first computer program.  Hour of Code - Learn the basic concepts of Computer Science with drag and drop programming. This is a game-like, self-directed tutorial. Learn repeat-loops, conditionals, and basic algorithms.
 * If you have some programming experience, learn the basics of JavaScript programming while creating fun drawings with your code. An introduction to JavaScript by Khan Academy - Video, step-by-step tutorials.
 * 1) In the Programming discussion, write a brief description (2-3 sentences) of your programming experience. Which tutorial did you do? Do you have any prior programming experience? Would you recommend this activity to others?


 * 1) JavaScript in 30 minutes - Learn what you can about JavaScript in 30 minutes. Use any of the resources listed in the Media section below, Learning Web Design Chapters 21-22, online tutorials, instructional material from a JavaScript course. What did you know about JavaScript before you started this activity? What resources did you use? What did you learn? What questions do you have about JavaScript? Are you interested enough to want to learn more about JavaScript? Will you need to learn JavaScript for developing web sites beyond this course? Write a brief summary of your experience and post it to the JavaScript experience discussion. Review the posts of 3 others.


 * 1) Search Engine Optimization (SEO) - Being "found" and listed in search results is an important part of publicizing your site. The elements in head section of the page is used for this. More than just Google, there are Baidu, Bing, and Yahoo! and others.  Find an article that gives a good overview or specific advice about using these elements effectively. Post a brief summary and a link to the article in the Search Engine Optimization discussion.


 * 1) Internet of Things (IoT) - The next big thing is the Internet of Things. The articles listed in the Media  section provide a great overview with lots of interesting examples in a broad range of categories. Take a look. What do you think? What is one example that is a surprise but you would like to see? Post the name and ONE sentence about your selection to the Internet of Things discussion. Conclude your post with a question. Reply to 2 others and concluded your replies with questions.


 * 1) Web developer jobs - There are many skills and roles available for web developers. Some organizations have a team of developers with different specializations. For other organizations, there may only be one person who develops the web site in addition to other responsibilities. Find 2-3 job ads for web developers. Review the job requirements. Post a link to 1-2 job descriptions and comment on what skills you have and need to develop to perform this job in the Developer jobs discussion.


 * 1) Revisit basics - In a new project, use all the elements, attributes and properties within your page. Include some descriptive information so the viewer knows what is being demonstrated within your page. Also, use comments in your HTML code to indicate what you are doing. Publish your project file.
 * 2) Submit the link to your project to the Revisit basics assignment.
 * 3) Post a link to your project and any comments or questions about the assignment to the Revisit basics discussion.
 * 4) Review the work of 2 others - the page display and the source code. Post a note with links to those projects, and a brief description of your observations - anything that you learned from looking at these? Any ideas you have for using in your own work in the future? Post to the Revisit basics discussion.


 * 1) Data visualization - There are many different ways to display numbers and statistics. Tables are convenient but can be overwhelming. Other data displays include charts, infographics and interactive animations. Find an example for an interesting display that is an effective way to convey the information. Post  a link to your selection and provide a brief description of why this is better than just a table of numbers to the Data Visualization discussion. Review 3 others and post a comment comparing effectiveness of these to the one you selected.


 * 1) Success Skills - Solve it - There are many tools available on the web to help with problem solving skills development and practice. Critical Thinking, Problem Solving and Decision Making are the primary focus of the articles provided. Review 2-3 articles from the Success skills - SOLVE list in the Media section below. Find another similar article that your would recommend be added to the list. Post a link and a brief summary of 1 to the Success Skills - Solve  it discussion.
 * 2) Phishing - Do you think you know an email scam when you see one? Take this quiz and see if you can tell the real corporate emails to customers from the phishing scams. I got 7 out of 10 right. I missed 1 scam but I would have ignored two real requests from companies I do business with. http://www.sonicwall.com/furl/phishing/
 * 3) eCommerce - Some of the "best" examples of web site design are the sites that sell stuff. Find a site that sells products or services online. Think about why the customer visits this site. How does the site design help the customer buy from the site? Post a link to a commercial web site with a brief description of what makes this a successful (or not) web design to the eCommerce site design discussion. Keep the description short - 2-3 sentences.


 * 1) Group Project groups discussions - Web Design - For the activities in this Module, you accessed a number of web sites. In addition to learning from the content, practice evaluating web design on the sites you visit. In each module, we focus on another area of web design and development. What are you looking for in good web design based on the topics we covered in the course so far? What is something important and interesting that you learned about web design? Do you have questions about good web design? How would you apply these design ideas to your own work? Provide a link to the example and brief description of the the design feature. Share with your group in the Group discussion. Are there outstanding questions? Contribute one or more posts to the discussion for the group. If you have a question about working as a group, please ask.

== ==
 * Textbook - Learning Web Design - Chapters 19-22 - 19. More CSS Techniques, 20. Modern Web Development Tools, 21. Introduction to JavaScript, 22. Using JavaScript

Internet/computer tricks
 * Text Fixer - tutorials, code creator
 * 27 People Share The One Cool Internet Or Computer Trick They Know - these suggestions are not something you are going to use everyday, but it is interesting that you can do this

INTERNET OF THINGS (IoT) http://www.diigo.com/rss/user/vtaylor/iothings

HTML5 http://www.diigo.com/rss/user/vtaylor/html5

SEARCH ENGINE OPTIMIZATION (SEO) http://www.diigo.com/rss/user/vtaylor/SEO

SOLVE http://www.diigo.com/rss/user/vtaylor/solveit

2016.3 2540 . 2018.3 5131