Depending on what framework you are running slimbox under, you can easily allow slimbox open an image as soon as the page has loaded. Simply add the following code (based on your framework) into your pages’s <head> tags.
Mootools:
window.addEvent(“domready”, function() {
Slimbox.open(“image-to-load.jpg”, “image caption”);
});
jQuery:
jQuery(function($) {
$.slimbox(“image-to-load.jpg”, “image caption”);
});
Try our recommended websites to check what your website looks like on different browsers, such as Google Chrome, Firefox, Internet Explore (all versions) as well as Safari on the Mac.
When designing websites, we recommend to have as many different browsers installed on your computer for testing purposes.
For example, we run Windows computers running various browsers – Firefox, IE, Safari and Google Chrome. It’s much easier to test an entire website using the installed browser as opposed to the screenshot websites listed below, however there are times when you are unable to install multiple versions of browsers (for example Internet Explore 6 and Internet Explorer 8 cannot run on the same machine), so this is where the following sites do come in handy!
Browser Shots
www.browsershots.org
Supports: Linux, BSD, Windows and Mac OS Browsers.
Browsershots makes screenshots of your web design in different browsers. It is a free open-source online service created by Johann C. Rocholl. When you submit your web address, it will be added to the job queue. A number of distributed computers will open your website in their browser. Then they will make screenshots and upload them to the central server here.
Net Renderer
www.ipinfo.info/netrenderer
Supports: IE 5.5 – IE8
Designed to easily check what your desired website looks like on a range of different Internet Explorer versions.
What are some cons of the above methods?
Screenshots are great, but one of the criticisms of screenshot based testing tools is that you can’t test functionality via a flat screenshot. You can test layout with screenshots, but what about cross browser and OS functionality of your Javascript or dynamic CSS elements? For that you need to actually interact with the page.
There are several paid methods, such as crossbrowsertesting.com, but we would recommend to dust one of your old PCs and install different versions of browsers to cut the costs down!
There are a number of websites out there offering free flag icons, but after about an hour of searching, we would like to share our top 2 favourites.
Flag icons are a great way to reach out to a broader audience. If you place some small flag icons on your website, and link them to the respective Google translation, you can present your website in many different languages!
Icon Drawer’s Flag Icons
243 free flag icons representing countries and unions all over the world presented in PNG format. The flags look quite modern.
The supplied sizes : 16×16, 24×24, 32×32, 48×48.
Click here to get your copy of the flag icons
(link to designer’s website required)
FamFamFam Flag Icons
“Flags” are 247 icons — in GIF and PNG formats
If you only need your flags to be pixel icons, you’ll find these to serve your purpose.
http://www.famfamfam.com/lab/icons/flags/
(no credit or linkback required)
Vector graphics allow the designer to create artwork with no limitation on the quality within an image. Once created in design software, such as Adobe Illustrator, these vector graphics can be scaled up for billboards and beyond without distortion.
These graphics usually provide better quality over the traditional lossy image formats, such as Bitmap and JPEG. This means that if you were to view a vector and bitmap image next to each other, as you zoomed in you’ll be able to see that the bitmap image will suffer from pixelation while the vector graphic’s quality will remain intact.
Here are 7 of our favourite websites. Without registration you’ll be able to download free vector grpahics of various categories which will help you with your designs. the common formats you will find will be .eps, .ai, .ps and .pdf. We have chosen the following websites as they have a diverse range of different goodies to snatch up!
Vecteezy is an index of Free Vector Graphics available for download by some of the best artists around the world
Contains a select collection of vectors through categories such as Icon, Nature, Abstract and more. It also allows you to leave comments, tips, and hints on their vectors.
Similar to Vecteezy, on this site you’re also able to submit your own vector graphics allowing you to gain exposure and recognition. Most of the files are in EPS format and licensed under Creative Commons.
This site offers a high quality stock of vectors with categories ranging from animal to vintage. You’ll find 72 pages of creative graphics carrying over 840+ free vectors.
VectorArt.org houses a great selection of free vector graphics downloadable in several file formats including EPS, AI and PDF. You’re easily able to scan for graphics while similar to FreeVectorGraphics.net you can vote for your favourites.
Vector Valley is a vectorial gallery showcasing quality graphics and artworks in various formats such as EPS, AI, CDR, and SVG. Vector Valley also offers additional tools such as Vector Tutorials, Illustrators Profiles, and more.
Their goal is to make the vectors as easy to search as possible. You can also participate on the site by submitting any possible vectors you’ve created or links to vectors you haven’t seen stocked on the site.
You are currently browsing the archives for the web design tips category.
A Sunshine Coast web design agency based in Caloundra/Nambour, servicing the entire east coast and we currently have clients on the Sunshine Coast, Brisbane and Gold Coast
