My Web Design Notes

Designing New Website For Portfolio - Part 2

2011-02-06T21:58:00.000-08:00

My new website has left the Photoshop phase, and is now a working layout. I 've become good at z-indexing for layering my graphics. One of the my other challenges is making the load time faster without loosing the quality of my graphics either.

http://www.dmtportal.net/dmtportal-new/index2.htm

Check List

Header graphic hot spot - Done
Change 2 small left content graphics
Add text content
Change color and headings of slider menu
Add slider content
Form - fonts size/bold fix z-index - Done
Footer text
Add pages
Cross browser test
Submit
Update layout of blog

Designing New Website For Portfolio

2011-01-11T21:33:00.001-08:00

My current portfolio website was my first time using a tableless css layout. The site is 3 years old, and it's time for a total make over. I've learned a lot since then from always challenging myself. I need to take it to the next level with each new website. The old site was http://www.dmtportal.net/. The new site will be www.david-toth.com.

This is the photoshop mock-up.

Final Checklist for Ar-Jay's Upholstery

2010-09-08T23:19:00.000-07:00

Validate XHTML - Done
Validate CSS - Done
Convert to PHP with includes files - Done
Design photo gallery -
Design contact forum and test - Done
Map - Done
Create pages - About, Services, Work, Contact - Done
Blog - Done
Site map - Done
Submit - Done

Site Update

http://www.arjaysupholstery.com/

Arjay's Upholstery Working Layout

2010-08-19T00:43:00.000-07:00

After a few learning curves, I've completed the first working web layout. I still have some more styling to do, but I'm happy with the results so far. I've been experimenting with optimized graphic, and combining style sheets for faster load time. I'm going on a short 4 day vacation, so I will not be working on the site during that time. It will give me a fresh perspective when I come back.

1st working layout:

Updated php version as of 9-10-10

Old link inactive

I Challenge Myself - ArJay's Upholstery Website

2010-07-21T09:38:00.000-07:00

With every new web project I like to challenge myself with something new. ArJay's website has a lot of png graphic overlays and textures. The footer area will be the most fun. I will become good at positioning and z-indexing. Also, with the amount of graphics, I will have to speed up the load time with some good image optimization.

ArJay's Website PSD Layout For Final Approval

2010-06-22T23:46:00.000-07:00

Here is the final photoshop mock-up. Next, I need to go over with customer for final approval. Also, need to go over detials before slicing the image. Need stock pictures of upholstery work of airplanes, boats, and late model cars before creating service pages. Here is the layout.

AR-Jays Website Coming Together - 2nd Revsion

2010-05-25T08:21:00.000-07:00

This project was put on hold while waiting for stock photos from customer. It gave me time to work on and finish some other web projects. I also became good at fixing Malware issues. A couple of week ago, GoDaddy server was hacked, and one of my php sites was attacked. I had to go through all my files, and clean them out 3 times. At first, I thought it was an RSS problem, but later discovered it was coming form the server. Afterwards, I apologized to the creater of SimplePie. It was a little stressful. It would pop-up a fake virus scan, and would try to trick you into taking action.

Here is the latest Ar-Jays Photoshop Mock-up.

New Web Design Project - AR Jays Upholstery

2010-03-11T21:23:00.000-08:00

I just began my latest web design for AR Jay's Upholstery located in San Diego, California. Its actualy a re-design of an exsisting website. The website will have an upholstery shop look and feel. I'll be using large background graphics, and PNG graphics to give it realistic depth. The new website will include a Wordpress blog. Let the fun begin.

Quick Mock Up

Beginning PSD Design

Project Six is launched

2009-10-19T23:23:00.000-07:00

I launched my newest website last week. I have a few tweeks here and there. The website is about my 1966 Ford Mustang and related media.

Project Six

Project Six Blog

Next, I have to finish my friend's website. Featuring his 1977 Ford Pinto Drag Car

Quick Draw Racing

