Skip to content

homework #1

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

homework #1

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
e07b23b
homework
BilleyF-KingGir Jan 30, 2014
f406e63
done
BilleyF-KingGir Feb 3, 2014
9731fbc
JavaS
Feb 3, 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
2 changes: 1 addition & 1 deletion README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ QA-html

These are the starter files for the Q&A Assignment.

To complete the assignment:
To complete the assignment:

* Fork the repository to your Github account
* Edit the index.html file to add proper markup to the page (I will show you how to use cloud 9, http://c9.io )
Expand Down
60 changes: 60 additions & 0 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,60 @@
<!DOCTYPE html>
<html lang='en'>
Copy link
Owner

@profstein profstein Feb 7, 2014

Choose a reason for hiding this comment

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

in HTML5 it is valid to use single quotes ' like you have, BUT... most people use double quotes "
Just FYI


<head>
<title>Assignment 1 Billey Florvulus </title>
<meta charset='utf-8'>
</head>

<body>

<div ='title'>
Copy link
Owner

@profstein profstein Feb 7, 2014

Choose a reason for hiding this comment

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

You've left out either class or id here. I think you meant to write:
<div id="title">

You do this on all of the other divs on the page.

It is great that you're giving classes and ids to your divs though.

<h1>Assignment Q & A in html</h1>
</div>

<div ='name'>
<h4>Name</h4>
<ul>
Copy link
Owner

@profstein profstein Feb 7, 2014

Choose a reason for hiding this comment

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

Using an unordered list here is not very semantic (you aren't listing anything, just writing your name). The easiest solution is to just put your name in the h4.

You could also write out <h4>Name: Billey Florvulus</h4>

If you want to style your name or the word Name differently then put tags around one of them like <h4><b>Name:</b> Billey Florvulus</h4>

<li>Billey Florvulus</li>
</ul>
</div>

<div = 'designdevlop'>
Copy link
Owner

@profstein profstein Feb 7, 2014

Choose a reason for hiding this comment

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

In addition to the unique ids you've given to each Q&A pair I'd like you to give them each a class as well like:

and
<div id="interestInlearning" class="QA">

By giving them all the same class you are showing that they are all of the same type and it will be easy for you to go back later and style all of the pairs in a similar way.

<h4> Designer or Devolper</h4>
<article>
<p> I consider myself a bit a both, since I have a passion for both designing and devolping. When it come to which one I excel at more, I'd say the devolping part since I've taken more devolper based classes.</p>
</article>
</div>

Copy link
Owner

@profstein profstein Feb 7, 2014

Choose a reason for hiding this comment

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

You're doing some things great here and some things I'd like you to update. Let's start with what is great:

  • You used consistent markup for all of the questions and answers
  • You have different markup for the questions than for the answers
  • You marked up each Q & A as a pair

Here's what I'd like you to modify:

  • In HTML 5 an article is something that can stand on it's own. It can (and probably should) have headings inside of it. Here you've used it just for the paragraph that answers the question. I would suggest something more like the following:
    • Use an article around the whole thing, the title and your Q&A's.
    • Then around each pair use <section> tags in place of your <div> tags.
    • Then remove the <article></article> tags keeping the <p></p> content inside of them.

<div ='intrestInlearning'>
<h4> Intrest in Learning in the Class</h4>
<article>
<p> I wanna learn better ways to actually design a website, better coding techiques and all the cool stuff Professor Stein was talking about.</p>
</article>
</div>

<div = 'gooddesign'>
<h4> What is Good Web Design?</h4>
<article>
<p> Good web design stays true to the topic. It doesn't go off on a random tangent just to show you something totally off topic. Good web design is also plays well with the eyes, for example it should actually look not and not hurt your eyes.</p>
</article>
</div>

<div = 'goodexampleofsites'>
<h4> Good Example of Conference/Event Websites </h4>
<article>
<p> Some good example of conference sites are these two.
<a href='http://www.leaderstheconference.com/'> Number 1</a>
<a href='http://two5six.com/'>Number 2</a>
Copy link
Owner

@profstein profstein Feb 7, 2014

Choose a reason for hiding this comment

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

The site for this conference now just shows a landing page. I'm sure it was a great site but can you change it to one that has some content?

Also change the names from Number 1 and Number 2 to the names of the conferences.

</p>
</article>
</div>

<div = 'Giantrobot'>
Copy link
Owner

@profstein profstein Feb 7, 2014

Choose a reason for hiding this comment

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

What's this in here for?

<script>
promt("hey there");
</script>
</div>

</body>
</html>