Simple design rules for web developers

Designers. Can’t live with them, can’t live without them. More often then not, developers will have to work together with designers to create a website. Which most of the time means the designer will create a design and some HTML & CSS. Which the developer will then integrate and adapt to fit into his software to actually make the site work.

The problem however is; Developers normally didn’t go to design school and many of them have the artistic ability of your average garden rock. I’m certainly no exception to that. However, if you learn a few basic guidelines and rules, you can make the life of your designer buddy a lot happier by not screwing up his design.

So here are just a few general hints and tips to explain what is important when adding something to an existing design or when integrating it into the actual software of the site.

Aligning stuff

Stuff needs to be aligned, both horizontally and vertically. It must be aligned “visually” instead of accurately, which means that if you look at it, it should look aligned. Which could mean two pixels to the right or left of the point where two blocks were actually aligned.

however as a rule of thumb, you can pretty much align them accurately. The reason for aligning stuff is because it is visually pleasing for us to look at.

misaligned

aligned

In some few cases the designer might actually want to purposefully have a few elements be misaligned, so if your doubting, just look at his designs or simply ask him.

Whitespace

Where saying less is more. Whitespace, as the name suggests, is the empty space around objects. As with alignment, everything should have a little bit of white space and for the most part, the amount of whitespace should be the same.

Whitespace brings some calm into a design. A design will look far less crowded with ample use. Also, whitespace will often be used to emphasise certain elements within a design. This is where the amount of whitespace will differ. Headers, for instance, will often have more whitespace around them then paragraphs.

It is also always a good idea to make sure there is a lot of whitespace around important elements for your website. When there is a lot of whitespace around an element in comparison to other elements on a page, your average human will read that element first.

If you want to know a lot more about whitespace, read this article from a list apart that deals exclusively with whitespace.

Colours

Colours are not only pretty but also important. Often companies and brands will have very specific colours associated with them. Coca Cola red, UPS gold&brown, etc… Now designers could probably bore you for hours about colour theory and all that stuff. However, what’s important for us developers to know, is to never introduce new colours. A designer will have chosen a small select group of colours for use in the design.

You will have one or two base colours, and an accent colour. For instance, for the design of this site, the base colours are light grey and white. and the accent colour is blue, and perhaps black.

What this means is that if I should add some new element, it should be one of those colours. Not purple simply because I like purple. Your best bet, depending on the size of the new element, would be to use the accent colour. The use of the accent colour is to basically add some spice to design and use it to draw the attention of viewers.

When using colours, be precise. You might think, blue is blue. But if your designer used #7c95e7 in his design, then be sure to use #7c95e7 as well. You could even ask your designer to write down the used colours for you in HEX.

Ask your designer

question

Above are just a few general tips to watch for, but the best advice I can give is to simply ask your designer when in doubt or even just to verify. Because basically, It is like you created the software for the site and then some amateur takes it and start modifying it in small ways. I think most developers would at least like steer how those modifications are made, explain a bit what the thoughts were behind how it was written and such.

I have to say though, not all designers will like explaining it to you. But just remember, your not doing the above to please the designer, your doing the above to please the client, to make a better website. If that means having to bother your designer for 5 minutes, then so be it.

Please follow and like us:
error

Continue Reading →

How Long Does it Take to Become a Web Designer?

A web designer is a professional who designs, updates and maintains websites for a living. She works with the aesthetics of a website, ensuring that a webpage is easy to navigate, supports major browsers and complies with website standards. A web designer’s overall goal is to produce websites that captivate the online audience and bring repeat web traffic.

Web Designer Training

Traning

  • Web designers can take their training within the classroom or online. Training resources are available through online community forums, self-paced tutorials and textbooks. Some web designers are self-taught and take courses at their own pace, while others take more rigorous training at community colleges and four-year institutions.

Experience and Education Required

  • Web designers do not require a degree to perform their job. However, companies hiring for web designers usually require a bachelor’s degree in marketing, graphics design or computer science, while others require an associate’s degree or certificate.Web designers should be familiar with HTML (hypertext markup language), CSS (cascading style sheets), JavaScript, Flash, Fireworks, Dreamweaver and the Adobe suite. An eye for design, hands-on experience and a portfolio of work are also required. Experience can be gained through internships, volunteer services and by completing web projects in their spare time or on the job.books

