Jump to content


Photo

[SOLVED] moon dance


  • This topic is locked This topic is locked
47 replies to this topic

#21 448191

448191
  • Staff Alumni
  • Advanced Member
  • 3,545 posts
  • LocationNetherlands

Posted 15 August 2006 - 10:36 PM

Content

Texts
This is what bothered me the most:

“I find explaining a fractal difficult at best.”


What is this, a blog? A high school essay on ‘fractals’?

No, it’s a company website. It’s hard for people to believe you KNOW something you can’t explain properly.

“They are the beauty of design that is never ending and maybe that is all that is necessary. However. Let me get a bit more technical.

A fractal is a mathematical formula rendered in the computer to form a design with colour. The computer makes….”


The intent of above section is good: give a simple explanation that anyone can relate to and understand, then go into detail to show that you know what you’re talking about. The intend is good, this is how it should be done. The execution is not as good though.

First off, don’t use single word sentences if you’re writing a serious text. Secondly and more importantly, better divide the information by purpose.

Example:

“Fractals are the beauty of design. They are artwork that is generated by a computer from input of the artist…. Etc etc…”


Then the technical shit (and maybe go in a little deeper):

“The computer makes thousands of computations….. Fractals are characterized by their repetitious pattern…… Etc etc…”


Other content
With ‘other content’ I mean a variety of things. For one, you could ditch the ‘validity’ icons, since NOT A SOUL ALIVE SEARCHING FOR ART GIVES A RAT’S ***.

The banner. It’s terrible. It’s a poor excuse for an image.

This is an artists’ website for crying out loud! Have her create an image!
Idea; have her incorporate the name of the ‘company’ into the design. She could, for example, use an image of a morning moon, and add a siluet of someone dancing on it.

Copyscape logo. Don’t do it.

I can understand you put a lot of work into creating this site, and will put in even more, so you don’t want someone to come in and steal it.

But trust me, you don’t have anything worth stealing on that site. You can use copyscape if you insist, JUST DON’T SHOW IT. It doesn’t serve any other purpose then make your site look like the work of a amateur. It’s almost as annoying as ‘no right click’ scripts.


#22 448191

448191
  • Staff Alumni
  • Advanced Member
  • 3,545 posts
  • LocationNetherlands

Posted 15 August 2006 - 10:39 PM

Usabilty

Readablity
Usability is all about making it as easy as possible for the user (or visitor, name as you will) to use the functions a site has to offer them. One of which is getting information.

Texts need more ‘grouping’ (or ‘paragraphing’ if you will). For example:

“You can also view my work on ebay under the ID of "bromley2". Please…”

Before I actually read it, I have no idea what’s it about. I’d almost think “Wicked Stones” is the paragraph heading. That, by the way should NOT be there. I reckon Vikki is probably a close friend of Carolyn, and she wants her link on the front page, but this is wrong. The link is perceived as content, not an external link. Don’t confuse your visitors. But her logo at the bottom, next to the EBSQ logo, where it belongs. People tend to pay more attention to logo’s than links anyway. Just like ‘reading’ the playboy.

“Browse the galleries within Moon Dance

                                                          Design and you will find”


That doesn’t read very easily now does it? Who are you trying to torture?

Use nested images wisely. Look at the ‘Testimonials’ part on the front page. That part looks good. Align images right. Only use left aligning when the image is fairly small.

Why? It’s simple: people read from left to right. It’s a pain to have move your sight by a hundred chars to the left suddenly.

Padding. Padding’s primary function is to make for easier reading. Use it for anything you want read. That includes the ‘more info’ box!

I said I’d come back to you on scrolling. Scrolling is not necessarily bad, as long as it’s used wisely.

First let me introduce you to the concept of ‘content-breaking’.

Content-breaking, in essence, is the improper dividing of content.

On every website you have content. This content can be logically divided into groups, subgroups and many smaller groups. The art is to divide these groups, without ‘breaking’ their relationship. Look at it like an XML tree. If I take one child node and attach it to a different parent, chances are the application parsing the file will interpret it differently. Same goes for content. Except your visitors are the applications, your content groups are the nodes, and your navigation and layout is the tree!