Final Checklist For Project Six

2009-09-17T08:15:00.000-07:00

1 Index - mouseover for blog and contact graphics - DONE

2 Media - content and text for magazine pages

- MF - Done

3 Inline Six - Done

4 Gallery pages - finish and upload menu graphics - DONE

5 Restoration - DONE

6 Exterior - text - DONE

7 Engine - Done

8 Models text - DONE

9 Prototype - Gallery/Text - Done

10 Email - encrypt

11 Validate - Done

12 Google Analytic code - waiting for site to be uploaded to new server - Done

13. Site map and submission - Done

Project Six Website - 1966 Ford Mustang

2009-08-13T11:22:00.000-07:00

I just uploaded my first rough draft of my Project Six Website. With in the first 60 seconds, I saw some changes and additions that needed to be made. The website shows off my 1966 Ford Mustang with a 200 six cylinder. Showing it off is part of the enjoyment of having it.

Old website (circa 2002)-

www.project-six.com

New draft-

http://www.dmtportal.net/project-six/index.htm

Project Six Re-Design

2009-08-07T11:44:00.000-07:00

My newest web project is re-designing one of my older websites www.project-six.com. The website features my 1966 Ford Mustang. I designed it in 2002 with messy tables and scrambled code. I look forward to launching the new css website.

JBA Performance Center Launches new website

2009-07-10T11:52:00.000-07:00

JBA Performance Center Launches new website. Ken Polard from Site Creaters built the infrastructure. I'm bringing over some of the information and graphics from old website.

www.jbaracing.com

BACK IN ACTION

2009-06-27T20:48:00.000-07:00

After getting my new computer, I'm downloading CS4 Suite. Its taking forever though.

Just completed my first PHP class

2009-05-27T18:25:00.000-07:00

My first PHP class was a little hard. I will be doing alot of reviewing before my next PHP class. I'm digging the server side includes.

MySQL Database

2009-04-23T15:48:00.000-07:00

I just started to build my first database. It was somewhat difficult start, but I'm getting the hang of it.

IE6 or not IE6

2009-04-20T08:52:00.000-07:00

I'm relatively new to CSS based websites, and I want them to be semantically correct and validate. I find myself spending a lot of time figuring out how to get my websites to render correctly in ie6. I've read many articles about the pros and the cons. What makes the most sense to me is the audience for a particular website. What percentage of them using ie6 would I be turning away? If it is small enough, then I should not worry about them, and just design a clean and effective website. I can't help not worry about that one person who views my website in IE6, and says it "sucks".

First PHP Script

2009-04-19T13:42:00.000-07:00

Some of what I learn in web design is from taking a part source codes, and re-arranging it. I just learned why I could never see the php code in an html document. The only thing the Web browser sees within the PHP coding sections is any output from the PHP script. The Web server hides all of the PHP code from the client, and the php codes is not present in the source code.

Cool stuff!

WAMP Server - Version 2.0h

2009-04-16T13:37:00.000-07:00

I just downloaded the WAMP Server for my PHP class. Let the fun begin!

PHP and MySQL

2009-04-15T18:56:00.000-07:00

Today, I started my first PHP class. Now the fun begins.

Absolute Positioning

2009-04-06T23:44:00.000-07:00

So I heard at one of my css group meetings that I can position display blocks using absolute positioning. From what I understood, it is way to avoid IE 6 issues with doubling up on the margins. I tried it on the site I'm working on www.quickdrawracing.com. It works fine in Firefox, but not as well in IE6 and IE7. In IE6 only, the right column is lower than the left column. In both IE6 and IE7 the left column cuts of part of the text in the right.

I found an article on A List Apart that might help.

New CSS Project - PSD Layout

2009-03-19T18:19:00.000-07:00

I'm designing the Photoshop layout for a css website. The website is for my friend's 1977 Ford Pinto Drag Car.

The PSD Layout:
http://www.quickdrawracing.com/layout.htm

