Web coding
This section of our web site deals with the technical end of things.
Snippets of and links to xhtml, css and php code are what you’ll find here.
This section of our web site deals with the technical end of things.
Snippets of and links to xhtml, css and php code are what you’ll find here.
So finally here is the promised follow-up to my first benchmak (Wordpress vs. Textpattern – a quick performance benchmark) which will compare Wordpress, Textpattern, Serendipity and Lightpress, the last one (currently) only being a frontend for Wordpress.
I don’t normally point to sites using lots of dohickys. But this site is immaculate. It really impresses me.
It uses a CD/CD Cover as the UI(User Interface) to great effect.
On loading it does play music. So have your speakers at an appropriate volume.
Nice list of fonts common to PC and Mac.
Here you can find a list with the standard set of fonts common to all versions of Windows and their Mac substitutes, referred sometimes as “browser safe fonts”. This is the reference I use when making web pages and I expect you will find it useful too (knowing what fonts can you use in a web page is essential for a web designer).
This cheat sheet for CSS has actually answered a question I had yesterday that I spent some time looking for, and still didn’t find.
The CSS cheat sheet is designed to act as a reminder and reference sheet, listing all selectors (as of CSS 2.1) and properties. It includes a visual example of the box model, unit reference for CSS units and the various media types CSS makes allowance for.
I wanted to know what the CSS snippet achieved:
ol > li {
property: value;
}
Now, thanks to Mr Daniels, I know.
It applies the style rules to <li> with <ol> as parent.
This sheet is now printed and on the wall.
I make almost all navigation bars (vertical and horizontal) as unordered lists (<ul>). If you wanting an easy to understand tutorial on how to do this, visit the CSS Resource, List Navigation Tutorial.
Tagged with: XHTML, CSS, ul, navigation, lists.
This article is the first of a series on typography. I’ve found some really interesting points that will make their way into the next web site I do.
The Measure is the name given to the width of a body of type. There are several units of measurement used for defining the Measure’s width. The three basic units are:Mark Boulton | Information design | Journal | Five simple steps to better typography
Tagged with: Typography, web, design.
Beyond the link is a very cool effect done entirely in XHTML and CSS. It really shows that with some out of the box thinking, almost anything is possible.
Of course you need a modern browser (hint: MS Internet Explorer isn’t one).
Go take a look at http://biocandy.dk/test.html.
Joh Hicks has updated the box model diagram, added CC license.
Since I posted the original 3D CSS Box Model diagram, I’ve had a lot of requests from people who want to re-use and/or adapt it. I always intended that it be free for the taking if someone found it useful, but people seem to like the security of a legal document. So its now released under a Creative Commons license to do with as you wish, and has been moved to a more permanent location at http://www.hicksdesign.co.uk/3dboxmodel.3D Box Model is now Creative Commons : journal : // hicksdesign
This diagram makes it much easier to understand what’s going on when designing web pages with CSS.
This Textpattern plugin replaces the previous one.
I’ve updated the code, and changed the name.
First the name change, I found that in testing it, it was painful to type it frequently. So I’ve shortened the name to make it less painful.
The code changes: when previewing the body of an article which made use of ben_tag the tag word wouldn’t appear. Now it does.
Usage:
<txp:ttag>tagword</txp:ttag><txp:ttag url="http://example.com/">tagword</txp:ttag>Tagged with Textpattern and Technorati.
A nice list of CSS hacks to hide CSS code from various browsers can be found at Café Phespirit – CSS Hacks.
This is useful stuff. It allows you to code a web site to appear the way it should in modern and current browsers, and then either code it so that it degrades nicely in older browsers, or code it so that the CSS styling is ignored totally, giving a very bland but readable site.