grant.codes

Jump to menu
  • About
  • Contact
  • Projects
  • Updates
  • More...Likes
  • Photos
  • Galleries
  • Replies
šŸ‘ˆšŸ•øšŸ’šŸ‘‰

Liked https://css-tricks.com/need-to-scroll-to-the-top-of-the-page/

Need to scroll to the top of the page?

Perhaps the easiest way to offer that to the user is a link that targets an ID on the <html> element. So like...

<html id="top">
  <body>
     <!-- the entire document -->
     <a href="#top">Jump to top of page</a>
  </body>
</html>

But we've got a few options here.

If you want it to smooth scroll up to the top, you can do that in CSS if you like:

html {
  scroll-behavior: smooth;
}

Note that placing a property on the HTML element like that is all-encompassing behavior you don't have much control over.

In this case, we aren't linking to a focusable element either, which means that focus won't change. That's probably important, so this would be better:

<html>
  <body>
     <a id="top"></a>
     <!-- the entire document -->
     <a href="#top">Jump to top of page</a>
  </body>
</html>

It's better because the focus will move to that anchor tag, which is good for people using the keyboard or assistive technology.

These require clicks though. You might need to trigger scrolling within JavaScript, in which case:

window.scrollTo(0, 0);

...is a sure bet to scroll the window (or any other element) back to the top. The scrolling behavior of that is determined by CSS as well, but if you aren't doing that, you can force the smoothness in JavaScript:

window.scroll({
  top: 0, 
  left: 0, 
  behavior: 'smooth'
});

For a more complete story about smooth scrolling, we have a page for that.

Posted 6 years ago
Liked 6 years ago

Liked https://www.reddit.com/r/Eyebleach/comments/cymwhi/pocket_kitty/?utm_source=ifttt

Pocket Kitty

Pocket Kitty from Eyebleach
Posted 6 years ago by
SuitingUncle620
Liked 6 years ago

Liked https://www.reddit.com/r/animalsdoingstuff/comments/cy5rwx/have_you_ever_seen_a_hamster_getting_mad_and_slap/?utm_source=ifttt

Have you ever seen a hamster getting mad and slap 😹

Have you ever seen a hamster getting mad and slap 😹 from animalsdoingstuff
Posted Permalink
Liked 6 years ago

Liked https://twitter.com/Melophilus/status/1167752781278658565

Robin on Twitter

Ever wanted to draw bears? But couldnt think of a bear to draw?

Well boy howdy do I have something for you! Introducing #Septembear!

I'll be drawing a bunch o' bears. If you wanna join in for a couple then please do!

RT appreciated..🐻 pic.twitter.com/a93p7PAtYb

— Robin (@Melophilus) August 31, 2019
Posted 6 years ago
Liked 6 years ago ā— Also on:

Liked https://www.instagram.com/p/B10fuzOFX5g/

Extra: DOGGUST FINALE Thanks for following my doggust fun :) I'll be starting Septembear tomorrow! #doggust #doggust2019 #dogust #dog&

Posted Permalink
Liked 6 years ago ā— Also on:

Liked https://www.reddit.com/r/youtubehaiku/comments/cxhenw/poetry_plague_doctors_were_really_neat/?utm_source=ifttt

[Poetry] Plague doctors were really neat.

[Poetry] Plague doctors were really neat. from youtubehaiku
Posted 6 years ago by
Ms_Everything9
Liked 6 years ago

Liked https://www.customerservant.com/in-reply-to-cambridgeport90-and-jgmac1106-regarding-the-indieweb-fifth-choice-the-elephant-in-the-room-of-other-cmss-and-accessibility/

