Posts Tagged CSS

Normalizing CSS Styles

Before you even start contemplating the code for your new design, it’s good practice to normalize all elements in your first lines within the CSS file. 

“Normalizing” – means you are overriding all browser styles; which will appear if you do not provide code for styling.

Due to the fact that your final design should show well with a variety of browsers, you should also know that different browsers have different style defaults. By normalizing your CSS code, you are actually setting all these styles under your control (to some degree).

Here’s a list of normalizing your elements:

/*Margin and Padding */
body, div, dl, dt, ol, ul, li, h1, h2, h3, h4, h5, h6, p, blocquote
{margin: 0; padding: 0}

/* Font Size */
h1, h2, h3, h4, h5, h6, p
{font-size: 100%}

/* Normalize Lists */
ul, ol
{list-style: none}

/* Font Style and Font Weight */
p, h1, h2, h3, h4, h5, h6, strong, address, caption
{font-style: normal; font-weight: normal}

/* Remove borders or spacing from tables */
table
{ border-collapse: collapse; border-spacing: 0}

/* Remove borders from images */
img
{ border: 0}

Take in consideration all these style elements before you actually start your coding in CSS and you should have a clean slate when testing in different browsers. Good luck!

, , , , ,

No Comments

Design by Satori – Web Redesign – Part 2

This is part 2 of this series. You can view Part 1 here.

I decided to split the main screen in 2 sections, after the “slideshow” on the billboard. One section will cover copy about myself, talents, skills, etc. and the right sidebar will include “Services” and “Design by Satori featured in”.

The sidebar will change according to whatever page I’m on and display information with links for easy navigation. For example, if on “Portfolio” page, the sidebar will include:

  • Web Portfolio – with copy and my best samples
  • Before & After Design Portfolio – section with jobs I took over and redesigned sites for clients
  • Logo & Branding Portfolio – samples of my work along with copy of logo and branding
  • Brochures Portfolio
  • Print Portfolio
  • Graphics Portfolio

For the “Portfolio” page I am currently using thumbnails but after reading some more on Smashing Magazine, I reached the conclusion that thumbnails should be eliminated and large pictures of the design work should be displayed without leaving people guess what every thumbnail would be.

An explanation of each project will be a nice add-on (and that will give me some more tags and keywords that would please the All Mighty Google). Of course “Calls to Action” with “Contact” information would be present next to each project, allowing the web viewer to immediately take action once convinced the work is up to his/her standards.

In conclusion – the below shows where the change will occur:

Read the rest of this entry »

, , , , , ,

No Comments

Design by Satori – Web Redesign – Part 1

It’s been almost a year since my last redesign of “Design by Satori” and it’s time for another one. By the way -I highly recommend redesigning your site once per year or at least updating chuncks of text in your web copy at least 4 times per year. This will maintain Google rankings not to mention the nice surprise you will give your web viewers – showing that you care about your site and the way you present it to them.

I have decided to share with you the pain of redesigning a website, especially if you are like me (looking at tons of websites for inspiration, trying something, don’t like it and start all over again).

Well the present site was a bit too dark. Here’s a shot of it here:

In fact, here are all my versions since I decided to redesign the site every year (sometimes twice):

Read the rest of this entry »

, , , , , , , , ,

1 Comment

Web Design – The Right Way

Designing a web site in less than 30 minutes?

Designing a web site in less than 30 minutes?

Every time when you conduct an internet search for web design and/or development you get hit by an avalanche of software packages, web experts, design companies and freelancers. All hard at work, trying to impress you with their portfolios, creativity and willingness to go the extra mile to build that perfect website for you.

That is all fine; after all – I belong to one of these groups. What is disturbing for a designer like me is the existence of so called web design packages that claim to be able to build a website in 30 minutes or less. But truly disturbing is the actual existence of a professional company that would consider buying one of these packages and claim they have an effective web presence.  Read the rest of this entry »

, , , ,

No Comments