Skip to content
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.

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

Brenna's Static Site #19

Open
wants to merge 11 commits into
base: master
Choose a base branch
from
Open

Brenna's Static Site #19

wants to merge 11 commits into from

Conversation

bcmdarroch
Copy link

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? No issues, just a couple warnings about the main sections missing headings.
Why is it important to consider and use semantic HTML? It makes your code more readable, for both search engines and your team members. It is a more specific system of naming.
How did you decide to structure your CSS? I decided to create sections for my CSS, beginning with the most general page rules, then moving on to the header, main, and footer rules.
What was the most challenging piece of this assignment? I'm still struggling with layout and the positioning of elements. I wanted to center the elements on my site, which I did, but it gets wonky when you squash the screen size.
Describe one area that you gained more clarity on when completing this assignment Though I still have more to learn about layout, I definitely feel more comfortable manipulating elements and using specific selectors.

@CheezItMan
Copy link

Static Site

What We're Looking For

Feature Feedback
Baseline
Appropriate Git Usage Reasonable number of commits, good commit messages
Answered comprehension questions Check
Page fully loads Check
No broken links (regular or images) No broken links, but 2 to your art portfolio
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. Check
All images include alternate text Check
CSS The layout needs a bit of work. The footer wraps on my laptop in a way you probably didn't anticipate. There will be plenty of time to work on things.
Using class and ID names in style declarations No use of IDs which is fine. Good use of classes.
Style declarations are DRY CSS is fairly DRY.
Overall Nice use of rollover effects. The site looks appealing although the layout is a bit wonky on my laptop. The text however is easy to read and the css/html is pretty well structured. I'm curious why you have 2 links to your art portfolio on the site. I like the artwork as well.

Copy link

@miriam-cortes miriam-cortes left a comment

Choose a reason for hiding this comment

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

Did you end up using all the html files? I couldn't get to the bio, blog, or portfolio pages from the index page. Nice job making your css dry!

I'm Brenna (not Brenda or Brianna or Greta) Darroch (pronounced like Arrow)! I love making art, reading, writing, and coding. I'm currently a student at Ada Developers Academy, learning Ruby, HTML/CSS, Ruby on Rails, and Javascript. On the side, I'm teaching myself game programming.
</p>
<p>
Fun fact: I know the following musicals by heart: Grease, Sound of Music, My Fair Lady, Phantom of the Opera, West Side Story, and Fiddler on the Roof. Currently working on Hamilton. :)

Choose a reason for hiding this comment

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

👍 You're my hero!!! I absolutely LOVE musicals!

<img src="images/portfolio.png" alt="Art Portfolio" />
<p class="desc">
Using HTML, CSS, and Javascript Lightbox, I coded my art portfolio site.
</p>

Choose a reason for hiding this comment

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

This is repetitive, but I don't see it on your actual webpage. Not sure if I'm looking at the right place 🤔

<link href="styles/normalize.css" rel="stylesheet">
<link href="styles/styles.css" rel="stylesheet">

<!-- favicon didn't work!

Choose a reason for hiding this comment

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

favicons are such a pain, amiright??

color: #09B3C4;
}

h1 a, h2, h4 {

Choose a reason for hiding this comment

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

nice job staying DRY!

}

*, *:before, *:after {
box-sizing: inherit;

Choose a reason for hiding this comment

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

I'm not sure that this line is necessary...does this do the same as lines 8-10?

padding: 0 2.5%;
}

.prof {

Choose a reason for hiding this comment

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

does this refer to any of the classes in your html file? Can't find its reference anywhere

}

section.contact img {
width: 50px;

Choose a reason for hiding this comment

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

maybe even add the footer img selector here to make it more dry!

@@ -0,0 +1,139 @@
/* color1: #09B3C4 */

Choose a reason for hiding this comment

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

You might not use it at ADA but if you use sass (different but similar to css) you can make these constants so you can declare them once and refer to them everywhere! (makes changing the color soooo easy in the future!)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants