Skip to content
View in the app

A better way to browse. Learn more.

Web Designer Forum

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

Thoughts on new beta site

Featured Replies

Im am currently redoing my site and wanted a little feedback.

 

http://beta.cibgraphics.com/

 

Couple things to note

 

  1. I am in the fixing phase, so margin/padding issues I haven't gone through, so expect those (but I would be ok with you pointing them out just so I don't miss them)
  2. I still have to fix some images like extending the rule image, services graphic, and a few other things
  3. The technologies will link to a section on the services page, it's just not completed yet
  4. A lot of the headers are not final (like the "a little about me" is not staying). Suggestions on headers would be welcome.

 

Just wanted to get everyone's input even though I still have work to do one it.

You have some neatness going on here alright :)

 


  •  
  • You need to enhance typography a bit. Headings are too small and not dragging attention. I would increase their size and use a different font (with @font-face or cufon).
  • Also, it might be an idea to increase font size of the menu descriptions to 11px.
  • You could add some depth to the pagination circles or be a little more creative with them.
  • Button hover effects are too subtle. No visual indication that I am hovering the button.
  • Input fields on the contact page feel too tight.
  • I'd add a footer with various info so content would cover the full monitor size (assume a 1024 in height). This problem is present on the contact page.
  • Spacing issues, but you already know those :)

I thought it's a Wordpress theme :)

Nicely done and I liked the color combination (blue, grey) with the noise effect.

It's looks professional!

Edited by Monie

 

- You have lots of javascript for a simple site, maybe you could try and cut back on the 3rd part software such as jquery (im just not a fan)

- There is a lot of tab indenting on the page, the sites ive normally come across use space indenting.

- You've also got a browser specific CSS which is a bit of a bumber.

 

 

Let me interrupt you there for a sec.

 

Jquery, not a fan? Try to build a site nowadays without jquery and you can say goodbye to stuff like, ajax validation, twitter feeds, various web services and of course nice animations made reaaaally easy. But I guess I shouldn't be telling this to an advanced web developer since i'm stating the obvious :p

 

Browser specific CSS is completely fine and noone will question site validation if you use vendor specfic attributes. Ever tried to achieve drop shadow without using an image, or rounded corners?

 

I suggest you do a bit of research on jquery and CSS standards nowadays.

Edited by Acrylic

  • Author

You have some neatness going on here alright :)

 


  •  
  • You need to enhance typography a bit. Headings are too small and not dragging attention. I would increase their size and use a different font (with @font-face or cufon).
  • Also, it might be an idea to increase font size of the menu descriptions to 11px.
  • You could add some depth to the pagination circles or be a little more creative with them.
  • Button hover effects are too subtle. No visual indication that I am hovering the button.
  • Input fields on the contact page feel too tight.
  • I'd add a footer with various info so content would cover the full monitor size (assume a 1024 in height). This problem is present on the contact page.
  • Spacing issues, but you already know those :)

 

The headers are using Cabin, but I will try something else. My current site uses Cufon, and I didn't like it (although I typically like cufon).

I like the 10px menu descriptions and the pagination.

I will see what I can do about the button hover effects. I agree that they are too subtle

I agree on the contact page feeling tight. I will loosen it up.

I don't agree with the footer suggestion. Im not going to add content for the sake of extending the site. I will only extend it if the information is valuable to the visitor which I will take a look at (like adding the most recent post and such.

 

Thanks for the comments/suggestions

 

 

Looks absolutely amazing! You should be proud, lovely work, specially following the trend of mat textures at the moment.

 

A few thinks you might want to consider code wise:

 

- You have lots of javascript for a simple site, maybe you could try and cut back on the 3rd part software such as jquery (im just not a fan)

- There is a lot of tab indenting on the page, the sites ive normally come across use space indenting.

- You've also got a browser specific CSS which is a bit of a bumber.

 

But all in all love the design and good lick :D

 

