How to build a website PT5

COOL FEATURES FOR YOUR SITEBy Kyle Gibson – Technical Director, Underground DesignSo you finally have a website up and running, congrats! I am going to talk to you this month about how to genuinely drive visitors back with some awesome features that every website needs. If you have been following my other tutorials on building a website, hopefully you are using WordPress by now. The features I will be discussing in this issue are all achievable by the click of a button on Wordpress.Content! Content! Did I mention content?The internet was created in the first place as an information source. If the content on your site does not provide the information promised, it won’t be of much value to your visitors. You can have the most boring and simplistic website design and still drive up the traffic if you provide organised and efficient information. There is no excuse in this day and age not to use up to date and relevant content. One of the websites I have worked with is iphonewzealand.co.nz, which has hundreds of thousands of hits per week! Why? Simply because of their content. They are a small group of professionals who have brought together amazing, relevant articles and the site is updated daily, which encourages loyalty among their visitors.I can picture all of the designers out there telling me otherwise right now, but from my years of experience I can tell you that content really is the key. If you are using WordPress, there are a number of plugins and default settings that enable you to manage content. You can even specify when your articles are published, allowing you to spend just one day managing a whole week’s worth of content. Not only can you do future posts but you can also use an inbuilt feature called ‘Press This’. This tool enables you to save a bookmark in your browser, so when you come across something relevant, push ‘Press This’ and presto, you now have that article complete with images saved in your WordPress blog. Format your website for mobile devicesI believe this is one of the biggest annoyances on the web today, ever since mobile platforms gave us the ability to browse on the go. Generally if you look at a website on an iPhone or Android device, you are looking for either contact information or event details. You know what I’m talking about – when you get a website that is designed for a 23” monitor on a 3” screen after it has taken five minutes to load. Every website is mainly built using CSS (style sheets), which means that designing for a mobile device is as simple as creating a new style depending on the device. If you wanted to, you could have a different website for every browser. I won’t go into too much detail but if you Google ‘cross browser CSS’ you will start to make sense of what I am saying.If your website is heavy on graphics or uses multimedia or programming functionality, it will not perform well on mobile devices. Remember, not all mobile users are using the latest high-speed data networks. Also, mobile-device processors aren’t as robust as the one in your home or office PC.Creating a mobile version of your website is not as difficult as it sounds. Displaying the content of a modern CSS-coded website in a mobile setting can usually be accomplished by creating an alternate stripped-down version of the CSS style and then using automated code to direct mobile users to that version.If you are using WordPress, they have ready-made mobile templates that take the hassle out of the process. Once it is installed you can make minor tweaks if necessary, but in my experience it works straight out of the box. Don’t worry if you are not using WordPress – there are lots of free hosted solutions that will turn your website into a mobile version as well.JavaScript and jQueryIf you head to jQuery.com, you will see all of the amazing things that have been created for you to make your website look awesome. jQuery is a complex library that allows you to do anything you wish with your website, whether you want to stream audio or make multifaceted photo galleries.One of the most simple but effective jQuery plugins is Lightbox. You may or may not have heard of it, but I can guarantee you that you’ve seen it (Facebook uses it a lot). Lightbox enables your user to click on an image and have it pop up without reloading the browser. There are many variations of Lightbox (for example, Thickbox), which let you decide which one is best suited to your site. Lightbox is not just for images, you can put full HTML code in its place, so instead of sending visitors to another page to contact you, a pop up with a contact form will appear.The possibilities are endless with jQuery, so do some Google searching and you will be amazed at what you can do!Short CodesShort codes are a great way for you to quickly add interactive content to your website. A short code looks like this: [YOUTUBE] URL [/YOUTUBE], all the hard work is already done for you and formatted correctly. This is especially beneficial if you are updating content on a regular basis. WordPress uses short codes in most plugins, whether it is adding YouTube, Sound Cloud or any other media from other sites. Simple sign-in/registrationIf you are dealing with sign-ins, keep things as simple as possible! Anything more than a name and email address is too much. Most people joining your site today probably already have a Facebook and/or Google account. What we can do with this information is outstanding. There is now a button on Wordpress that allows your users to register with their Facebook or Google accounts, rather than having to create yet another new login. There are a number of different plugins that offer Facebook integration, allowing you to merge information.So get out there, post some exciting content, allow mobile users to access your website and keep it simple. If you do this work now, proactively, you’ll have a leg up on this growing trend.