Fake Images Please?

Updated: in Resources

When you are designing a new website you normally go through a few steps until you have the finished design.

First you will get the requirements for the design from the client, this will lead you to create a wireframe to show the client so you can make sure that it is what they hoped for.

With a wireframe you will get the basic layout of the website but won't really get the look and feel of site for this you need to start the prototyping stage. This is where you will create the site in HTML including dummy text and dummy images.

The easy thing is to include dummy text as you can use lorem ipsum. But it takes more time to create these images and make sure they are the right size for your design. Then if you want to change the sizes of these images you have to go back to your image editor and change the sizes, save the file and add these images back to your prototype page.

Fake images please

The solution is using a placeholder service like fake images please. This service allows you to create fake images at the create sizes using their API, which means you can quickly add these placeholders to your design but just typing in the image URL.

Just like the examples below.

Create An Image 300x300

The simplest form of creating an image is to pass in 1 parameter for the size of the image, this will create an image 300 x 300.

<img src="http://fakeimg.pl/300/"/>

Continue reading »

Remove Default WordPress Image Sizes

Updated: in Wordpress

When you upload an image to WordPress by default it will be converted to three different sizes.

  • Thumbnail
  • Medium Size
  • Large Size

If you don't want your users to use any of these images sizes on your theme then you might want to stop the user from using these different sizes.

You can remove these from being used by using the WordPress action intermediate_image_sizes_advanced and unset the thumbnail, medium and large sizes, this will mean the only size they have left is the full image size.
Continue reading »

Block Pinterest Users From Pinning Your Images

Updated: in HTML5

Pinterest-Logo

Pinterest is the newest big thing in the Social media world, this site is an image sharing social network. It allows it's users to pin any image on any website to share with their followers.

There has been a lot of talk about the copyright problems with Pinterest, for example photographers can now have their images shared all over the internet. This can be great for marketing your image but what if there are some images that you don't want to be shared on Pinterest.
Continue reading »

Set Expire Headers In htaccess

Updated: in htaccess

A way that Browsers try to help speed up rendering the page is by taking static data and cache it. These are things like images, CSS and JavaScript files. As Browsers are going to cache these bits of data you can actually set an expiry so the Browser will know not to cache these anymore.

The Browser will keep serving these until the date you set.
Continue reading »

CSS Buttons With Icons But No Images

Updated: in CSS

Demo

Since reading the article Just some other awesome CSS3 buttons I become interested about how you can use this effect to get icons on buttons without using any images.

As a web developer I don't really get on with images and if I can avoid using them I will, so when I saw this trick about displaying icons in a button without using any images I wanted to explorer what other icons you can use just by using CSS.

I discovered that there are loads and loads of icons that can be used in your CSS by using Hexadecimal entities.

There are lots of places I found to get the codes for these icons here is a list of places I used to get the most useful icons for this example.

Continue reading »

25 Quick SEO Tips Every Website Should Follow

Updated: in Articles

seo
SEO (Search Engine Optimization) is not a quick process or a guaranteed process and if anyone else tells you anything else they are lying.

No Search Engine Optimization expert can guarantee you number position in Google for your most competitive keywords, but there are things you can do to help your website get to the top of the search engine results.

I'm not saying follow all these tips and you will be top but they can certainly help. Most of these Search Engine Optimization tips are known as on-page Search Engine Optimization (SEO), which means these are things you can change on your existing website. These will be title tags, descriptions, header tags, content and links.
Continue reading »

Using a Gif and CSS on Large Images

Updated: in CSS

What?

Using CSS you can put an image as the background image of any images on your web site. Sounds confusing but a image is just a normal HTML DOM element, which means you can add the same CSS attributes to it such as borders and backgrounds.

If you have a website which has large images to load on the page the user will need to wait for them to load leaving a blank space on the screen.
Continue reading »