Thanks for the comments/suggestions. I don't think that there is a lot of javascript. I will be combining a lot of them to reduce requests, but all of them have very specific purposes which I really don't want to take out. The thing I can take out is the jQueryUI. I am not using that, and that was left over from my vanilla kit I developed/used.

The CSS browser specific code is all CSS3, and I have included all vender prefixes included Opera and MS which hardly anyone does. Those who have IE8 or below would never be the wiser since the code is only progressing the site and not essencial to the layout or functionality.

The tabs vs spaces is a setting that I normally have changed. I typically have it set to spaces but have yet to do that on my home version of Textmate. It is a simple fix and one that I will do. Thanks for reminding me.

 

 

I thought it's a Wordpress theme :)

Nicely done and I liked the color combination (blue, grey) with the noise effect.

It's looks professional!

 

Thanks for you comments. Is thinking it was a Wordpress theme good or bad? :)

 

 

+1 for all of you.

Edited by cibgraphics

I like the 10px menu descriptions and the pagination.

 

The size is ok but there's something funny going on with the letter spacing - they appear a litle squashed together. Example - look at "Tutorials and ideas" under the blog menu item.

  • Author

The size is ok but there's something funny going on with the letter spacing - they appear a litle squashed together. Example - look at "Tutorials and ideas" under the blog menu item.

 

It's default letterspacing, something I can and will adjust. Thanks.

 

Edit: I have done some adjusting before I went to work on some of the suggestions. Need to find time to do the others.

Edited by cibgraphics

  • Author

Right now it's just HTML with basic php includes for rapid development. When I am done it will be converted and put into Expression Engine.

Right now it's just HTML with basic php includes for rapid development. When I am done it will be converted and put into Expression Engine.

 

Nice :)

No, I am not a fan of JQuery. I do try, and succeed in many of the things you mentioned such as AJAX validation, twitter feeds etc. (both of these I achieved this morning). You should be able to do these things without the aid of 3rd party software as it adds additional weight to load times, protocol connections, client side processing etc. and if you work with very large volumes of traffic this can greatly impacted on the servers functionality. - So it is alway important to only use script that is absolutely necessary to provide the design you are after, codes like jquery generally bring many other "helping" scripts that you dont need as the OP confirmed.

 

I agree, but how is using Jquery slower than using normal javascript. Jquery is a compact js library so how is it slower? It is basically a collection of general abstractions of common JS usages. You fire a function call to jquery and activate a code snippet from its source. The great advantage of using jquery is that - it already contains all the code snippets we use for cross browser javascript and it greatly...and I mean greatly speeds up design and development process. Not to talk about the extraordinary design that you can achieve with its effects. Think about a jquery slider and count the time how much it would take to build one with raw Js and with jquery. Plus if you think about it. Most of the times one snippet of complex JS script would add up in size to the full size of the jquery lib itself.

Jquery is fast, lightweight, cross browser compliant and Css3 compliant. I'm not sure about the "helping" scripts you are talking about. Did you refer to JqueryUi? The OP only said that he'd drop jqueryUI and I agree with that...but not jquery.

 

You should be able to write CSS that works on all major browsers without the need for browser specific CSS as this gets clunky for the same reasons above and can be simply avoided by correct coding. Yes I have tried and yes you can do it without browser specific CSS. I never said it would hinder the sites validation, it's simply cleaner to incorporate it into one CSS. :p

 

How does it get clunky? It increases load time? Your reasoning is flawed. Vendor specific extensions increases the CSS file by 1 line each...You could claim that they are not necessary but then you could also claim that css3 is not necessary because it has fewer functionalities so it loads faster.

You said you have tried it and succeeded in creating a CSS3 effect with correct coding. Please share, because you know something most of us don't. I have always wanted to know how to replace -moz-box-shadow or -webkit-gradient with something easier to get a css3 effect. Please don't say "with JS" because then you contradict yourself

Edited by Acrylic

