Browsed by
Tag: Web development

Creating a WordPress Theme from Scratch: Dynamic CSS3

Creating a WordPress Theme from Scratch: Dynamic CSS3

CSS3 and HTML (5) comes along with a great tool to give your pages a different look depending on different features of the client.

Differently sized pages can have different CSS styles without having to do anything fancy. In fact most modern browsers on a desktop (Firefox, Chrome, Safari) all cause a re-evaluation of the screen size when it is changed. This means the user always get a nice looking site without any unnecessary scrolling regardless of device or screen size:

<link rel=”stylesheet” href=”small-style.css” type=”text/css” media=”screen and (max-width:480px)”>
<link rel=”stylesheet” href=”style.css” type=”text/css” media=”screen and (min-width: 481px) and (max-width: 1024px)”>
<link rel=”stylesheet” href=”large-style.css” type=”text/css” media=”screen and (min-width: 1025px)”>

Suddenly we have three different CSS files that can feed the page: resize divs, change the font size or even hide entire sections.

Some websites take you off to a completely different subdomain of their site (e.g. m.mywebsite.com).

This means that you have to maintain a completely separate subdomain. Analytically I don’t see any benefit really – you still get the stats from your Google Analytics of user agents and hence how many people are accessing the site on their mobile.

In terms of adverts, there will be no different as to which system is used really.

So assuming that you want to show the same content to your users regardless of their device, this responsive method is definitely more useful.

Alternatively you can use just one CSS file and include:

@media screen and (max-width: 480px) {
/* SMALL SCREENS */
.menu{
display:none;
}

.mobile-menu{
display:inline;
}
}

/* NORMAL SCREENS */
.menu-title{
display:inline;
font-size:24px;
}

.mobile-menu{
display:none;
}

@media screen and (min-width: 1025px) {
/* LARGE SCREENS */
.menu-title {
display: inline;
font-size:32px;
}

.mobile-menu{
display:none;
}
}

This is just the surface of how the dynamic web pages work and there are some great frameworks out there that you should investigate to help you with your design: e.g. normalizemodernizr

Softwire

Softwire

I have now been working at Softwire for over a month and I have really been enjoying it. Based in Kentish Town there are roughly 60 employees at a company that has been going for almost 11 years now. They develop bespoke software for literally any kind of company – whether it be mobile applications, databases, websites or online reservation systems. So if you need any work please do get in touch at robert.desmond [at} softwire.com!

I joined the tail end of a project for a company whereby we are re-developing their software for a cross-platform solution using Java. My work was to develop some dialog boxes for this application that tied in with the rest of the project and the work completed by my two colleagues. This has allowed me to get to grips with IntelliJ and SVN repositories too.

The company we are working for has a product that is a bank of camera sensors that track LEDs which light up at specific times when told to by the hardware (gait (walking pattern) analysis) that can be attached to a human body. The fact that the system knows which one flashes at which time means that occlusion does not confuse the system as to which marker went where. (A bit like the DiamondTouch table and tracking which user touched where as opposed to general finger touches that could be anyones) The data can then be used by this application that I have been working on to be analysed for medical research and diagnosis, as well as professional sports analysis. They are the world leader in this sort of stuff and its really great to work on quite a fun project (even if I am just working on dialog boxes!).

Having completed this task (although the client hasn’t signed off on it), I have moved on to an internal project for automating the company’s appraisal process that occurs annually. This is using MVC with .NET C# web development which is new for me, however I am quite quickly getting into it and working out how the project (which has been developed a lot before me) works and how I am to progress.