When to require scrolling:
When you absolutely need the extra space to fit content that is grouped, and dividing the group up is not an option (not logical). In other words, when a 'undividable' group of content needs more space. Many sites divide the group, especially when dealing with text, over several numbered pages. This should be considered ‘breaking’. Scrolling is much more convenient to the user. Alternatively one could use chapter headings as navigation, if the content is dividable in chapters.

When NOT to require scrolling:
When rearranging, resizing or anything else can prevent it. When the content can be logically divided, and still (or even more so) be easy to find.

Shopping
I mentioned earlier the concept of breaking. This applies very much to your gallery. The galleries should be grouped and divided, not broken and dumped into the ‘root’ of your navigation (your menu).

Ok, so scrolling is not an option, too many thumbs for that.

What you need to do is properly divide the artworks into categories and facilitate clear navigation.

For example:

Categories: Flowers, Fractals and Others.
One link to gallery in menu.
Clear category pages, with prominently placed links to other categories.

It’s as easy as that!

Again, I’m going to point out you should use a local shopping cart. People want to know what’s in there, or at very least the total amount. Having to click a link, interrupting the shopping provides a very poor shopping experience.

Edit: removed some inconsistancies...

#23 448191

448191
  • Staff Alumni
  • Advanced Member
  • 3,545 posts
  • LocationNetherlands

Posted 15 August 2006 - 10:45 PM

Summary

It has potential (it has a valid purpose and some great looking art to support it), but needs serious work.

I could write more here of course, but it's way past my bed time... It's 1:00 over here.

I might even critique some more when I have the time...  ;D

#24 moberemk

moberemk
  • Members
  • PipPipPip
  • Advanced Member
  • 695 posts

Posted 16 August 2006 - 12:13 AM

...
That is a long, long critique.
Disclaimer: No matter how harsh I may be, I'm always IMO only.

#25 Ninjakreborn

Ninjakreborn
  • Members
  • PipPipPip
  • Information Technology Specialist
  • 3,922 posts
  • Age:33

Posted 16 August 2006 - 04:16 AM

That is the best, and most helpful critique I have ever seen or recieved.  It'll take me a few months(in my spare time) to do all of this but I will follow virtually everything you said, I wish you would always critique every site I laid out here like that, you could be a professional critiquer with that kind of professionalism, thanks.  I will do 99% of this when I redo the site again.

------

Business Website: http://www.infotechnologist.biz

Personal Website: http://www.joyelpuryear.com

Blog Site: http://www.realmofwriting.com
Services: Web development, application development, mobile development, and custom development. All services listed on my website.


#26 448191

448191
  • Staff Alumni
  • Advanced Member
  • 3,545 posts
  • LocationNetherlands

Posted 16 August 2006 - 06:11 AM

Well, you get what you ask for.  :P

I make it a point to deliver what I promise.  ;D

It's been a good excersize for me, putting into words some of the things I've learned. I wouldn't publish a text like this though (although the difference between 'posting' and 'publishing' is rather trivial). It needs a lot of proofreading and better grouping. But as you can understand I won't bother with that.  ;)

Glad to be of service, more so because like I said, it's been benificial to myself also.

#27 448191

448191
  • Staff Alumni
  • Advanced Member
  • 3,545 posts
  • LocationNetherlands

Posted 16 August 2006 - 09:19 PM

What have you done?  ::)

Compressing images doesn't mean using smaller dimensions!  ???

#28 Ninjakreborn

Ninjakreborn
  • Members
  • PipPipPip
  • Information Technology Specialist
  • 3,922 posts
  • Age:33

Posted 17 August 2006 - 06:16 PM

I didn't those are the same dimensions.  I optimized it, I haven't compressed it yet, I just optimized them so it loads faster, until I have time to go over the site again later on down the road.

------

Business Website: http://www.infotechnologist.biz

