With the final build of HTML5 coming soon, its a good time to read up on the values of XHTML and HTML. They’re the base. The base of many other languages, the base of the internet world. Every interface you come across on the internet will have some sort of, or a portion of HTML/XHTML in it! Even iPhone and iPod Applications have it in.
So you can use these cheatsheets to help you!
XHTML ~ Click Here
HTML ~ Click Here
Please comment if these have helped you!
Google is having a pretty hard time getting the word out about Chrome (and let’s face it, it’s Google’s fault a bit). But ok, instead of wasting 400 words bashing Google and Chrome, let me just tell everyone about a new YouTube channel they have launched. It has videos showing off the features Chrome has, including it’s easy to use and fast.
OK, I’ll give them that, so why don’t you just check out the channel? It’s fun, it’s cool and I watched the whole thing… on Firefox.
But check it out anyway!
Google Chrome Channel: LINK
On twitter we have been told about a feature that is rumored to appear in the next firmware for the iPhone. 3.0. 2.0 saw no real UI changed apart from the huge code that was used to run apps of different UI and style.
One thing the iPhone doesn’t have is the time machine. This is probably one of the best features of a mac, and many people love the UI that it utilizes. Time machine is very 3D orientated and we have been told that this should be coming to the iPhone.
The Time Machine UI should be coming into the 3.0 release as a way of organizing applications. That is all we know, now you have to wait for the announcement about the new version of firmware. This isnt confirmed so if it isnt right, sorry.
Time Machine on a mac:
Theres currently a discussion going on that is about the process of making a website, every developer has their own method. Mine is very simple but the points below are an excellent way to make and plan a website. Many websites take alot more, thinking and people to make so the process can get switched or messed a round a lot. Please comment with your methods.
1. Do your research – What is the purpose of this site? Who is it for? etc. Become the website.
2. Write your content – Finding a decent copywriter will pay off here.
3. Work out the page structure for the website – Basically a sitemap. Knowing the content will help at this stage.
4. Code your content in semantic (X)HTML – Don’t think about the layout or styling at this point; just content!
5. Start brainstorming and sketching layout designs – Knowing the content will help immensely at this stage.
6. Modify your (X)HTML to contain any classes, ids and structural elements you may need when writing the CSS.
7. Code any behavioural JavaScript elements – It’s helpful to do this without any styling on the website at first.
8. Code any backend elements in your desired language – PHP, Ruby, etc.
9. Code your CSS and insert images – This is where you make the site look how you designed it.
10. Go back over anything that is still left – Tweaking and finishing any JavaScript that relied on styling. Finishing backend coding. Adding any structural elements you forgot about.
11. Profit!
Something that many of my readers know is that for many of my clients i have to bend over backwards to accommodate Internet Explorer 6. Its stupid but theres loads of things to make it simpler…
For example theres a nice little tools called the IEtester for windows vista and windows xp. It uses the engine for IE 5.5/6/7/8. This means it has a whole range of stages that test the acid stages. Its very interesting at the least to see the improvement over the years (even though internet explorer still sucks). Even better though Stevey, a good friend, told me about this tool, after downloading it and installing t i found that it is a very good tool in everyway. Although as detailed on the site, its still in development and there are a few bugs that do get in the way. For example the user css rendering. Thats hard to explain but you will find out if you do try it.
Its a brilliant tool and doesnt take up any time unlike browsershots. So please try it out and dont be afraid to comment about it.
http://www.my-debugbar.com/wiki/IETester/HomePage
I am currently working on a client (see listing here) the building they’re in uses IE6 so many of the users will be seeing the site on IE6. Website developers shouldnt have to put up with the site of people that cannot click the update button. I am not being stupid when i say that. I know that updating a few hundreds PC’s on a network will be hard but the point is. Your software is seven years old, YOU NEED TO UPDATE. Either way as much as i hate the shortcomings of IE6 i have to prepare for them. Annoying as it is I’m grabbing a little fun out of the whole situation. At the top of the website i have embeded this php script that quite clearly says to any IE6 user, UPDATE! Such a lovely message i think, so i suggest everyone follows suit and adds this adoring message.
The one advantage of this version of script is, it has built in jQuery to have effects and you can close the box at the top of the page.
http://www.thatgrafix.com/php_detect/
It seems for many of my projects always include a video somewhere and this time as I am working on joejoe Live i need the skill of “how to use youtube” again. Well i have remembered a few things from my last project. Many poeple want to know everyday how to make an embedded youtube video autoplay. Its so very simple really, in the past i have seen complicated macros to do it when all along its only one simple tag!
Grab your embed video code:
<object width=”425″ height=”344″><param name=”movie” value=”http://www.youtube.com/v/m0ZayLAysjg&hl=en&fs=1″></param><param name=”allowFullScreen” value=”true”></param><param name=”allowscriptaccess” value=”always”></param><embed src=”http://www.youtube.com/v/m0ZayLAysjg&hl=en&fs=1″ type=”application/x-shockwave-flash” allowscriptaccess=”always” allowfullscreen=”true” width=”425″ height=”344″></embed></object>
And simply add this to the end of “http://www.youtube.com/v/m0ZayLAysjg&hl=en&fs=1″ :
&autoplay=1
As simple as that!
please excuse my very bad tastein music but for about 10 seconds it brought back some fun memories of being a child. 
Making your website pay for itsself is a whole task of its self, granted you could get qualified professionals to do the work but then again if you want complete control over the design,content and working you will do it yourself. This also means choosing an advertising circle to use. There are thousands of advertising companies out there and today Pure Elite has chosen to pick on one, adbrite. This is an experiment of how the system works and the payout ect… The experiment will work over a series of a few days to weeks (depending on adbrite). We have no agreement with adbrite so we shouldn’t be getting any special treatment, lets get going…
- I’m registering here: http://www.adbrite.com/ as a “Publisher” – thats a website owner
- Completing the registration is easy as pie…
- Activated the e-mail they sent to my inbox, it was instant
- From the sign up you can go straight ahead and design your first advertisement. i haven’t so i went straight to my dashboard.
Thats my current dashboard, now lets make an advertisment, Click on the link at the top that says “manage Ad zones” or on your dashboard “Create a new zone“.
You will be brought to a page where you will have to choose what type of advertisment you would like to display. I wont go into explaining the types of adverts as they are displayed and explained ont he site, although i do not recommended using the hovering text links, they are if anything…annoying.
Next you will have to choose the size of you advert. This is fairly crucial as you do not want your sebsite littered with adverts. A prime example of over advertising is www.askvg.com, Vishal Gupta has used many different networks to advertise (this is against many of the networks agreemenets) and he has blocked his content in with adverts. If his site contained any real outgoing “design” it would look messy and up tidy, more so than it does now. Sorry to pick on him, oops. Choose adverts that will fit into your design very well, when designing your site you should have thought about the size and positioning of adverts. To find out standard sizes of adverts, Click Here.
After you have chosen your advert types place make sure you choose your advert safety spec: I recommend using the family safe setting. This will avoid adverts saying “call ******* to speak to many singls in your area”, many people find those adverts very offensive.
Continue to add information about the ad zone and its purpose and the description of the site that its on. This will help advertisiers know what your site is about if they choose they want to advertise with you. THen at the bottom of this page please select the genres of adverts you could like to display and continue…
ta~da you’re done, now all you need to do is too copy the code and post it on your website. Click Here to start with adbrite, clicking the link here will refer you to them from us, it keeps this site alive.
We will review adbite when we get our first check in a month when we’ve earnt $10, so for now you can just look at our advert to the side of this post.
While developing my current website for my business i needed to come up with a replacement for the <li> tag and after thinking about it i cam up with two ways of doing it. I shall qucikly share them with you.
1. CSS
The first thing you could do if you still really wanted/needed to use a tag would be to add a new css element.
TAG {
display: list-item;
list-style-type: disc;
}
of course change “TAG” to what you could like your tag to be like, “list” and use it as <lis></lis>
2.HTML
The other and proberlly more simple way for you non CSS users out there(I know you exist) you can use the following code to generate a bullet point.
•
I hope that helped guys, its only small but like me it could make not having to remake your navigation.
This is something every website developer should have uploaded on their servers, i have:
Many of my clients have wanted image gallery’s and this is a nice little effect that brings more attention towards the image being shown, You can download it here:
How to use this:
- Download and extract the contents
- Add the following lines to your “HEAD” section of your HTML page, change to be appropriate.
<script type="text/javascript" src="js/prototype.js"></script> <script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script> <script type="text/javascript" src="js/lightbox.js"></script><link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />
- When you have added the image add rel=”lightbox” into your img code, like this:
<img src=”IMAGEURL” alt=”" rel=”lightbox” />
Whey hey, there it is… Working 
[Please check the lightbox website for more info] Here
I hope to post your more effects to help you enhance your web UI.