Ego One - Pure | Fresh | First
Would you like to react to this message? Create an account in a few clicks or log in to continue.

We're Moving. So, we've disabled new registrations on this forum. The forum will not officially be released until 8 PM Pacific Standard Time (Friday, Sept, 9th, 2010)~ http://www.ego-one.net/

View previous topic View next topic Go down  Message [Page 1 of 1]

MrMario

MrMario
Manager
10 Short & Sweet Tips On How To Design For A Website 989a7e651. Remember you have very little time on your hands

On average page visit is about 4 secounds. That doesn't give you enough time to give the impression on the user and give him the engaged with your site. This means that you have to be as precised as possible in explaining what the site is doing. If its takes the users a while to figure out what to do or what you are trying to do you will lose a lot of users



2. Remember that user scan the web

When you walk into the room you don't see every single face there. First you only notice shapes of people and stuff that are inside. You scan the room. Then you move on to something that grabs the attention. Similar thing happens with first visit to the website. Users scan it first. This is the point where you need to guide user wherever you want him to go. It can be a login button, learn more button, conversion form, blog post...

3. Up-left corner of the web site is most visible

When we read books we always go from left to right. The early web sites and applications were designed this way. The Logo is the best place to put on the top left side. Think of putting some other options as well like a login box, search, etc...

4. Learn about F pattern
Some eye-tracking case studies proves that users scan the web in a shape of a letter F. Top area gets scanned all the way, middle area half way through and lower area gets scanned only on the left side. Just something to think about when you're having doubts on where to put content blocks in your designs.

5. Learn what users ignore

User ignore ad's and text ad's and also ignore large blocks of text. Nobody has the time (actually I would say patience!) to read great blocks of text just to get an idea of what the page is about.

6. Text vs graphics

Text grabs the user's more attention then graphics. If you want to provide your users a message use a large slogan then a nice graphic header

7. Grab attention with design elements

Good elements for grabbing attention are text slogans, call to action buttons (usually using bright colors)

If you're writing a long article one of the most important things are headings. Headings grab attention like nothing else. Use the headings properly, explain the user what the article is about in just those few simple steps.

8. Text Formatting

Text has more chance of being read when it's formatted properly. Don't be afraid to use many paragraphs, bold and italic text blocks, blockquotes, underlined or upper-case text... Anything that makes your text block more visually attractive. Of course, you need to use formatting to emphasize important words or sentences and guide your reader through the article.

9. Use clean graphics

When you use graphics in your design make sure that they're not too busy, messy and non-understandable. Many people will find it hard to look at the image that is too busy or colorful. Graphics needs to be clean and non-confusing.

What you can use to grab attention with graphics are people faces, especially when eyes on the photo are looking at the user. Also you can use eyes on the photo to “point” users to a certain direction.

10. Use whitespace

Use whitespace to give some element more visibility. If a certain element is too close to margins or other elements the things will be confusing and messy. Give it some “air to breathe”. This especially applies to text blocks.


Guest posting activated




LH Justin

Post Sat Nov 21, 2009 10:23 pm by LH Justin

Nice tips!

Jalokim

Post Sun Nov 22, 2009 2:27 am by Jalokim

a little hypocritical
especially when this whole post of yours is a giant wad of text, with no whitespace, or graphics.. hahahaha Razz

tips are correct, but maybe we need to present it better tooo

Short & Sweet, good tips Big Grin

karkooshy

Post Sun Nov 22, 2009 6:49 pm by karkooshy

I like it Smile
it was certainly a good read Big Grin

wow, xP
users scan sites in a shape of an F...
dIdn't know that before Surprised

View previous topic View next topic Back to top  Message [Page 1 of 1]

Permissions in this forum:
You cannot reply to topics in this forum




Site powered by Forumotion
Copyright 2006-2013 | JalokimGraphics | Ego-One
<!-- <script type="text/javascript"> var vglnk = { key: '0d80ae9fe71cec9484f682bd59232f9e' }; (function(d, t) { var s = d.createElement(t); s.type = 'text/javascript'; s.async = true; s.src = '//cdn.viglink.com/api/vglnk.js'; var r = d.getElementsByTagName(t)[0]; r.parentNode.insertBefore(s, r); }(document, 'script')); </script> <div id="Forumactif_Video"></div> <script type="application/javascript"> //<![CDATA[ var slmadshb = slmadshb || {}; slmadshb.que = slmadshb.que || []; slmadshb.que.push(function() { slmadshb.display("Forumactif_Video"); }); //]]> </script> <script type="text/javascript">window._taboola = window._taboola || []; _taboola.push({flush: true});</script> <!-- BEGIN 1425605 - etoxic - FR - CDB - PCK - sticky footer - 728x90--> <div id="criteo_sticky"> <script type="text/javascript"> function CreateStickyFooterContainer(e) { var t = document.getElementById(e); t.style.position = "fixed", t.style.zIndex = "2147483646", t.style.bottom = "0", t.style.left = "0", t.style.padding = "0", t.style.borderColor = "rgb(196, 196, 196)", t.style.width = "100%", t.style.backgroundColor = "rgba(245, 245, 245, 0.54902)", t.style.borderStyle = "solid", t.style.borderWidth = "1px"; var o = document.createElement("a"); t.appendChild(o), o.style.backgroundColor = "rgb(221, 221, 221)", o.style.backgroundImage = "url('//static.criteo.net/images/criteo/publishertag/close.png')", o.style.backgroundRepeat = "no-repeat", o.style.backgroundPosition = "center", o.style.display = "block", o.style.position = "absolute", o.style.left = "0", o.style.top = "-24px", o.style.width = "23px", o.style.height = "24px", o.style.borderBottomColor = "#6d6c71", o.style.cursor = "pointer", o.onclick = function() { t.style.display = "none" }; var l = document.createElement("div"); l.id = "cto_sticky", l.style.margin = "0 auto", l.style.display = "table"; t.appendChild(l); return l.id }; Criteo.events.push(function() { if(!isMobile){ Criteo.Passback.RenderAd(CreateStickyFooterContainer("criteo_sticky"), function(){ var slotid = "criteo_sticky"; var div = document.getElementById(slotid); div.removeAttribute("style"); }); } else{ var slotid = "criteo_sticky"; var div = document.getElementById(slotid); div.style.display = "none"; } }); </script> </div> <!-- END CRITEO TAG --></body></html><strong><a href="https://www.forumotion.com/" target="_blank">Free forum</a></strong>&nbsp;|&nbsp;<span class="gensmall">&copy;</span><a href="https://www.forumotion.com/phpbb" target="_blank">phpBB</a>&nbsp;|&nbsp;<a name="bottom" href="https://help.forumotion.com/" target="_blank">Free forum support</a>&nbsp;|&nbsp;<a href="/abuse?page=%2Ft613-10-short-sweet-tips-on-how-to-design-for-a-website&amp;report=1" rel="nofollow">Report an abuse</a>&nbsp;|&nbsp;<strong><a href="https://www.forumotion.com" target="_blank">Forumotion.com</a></strong>Derp