Kie's resources for the indie web

Making a website step by step for beginners

(I still have to write this part. Long story short the current web sucks ass, and I am extremly tired of mainstream social media platofrms.)

Graphics resources

Resources to make or edit graphics

• 3dtext2gif GIF maker : this website generates moving 3D text.
• Ezgif.com : I use this website to cut GIFs and moving WebP graphics. It also lets you crop them, add filters or text to them and extract individual frames.
• Earthbound textbox maker : an Earthbound-style textbox maker. Has nice customization options.
• Minecraft achievment maker : makes a minecrfat-style achievment box.
• The Death Generator : generates textboxes in the style of a huge library of videogames.
• Remove bg : automatically removes the background from an image.
• Dither Me This : dithers images! With many different dithering options.
• 3D GIF Maker : tool to turn images into spinning 3D animations.

Fonts

• Dafont.com : huge database of free fonts. Most of them have a free licences for personal use, but some are 100% free. Has great fonts for titles and decorative text.
• Google Fonts : numerous free fonts, usually with both bold and italic variants. The fonts are great for body text, with many basic and high-readability options.
• fontspace : 130,000+ free fonts of all kinds.

Collections of graphics

• My collection of web stamps : a whole bunch of stamps I found throughout the web. The stamps can be filtered by theme and are sorted by color.
• Tiny identity buttons masterpost : huge collection of tiny buttons for pronouns, orientations, disabilities and interests.
• Jasmine : numerous (but not limited to) videogame and anime materials. Also contains some fonts, cursors and clocks. To access them use the "materials" drop menue at the top.
• Pixel Safari : nice collection of blinkies, stamps, favicons, dividers, buttons and more.
• TheVGresource : huge database of sprites, models, textures and sound effects from videoagmes. Might be a bit hard to navigate.
• Starmen.net : website with a lot of materials from Mother/Earthbound games. Includes official art, maps, assets and sound effects.
• Emocowboy's graphics : collection of blinkies, banner ads and other graphics. Lots of emo-themed graphics.
• Public domain art hoard : HUGE (1500+) assortment of public-domain artworks.
• Tenshiikisu backgrounds masterpost : huge masterpost with 500+ backgrounds. Including tiled, gradient and anime backgrounds.
• Nimravidae's hoards : good collection of stamps, blinkies and badges
• Fairycakesbakery graphics collection : collection of favicons, blinkies, stamps, icons and dividers.
• Gifcity : cardd with various graphics. Includes tiled backgrounds, blinkies, stamps, favicons and more.
• Prismatic realm : really nice assortment of web ads (focusing on anime and videogames), anime magazine covers and PNGs of figurines.
• Sozoro9 : website with free banners, buttons and tiled backgrounds. It's mostly in Japanese but easy to navigate.
• Fool Lovers : website with cute pixel graphics, tiled backgrounds and butotns. The website is exclusively in Japanese (you can browse the materials through the "menu" section in the top right).
• Queen's web graphics : big collection of tiled backgrounds, borders and assorted graphics. The website is in Japanese and really confusing to navigate.
• My own collection of graphics on Tumblr : all the posts with nice graphics I found while browsing Tumblr! Ocassionally includes resources.

Everything code

Materials to learn coding

• "The Only CSS Layout Guide You'll Ever Need" by EdRoh (youtube) : a pretty well-rounded guide on how to create a layout for a website from scratch. Goes over both flexbox and grid.
• "Learn Flexbox CSS in 8 minutes" by Slaying The Dragon (youtube) : complete guide on flexbox properties.
• w3schools HTML directory : EVERYTHING HTML.
• w3schools CSS directory : EVERYTHING CSS.
• LTW HTMl semantics cheatsheet : great reference for HTML semantics.

Code snippets

• Adilene multiple song music player : really nice music player that allows you to add multiple songs! It can be find in the "Resources" section under "My Codes". I used it in my homepage.
• w3schools how to filter elements : code to create filterable elements. I used it in numerous pages of the website.

Accessibility resources

• Accessible Net Directory : great place to start to make your website more accessible. Provides a lt of information and resources.
• Venngage accessible color palette generator : generates palettes with high-readability colors that go well with a color inserted by the user.
• "The right tag for the job: why you should use semantic HTML" by localghost : this article describes the importance of semantics when writing HTML code and offers some resources at the end. I've been trying to pay attentioin to HTML semantics since reading this article.

Other lists of resources

• Doqmeat's links : really comprehensive list of resouces of any kind. Including fonts, hosting services, graphics, articles on the independet web, webrings and various tutorials.
• Sadgirl.online webmaster links : very famous directory of resources to make websites. Has resources for pretty much anything, and a nice filtering system.
• 32-bit Cafe resource list : extremly comprehensive list of resources for the independent web. Including graphcs, snippets of code, resources to learn coding and accessibility resources.
• 443b94 graphics links : list of sites with graphics.
• Swirl's resources : list of websites with graphics, various online tools and resources to learn coding.
• Killychan's resources : list including numerous resources for 3D models and 3D textures.
• Ichigo directory : list of websites featuring cute and pixel graphics.