Length of Training

  • The length of training for a web designer is two to four years. Individuals with a creative background find it easier to learn web design. Because web designers have to constantly keep abreast of new technology, learning never stops. During training, a web designer should assemble a portfolio displaying his skills and creativity for future employers or clients.

Pros and Cons of Being a Web Designer

  • Web designers have to put in long hours of work to make immediate changes to a website or meet a client’s deadline, which requires flexibility and patience. They must be willing to listen to the company or client’s needs and create a design they may not find appealing. On the other hand, a web designer can work from any location. Web designers who telecommute must purchase their own software, which can be expensive. The career of a web designer is rewarding, as the finished work is published for the world to see.

Salary of a Web Designer

  • According to Payscale, the 2019 median salary of a web designer with less than a year of experience is $30,000-$45,000 per year. Web designers with one to four years of experience make $32,000-$48,000 a year, and those with 10-19 years of experience make between $40,000-$80,000 a year.
Please follow and like us:
error

Continue Reading →

Responsive Web Design

Driven by the increasing use by consumers of Smartphones and Tablets, the Market for Mobile Processors is estimated to be as big as 1.9 Billion Units Annually, by 2019, says Research Company NPD In-Stat.

So what does this mean for web design? These figures do not even include the use of lap tops which has never been so prevalent, so if your website only works properly when viewed on a desk top computer, it could have a negative effect on your Company’s prospects, sales and customer satisfaction.

feedback

So how do you counter this? The answer comes from Responsive Web Design, which is a modern website design technique, which ensures that on whatever device your website is viewed upon, it will render on the page perfectly, whether it is a Smartphone, Tablet, portable Reader or even wide screen TV.

Responsive Web Design

A website that has been designed using Responsive Web Design will give you the confidence that you are not missing out on any user base that is out there. Quite simply some consumers do not use desk top computers, some may only use them, and as a marketeer you need to feel confident that whatever section of users would be interested in your product or service, it is easy for them to use your website on the device of their preference.

There is another very important consideration. Emerging research suggests that more and more people actually buy products and services using portable devices. So again, if your Shopping Cart System only works properly on desk top, this is another potential barrier to sales and growth.

One great advantage of having your website produced using Responsive Web Design is that it may negate you from having to have a dedicated App built for iPhone, Android, Windows 10 or other Smartphone platforms, thus saving considerable expenditure.

app-interface

Responsive Web Design is something all businesses with a web presence need to take very seriously indeed, if they are to remain competitive and switched on

Please follow and like us:
error

Continue Reading →

The Importance Of Professional Web Design

The internet is one of the most powerful mediums that companies can use in order to advertise and market their company and the products and service which they offer to consumers. With that in mind you must go out of your way to ensure that your website truly stands out from your competition. This is only possible if the general design of your website is professional and unique. You must go out of your way to ensure that the web design of your website immediately hooks visitors in and encourages them to continue checking it out. If you fail to focus on the design of your website then you could be losing a good number of potential customers. This will ultimately result in a loss of revenue for your company.

css-photo

When it comes to web design you have to main options. The first option that many companies consider is creating their website in-house. Even if your company doesn’t have a trained web designer you may be contemplating purchasing some web interface software that can be used to create a website for your company. You may also be considering using a free online resource that provides users with free to use website templates. The majority of companies that consider this option are those companies that are simply working on a limited budget and don’t believe that they can afford to hire a professional web designer to complete this task for them.

The second option that you have is to hire a professional web developer to design and build your website from scratch or to take your preexisting website and to update it in order to increase its performance. This is by and far the most sound option that you can consider making use of.

professional web develope

Once your website is launched you will need to ensure that internet users are able to find it. This is done through a process known as search engine optimization. This is where the coding of your website is manipulated in a manner that makes it easy for “robots” from search engines like Google to read the content on your website and to determine where they should rank your website based on your content. Search engine optimization can also be increased by the type of written content that appears on your website. You can hire a web development team that specializes in both design and in SEO services. This will ultimately save you money as well when you acquire these two services in a package deal.

Without search engine optimization your website will not be ranked highly by search engines. This will, of course, result in a lack of exposure for your company. This is specifically true when you keep in mind that most internet users that run a basic search online will look no further than the second page of search results that they find. Most people don’t even look beyond the first page of search engine results that appear. That is why it is crucial to focus on the SEO of your website to make sure that when people run searches that are related to your company and its products and services that your website appears at the top of the list.

Please follow and like us:
error

Continue Reading →