As a long time graphic designer and having worked in the advertising and related marketing industries since I was 16, tackling web page design was a natural step. I’ve designed many web pages, some winning honor and recognition. As the first nature photographer with a regular column on a webzine, I’ve had my hands in quite a few “webs”.
Taking Your Camera on the Road has had a long history. It began as one of the first personal websites on the World Wide Web in 1994 as Compuserve started offering websites to users. Having been on the Internet in one form or another for many years, it was only natural to expand into this new “Internet billboard” venue.
Soon I was designing sites for others and heading up projects for websites for several non-profit organizations. In 1996, I gave up the majority of that work to hit the road full-time with my husband, creating what would eventually become one of the earliest “weblogs” which we called “Journal Thoughts”. Stories of our adventures on the road were put out by email and on our website. Soon the list of email recipients became to large and in 2001 we began posting them solely on our website.
Our domain name changed from
vanfossenpro.com to a better title of
cameraontheroad.com took place in 2004 after much too long of a debate and research.
In 2003, after two years of movement in that direction, we officially converted our site to be even more accessible through the use of CSS stylesheets. NO MORE TABLES. That’s right. We took the leap and now all of our layout is table-free, except where tables are appropriate such as providing a chart of numerical or text information, like a spreadsheet. As much work as it was to convert the entire site, it is now easier than ever to make formating changes to the pages, and they load even faster than before.
In 2004, with such a vast amount of resources in web pages, images, and content to manage, we switched the entire static HTML site over to WordPress, a very popular weblog tool that we’ve manipulated into a Content Management System (CMS). It is now MUCH easier to maintain our site and add content even faster.
In making these changes, we’ve also received validation and website awards from a variety of sources that prove our pages are designed with accessibility in mind (for disabled and physically challenged folks) and pass inspection with the HTML inspectors out there. We’ve also passed the PIC Platform for Internet Content Selection) validation which ranks documents for content, such as age-sensitive material. We’ve been validated and rated as totally safe for parents to allow their children to view our pages. YEAH!
Validation for web page design is serious stuff. It is an honor to get the high score that tells the world that we’ve accomplished something in return for all those long hours of problem-solving, overcoming technical and mental challenges, and the sore eyes, back, and butt that comes with the physical investment of time and energy to create accessible and viable web pages. Here are some of our “awards”.
Management of all this is made much easier through the use of WordPress.
The average number of unique visitors to our site averages about 22,000 a month. We get an average of 500,000 hits a month, though many of those are from search bots.
While the majority of our visitors are from the United States or using English based operating systems and software, over 20% of our visitors are from non-English speaking countries. People visiting our site are mostly equally divided between those seeking information about photography and web page design.
Web Design Directory
We write a lot about web page design and development, mostly sharing our own experiences and expertise. For information on the various topics we write about concerning web design and the Internet, check out these categories:
- Web Pages Design, Development and CSS
- CSS Tips and Tricks
- Web Page Design Techniques and Information
- Website Development Techniques and Information
- Computer Tips and Tricks
- Internet Tips and Tricks
For information specific to our web page design:
- HTML Instruction
- Cascading Style Sheets
- Web Graphics
- Java Scripts
- Web Design for Accessibility
- Design Elements
- Graphic Programs
- Other Internet and Web Resources
- Special Thanks
- Our Web Page Design Credits
- The Software We Use
- Website Awards
Hyper Text Markup Language (HTML) is the code behind the visual presentation of a web page. Created in the 1980s, this “universal language” talks to Internet Browser software giving instructions on how the page should look. In 2004, we moved up to the “modern” HTML to XHTML. Here are some links to help you better understand how HMTL works:
- Tucows Shareware and Web Design
- CNET Help.com
- Chami Tips
- Learn the Net (in English, Spanish, French, and more)
- Sucky-to-Savvy Web Page Design
- Bare Bones Guide to HTML
- Create Meta Tags for Search Engine Success
Cascading Style Sheets
A well designed web page consists of two “pages”. The structural page called “HTML” and the presentation style called “CSS” (Cascading Style Sheets). While the html pages hold the content of the page, the CSS holds the coding controls the size, style, and color of fonts, design elements on boxes and other graphic elements, and the page’s design overall. Here are some sites to help create CSS for your website:
- CSS Zen Garden – incredible exploration of web page control through CSS*****
- The World Wide Web Consortium
- Builder’s list of CSS style elements and definitions
- WebMonkey’s CSS Tutorial
- Builder.com: Beyond the code
- To Hell with Bad Browsers – a look at the benefits of CSS designs cross platforms
- Digital Web’s Web Page Reconstruction with CSS
- website Tips’s Design and Layout with CSS
- Inknoise Layout-matic (CSS layout forms)
- The HTML Writers Guild CSS Frequently Asked Questions
- List of properties and values supported by CSS-1
- IMS Web Tips: Good design and CSS information
- WDVL’s Toss Out Your Tables
- How to build a website without tables
- Introduction to CSS Layout
- Quirksmode – CSS detailed info
- WebReference.com’s CSS Links | Reprints |
- The WebDeveloper’s Virtual Library’s CSS Area
- HTMLHelmp.com’s CSS Pages
- Imagemap Tutorial (NCSA)
- JPEG Image Compression FAQ
- Imagemap Help Page
- Build a Rotating Gallery With Cold Fusion
- Cool Archive
- Icons, Bars, Buttons, Free
- Icon Bazaar
- Clickable Thumbnail Code Maker
- Dynamic Drive
- Code House
- Freeware Java
- 24fun.com Java Scripts
Web Design for Accessibility
If you are designing a web page or work with web page designers, please insist on making web pages accessible for everyone. Simple steps include labeling all graphic images in a way that describes them instead of using a vague caption, and putting a “title” tag in every link which describes the link, and making sure that all of the tag definitions, the text that defines a tag such as font size=”+2″ go into quote marks, whether needed or not. This helps text readers define what is readable and what is not. Incorporating these easy changes allows screen reading software to describe what is on the screen and to not just read the coding as “link here http://www.something.long. and/undescribe/able”. More than 25% of internet and web users are physically and visually challenged, and the number is growing as software becomes more available and reasonably priced. If one in four of your customers had specific needs, wouldn’t you want to meet them?
You can learn about our accessibility policy on our Accessibility Policy.
- The World Wide Web Consortium’s Accessibility Recommendations
- Research-based Web Design and Usability Guidelines by the National Cancer Institute
- HTML Writers Guild’s AWARE Center (Accessible Web Authoring Resources and Education)
- The National Center for Accessible Media
Web Design Elements
It’s the details that make a page interesting. Here are some sites dealing with a few of those design details:
The magic of web pages comes from the graphics and here are a few of the programs we enjoy using to create our pages:
Our Web Page Design Credits
In college, my professor in Advertising told me that there was no such thing as a new idea, just new ways of using old ideas. After 25 years in the business, I have to agree with them. We all get our inspiration from somewhere and here here are some of the resources for the inspiration that created these pages:
- WordPress: We’ve turned this weblog software into a Content Management System (CMS) and we love it. It is easy to use and very powerful, allowing us to do so MUCH more with our website.
- WordPress Plugins: We use a lot of WordPress Plugins on our site and are externally grateful to the volunteers who create these wonderful extensions to WordPress.
- BladePro: a great plug-in for PaintShop Pro that creates instant wonderful graphic effects on text or anything else.
- Paint Shop Pro by Jasc: PhotoShop is good but we keep using Paint Shop Pro. Check out their unique BROWSE feature for thumbnail preview images.
- WordPerfect: If you are into power writing or publishing, nothing can beat WordPerfect.
Help and resources for business, life, and writing
- Writers Forum on Compuserve
- Writer’s Digest
- Up With People
- American Business Women’s Association
- Consumer.net: Protects privacy issues for consumers (junk mail protection)
Everyone works at their own pace and with their own beat. These artists helped Lorelle find her own rhythmn as she wrote.
Software We Use
- HotDogPro – Web Development Software
- All writing done with Corel’s WordPerfect, still the best powerhouse word processing program
- Photography and Graphic Art: PaintShopPro
- Animated Graphics Design and Construciton: AnimationShop
- Windows Program Uninstall and Cleaner: CLEANSWEEP
Favorite Games for the down-time on the road
We all need some time wasters to get through our life on the computer and on the road. Here are a few of ours.