Haby's Static Site #31

habypsow · 2017-03-20T14:59:53Z

Static Site

Congratulations! You're submitting your assignment!

Comprehension Questions

Question	Answer
Did you have to resolve any issues when running the HTML Validator? If so, what were they?	Yes, I used an inline display function, and still wanted to change the width of the element, but the validator output a warning that width cannot be used with the inline display function.
Why is it important to consider and use semantic HTML?	It is a way to have humans interpret and understand the thoughts and the way that the user structured their code. It makes the code more meaningful.
How did you decide to structure your CSS?	I just used one stylesheet for my files. I do realize this makes it a long piece of code, I just struggled with time, and also wanted to use some of the properties assigned to elements in some other html files.
What was the most challenging piece of this assignment?	This, I realize, is definitely not the best work I could have done. Everything was challenging. I ran out of time, and wanted to complete so much more in the styling, and dryness of the css code as well. There are so many beautifully rendered websites out there that have features that I wanted to apply to mine, however I did not know how to implement some of these complex features.
Describe one area that you gained more clarity on when completing this assignment	I think the ability to use the features we were taught about developers tools to 'debug' your code live, has been cemented in for me right now.

…index.html

… why

CheezItMan · 2017-03-24T18:55:38Z

Static Site

What We're Looking For

Feature	Feedback
Baseline
Appropriate Git Usage	Good number of commits
Answered comprehension questions	Check, in organizing your CSS you can use comments to create sections to help organize the file.
Page fully loads	Check
No broken links (regular or images)	Your menu links are broken because ".html" is misspelled.
Includes at least 4 pages and styling	Check
HTML
Uses the high-level tags for organization: `header, footer, main`	Check
Appropriately using semantic tags: `section, article`, etc.	Good semantic tags
All images include alternate text	On the about page you have images with alt attributes.
CSS
Using class and ID names in style declarations	Check
Style declarations are DRY	There is some drying of your CSS that you could do. If you check you have multiple rules setting widths colors, etc.
Overall	This is a really attractive site with well structured code. You do need to watch light-colored text on light colored sections of text. It makes it harder to read. Also check for broken links a bit more throughly. Overall this is a great site.

jchung722

Hello Haby! I'm sorry for the delay with my code review! I just added a couple comments that could help dry up your code, but overall great job :). I liked what you did with your social media icon links - neat! Keep going strong!

jchung722 · 2017-04-05T08:06:18Z

about.html

+<body id="page3">
+  <header>
+    <div class="header-name">
+      <a href="about.html" target="_blank">Haby Randall</a>


You might want to rethink using target="_blank" for links to pages of your website since it opens pages into a new tab. Makes sense and super useful for the way you used this for your links to social media sites!

jchung722 · 2017-04-05T08:07:10Z

about.html

+    <nav class="top-nav">
+      <ul>
+        <li class="btn"> <a href="hobby-blog.html" target="_blank">Hobbies</a></li>
+        <li class="btn"> <a href="porfolio.html" target="_blank">Porfolio</a></li>


link is broken because portfolio is mispelled

jchung722 · 2017-04-05T08:10:54Z

about.html

+  <main>
+    <section>
+      <article class="bio">
+        <img src="images/IMG_4566.JPG" />


adding a description under an "alt" attribute to image tags can be helpful in case links to images are broken.

jchung722 · 2017-04-05T08:14:39Z

about.html

+  </header>
+
+  <main>
+    <section>


section tags may be unnecessary since page is already divided into articles

jchung722 · 2017-04-05T08:16:53Z

hobby-blog.html

+  <main>
+    <section id="posts">
+      <article class="hobby">
+        <img src="images/IMG_3095.jpg" alt="puppies"/>


cute puppy! :) and nice use of alt attribute

jchung722 · 2017-04-05T08:27:34Z

index.html

+
+  <main>
+    <section class="introduction">
+      <article class="intro-paragraph">


looks like your articles have two different classes: "intro-paragraph" and "about-me-paragraph" yet the same styling. So these could be under the same class, but since the classes weren't called in your stylesheet, I wouldn't give them a class at all. If this was this was something you did to label/keep track of your paragraphs, I would use comments instead.

jchung722 · 2017-04-05T08:34:48Z

stylesheets/styles.css

+  margin-top: 5%;
+
+}
+.github, .instagram, .twitter, .facebook {


could have named these all one class (i.e. .social-media) instead of separate classes. Class is used like ID here.

jchung722 · 2017-04-05T08:36:33Z

stylesheets/styles.css

+  color: inherit;
+}
+
+footer {


Are there some ways css could be dried here? There are similar styles to header.

habypsow added 17 commits March 17, 2017 14:57

Added initial folder structures

6e22b39

Set up header in index.html

a17a729

Added introduction section in index

564e740

Added images to images folder, added body and footer section nubs to …

e66c1f6

…index.html

Added font awesome, and edited footer in index.html

bccf609

Adding google fonts link to head of index.html

e694196

Added styling to header

857c3d6

Starting to edit introduction section in index.hmtl

49943fd

Added styling to introduction links in index.hmtl

277d248

Added footer and padding in heading boxes

f80e79a

Added images to portfolio.html

a420a34

Added images to porfolio.html

c4dc8b2

Started about me page

257e735

Added images to about.html

c29f787

Working on hobby.hmtl

ffb8383

Deleted some images, also editing hobby.html

9d4ab1d

Edited hobby-blog.html, links not working in navigation bar, not sure…

d08d188

… why

Hamled assigned jchung722 Mar 22, 2017

Fixed errors of broken links

d1e7f68

jchung722 reviewed Apr 5, 2017

View reviewed changes

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Haby's Static Site #31

Haby's Static Site #31

habypsow commented Mar 20, 2017

CheezItMan commented Mar 24, 2017

jchung722 left a comment

jchung722 Apr 5, 2017 •

edited

Loading

jchung722 Apr 5, 2017

jchung722 Apr 5, 2017

jchung722 Apr 5, 2017

jchung722 Apr 5, 2017

jchung722 Apr 5, 2017

jchung722 Apr 5, 2017

jchung722 Apr 5, 2017

Haby's Static Site #31

Are you sure you want to change the base?

Haby's Static Site #31

Conversation

habypsow commented Mar 20, 2017

Static Site

Comprehension Questions

CheezItMan commented Mar 24, 2017

Static Site

What We're Looking For

jchung722 left a comment

Choose a reason for hiding this comment

jchung722 Apr 5, 2017 • edited Loading

Choose a reason for hiding this comment

jchung722 Apr 5, 2017

Choose a reason for hiding this comment

jchung722 Apr 5, 2017

Choose a reason for hiding this comment

jchung722 Apr 5, 2017

Choose a reason for hiding this comment

jchung722 Apr 5, 2017

Choose a reason for hiding this comment

jchung722 Apr 5, 2017

Choose a reason for hiding this comment

jchung722 Apr 5, 2017

Choose a reason for hiding this comment

jchung722 Apr 5, 2017

Choose a reason for hiding this comment

jchung722 Apr 5, 2017 •

edited

Loading