Some handy links for basic website development

As a mentor for the Code Institute I find myself referring people to these sites over and over, especially when they start their journey and their first milestone is producing a basic website using just HTML and CSS. Here they are and hopefully you can find something of use in there too.

For free Images and Videos that don’t infringe copyright

It’s important to remmeber that when using images on Websites we have to make sure we aren’t infringing copyright law. I knew someone years ago who had an online shop and one of their images was registered with a big multinational image repository firm (yes that one :) ). Their business was barely ticking over and one day they got a communication from some solictor and gave the notion that due to using one of their images they were going to be sued for all the money that site had earned, it was their arguement that the guy’s firm had only made money due to their small image on his site. So make sure you your images are sourced responsibly! Here’s some places that free images can be found:

Unsplash - do a search and after the premium images you’l find free ones, here’s their license deatils. Here’s a free image of a Shiba Inu I found by Photo by Jaycee Xie on there:

Now in a very similar vein you can the same for videos:

Coverr - again do a search and after the premium videos you’ll find free ones.

Colour Palette Generator

One thing that is very handy, especially if you’re like me and not a natural designer is a colour palette creator. One of my favourite sites for such purposes is:

Coolors - this makes the whole process of getting a palette so simple. You just hit the start the generator! button and away you go. Really explore and play around with this, you can lock in colours you like and change shades of individual colours while remaining in the ‘values’ to keep teh palette looking in balance. You get left with the colours and their corresponding hex or rgb vlaues. Like so:

Markdown

For markdown there are plenty of cheat sheets out there and I wrote one too which can be found here.

Try to use rem not px in your CSS

This blog post from engage explains why you ought to use rem and not pixels in your css, though suffice to say if you want your site to scale well and for accessibilty use rem.

Multi Device Website Mockup Generator

You’ve built your wonderful site and now you want to show someone how is looks across many different devices - use this site here called techsini.

Neat eh?