Font Awesome
I recently purchased a Responsive Menu which uses some simply amazing font icons in the css menu. Not all of the icons the web designer has used suited my website so I had to investigate how the icons were created and I discovered Font Awesome.
The icons are free to use and can be used with Twitter Bootstrap or your own website development, visit the website to learn more - Font Awesome.
Example:
Ambulance or make it bigger!
Responsive Web Design
What is Responsive Web Design? To keep the answer simple responsive design is where a website / blog is designed to show the web page in a range of devices from large 22 inch monitors down to a mobile phone, or the other way round, it is design from mobile up to desktop. The idea is that your content should be accessible and easily read on a number of screen sizes without having separate mobile specific site or content.
If you use Blogger and Wordpress then you will find some of the latest templates are Responsive. The easiest way to see if you are using a responsive web designed is to resize your browser, if the content changes to fit your changing web page size then you are looking at a web page that has been designed to be Responsive, it responds to the size of your browser screen and device you are using.
Many web developments have abandoned support for older mobile phone devices and create a single page that can be viewed and read from 320px wide screens up to a large desktop monitor.
Recommended Reading
Responsive Web Design by Ethan Marcotte - I bought my copy from A Book Apart website and paid $9 (about £6) for the electronic version as the printed version on Amazon is in French (at the present time) so get it direct and download it and save some dosh.
If you read French then please go ahead and buy the printed paperback copy of the book from Amazon UK
What I enjoyed about this book is that it explains why we should use Responsive Web Design as well as a straightforward way of how to do it.
I am amazed at the range of knowledge available as well as free website design tools and scripts. I use the 1140 Grid by Andy Taylor as the basis of my websites, OK I do add bits and pieces of my own CSS coding and hopefully do not break the responsive CSS layout. I did try and figure out how to do this myself and ended up being frustrated at my lack of knowledge. There are other Responsive web templates available and I have tried a number of them. Unfortunately they are either too complex for me to get my head around or they do not preview correctly in Dreamweaver 6 which I use to create my websites. I need to visual confirmation of what I am trying to design and Dreamweaver does this for me. I use about 3% of the power of Dreamweaver so if you are a web designer or someone wanting to learn how to design websites then Dreamweaver is software I can recommend having used it for 8 years or so.
Suggested Reading
Responsive Web Design with HTML5 and CSS3 By Ben Frain.
Learn how to design websites according to the new “responsive design” methodology, allowing a website to display beautifully on every screen size. Follow along, building and enhancing a responsive web design with HTML5 and CSS3. The book provides a practical understanding of these new technologies and techniques that are set to be the future of front-end web development.
Responsive Slides
I am sure you have been impressed with range of ways to display pictures on the web, media gallery software can be downloaded for free that allows you to create photographic and other media gallery where your visitors can vote for and add comments. I use Coppermine to add photographs, it is database driven so you do need web hosting that provides MySQL databases.
Another way to display pictures is to use a slides and you can spend a few pennies to several £ on buying slide software for a website. I have spent money buying licences for slide show software only for it to be abandoned as I did not really like the software or because the software supplier wanted ongoing payment for "updated software". While I have no problem paying for software and scripts I am happy with it does get kind of irksome when the software is just not as good as one expected and then they want you to pay for fixing it.
So what is available for free in the Responsive Slide market, and yes I want a slide show or gallery to resize to suit my visitors web browsing size. Well the appropriately named ResponsiveSlides.js can be downloaded for free and was developed by web developer Viljami Salminen. Not only is this script / plugin free, it also works wonderfully well.
Pet Pigs
Buddy our pet Kune Kune Pig
Tibby Watching the Pigs
Our pet pig Buddy
Our Chickens
Chickens
Our Collie, Charlie on Dunnet Beach
Collies on Dunnet Beach
Dunnet Beach
Tibby at Dunnet, Caithness
Tibby is a retired sheepdog
Tibby
My pal Tibby
Tibby on the beach
Responsive Menus
If you have a responsive web design then you need to consider how your menu system is going to work with the different sizes of screen that it will have to work under. A nice wide top menu that has lots of items in it as well as drop-downs may work well on a medium to large computer screen, but what happens when you look at the same page on your Samsung or iPhone, or on your tablet in portrait mode. Yes it can be a problem. The solution many developers have chosen is to collapse the menu into a single button when the width of the screen is smaller than the full menu can show properly, the visitor on a small screen device can then click on the menu button for the menu to appear and be selected or scrolled past.
I have come across and purchased a Responsive Menu through CodeCanyon and it costs as little as $3 (£1.50). I am still learning how to use this gem of a CSS / html5 based menu system and while I like the design of the Responsive Menu I have found that it does not suit some browsers, so back to the drawing board. It is however worth trying out to see if it suits your needs.
Bats
Just sometimes we get a bat flying in the kitchen door of our house from the nearby bat roost. We just need to be gentle and careful when handling them (with gloves and a towel) to put it back outside where it belongs - catching midgies and other insects. Bats are fascinating to watch and when working on my computer I can see them flying around in the garden at dusk during the summer months.