Meglio Javascript o HTML?

[Shyson]

Sono in dubbio: devo mettere dei codici per icone social nel sito e lo posso fare in questi 2 modi, secondo voi qual'è il linguaggio più leggero e sicuro?

 

[Leonardo Scotti]

puoi spiegare meglio ciò che vuoi fare?

 

[Shyson]

Ho la possibilità di mettere il codice in 2 modi, ma non so qual'è meglio:

  <!-- HTML -->                          
<ul class="share-buttons">
  <li><a href="https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fsito.it&quote=" title="Share on Facebook" target="_blank"><img alt="Share on Facebook" src="https://sito.it/icone-social/Facebook.svg" /></a></li>
  <li><a href="https://twitter.com/intent/tweet?source=https%3A%2F%2sito.it&text=:%20https%3A%2F%2Fsito.it" target="_blank" title="Tweet"><img alt="Tweet" src="https://sito.it/icone-social/Twitter.svg" /></a></li>
  <li><a href="https://pinterest.com/pin/create/button/?url=https%3A%2F%2Fsito.it&description=" target="_blank" title="Pin it"><img alt="Pin it" src="https://sito.it/icone-social/Pinterest.svg" /></a></li>
</ul>

<!-- JS -->
<ul class="share-buttons">
  <li><a href="https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fsito.it&quote=" title="Share on Facebook" target="_blank" onclick="window.open('https://www.facebook.com/sharer/sharer.php?u=' + encodeURIComponent(document.URL) + '&quote=' + encodeURIComponent(document.URL)); return false;"><img alt="Share on Facebook" src="https://sito.it/icone-social/Facebook.svg" /></a></li>
  <li><a href="https://twitter.com/intent/tweet?source=https%3A%2F%2Fsito.it&text=:%20https%3A%2F%2Fsito.it" target="_blank" title="Tweet" onclick="window.open('https://twitter.com/intent/tweet?text=' + encodeURIComponent(document.title) + ':%20'  + encodeURIComponent(document.URL)); return false;"><img alt="Tweet" src="https://sito.it/icone-social/Twitter.svg" /></a></li>
  <li><a href="https://pinterest.com/pin/create/button/?url=https%3A%2F%2Fsito.it&description=" target="_blank" title="Pin it" onclick="window.open('http://pinterest.com/pin/create/button/?url=' + encodeURIComponent(document.URL) + '&description=' +  encodeURIComponent(document.title)); return false;"><img alt="Pin it" src="https://sito.it/icone-social/Pinterest.svg" /></a></li>
</ul>

 

[Leonardo Scotti]

Io userei HTML, ma penso che sia più una scelta personale che determinata da convenienza

 

[Shyson]

Io userei HTML, ma penso che sia più una scelta personale che determinata da convenienza

Funziona meglio il Js, l'altro va a influire sul css.
Però vorrei farti vedere una cosa: queste 3 icone appaiono in fondo a ogni articolo e di ogni pagina (quello in alto nella colonna sinistra). Se nota facilmente che nelle pagine appaiono quadrate con lo sfondo, mentre negli articoli sono rotonde senza sfondo, come mai?

Alberti Foto

Fotografare non è solo fare click, significa fermare il tempo, raccontare una storia, mettere il passato, il presente e il futuro nello stesso momento.

albertifoto.altervista.org

CSS

/* Icone social */
ul.share-buttons .sr-only{
    width: 110px;
    list-style: none;
    padding-top: 20px;
    border-top: 1px solid #d6d6d6;
    position: absolute;
    clip: rect(1px 1px 1px 1px);
    clip: rect(1px, 1px, 1px, 1px);
    padding: 0;
    border: 0;
    height: 1px;
    width: 1px;
    overflow: hidden;
}
ul.share-buttons li {
  display: inline;
}
ul.share-buttons img {
  width: 32px;
}