Let me interrupt you there for a sec.

 

Jquery, not a fan? Try to build a site nowadays without jquery and you can say goodbye to stuff like, ajax validation, twitter feeds, various web services and of course nice animations made reaaaally easy. But I guess I shouldn't be telling this to an advanced web developer since i'm stating the obvious :p

 

Browser specific CSS is completely fine and noone will question site validation if you use vendor specfic attributes. Ever tried to achieve drop shadow without using an image, or rounded corners?

 

I suggest you do a bit of research on jquery and CSS standards nowadays.

 

Most things JQuery can perform, can be written by hand in a much simpler and controlled manner,

 

By which I mean JQueries are a 'combination' (for loss of better words) of scripts, this means there will be alot of unused coding, which will get downloaded increasing page load times. It isn't really worth increasing page load time for unused scripts, as well as hidden scripts, that you may not understand, and can be abused.

 

 

If a JQuery is edited and optimized for your use it's a different can of cookies. However, the OP states there is unused parts of the script,

The thing I can take out is the jQueryUI. I am not using that, and that was left over from my vanilla kit I developed/used.

 

So if a JQuery is used, then and optimised it can be justified. Else it really is just increasing servers load.

 

 

--SNIP--Not to talk about the extraordinary design that you can achieve with its effects. Think about a jquery slider and count the time how much it would take to build one with raw Js and with jquery. Plus if you think about it. Most of the times one snippet of complex JS script would add up in size to the full size of the jquery lib itself.

Jquery is fast, lightweight, cross browser compliant and Css3 compliant. I'm not sure about the "helping" scripts you are talking about. Did you refer to JqueryUi? The OP only said that he'd drop jqueryUI and I agree with that...but not jquery.

 

The 'extraordinary design' and be achieved by raw JS, and raw JS matching the library size of a JQuery (when for the same function) is very rare, no matter how complex it may be.

 

Also, you are thinking from a designer point of view here, in that it would be quicker to use a JQuery when designing, but the lack of full knowledge of whats happening in the libraries can lead to large instability in your web pages, if you read the JQuery entirely then yes you can argue it won't cause stability problems. As I said they need to be reduced/ optimized!

 

ON TOPIC TO OP

The site looks amazing! A great work to be proud of.

 

Feed back:

 

-The JQuery as has been mentioned, (see below)

-If I was being picky I would say about your code alignment, but, that's personal preference ;)

-Since this is still a beta site, I wouldn't worry too much about unused code until, entering gamma or final stages.

 

Well done!

One last remark on this and im donw with my offtopic ramble :p

 

a single twitter widget written and minimised in raw JS = 31kb

Full jquery lib minimised = 76kb

 

Point is...if you create a feature rich website, which is pretty much a standard nowadays, you'll be using more than one script.

You have some neatness going on here alright :)

 


  •  
  • You need to enhance typography a bit. Headings are too small and not dragging attention. I would increase their size and use a different font (with @font-face or cufon).
  • Also, it might be an idea to increase font size of the menu descriptions to 11px.
  • You could add some depth to the pagination circles or be a little more creative with them.
  • Button hover effects are too subtle. No visual indication that I am hovering the button.
  • Input fields on the contact page feel too tight.
  • I'd add a footer with various info so content would cover the full monitor size (assume a 1024 in height). This problem is present on the contact page.
  • Spacing issues, but you already know those :)

 

a also disagree strongly with the jquery point here.

 

If you link to the google hosted version of jquery, chances are that files in the viewers cashe already. unless they live in 2000.

hi,

 

really nice clean website, i like it!

 

My only thought is that maybe the textured noise background is overused slightly.

 

This is just a personal preference I guess but it looks as if it is applied to the whole page.

 

Maybe removing the texture from certain elements such as the footer, technology experience boxes and design process logo may help to section the content better?

 

Again just a personal preference but a nicely styled website!

Create an account or sign in to comment

Account

Navigation

Search

Search

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.