My tribute page(Jose Rizal)

My tribute page(Jose Rizal)
0

#1

Hi I’m Ric

I’m new to coding and after finishing this i just realized that i really need to improve my designing skills cause this is a bit rough and rushed. I guess but feel free to review and criticize my work and suggestions is more than welcome and I needed that to.

Thank you

Here is the link to my tribute page: https://codepen.io/ricmanantan/pen/ooLpdB


#2

Hi @ricmanantan,

CSS inspector:

  • Unkown word
.box{
  border
}
  • Do not use lower levels to decrease heading font size:
<h1 class="text-center">José Rizal</h1>
 ...
<h3 class="text-primary">Jose Rizal</h3>

MDN documentation:
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/Heading_Elements

Do not use lower levels to decrease heading font size: use the CSS font-size property instead.Avoid skipping heading levels: always start from <h1>, next use <h2> and so on.

http://w3c.github.io/html/sections.html#the-h1-h2-h3-h4-h5-and-h6-elements

h2–h6 elements must not be used to markup subheadings, subtitles, alternative titles and taglines unless intended to be the heading for a new section or subsection. Instead use the markup patterns in the §4.13 Common idioms without dedicated elements section of the specification.

Common Idioms
https://www.w3.org/TR/html5/common-idioms.html

  • Target blank vulnerability (important)
<a href="https://en.wikipedia.org/wiki/Jos%C3%A9_Rizal" target="_blank">Wikipedia</a>

MDN documentation:

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a

Note: When using target, consider adding rel="noopener noreferrer"
to avoid exploitation of the window.opener API.

https://mathiasbynens.github.io/rel-noopener/

TL;DR If window.opener is set, a page can trigger a navigation in the opener regardless of security origin.

https://www.jitbit.com/alexblog/256-targetblank---the-most-underestimated-vulnerability-ever/

People using target=’_blank’ links usually have no idea about this curious fact:
The page we’re linking to gains partial access to the linking page via the window.opener object.
The newly opened tab can, say, change the window.opener.location to some phishing page. Or execute some JavaScript on the opener-page on your behalf… Users trust the page that is already opened, they won’t get suspicious.

How to fix
Add this to your outgoing links.

rel="noopener"

Update: FF does not support “noopener” so add this.

rel="noopener noreferrer"

Remember, that every time you open a new window via window.open(); you’re also “vulnerable” to this, so always reset the “opener” property

var newWnd = window.open();
newWnd.opener = null;

Cheers and happy coding :slight_smile:


My Portfolio Page - Steal It!
Please provide your suggestions about my Portfolio page
My Portfolio by Josue Guerrero
#3

Hi Sir errertres,

Thank you for your wonderful feedback i’ll do all your on this and on my next project. happy coding sir