These are tools that I use pretty regularly to create and test websites. I built this list to help content creators and contributors, and those who are not necessarily coders, to keep their sites up to standards.
For Content Creation
Tools to create clean html, alt text, and optimized images for optimized websites.
Word To HTML Cleaner https://wordhtml.com/
Copying code from Word, and other content, include AI code, can give you code with lots of stuff you don't want to enter into your CMS. Clean it up first.
Image to Text https://www.imagetotext.info/
Received the files you need in a pdf or image - convert it to text for editing, or the start of an alt text.
Upscale https://www.upscale.media/upload
Need to enlarge a small graphic or make it bigger to reframe? Upscale it, but watch for text that gets mangled.
Tiny PNG https://tinypng.com/
Optimize images, and choose the best format. Avif and Webp, the smallest, are finally common enough to use for most cases.
Remove BG https://www.remove.bg/
It's worth a try to remove the background from an image to get a transparent background. Sometimes it's not great, and you have to stick to having a background color with it.
For Stock Images
The first best choice is to use original images, unique to your website. Next best is good stock images. Avoid AI generated images for the environment, and for making you look less authentic.
- https://www.pexels.com/
- https://uxwing.com/
- https://www.shopify.com/stock-photos
- https://pixabay.com/
- https://unsplash.com/images/stock/royalty-free
For Online Image Editing
- https://www.canva.com/ - decent free tier.
- https://www.photopea.com/ - like photoshop for the web.
For Website Testing
Even when a site begins optimized, adding and editing text and images can let things slip without notice.
Page Speed https://pagespeed.web.dev/
It's better to use Lighthouse, built into Chrome Dev Tools https://developer.chrome.com/docs/lighthouse/overview
Rich Snippet https://search.google.com/test/rich-results
When you have blog posts and product entries, you can use tags to optimize search and ai interpretation. Requires either built in support in your CMS, or editing html in source.
Open Graph Tag Checker https://www.opengraph.xyz/
Check how your page will appear shared on a link preview in social media sites, and that you have the correct information
Bonus:
Awesome Screenshots Browser Extension https://www.awesomescreenshot.com/
Makes it pretty easy to take a screenshot of an entire page. Available for Chrome and Firefox.
No comments:
Post a Comment