About the site
Summary
This site is mostly about web standards, XHTML, CSS and my photographies. The site is also my little playground to try new things out. The site should be both usable and accessible, nice to look at and have great content, hopefully
Web standard
This site tries to be as web standard compliant as possible. Markup, style and functionality is separated for easier maintenance. By using webstandards with separated design and markup some browser will not get any design at all. That is 4.x browser of Netscape, IE and Opera. All content will still be visible for those browser. For full support, please see below for web browser that do support web standards.
- Separation of presentation and structure: implied as ideal: a best practice.
- Semantic markup: implied: a best practice.
- Content delivery via media types: explicit, a "standard."
- Well-formed markup: explicit, a "standard."
- Conformance: explicit, a "standard."
What is web standards? The site is mainly for people working with web and design so I mainly develop with this in mind. The site looks best in a browser that is web standard compliant. That means, Firefox, Konqueror, Apple Safari and Opera. The site still works for Internet Explorer and older browser, but it might not always look top notch. The site is also optimized for a screen resolution of 1024X 768 and higher because of the user base I have (2.7% have 800X600 or less).
Cookies
By Swedish law any site who uses cookies needs to have a cookie policy. This site uses cookies to store the information you add when comenting an article. That is name, email address and URL to your site. The information is only saved locally on your computer.
Copyright
This site is using the Creative Commons license for both site design, articles and photographs. You are free:
- To copy, distribute, display, and perform the work
- To make derivative works
Under the following conditions:
| Icon | Information |
|---|---|
![]() |
Attribution. You must give the original author credit. |
![]() |
Noncommercial. You may not use this work for commercial purposes. |
![]() |
Share Alike. If you alter, transform, or build upon this work, you may distribute the resulting work only under a license identical to this one. |
- For any reuse or distribution, you must make clear to others the license terms of this work.
- Any of these conditions can be waived if you get permission from the copyright holder.
Your fair use and other rights are in no way affected by the above. The Creative Commons license in a human readable format or the full license.
Typography
The typography is an important part of web design. I like to use strong and big headings as you can see. I am right now trying out an Arial as headings.. The font used primary for text is Verdana for Windows and Macintosh. The column fit around 70-80 characters which I like, not too many or too less. Some font statistics. The text also has a larger line-height than normal. Code examples makes use of an old classic, Courier New. All fonts are set to variable font size so the you can change the size of the font.
The whole site works fine if printing, the site uses an own print style file for nice layout when printing. The fonts used works better for off line and all things not related to the articles are removed.
XML Feeds
The site makes use of XML feeds in a few different formats. There are different clients that make can use these feeds. Some browser (Firefox and Safari) also have support for them. This site have XML feeds in three formats, RSS 2.0, RSS 0.92 and Atom 0.3. What is XML feeds?
Usability
Usability is quite a large area with no really truths. I still always have this in mind when I am designing and developing this site. As this is private site I have no resources for usability testing. I can only trust my professional knowledge. Because of this I use large headings for easy scanning and really strong colors on links to see them all clearly. I try to have as little information on pages as possible and not more than 20 links per page. All links within my site are normal links, no javascript pseudo links are used. Links to other site a opened in a new window, this should be marked out with an icon after the link.
Accessibility
This site have been tested in a non graphical browser. I have not used a screen reader to listen to the site as I cannot find one for free. If you have any problem, please let me know what can be changed. The site makes use of access keys for to most common areas and tasks. These are based on the standard set by Funka.nu and the Swedish 24hr project. I have only removed the keys to pages that I do not have on the site. To make use of Access keys on Explorer press Alt + the key, then Enter, on other browsers just Alt + the key. On Macintosh use Control + the key. This is the sites access keys.
- S - Go to content
- 0 - About the website, accessibility information
- 1 - Start page
- 4 - Search
- 8 - Hight contrast layout / Normal layot
Images
All content images have alt texts that describes the image. Decorative images that are used as "Smiling ladies" have the alt text set to nothing.
Acronyms and abbreviations
The site make use of acronyms and abbreviations. This shown with a dotted underline, If you hover the the word you will get a explanation of the word. This is done automatically in my publishing system.
Links
The links try to explain what they link to. The link should be able to read out of context and still be understandable.
Forms
The form is using labels and works fine in non graphical browsers.
Search
All pages include a search at the top of the page, both visual and code wise.
Semantic
The site makes use of HTML the way it should, headings are headings and tables are used for tabular data etc. This to help non graphical browsers and search engines to grasp the content in a better way.
The nerd stuff for nerds
The site uses WordPress as the publishing system, PHP for scripting and MySQL as database. The web server is Apache. I can recommend great webhosting at Site5. This site uses XHTML Transitional 1.0 as Document type. The pages are served as HTML/text and not XHTML/xml. All HTML and CSS should be validated. All design is separated and moved to style file (CSS) All functionality is moved to a external function file (javascript)



