#microformats 2019-05-12

2019-05-12 UTC
nitot, JonathanNeal, KartikPrabhu, jamietanna|wwwjv, wakest[m], jgmac1106[m], astrojuanlu[m], pniedzielski[m], [eddie], bigbluehat, sknebel, jacky, gRegorLove and [Rose] joined the channel
#
@bswierczynski ↩️ For the record (tho it shouldn't matter): I come from a background with high effort put on quality HTML, CSS, semantics and accessibility (back from microformats through WAI-ARIA and testing w/ scr readers). I'm NOT saying to screw 'em. I'm stating limitations in marketability. (twitter.com/_/status/1127442506382110720)
[frank] and [tantek] joined the channel
#
@guzmanadrian "Microformats and RDFa deployment across the Web" http://bit.ly/2YqaET9 (twitter.com/_/status/1127469545063690240)
nitot, [jeremycherfas], [Rose], adactio, [eddie], mauz555, KartikPrabhu, [jgmac1106], Daniel, gRegorLove, tantek_, [tantek] and [voss] joined the channel
#
[tantek] "Posted January 25, 2011"
[dmitshur], mauz555, vivus, nitot, [tantek], [schmarty] and [Chase_McCoy] joined the channel
#
[Chase_McCoy] Could someone help me out getting an `h-card` setup on my site? I added the following markup to chasem.co:
#
[Chase_McCoy] ```
#
[Chase_McCoy] <div class=“sc-bdVaJa sc-cSHVUG cNkEge”>
#
[Chase_McCoy] <a rel=“me” class=“p-name u-url” href=“https://chasem.co/“>Chase McCoy</a>
#
[Chase_McCoy] <p width=“95%” id=“hcard-Chase-McCoy” class=“h-card vcard sc-bwzfXH dmpxgm”>
#
[Chase_McCoy] <img class=“u-photo” src=“https://github.com/chasemccoy.png” alt=“”>
#
[Chase_McCoy] <a rel=“me” class=“u-email” href=“mailto:hi@chasem.co”>hi@chasem.co</a>
#
[Chase_McCoy] </div>
#
[Chase_McCoy] <a href=“https://twitter.com/chase_mccoy” target=“_blank” rel=“noopener” class=“sc-bwzfXH Link__Container-kQAKlC hkTuJ”>Twitter</a>,
#
[Chase_McCoy] <a href=“https://instagram.com/chs_mc” target=“_blank” rel=“noopener” class=“sc-bwzfXH Link__Container-kQAKlC hkTuJ”>Instagram</a>,
#
[Chase_McCoy] <a href=“mailto:hi@chasem.co” class=“sc-bwzfXH Link__Container-kQAKlC hkTuJ”>Email</a>, &amp;
#
[Chase_McCoy] <a href=“https://github.com/chasemccoy” target=“_blank” rel=“noopener” class=“sc-bwzfXH Link__Container-kQAKlC hkTuJ”>GitHub</a>,
#
[Chase_McCoy] <a href=“/feed.xml” class=“sc-bwzfXH Link__Container-kQAKlC hkTuJ”>RSS</a>.
#
[Chase_McCoy] Slack is not letting me edit or delete my messages for some reason...
#
[Chase_McCoy] ```
#
[Chase_McCoy] <p id="hcard-Chase-McCoy" class="h-card vcard">
#
[Chase_McCoy] <img class="u-photo" src="https://github.com/chasemccoy.png" alt="">
#
[Chase_McCoy] <a rel="me" class="u-email" href="mailto:hi@chasem.co">hi@chasem.co</a>
#
[Chase_McCoy] <a rel="me" class="p-name u-url" href="https://chasem.co/">Chase McCoy</a>
#
[Chase_McCoy] ```
#
[Chase_McCoy] </p>
#
[Chase_McCoy] That is my markup, but the h-card validator https://indiewebify.me/validate-h-card tells me that it can't find my h-card. Any idea why?
#
Zegnat Slack is a bridge to IRC. Because messages cannot be edited on IRC, we also do not support it within Slack.
#
[Chase_McCoy] Ah, I see. Sorry about the mess, then!
#
[Chase_McCoy] I am using some CSS to hide the actual card from my site visually. Could that be an issue?
#
Zegnat Shouldn't be. php.microformats.io also can't find any contents on the h-card
#
[Chase_McCoy] Hmm. I can manually verify that the contents are present in the DOM on my site…
#
[tantek] the markup is invalid. you can't put a div instead a p in html
#
[tantek] *inside
#
[tantek] what's this for? <div class=“sc-bdVaJa sc-cSHVUG cNkEge”>
#
[Chase_McCoy] [tantek] Haha, I realized that just a bit ago. I just pushed an update to my site that fixes it!
#
[Chase_McCoy] Those are just classnames for styling purposes that are generated by styled-components
#
[Chase_McCoy] thanks for your help!
nitot, [grantcodes], [frank], adactio, [Zegnat], [sebsel], [Rose] and [gerwitz] joined the channel
#
[gerwitz] re: `/` vs `/about` for my h-card, I think I will use mostly hidden properties on `/`, and then reveal more on `/about`. ¯\_(ツ)_/¯
nitot, KartikPrabhu, [tantek], chrisaldrich and [aaronpk] joined the channel