Tuesday- Part 1 (Notepad++ and Firefox)
A. Adding a favicon to your webpage. We didn’t get to this last week, so let’s do it now.
Favicons are the tiny icons that appear on the top left next to a website’s name and URL.
First, you must design your favicon in some kind of image editor such as Photoshop. You might also be able to find free favicon generators online. Try this website: http://favicon-generator.org/. It will take a picture or graphic you have and turn it into a favicon. The picture must be a perfect square (same length and width). To do this open up your image with either Photoshop or whatever image editor you have on your computer and crop and resize your image to make sure it’s the same length and width. If you want, click here to download the Mustang logo to use (it is a perfect square).
If you don’t use an image that is a perfect square you will end up with a distorted favicon because the favicon it generates will be 16 pixels by 16 pixels.
Again, pay attention to file name and file type. Save your favicon as favicon.ico and save it in the same place as your index file (desktop or My Documents).
Now that you have created your favicon, step two is adding code to your webpage.
Add this to your head section:
<link rel=”icon” type=”image/x-icon” href=”favicon.ico”>
(If you copy and paste this, you will have to delete the quotation marks and add them again in Notepad++)
Once you have done that, save your index file and refresh the browser. Hopefully you will see your new favicon!
B. We have experimented with some common HTML tags. Want to see some more? Try adding some to your page now.
Also, how about adding a weather sticker to your page that displays the current weather conditions?
Tuesday- Part 2 (Hour of Code special activities)
C. What exactly is computer science?
Click here to see some interesting statistics about computer science in America
D. In recognition of Computer Science Education week, you’re going to continue your Hour of Code by learning some new code beyond what we would typically learn in our web design class.
Today you’re going to choose a tutorial from the following list. There are tutorials on JavaScript, Python, app-building, and more. You are free to work on whatever you want:
I promise you will like these and will have some fun!
You will need headphones. You are welcome to use your own or you can use the ones I have for class.
Wednesday
Today you’re going to use Scratch to create an interactive holiday card.
Scratch is a visual programming app you can use right in the browser to create interactive media like games and animations. It was developed at MIT. Before you dive into your own activity, let’s look at my beginner Scratch project that I did at the beginning on the year.
Before you begin, you will need to sign up for a free account to use Scratch and save your project.
Now, let’s all work on Scratch’s interactive holiday card tutorial. Again, you will need your headphones because you can watch videos to help you as you go along if you want.
http://scratch.mit.edu/projects/15230028/?tip_bar=hoc#editor