Chapter 3 Homework

This is my homework for Chapter 3.

Week 4- Google Analytics

This morning we signed up for the Google analytics to track who sees our website. We also talked about buying domains for cheap and there is a trick to get it more cheaper at godaddy.com. I would want to buy a domain in the future but for now, I think I'll stick to my Aisite. I will be posting more in the afternoon.

Absolute, Static, Relative and Fixed Positioning Tutorial

Today we are going to talk about Static, Relative, Absolute, and Fixed.

 Static: The elements will be in the same place where it usually starts on the page. When you type in static and hit refresh, it will stay positioned as it usually does.

Relative: The element are positioned in relation where it would normally be in the page. As you can see, it will overtop the element.

Absolute: It removes an element from the document flow and it goes anywhere we tell it to.

     

Fixed: The element will stay even when scrolling. Try adding 0px for the margin and top. When you check on safari and try scrolling down, it will stay where its positioned and will stay on top on the other element behind it.

Week 3- Standards 508

On Tuesday we watch a video about accessibility and usability. It was about how people who have disability can use the internet. We also got to hear an example of a website with the accessibility on. In my opinion, I feel bad that people with disability that enjoys browsing the internet has to use it like that. We did a little exercise about using div tags and at first I was pretty lost because the css was all over the place. (No offense) So I didn't know where to start. I tried to start taking out the tables on the days and weeks and tried creating div tags for it. So far, I think it went ok.

Box Model Tutorial

What is a box model? For a brief overview, a box model is a layout of four parts. It contains:

-margin

-padding

-border

-content

The margin, which goes on the outside, clears an area around the second box, which is the border. The margin is completely invisible. The padding which is the third box, clears around the content. The content is where you put text and images.

Now to the tutorial...

First we have to open up Dreamweaver. When it is open, you want to click on the split so we can see the code and design. You will see that there is a Doctype so we can leave that there.

You want to change the title from Untitled Document to Box Model Tutorial.

Now so we are going to create a css so after the head tag, we are going to type:

After that we are going to write in the body. First we have to create a line on top of the box. So we are going create an image.

After the line we created (img src), we are going to type in the box. So we have to make a div class and name it box. After that we will type:

We are going to save it and call it "box_model.html". Once you saved it, you will see a little box on the design section.

Voila! You have created a box model. If you have any questions, comments, or suggestions, comment below and i will get back to you. Thanks!

Week 2- Speech Bubbles

In the morning Sharon talked about what we will be doing in the upcoming weeks. We did an exercise on dream weaver. We did speech bubbles, we did some few changes on the css. At first I was a little confused because Sharon told us to make triangles on the comment box but mines turned into squares which was a little weird at first. After we tried to add gradients on the comment box, everything started to fall right in place. We watched a video about how to do the nth-child which was a bit confusing at first but I think I got the hang of it. We tried to rotate the images to slant the other side by using nth-child. For homework, we have to make a box model so I have to finish this post right about now.

Results for Web Speed Report

Today I submitted my blog on the website optimization and my HTTP results turned out to be 22 with the total size of 59075 bytes. I am pretty confused with the results because it says I have too many images and I haven't posted any images. I don't know if there is something I should do. Any help would be great!

First Post

This will be my blog for my MM2203 class Intro to Web Design.