Personal Website: http://www.joyelpuryear.com

Blog Site: http://www.realmofwriting.com
Services: Web development, application development, mobile development, and custom development. All services listed on my website.


#29 448191

448191
  • Staff Alumni
  • Advanced Member
  • 3,545 posts
  • LocationNetherlands

Posted 17 August 2006 - 07:59 PM

C'mon, that just isn't true.

The original Golden Lily had the same dimensions as the optimized image I posted. Now look at this version:

Posted Image

BTW, the images still load slow. I'm asking myself what exactly you mean by 'optimizing'. Preloading certainly isn't optimizing, it doesn't reduce latency one bit.

Plus, I shouldn't even have to download them again because I downloaded the same files last time I visited your site. This is why client/proxy caching is so important!

#30 Ninjakreborn

Ninjakreborn
  • Members
  • PipPipPip
  • Information Technology Specialist
  • 3,922 posts
  • Age:33

Posted 18 August 2006 - 10:26 PM

I optimized, in fireworks, it's called optimize.

------

Business Website: http://www.infotechnologist.biz

Personal Website: http://www.joyelpuryear.com

Blog Site: http://www.realmofwriting.com
Services: Web development, application development, mobile development, and custom development. All services listed on my website.


#31 AndyB

AndyB
  • Staff Alumni
  • Advanced Member
  • 5,465 posts
  • LocationToronto

Posted 19 August 2006 - 12:20 AM

If that's "optimized" with Fireworks 'optimize' then it isn't doing any compression as far as I can tell.  The image illustrates - on the left an 18kb Fireworks 'optimised' version; on the right the same image compressed with Photoshop.

Posted Image


Legend has it that reading the manual never killed anyone.
My site

#32 Ninjakreborn

Ninjakreborn
  • Members
  • PipPipPip
  • Information Technology Specialist
  • 3,922 posts
  • Age:33

Posted 19 August 2006 - 04:23 AM

oh shit, I optimized based on my thumbnail size so it changed the sizes of the pictures on the big pages how the hell am I going to fix this,

------

Business Website: http://www.infotechnologist.biz

Personal Website: http://www.joyelpuryear.com

Blog Site: http://www.realmofwriting.com
Services: Web development, application development, mobile development, and custom development. All services listed on my website.


#33 AndyB

AndyB
  • Staff Alumni
  • Advanced Member
  • 5,465 posts
  • LocationToronto

Posted 19 August 2006 - 10:58 AM

...  how the hell am I going to fix this,


Well, you can't resize the small pictures back to big ones, so it's back to square one and start again.
Legend has it that reading the manual never killed anyone.
My site

#34 448191

448191
  • Staff Alumni
  • Advanced Member
  • 3,545 posts
  • LocationNetherlands

Posted 19 August 2006 - 12:33 PM

I use fireworks (8 ), but I can't spot an 'optimize' function...

Choose "File>Image Preview".

For pictures, use jpeg. Use the lowest quality setting that produces acceptable output. Click "export".

Wait a second, found it. "Window>Optimize". Thing is, you have to choose "File>Export", not "File>Save" in order to have the changes you make have any effect. The "Image Preview" is better because you need to see what effect your changes have before you export.


#35 Ninjakreborn

Ninjakreborn
  • Members
  • PipPipPip
  • Information Technology Specialist
  • 3,922 posts
  • Age:33

Posted 24 August 2006 - 06:44 PM

I fixed the images, and resized them again, now I did some more changes, I will still work on some of that huge list later on, when I get more time for another update. All ideas would help, that big review will help a lot

------

Business Website: http://www.infotechnologist.biz

Personal Website: http://www.joyelpuryear.com

Blog Site: http://www.realmofwriting.com
Services: Web development, application development, mobile development, and custom development. All services listed on my website.


#36 Ninjakreborn

Ninjakreborn
  • Members
  • PipPipPip
  • Information Technology Specialist
  • 3,922 posts
  • Age:33

Posted 04 September 2006 - 09:53 PM