The current website layout:
http://www.quickdrawracing.com/

My next web design adventure - PHP programming

2009-03-14T22:16:00.000-07:00

I'm taking it to the next level. Next month I'm starting my next online class. I want to learn how to create an interactive Web site,
thru PHP programming language. Time to learn new ideas. Create new problems, and learn how to solve them.

New CSS Project

2009-03-09T22:45:00.000-07:00

I'm re-designing an html website to a tableless css website. Here is the old layout. (www.quickdrawracing.com) This is how I used to design websites with heavy graphics and tables. They always seem to work out fine, but I never knew how well they held up in different browsers. I should be done with the css layout in a week.

Website is valid

2009-03-03T15:37:00.000-08:00

I just uploaded my web pages. They're all html and css compliant. I have to adjust the footer a little. The text is a little jumpy from one page to the next

html validation link

css validation link

Website Validation and Cross Browser Issues

2009-03-02T23:54:00.000-08:00

I'm checking thru all my web pages, and making the html valid. I ran into some issues with the list in the content div section. The line spacing was not consistant across browsers. Also, ie6 would cause the content background image to multiply. I found a list that uses background images for the bullets. So far it holding up, and works across browsers. I will double check on my work computer tommorow.

The list can be found at www.http://css.maxdesign.com.au/listamatic/vertical05.htm

Web Design Networking

2009-03-01T12:28:00.000-08:00

When it comes to networking, I'm on the shy side. Eight months ago, I came across a great networking website called Meetup. It's a networking site for everything thing you can think of. If there is not a group to suit your interests, then just start your own. In know time, you will have a Meetup group. I currently belong to San Diego Web Designers and San Diego CSS Web 2.0 Designers. The CSS group is my favorite. The discusions always tie into what I'm currently studing. At the last meeting, there was a guest speaker who talked about SEO and CSS. I'm just finishing up an SEO class online, so I understood what was being discussed.

Advanced HTML - W3C Standards

2009-02-21T21:02:00.000-08:00

In my quest to writing HTML code that is compliant to W3C's rules, here is a link:

Advanced HTML

XHTML vs. HTML

2009-02-21T13:01:00.000-08:00

here is a link to a good post about XHTML.

Here is a quote.

Html is still a Standard and the newest version of HTML available. Some still believe that XHTML replaced HTML (something I believed 1 1/2 years ago as well) and HTML is retired. Wrong.

To see the rest of the post go to

www.killersites.com

Cross Browser compatibility with CSS and “if statements”

2009-02-10T13:09:00.001-08:00

After finishing an intermediate level CSS class, I re-designed my portfolio website in tableless CSS. I ran into issues with my drop down menus. In IE7, when I would click my drop down menu, it would cause un-wanted scroll bars to appear. This happened in a screen size of 1024 x 768. Also, the drop downs would not work in IE6. Firefox and Opera did not seem to be an issue. So I went to Killersites forum (www.killersites), and some of the members helped thru the issue.

For the IE7 issue I added in my style sheet:

#navbar li li{ float:none; }

My style rule float: left from the #navbar li style was pushing the dropdowns out to the right

-------------------------------------------------------

For the IE6 issue I added an if statement in the head section of my web page:

I then added a behavior file csshover.htc. Downloaded from
http://www.xs4all.nl/~peterned/csshover.html, and put it in the same folder/directory as the html file.

After adding adding these, my drop downs worked good. I also, learned about
. They helped me with cross browser issues. I created my main style sheet to work with Firefox and Opera, and then added the for IE6 and IE7.

My Web Design Note Pad

2009-02-07T00:40:00.000-08:00

I have been playing around with web design for about six years now, but I have much more to learn. I have taken design classes, and used online tutorials and forums. With all this knowledge available, it is easy to forget. This is the perfect place to keep my notes, and to share what I have learned with others. After all, so many other web designers have shared their knowledge with me.