Skip to content

Jonathan Velasco #6

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
VelascoJohn wants to merge 2 commits into
base: master
Choose a base branch
from
Open

Jonathan Velasco #6

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
0271504
Merge pull request #1 from profstein/master
VelascoJohn Jan 27, 2014
f55cd26
your message goes here
VelascoJohn Feb 4, 2014
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: 19 additions & 16 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,32 +1,35 @@
<!DOCTYPE html>
<html>
<head>
<title>Assignment 1 Chris Stein </title>
</head>
<body>
<h1>Assignment 1: Q & A in HTML</h1>
<h2>Christopher Stein</h2>
</body>
</html>
<body>

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.


delete this line - convert everything else to a valid, semantic HTML page and answer the questions
<h1>Jonathan Velasco</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.

You still should have the h1 with Assignment 1 Q & A in it and not just your name. Your name should be in a H2 element.

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.



your name
<h2>Do you consider yourself more of a designer or developer (or something else, other answers are acceptable)? </h2>

<h3>I consider myself to be more into designing but I'm really interseted into devoloping as well </h3>

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 really want to accomplish a few things with the markup of the questions and answers:

  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.

With the markup you have you got 2 done well but 1 and 3 need some work. Semantic means that the tags match the content. h elements are headings and so it is hard to say that both the question and answer are headings. One way to do it is make just the question the heading and make the answer a paragraph like this:

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

The markup above also solves 1 by wrapping a div around each pair. Remember that most of the time you want to add a class or id to a div when you use it. Alternatively you could use a different element like section in place of the div.

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


<h2>What are you most interested in learning in this class?</h2>

Do you consider yourself more of a designer or developer (or something else, other answers are acceptable)?
<h3>How to convert the code we create in a computer into a phone or a tablet,learning about that transition excites me</h3>

What are you most interested in learning in this class?
<h2>What is good design?</h2>
<h3>For me the type that would catch poeple's attention right away, colorful and relevant design </h3>

What is good design?
<h2>What is good web design?</h2>

What is good web design?
<h3>Sometimes the simpler the better, a simple website with a clear view would get more viwers than a website with evrything flying aroud </h3>

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.
<h2>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.</h2>
<h3>I like those two websites because of the reasons I said, they make my experience really easy
<ul>
<li> http://www.goal.com/en-us </li>
<li> http://www.karmaloop.com </li>
</h3> </ul>
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.

A couple of comments here. One is that you generally don't want to have other blog level elements inside of heading elements, a list in this case. End the element before the list.

The other is about the sites. 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>