I am going through this week and next redoing most of the things on that review, I was looking for advice for the images, I know I can pre-load in javascript, that will help load times, but they load slow as hell, someone mentioned compression, I have never done that before, how do you do it, I will do that on all the images.

------

Business Website: http://www.infotechnologist.biz

Personal Website: http://www.joyelpuryear.com

Blog Site: http://www.realmofwriting.com
Services: Web development, application development, mobile development, and custom development. All services listed on my website.


#37 448191

448191
  • Staff Alumni
  • Advanced Member
  • 3,545 posts
  • LocationNetherlands

Posted 05 September 2006 - 01:48 AM

I am going through this week and next redoing most of the things on that review, I was looking for advice for the images, I know I can pre-load in javascript, that will help load times, but they load slow as hell, someone mentioned compression, I have never done that before, how do you do it, I will do that on all the images.


Have you read ANYTHING I wrote? Preloading will NOT reduce latency.

Here is where I explain how to optimize images for size using fireworks:

Choose "File>Image Preview".

For pictures, use jpeg. Use the lowest quality setting that produces acceptable output. Click "export".


Edit: "Optimizing", in this case, means getting the best compression with the least visual loss of quality.

If you have any questions at all about the advice I gave you, please, please let me know. It's not very satisfying for me if you don't understand it, I'd be happy to explain anything further.

#38 Ninjakreborn

Ninjakreborn
  • Members
  • PipPipPip
  • Information Technology Specialist
  • 3,922 posts
  • Age:33

Posted 05 September 2006 - 02:56 PM

Ok I am confused, I have never had to do compression/optimization, because I never did a graphics heavy site before.  I don't get this, I tried doing them all with photoshop "save for web" and that
1. didn't reduce any file size
2. Made just a copy of every image
3. took forever, to do all of those galleries, just 10 actually.

I tried with fireworks
1. It didn't reduce size
2. It took forever
3. It's not changing anything
I even tried finding online compression tools, how does everyone else compress there images.

------

Business Website: http://www.infotechnologist.biz

Personal Website: http://www.joyelpuryear.com

Blog Site: http://www.realmofwriting.com
Services: Web development, application development, mobile development, and custom development. All services listed on my website.


#39 wildteen88

wildteen88
  • Staff Alumni
  • Advanced Member
  • 10,482 posts
  • LocationUK, Bournemouth

Posted 05 September 2006 - 03:16 PM

Businessman to optimize an image in Fireworks is a breaze, same for photoshop.

Open an image into fireworks, then click the 2-Up buttom to the right of the Preview button. What this will do is open up two versions of the same image into two views, the left is the original image (uncompressed/optimized) the right is the what the final image will look like when it has been optimized/compressed. You'll also see the file size of the orginal and and what the final image file size will be when you have optimized it.

To optimixe the image make sure the Optimize pallete is open (press F6 or go to Window > Optimize).  Now play around with the options in the otimize pallete. Note: You can reduce the file size of an image quite bit by lowering how many colors are in the image. However if you make it too low it'll affect the images appearence. So rather than having 256 colors or more reduce it down little by little. Once you notice there is a big difference between the left and the right you know you've reduced the colors too much, so you'll want to increase it, so you cant see much difference between the two images, the thing you should notice is the file sizes are different, the right should be lower than whats on the right.

Changing the color isnt all of what optimisation is, but its one step towards optimising an image.

#40 Ninjakreborn

Ninjakreborn
  • Members
  • PipPipPip
  • Information Technology Specialist
  • 3,922 posts
  • Age:33

Posted 05 September 2006 - 03:20 PM

ah, ok thanks, I will do that on all the images then, and see how htey all turn out in the end, will this be enough to make them load fast enough, or should I put in pre-load too, or is there something else I can do, or will this be enough to make it load fast.

------

Business Website: http://www.infotechnologist.biz

Personal Website: http://www.joyelpuryear.com

Blog Site: http://www.realmofwriting.com
Services: Web development, application development, mobile development, and custom development. All services listed on my website.





0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users