Today’s Goals:
- Finish HTML review
Today’s Featured Site:
- http://levskaya.github.io/eschersketch/– If you make something you like, you can download it as a png file
HTML Review
- Important things to know: How to set up a webpage (basic tags, saving and opening correctly, edit with Notepad++) and commonly used tags to add links, insert images, create paragraphs and headlines, make bullets, add line breaks, and add favicons.
- You will have the entire class today and tomorrow to review HTML at your own pace by creating a webpage on a topic of your choice.
- You must follow the instructions below and include everything listed. Here is my example (just an image, links not clickable)
- Come up with a topic (5-10 minutes)
- Plan your content: images, text, links. Decide what you want, download and save image(s) you want to use, and save text and link(s) somewhere that you can easily find later (Google doc, Notepad, desktop note, etc.) (10-15 minutes)
- Code help and hints: Look at your previous projects and try W3Schools.com
- Open Notepad++
- Set up a basic webpage with the following opening and closing tags: html, head, title, and body.
- Save your page in a folder on your computer; make sure to save any images here, too
- Add a page title that describes what your page is about
- Add a headline at the top of your page
- Change your page background color
- Somewhere on your page you will need one of each of the following: an image, a link to a website, bullets, text in paragraph tags, and a line break.
- Get images from the following places ONLY: https://stock.tookapic.com/, https://unsplash.com/, https://www.pexels.com/, or Bing.com (do image search, then search for free to share and use). Resize images in Pixlr.com.
- Add a favicon: you will need a 16 x 16 pixel image and the correct code linking the image in your head section
- Extra credit HTML: Embed a video, use Font Awesome, add a small table (look at your other pages to get code and/or review how to do this)
- Extra credit CSS: See if you can figure out how to give your text a shadow by checking out this example
- Extra credit CSS: See if you can change your font by checking out these examples
- When you’re done: Read through web design in 4 minutes.
2 thoughts on “Class Tuesday, October 25, 2016”
Comments are closed.