Tag Archives: CSS

adding CSS, Javascript and images in Code Igniter

Last week I started learning Code Igniter. This has come about because I have been working with a great team building websites over the last year or so in Expression Engine, a CMS built on Code Igniter. There are a lot of things that frustrate me about Expression Engine and I am sure that knowing a bit about how the Code Igniter framework operates will help me in resolving some of those pesky EE issues.

After losing half a day trying to mess around with routes.php because I couldn’t seem to pull in my CSS files I discovered a reference to placing these directories in the root. Now I thought this would be the application root; everything under one roof. It turns out that when guides reference root in Code Igniter they are in fact talking about the root of the site. I think this is a bit sloppy. It means that I now have an uploads folder, images, css and js folders in the same places as system and application. I’d much prefer to have them in application and perhaps there is a way of doing that but I haven’t found it yet.

I’m going to be putting up videos on how I am getting along and the settings in Code Igniter on my new vimeo account. The first of these videos is here http://vimeo.com/57220196

Code Academy – HTML & CSS lessons OOD

Last week Code Academy announced the launch of their new series of lessons for people wanting to get to grips with HTML and CSS. The free service has been up for quite some time now and I have played through the javascript course whilst trying to find recommended free resources for some of my colleagues.

I have gone through the first 6 sections of HTML and have been somewhat disappointed on the coding standards being imposed.

I appreciate that HTML5 is still not official but there have been enough books written now and enough sites out in the wild to say certain things we are all agreed on. For example, that we can declare <html> as simply as that. There are some areas which are optional. Where I stopped was in the final part of Section 5 where you declare images. They have said that you MUST close the tag with a /. But this isn’t true because HTML5 doesn’t care if there is a closing tag or not it is more forgiving and ultimately easier and quicker to write. Continue reading →

Unique CSS classes – why not use id?

Recently, I saw a question from @mtrlar which asked why you shouldn’t put a style directly onto a page if it is a class that only appears on a single page?

The prescribed best practice for css & html is to never use inline styles keeping all your style declarations css files. My understanding of this was always that it allowed for global changes from a single file reducing the risk and cost of missing something in a raft of pages. In the case where the class .jumboText appears on a dozen or more pages you can change it once in a single css file rather than multiple times on many files. This principle works providing the class is used multiple times, even if it is multiple times on a single page.

Many people would conclude that if the style only appears once it is unique, if it is unique then you should use id instead of class, this could be wrong. There is a bubbling trend amongst css and html developers for using classes only for styling elements.

In a recent seminar by @adactio, talking about using html5. Jeremy Keith mentioned using the id attribute of an element for javascript Hooks and little else. I am not sure whether I subscribe to this theory just yet, but I can indeed see the benefits.

Over the last few years javascript has come back in a very big way, primarily this has been due to the development of all encompassing frameworks suck as Mootools and jQuery. jQuery has certainly changed the world of javascript and made it more accessible to people who are starting out with javascript authoring, I think I understand more about the basic syntax of javascript now from working with jQuery.

Where am I going with this post? well nowhere in truth, just a few slightly related things that popped into my bubble last week that I wanted to write about. Always put css into a css file rather than on a page, the fact that javascript will write inline styles to an element if you try to manipulate it doesn’t really matter, it’s a surface change which expires the minute you leave the page or manipulate something else.

UI – Designing Experiences

User Experience

Heading down the rabbit hole into the cold waters of user experience development.

For the next month I will be researching and analysing web apps to further explore the fundamentals, principles and the art of UI Design and creating powerful UX based applications.

I have just read the first part of Better User Experience with Storytelling by Francisco Inchauste for Smashing Magazine which has provided a very strong introduction into the principles of story telling and how these can be applied to branding, and generating an interactive experience.

Other blogs which have caught my attention today have been UI-Patterns.com which has provided some great advice on using wizards and goal indicators effectively in applications and the psychological impact that this can have on a user.

Konigi in itself is a wonderful example of beautiful interface design, and regularly updates with examples across the web of both site design and application design. The real winner for me is that they tag each submission with specifics such as use of Header and Footer, or menu controls.