tarasis
/
old_tarasis.net
Archived
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Changed from a button to a anchor link. (Still not sure if good or bad idea). Added actual links into the href's to get rid of the Accessibility errors on Frontend Mentor

This commit is contained in:
Robert McGovern 2020-09-05 21:28:25 +01:00
parent 9061889874
commit a3aed9c08f
2 changed files with 5 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
FrontendMentor/huddle-landing-page-with-single-introductory-section-master/index.html
View File

@ -29,15 +29,15 @@
Create connections with your users as you engage in genuine discussion.</p> Create connections with your users as you engage in genuine discussion.</p>
<div class="registerButtonSection"> <div class="registerButtonSection">
<button class="registerButton">Register</button> <a href="https://tarasis.net" class="registerButton">Register</a>
</div> </div>
</div> </div>
</div> </div>
<div class="socialButtonsSection"> <div class="socialButtonsSection">
<a href="#"><i class="fab fa-facebook-f fa-lg circleIcon"></i></a> <a href="https://facebook.com/tarasis"><i class="fab fa-facebook-f fa-lg circleIcon"></i></a>
<a href="#"><i class="fab fa-twitter fa-lg circleIcon"></i></a> <a href="https://twitter.com/tarasis"><i class="fab fa-twitter fa-lg circleIcon"></i></a>
<a href="#"><i class="fab fa-instagram fa-lg circleIcon"></i></a> <a href="https://www.instagram.com/tarasis/"><i class="fab fa-instagram fa-lg circleIcon"></i></a>
</div> </div>
<footer> <footer>
<p class="attribution"> <p class="attribution">

2
FrontendMentor/huddle-landing-page-with-single-introductory-section-master/work-through/myProcess.md
View File

@ -64,7 +64,7 @@ Couple of days later
* fifth: look at stacked icons on font awesome https://fontawesome.com/how-to-use/on-the-web/styling/stacking-icons * fifth: look at stacked icons on font awesome https://fontawesome.com/how-to-use/on-the-web/styling/stacking-icons
* ~~sixth: hover state for social icons not a good color. Aim for a lighter violet. Aim to stay in color scheme (important for accessibility)~~ * ~~sixth: hover state for social icons not a good color. Aim for a lighter violet. Aim to stay in color scheme (important for accessibility)~~
* seventh: good not used too much css, nor complex structure * seventh: good not used too much css, nor complex structure
* eighth: "personal pet peeve" html button is only valid in an html form, otherwise use a anchor styled as a button because a button has no href. -- Not sure which way to go with this because its not clear what would happen on the button press. Does it go to a new page, or reveal a email submission box * ~~eighth: "personal pet peeve" html button is only valid in an html form, otherwise use a anchor styled as a button because a button has no href.~~ -- Not sure which way to go with this because its not clear what would happen on the button press. Does it go to a new page, or reveal a email submission box
* ninth: "personally I would have wrapped the social icons and the footer links in a combined foot section just because that makes them easier to move later if doing a whole site". Mixed on this, attribution link at bottom was not part of the original design, but was part of the base files, and is something that was deletable. * ninth: "personally I would have wrapped the social icons and the footer links in a combined foot section just because that makes them easier to move later if doing a whole site". Mixed on this, attribution link at bottom was not part of the original design, but was part of the base files, and is something that was deletable.
* tenth: (overall people though I did a good/awesome job) * tenth: (overall people though I did a good/awesome job)
* eleventh: was told to check out PerfectPixel extension for Chrome/Firefox. Similar job to diffchecker, can use to add a design image as a layer and you can see how off you are from the design ... being by opacity or there is a difference view * eleventh: was told to check out PerfectPixel extension for Chrome/Firefox. Similar job to diffchecker, can use to add a design image as a layer and you can see how off you are from the design ... being by opacity or there is a difference view