I am currently working on a new website for the Allied Arts Foundation. The site is built on a WordPress platform and is my first HTML 5 site.
While this site is still a work in progress, you can check out the test site here: http://www.alliedarts.koolkattest.com/
With mobile becoming more and more important, many web designers and developers are creating websites specifically for this platform. However, many sites designed for the computer web browser display reasonable well on smart phones. As a user of an Android-based phone, one thing that always annoys me is that phone numbers on the sites are not clickable. Of course, if you code something like:
<a href="tel:+15551112222">555 111 2222</a>you will get an error if you try to open the link in a computer web browser.
So, should we all at least use some “light detection” capabilities such as Lightweight Device Detection in PHP? I am beginning to think this may become more and more important.
I have been busy trying out CSS3 with a recently launched website .
Felipa'a Home Page - Safari
Felipa'a Home Page - IE
So, I wanted to showcase some useful css techniques that I used with this site.
First, you will probably have to click the image to enlarge it to see the detail. Notice, that on the Safari page you get a rounded button and the text has a small shadow. This is accomplished with CSS:
background:white;
text-decoration:none;
padding:8px 15px;
color:#46b5d0;
margin-top:10px;
margin-right:10px;
float:right;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
font-size:1.2em;
-webkit-transition:color 2s ease-out;
-moz-transition:border color 2s ease-out;
-o-transition:border color 2s ease-out;
transition:bordercolor 2s ease-out;
text-shadow: 1px 1px 0 rgba(127, 127, 127, .5);
The border-radius creates the rounded button and the text-shadow property gives that beveled look to the text. While we must still rely on browser-specific properties to accomplish this, the code includes the standard properties which hopefully will soon be implemented by all of the major browsers.
Just finished helping out with some last minute CSS for Outbound Life. Site promotes outdoor activities along with a social networking to enable members to connect with other outdoor enthusiasts.
Launching a new site Seattle WordPress Themes
I have now had the opportunity to work on 2 years worth of conference websites for the Rotary District 5030. The first site is complete and the conference will be held in Portland this week. This was the first registration site that I ever worked on and it was a learning experience. One of the issues that came up was that people were not always sure of the registration process. This lead to having steps indicated on next year’s site. People seems to find this really helps and it was a simple addition to the process.
I have spent the past 2 weeks working on various projects requiring the use of PayPal for checkouts. On vinacafeusa, their premium coffee mix is now available online. Findacounselor.net allows new members to pay the joining fee with PayPal and finally, I started working on the Rotary District 5030 conference registration for 2011!
Data2insight helps organizations put 4 key strategies to work: Visualization, Measurement, Research and Planning.
The website is built on a WordPress platform for easy content management and includes a blog.
I attend an online preview for the Adobe CS5 launch. I am most interested in checking out the improved methods for extracting images from a background, the ability to create Flash that will run many mobile devices including iPhones and iPads. And finally the ability to preview content managed websites in Dreamweaver. It looked like the demo was actually using WordPress which is currently my preferred content management system.
I attended the work shop put on by Event Apart Seattle to update my skills in this area.
I am particularly interested in using the video and audio tags for my mobile websites.
As for CSS3, I am already using the border radius feature – although I am relying on jQuery for that as it will handle trident base browsers (IE). I also tried using text shadow to a nice effect on a website I am developing. And added RGBA with a transition to my website for content links.