Skip to content

Rosalyn De La Cruz #5

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
darkrosalyn5 wants to merge 1 commit into
base: master
Choose a base branch
from
Open

Rosalyn De La Cruz #5

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
35 changes: 35 additions & 0 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,35 @@
<!DOCTYPE html>
<html>
<head>
<title>Assignment 1 Chris Stein </title>
Copy link
Owner

@profstein profstein Feb 8, 2014

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

There's nothing wrong with what you have so far but you are missing a meta tag that should be in the head:
<meta charset="utf-8">
This is important to let the browser know how to deal with characters and this particular charset, utf-8, handles many languages.

</head>
<body>
<h1>Assignment 1: Q & A in HTML</h1>
Copy link
Owner

@profstein profstein Feb 8, 2014

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Because the ampersand & character is used in other ways in HTML it won't be valid if you just write it out. Instead use the character entity: &amp; wherever you want it to appear.

<h2>Rosalyn De La Cruz</h2>




<p><h1>Do you consider yourself more of a designer or developer (or something else, other answers are acceptable)?</p></h1>
<h2>I feel i am more of a designer as well as a programmer. I am better being programmer than designer, I like to code and I love the feeling of being able to control what I am trying to show.</h2>

Copy link
Owner

@profstein profstein Feb 8, 2014

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You've done some good things with the QA markup.

  • You've kept it consistent
  • You marked up the Qs different than the As

You really want to accomplish a few things with the markup:

  1. show that the question and answer are a pair (related elements).
  2. Have something be different between the two so that you can style the questions differently than the answers.
  3. Use semantic markup as much as possible.

I should say up front that there is no perfect answer for how to mark up this assignment — see this discussion. There is no Q&A element in HTML5. So I'm more looking that you have made an effort to do the three things above.

So while you have accomplished #2 the other ones need some work. Let's focus first on the elements you used. h1 and h2 are the main title and it's sub title for a the page or an <article> element. So they're a little bit overkill for the QA here. This is a semantic problem. You could fix it in a couple of way (remembering there is no perfect answer). One is to use a heading for the question and a paragraph for the answer like this:

<div class="QA">
    <h3>question</h3>
    <p>answer</p>
</div>
<div class="QA">
    <h3>question 2</h3>
    <p>answer 2</p>
</div>

That also fixes a couple of other issues. One of those is that you are misusing the <p> element right now. It can't have other block elements in it and now you have the h1 inside of it. The second thing this markup does is wrap a div around each question (with a class which is important for styling later) so the Q and A are clearly a pair.

Another couple of options are:

<section class="QA">
    <h3>question</h3>
    <p>answer</p>
</section>
<section class="QA">
    <h3>question 2</h3>
    <p>answer 2</p>
</section>

Or you might use a definition list:

<dl>
    <dt>Question here</dt>
    <dd>answer</dd>
    <dt>Question  2 here</dt>
    <dd>answer 2</dd>
</dl>

<p><h1>What are you most interested in learning in this class?</h1></p>
<h2>I am most interested in learning how to program maybe pictures and make things move like in video games, To learn how to be well versed in javascript. I want to be proud of my coding.</h2>

<p><h1>What is good design?</h1></p>
<h2>I think a good design is clean, or even "good looking", functional, and interesting. I think a good design will keep users on the site .</h2>

<p><h1>What is good web design?</h1></p>
<p><h2>A good web design is interactive, fun, quick, easy to navigate, and clean. Good webdesigns keep users on the site for many hours.</p ></h2>

<p><h1>What are the good examples of conference/event web sites? Answer by listing at least two sites including each URL and why you chose the site.</p></h1>
</h2>I think <a href= "StumbleUpon.com"></a> because this website launches anywebsite on any web broswer. It has a lot of interest that you can change. it's efficient, clean, and interactive. I think <a href= "jimcarrey.com"></a> is another good site. although it's not clean it's interactive and exciting. it has many things for a user to play or to look for content. I believe it's one of the most creative websites on the internet. </h2>
Copy link
Owner

@profstein profstein Feb 8, 2014

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You aren't showing any text to the user in the stumbleupon link and the jimcarrey link. Remember to put the text inside of the a tags:
<a href="link.html">Text user sees</a>

The other problem that neither of these are conference or event web sites. I realize based on your answers that I wasn't totally clear with my instructions. By "conference" I meant an event where there is a topic and are speakers and a schedule and people go to hear the speakers and talk to each other about the topic at a specific date and time.

By "event" I meant again some kind of happening that was time based but this time it didn't have to be a conference about a topic but could be any event like a concert or whatever.

You should choose at least one conference site (you can choose two if you like). The other one can be an event if you choose only one conference.

</body>
</html>



//Your assignment is to answer the following questions in an HTML file. Part of the assignment is answering the questions and part of the assignment is to answer them in a valid, semantic HTML page.
Copy link
Owner

@profstein profstein Feb 8, 2014

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This, //, is not a comment in HTML (it would be in JavaScript) in HTML comments start with <!-- and end with -->

You can also just delete this line.