Amanda Rush(Placeholder, edit later) WordPress powers over a quarter of the web. With such a large market share comes a shared responsibility to create a web that everyone can use and enjoy, regardless of how they access it.Published29 August 2019 by Amanda Rush | 29 August 2019 Replied to A post by Greg McVerry by Greg McVerry (https://quickthoughts.jgregorymcverry.com/)@cswordpress @Cambridgeport90 I picked a 5th choice: non WordPress CMS. Still native mf2 support in WPEngine properties would be great. Blocks worry all the PHP folks who have no, and don’t want any, React experience.This reply is part of a conversation on this post which has carried over to Twitter. There’s an elephant in the room we need to talk about regarding the fifth choice of non-WordPress CMS, and it’s accessibility, (or lack thereof) of those content management systems.Before anything else, Greg, I’m not mad at you for picking the fifth choice. WordPress isn’t the only thing out there, and it shouldn’t be the only thing out there, if for no other reason than the principles governing the Indieweb basically state that there shouldn’t be one platform/CMS to rule them all. That said, there’s a reason a lot of people with disabilities, (screen reader users especially), choose WordPress, and to a lesser extent, Drupal.Aside from the things that popularity brings, (one-click installs, for example), the fact is that content management systems outside of WordPress and Drupal and somewhat Joomla! do not take accessibility into consideration as part of their development and design roadmaps. And nobody wants to be the first person to start advocating piecemeal with each and every one of these only to be told that ā€œAccessibility is not a priorityā€ or any of the other excuses put forth for why something isn’t accessible. Nobody certainly wants to do it for free.I continue to contribute to WordPress accessibility for a whole host of reasons, some of which have to do with self-interest. I use WordPress and I want to give back, and it makes sense for me to invest in the platform that has helped me make my living for the last ten years. I also want others in the blind community to have the opportunity to use WordPress to make a living of their own. In order for that to happen, accessibility has to be part of the project.And unfortunately, experience has taught me, (as well as others in the disability community), that accessibility just isn’t a high priority, especially if it gets in the way of some cool new feature. That’s true for everything from Cpanel to PHPMyAdmin all the way down the line to just about every other thing used to create websites.Granted, given the insistence in the indieweb space on semantic HTML, I could find that I am pleasantly surprised that Known, for example, works just fine. And there are good reasons for using it, most notably that indieweb stuff just seems to work out of the box. What I’m not sure about though is the accessibility of themes/templates, and whether or not post kinds display is accessible, to say nothing of the creation process.Which brings me back to WordPress and Drupal, but especially WordPress. People who use screen readers, and to a lesser extent other assistive technologies, use WordPress because work is constantly being done on accessibility, along with the reasons that draw others to it: One-click installs, lots of options, thriving design/development community to create those options, and (relative) ease of use. And because things like Squarespace, Wix, and pretty much every other open source/free software content management system has significant accessibility problems, plus learning curves and all that jazz.So, to get back to my contention that indieweb WordPress will have to embrace blocks, I completely get that none of us want to touch React, and believe me I haven’t developed some sudden love for Gutenberg. I just think that, if indieweb stuff is going to take off, it’s going to have to be easier to handle the theming aspect of indieweb, and I think the easiest way to do that is to go with the flow of the community as much as possible. I’m not suggesting that the work be apportioned to others. Far from it. I’m saying we collectively need to do this, not that someone else should do it. I just don’t see the current theme status quo sticking around for long, and right now, we’re forking default themes probably because they are the easiest to fork, Independent Publisher being the exception.I’d feel sorry for anyone who tried to fork a Theme Forest theme. That’s something I wouldn’t wish on my worst enemy. And Genesis, as much as I love it, is going to take some thinking through due to the changes they’re making, and the fact that generally plugins that work best with Genesis are built to work with that framework and the way it does things and not to be compatible with stuff outside of that. There are some exceptions, (Give, Gravity Forms, anything that uses shortcodes to insert its content). But I think getting something like Post Kinds working with Genesis, plus making sure that it still works with everything else, would be a ton of work. I think there would have to be a separate Genesis-specific plugin to handle post kinds for that framework. And I’m using Genesis as my example because it has 250,000 users, a thriving design community along with development community, and is really quick to set up sites with. Problem is, that community is embracing blocks, because admittedly blocks make some things a lot easier to do, homepages that aren’t just static but are a mix of static and dynamic, for example. Up until Gutenberg that’s been accomplished with widgets and sometimes custom loops. Blocks/Gutenberg eliminates a lot of that work.So the Genesis community isn’t going to want to go back to the old way, even if indieweb is important to some of the community members. Users aren’t going to switch from Genesis to what’s currently there for indieweb with regard to themes unless they decide to be idealistic above everything else, which means indieweb is adopted by less people overall. While Genesis is the example under discussion here, all of this applies to every other theme framework, and themes in general. In short, blocks is where it’s at, whether I like that or not, and even if I still hate React for all of the reasons I hate it.Share this:FacebookLinkedInTwitterLike this:Like Loading... Discuss this Respond on your own site: Respond Leave a Reply Cancel replyDiscuss thisCommentYour email address will not be published. Required fields are marked *Name * Email * Website Notify me of follow-up comments by email. Notify me of new posts by email. This site uses Akismet to reduce spam. Learn how your comment data is processed. To respond on your own website, enter the URL of your response which should contain a link to this post's permalink URL. Your response will then appear (possibly after moderation) on this page. Want to update or remove your response? Update or delete your post and re-enter your post's URL again. (Learn More) Search ArchivesAugust 2019July 2019June 2019May 2019April 2019March 2019February 2019January 2019December 2018November 2018October 2018January 2018December 2017November 2017October 2017September 2017August 2017June 2017May 2017March 2017December 2016November 2016October 2016September 2016August 2016July 2016June 2016May 2016April 2016March 2016February 2016January 2016December 2015November 2015October 2015September 2015May 2015April 2015March 2015February 2015January 2015December 2014November 2014October 2014September 2014August 2014July 2014March 2014November 2013October 2013MetaLog in Indieweb Publisher empowered by WordPress %d bloggers like this:

This reply is part of a conversation on this post which has carried over to Twitter. There’s an elephant in the room we need to talk about regarding the fifth choice of non-WordPress CMS, and it’s accessibility, (or lack thereof) of those content management systems.

Before anything else, Greg, I’m not mad at you for picking the fifth choice. WordPress isn’t the only thing out there, and it shouldn’t be the only thing out there, if for no other reason than the principles governing the Indieweb basically state that there shouldn’t be one platform/CMS to rule them all. That said, there’s a reason a lot of people with disabilities, (screen reader users especially), choose WordPress, and to a lesser extent, Drupal.

Aside from the things that popularity brings, (one-click installs, for example), the fact is that content management systems outside of WordPress and Drupal and somewhat Joomla! do not take accessibility into consideration as part of their development and design roadmaps. And nobody wants to be the first person to start advocating piecemeal with each and every one of these only to be told that “Accessibility is not a priority” or any of the other excuses put forth for why something isn’t accessible. Nobody certainly wants to do it for free.

I continue to contribute to WordPress accessibility for a whole host of reasons, some of which have to do with self-interest. I use WordPress and I want to give back, and it makes sense for me to invest in the platform that has helped me make my living for the last ten years. I also want others in the blind community to have the opportunity to use WordPress to make a living of their own. In order for that to happen, accessibility has to be part of the project.

And unfortunately, experience has taught me, (as well as others in the disability community), that accessibility just isn’t a high priority, especially if it gets in the way of some cool new feature. That’s true for everything from Cpanel to PHPMyAdmin all the way down the line to just about every other thing used to create websites.

Granted, given the insistence in the indieweb space on semantic HTML, I could find that I am pleasantly surprised that Known, for example, works just fine. And there are good reasons for using it, most notably that indieweb stuff just seems to work out of the box. What I’m not sure about though is the accessibility of themes/templates, and whether or not post kinds display is accessible, to say nothing of the creation process.

Which brings me back to WordPress and Drupal, but especially WordPress. People who use screen readers, and to a lesser extent other assistive technologies, use WordPress because work is constantly being done on accessibility, along with the reasons that draw others to it: One-click installs, lots of options, thriving design/development community to create those options, and (relative) ease of use. And because things like Squarespace, Wix, and pretty much every other open source/free software content management system has significant accessibility problems, plus learning curves and all that jazz.

So, to get back to my contention that indieweb WordPress will have to embrace blocks, I completely get that none of us want to touch React, and believe me I haven’t developed some sudden love for Gutenberg. I just think that, if indieweb stuff is going to take off, it’s going to have to be easier to handle the theming aspect of indieweb, and I think the easiest way to do that is to go with the flow of the community as much as possible. I’m not suggesting that the work be apportioned to others. Far from it. I’m saying we collectively need to do this, not that someone else should do it. I just don’t see the current theme status quo sticking around for long, and right now, we’re forking default themes probably because they are the easiest to fork, Independent Publisher being the exception.

I’d feel sorry for anyone who tried to fork a Theme Forest theme. That’s something I wouldn’t wish on my worst enemy. And Genesis, as much as I love it, is going to take some thinking through due to the changes they’re making, and the fact that generally plugins that work best with Genesis are built to work with that framework and the way it does things and not to be compatible with stuff outside of that. There are some exceptions, (Give, Gravity Forms, anything that uses shortcodes to insert its content). But I think getting something like Post Kinds working with Genesis, plus making sure that it still works with everything else, would be a ton of work. I think there would have to be a separate Genesis-specific plugin to handle post kinds for that framework. And I’m using Genesis as my example because it has 250,000 users, a thriving design community along with development community, and is really quick to set up sites with. Problem is, that community is embracing blocks, because admittedly blocks make some things a lot easier to do, homepages that aren’t just static but are a mix of static and dynamic, for example. Up until Gutenberg that’s been accomplished with widgets and sometimes custom loops. Blocks/Gutenberg eliminates a lot of that work.

So the Genesis community isn’t going to want to go back to the old way, even if indieweb is important to some of the community members. Users aren’t going to switch from Genesis to what’s currently there for indieweb with regard to themes unless they decide to be idealistic above everything else, which means indieweb is adopted by less people overall. While Genesis is the example under discussion here, all of this applies to every other theme framework, and themes in general. In short, blocks is where it’s at, whether I like that or not, and even if I still hate React for all of the reasons I hate it.

Replied 6 years ago by
Amanda Rush(Placeholder, edit later) WordPress powers over a quarter of the web. With such a large market share comes a shared responsibility to create a web that everyone can use and enjoy, regardless of how they access it.
Liked 6 years ago

Liked https://www.reddit.com/r/youtubehaiku/comments/cx1nt3/meme_the_forbidden_music/?utm_source=ifttt

[Meme] The Forbidden Music

[Meme] The Forbidden Music from youtubehaiku
Posted 6 years ago by
Yntelligence
Liked 6 years ago

Liked https://css-tricks.com/maskable-icons-android-adaptive-icons-for-your-pwa/

Maskable Icons: Android Adaptive Icons for Your PWA

Youve created a Progressive Web App (PWA), designed an icon to represent it, and now youre installing it to your Android home screen.

Folder containing icons with transparent backgrounds or solid backgrounds

But, if you have a recent Android phone, your icons will show up like this:

Homescreen with icons inside white circles

What happened? Well, Android Oreo introduced adaptive icons, a new icon format that enforces the same shape for all icons on the home screen. Icons that dont follow the new format are given a white background.

However, there is a new web feature called maskable icons that is coming soon to Firefox Preview and other web browsers. This new icon format will let your PWAs have their own adaptive icons on Android.

I work at Mozilla and have implemented support for maskable icons in Firefox Preview. Ill show you how to add them to your own PWAs for Android.

What are maskable and adaptive icons?

Until a few years ago, Android app icons were freeform and could be any shape. This meant that web apps could also reuse the same transparent icon when pinned to the home screen.

Icons of various shapes and sizes

However, manufacturers, like Samsung, wanted to make all icons on a device the same shape to keep things consistent. Some manufacturers even wanted different shapes. To deal with the variety of requirements from manufacturers and devices, Android introduced adaptive icons. You supply an image with extra space around the edges, and Android will crop it to the correct shape.

Icons restricted to different shapes

But web apps are designed to work on any platform, so they dont have APIs to create these special Android icons. Instead, icons would get squished into white boxes like this:

Icons stuck in shapes with white backgrounds

Lo and behold, last September a brand new API descended upon us and was added to the W3C spec. Maskable icons allow web developers to specify a full-bleed icon that will be cropped. Its platform agnostic, so Windows could use them for tiles or iOS could use them for icons.

Icons with detailed backgrounds restricted to different shapes

How to create maskable icons

Since the maskable icon format is designed work with any platform, the size and ratios are different from the size and ratios of Androids adaptive icons. This means you cant reuse the same asset.

Maskable icons can be any size, and you can continue to use the same sizes that youd use for normal transparent icons. But when designing the icon, ensure that important information is within a safe zone circle with a radius equal to 40% of the images size.

The safe zone

All pixels within this zone are guaranteed to be visible. Pixels outside the zone may be cropped off depending on the icon shape and the platform.

Warning: If you already have an Android app, avoid copying and pasting the icon from your Android app to your web app. The ratios are different, so your icons would look too small.

Adding the icon to your Web App Manifest

Once the icons are created, you can add an entry to your Web App Manifest similar to other icon assets. The Web App Manifest provides information about your web app in a JSON file, and includes an "icons" array.

{
  ...
  "icons": [
    ...
    {
      "src": "path/to/maskable_icon.png",
      "sizes": "196x196",
      "type": "image/png",
      "purpose": "maskable"
  ]
  ...
}

Maskable icons use a special new key, "purpose", to indicate that they are meant to be used with icon masks. Icons with transparent backgrounds have a default "purpose" of "any", and icons can be used for multiple purposes by separating each option with a space.

"purpose": "maskable any"

Preview your icons

Do you want to see what your own maskable icons will look like? Ive created a tool, Maskable.app, to help you evaluate how the icon appears in different shapes.

The app lets you preview your icon in various shapes that can be found on Android devices. I hope this tool helps you create unique icons for your Progressive Web Apps.

Once youre satisfied with the results, you can start testing your app with Mozillas Reference Browser. This special browser is a testing ground for features before they reach Firefox Preview, and you can use it to check out how your PWA looks.

Tools like PWACompat also have support for maskable icons. You can automatically generate icons for iOS and other devices based on your new maskable icons!

Time to build your own icons

If you want to more control over how your PWA icons are displayed on Android, maskable icons is the way to go. With maskable icons you can customize how your icon is displayed from edge-to-edge. Hopefully this article can get you started on creating your first maskable icon.

Icon Credits:

Posted 6 years ago
Liked 6 years ago

Liked https://www.customerservant.com/read-a-new-era-for-the-genesis-framework-recapping-the-biggest-changes-and-how-to-work-with-them-by-cdils-and-added-some-indieweb-thoughts-approaching-heresy-spoiler-alert-were-gonna-have/

Amanda RushPublished28 August 2019 by Amanda Rush | 28 August 2019 Read A New Era for the Genesis Framework: Recapping the Biggest Changes and How to Work with Them by Carrie Dils (Carrie Dils)It’s been roughly one year since WP Engine acquired StudioPress, the makers of the Genesis Framework. There’s been a lot of forward progress, but it may have left some people feeling unsure about how to work with Genesis or best take advantage of new features.I’ve always loved the Genesis framework, and I still use it on client sites. While reading this post by Carrie, I began to think that those of us in the Indieweb community may quickly need to embrace blocks.Yes, I know, that’s basically heresy, but I’m thinking this may need to happen sooner rather than later since Gutenberg development is pretty rapid, the accessibility issues are being fixed pretty quickly, and the end of 2021 will get here before we know it. Post kinds as blocks, for example, would probably be a lot easier to share across themes, as opposed to now, when themes either have to be forked and customized or created from scratch to explicitly support microformats 2.Granted, you can have indieweb without post kinds, but post kinds is what enables people to truly own all of their content. And right now, there are only a few people doing the heavy lifting with regard to themes. That’s an untennable situation for a ton of reasons.In order for this to change, it’s going to have to become easier for other designers and developers, (let alone users), to implement this stuff, and there are two ways that can happen. The first is WordPress as a project adopts all the indieweb building blocks. This would be the best solution, but I don’t see it happening anytime soon. The second way is us adopting blocks on the model of something like the Automic Blocks plugin or similar, at least for the post kinds/microformats 2 part.I suppose there’s a third way, where WordPress adopts things like webmention and the other open standards, and blocks for post kinds is the compromise.These are all just thoughts, but the Genesis framework has somewhere around 250,000 users, it’s backed by its owning hosting company, and it really does provide an easy way for users to build sites, with some accessibility included. And I think expecting users to do the heavy lifting for themes just isn’t sellable.There’s a lot of promise contained in Gutenberg and the whole blocks concept, including the up-ending of what is the current raging dumpster fire which is the WordPress theme ecosystem, (with some notable exceptions for some themes). I’m thinking we should go with the flow as best we can.Share this:FacebookLinkedInTwitterLike this:Like Loading... Comment. Respond on your own site: Respond Leave a Reply Cancel replyComment.CommentYour email address will not be published. Required fields are marked *Name * Email * Website Notify me of follow-up comments by email. Notify me of new posts by email. This site uses Akismet to reduce spam. Learn how your comment data is processed. To respond on your own website, enter the URL of your response which should contain a link to this post's permalink URL. Your response will then appear (possibly after moderation) on this page. Want to update or remove your response? Update or delete your post and re-enter your post's URL again. (Learn More) githubGitHub icontwitterTwitter iconfacebookFacebook iconarush.iogithubGitHub icontwitterTwitter iconfacebookFacebook iconarush.io Indieweb Publisher empowered by WordPress %d bloggers like this:

I’ve always loved the Genesis framework, and I still use it on client sites. While reading this post by Carrie, I began to think that those of us in the Indieweb community may quickly need to embrace blocks.

Yes, I know, that’s basically heresy, but I’m thinking this may need to happen sooner rather than later since Gutenberg development is pretty rapid, the accessibility issues are being fixed pretty quickly, and the end of 2021 will get here before we know it. Post kinds as blocks, for example, would probably be a lot easier to share across themes, as opposed to now, when themes either have to be forked and customized or created from scratch to explicitly support microformats 2.

Granted, you can have indieweb without post kinds, but post kinds is what enables people to truly own all of their content. And right now, there are only a few people doing the heavy lifting with regard to themes. That’s an untennable situation for a ton of reasons.

In order for this to change, it’s going to have to become easier for other designers and developers, (let alone users), to implement this stuff, and there are two ways that can happen. The first is WordPress as a project adopts all the indieweb building blocks. This would be the best solution, but I don’t see it happening anytime soon. The second way is us adopting blocks on the model of something like the Automic Blocks plugin or similar, at least for the post kinds/microformats 2 part.

I suppose there’s a third way, where WordPress adopts things like webmention and the other open standards, and blocks for post kinds is the compromise.

These are all just thoughts, but the Genesis framework has somewhere around 250,000 users, it’s backed by its owning hosting company, and it really does provide an easy way for users to build sites, with some accessibility included. And I think expecting users to do the heavy lifting for themes just isn’t sellable.

There’s a lot of promise contained in Gutenberg and the whole blocks concept, including the up-ending of what is the current raging dumpster fire which is the WordPress theme ecosystem, (with some notable exceptions for some themes). I’m thinking we should go with the flow as best we can.

Posted 6 years ago by
Amanda Rush
Liked 6 years ago
NewerOlder
EmailInstagramGithub

Grant Richmond
grant.codes[email protected]