Website building experiences from HOMA architects

HOMA architects shares their website building experiences

(For a small size office 8 to 10 people)

Design cabinets on their development all have to build their own website. Not only could a website provide information, it also a proof of commitment and of independence. As an efficient PR mean, it shows the company’s values, philosophy, goals, and images. Therefore, a website is somewhat similar to an architectural construction, it has to be at the same time functional and aesthetic. Having no website building experiences, many people struggle when facing the website construction: where to start, how to organize, which type of user interaction to adopt, how to increase page view, etc.

These challenges are cause to procrastination or neglected website that won’t contribute any value to the company. HOMA architects experienced this aspect for a long time until we decided to dedicate time and money into it. Now we are more than happy to introduce it to you.

HOMA-architects.com

To HOMA architects, the website is our second office which is, in some cases, even more important than the physical one, because it will get more visits. Like a smart building, it helps visitors to get to know about us in the most efficient way.

But the best part is, after having completed it, we got some valuable website building experiences which we cannot wait to share with you: Colleagues, friends, clients…those who are considering getting their own website. These website building experiences will not turn you into a web expert, but they are essential to a new web owner.

In the eyes of an architect, a website is very similar to a construction project.

To begin, we need a host (something alike a land plot in an urban area), a domain name (like an address to help people find you) and an interaction interface (like the building itself with all equipment inside). All those can be rent yearly. To HOMA architects, the above elements are set as follow:

Host: A2hosting – this is an US host, introduced by a friend. Reasonable annual cost, many services such as: unlimited email addresses, nice security, great support team which are professional and prompt.

Domain: HOMA-architects.com – rent from name.com, biennial payment.

Graphic design: Designer Haru-Rabit

Coding and maintenance team: ElightUp team.

Operation: HOMA architects team

Step 1: Over view and intensions:

Determine the role of the website, this is what you handover to the coders, so it has to be clear. General thoughts about how the website appears and interacts. The impression you want to create, the value you want to highlight, the order of priority, copyrights…
Determine the disadvantage: we have no former website building experiences – so it is vital to trust the experts.
Determine the advantage: HOMA architects already has a large number of projects with beautiful images and bilingual texts in both English and Vietnamese, so no problem with full furnishing the website when it’s done.

HOMA architects’ intension:

Focus on User experience. The website’s content must be genuine and consistent to the company’s core values.
High performance: media must be light and fast loaded. The best way we found is preparing all media in small file size at a local server before uploading.

Step 2: Scenario

Scenario is the way you plan for users to discover your website in order. Which content will appear first, which can be found later? In our case, we put forward our projects. Lower scrolling down will be service content and team. End of page is a place for contact information.

More detail information about working methods, philosophy, blogs, career…can be found in deeper layers of page. All link buttons are organized in a pretty dashboard on top of page that floats all the time do ensure easy access to users.

References: It is always good to have a look at the other websites. That helps you get a more insightful vision at different angles. So, you would rather be more aware of what you really need than following impulsive feelings. We have visited many websites of great design companies, almost all of them are worldwide well-known design firms. We tried to see the message they send to viewers and the price they paid for that. Some are really beautiful and mysterious, some are full of large images, some stay there but are really close to viewers. Others are way academic, or very popular, or very commercial. However, visiting other website building experiences really helped us to imagine what we want for HOMA architects’ site.

Step 3: Graphic design

Consistency: A website is great when it is simple and consistent. Too many styles of different presentations for similar contents are mistakes that make a website looks amateur. It sounds basic, but it is exhausting when you really do it, especially for OCD perfectionists.
User interface: depending on the field, client and service that the interface needs to be designed relevantly. Young people are attracted in eye catching interface. Busy people need fastest access to information. All of HOMA architects’ clients have common point at good taste, high demanding and busy. That is why we adopt a simple interface that minimizes the page loading time. We also minimize almost all visual effects so the client could focus very fast on what they look for.
Graphic elements on page: Although many eye-catching layouts are available, we chose an orthogonal and simple layout with bright color. Not like what it seems, we spend a huge time to check the size of each elements and the alignment between them. As a reward, the viewers can enjoy the cleanliness and lightness that the website visually offers, so they can focus more on the architectural projects we design.
Font: art related industries prefer unique or rare fonts. But be careful because several fonts cannot support some languages. In our case, we chose avantgarde but it does not support Vietnamese, so we finally had to replace it with quicksand. Fortunately, it is very similar to avantgarde. Just looks slightly softer.
Add media, portrait photos of team. Your team definitely have to look fabulous on your website. It is absolutely worth it to organize a photo session. That could be a lot of fun too.

This is a short backstage clip when we shot our ” studio quality” team portrait

Step 4: Work with the web coder.

You can make you website interact in almost every way you want, given you have enough time and money. But how people feel about it when they visit, is nevertheless a lot more difficult. To a specific clientele and from the company’s perspective when determine the type of client communication through the website, you need to be clear about:

What you want for the website to have; which feature you want but you must let go because they are not essential.
What you see the other websites are having; what you chose to be like them, what you chose to be different.
When making the contract with the coding team, please make sure you don’t miss the followings:

Chose the web language platform: WordPress, Joomla, Shopify, Magento, Wix, Drupal. Your business will decide the platform. Your coder will give you the advices you need. Homa’s website is built upon WordPress because of its openness and flexibility. However, using many third parties’ plugins will eventually make you dependent in the future.
The parametric ability for the web administrator. Beside the web site’s front-of-house interaction, the back of house interaction is more important. The admin page has to be flexible enough to adjust texts formats, user interface and compositions. It will be painful if in the future you cannot change text into bold, italic or highlight important contents. It seems obvious but it is not done by default.
All coding contents need to be packed up and handed over to you as the first archive once the web construction is finished. Normally, this, by default, belongs to you.
Agreement on number of modification times. Although things seem to be well thought from the beginning, big chance is that you still have many surprises (normally negative ones) when you first see the product from the coding team. It is not their fault and not yours neither. It is just life. So, you need to sit down and talk about modifications and extra fee. Nobody wants modifications because it costs time and money. But at least, make sure that neither party will quit the job, angry and hurt. The easiest way is to make agreement about the number of times you can ask the coding team to modify for free. If you go over that amount, you pay the extra. Everybody will be happy. We had to modify 3 times and so did the final cost.
Language: If you run a bilingual website, there must be a language switch button. It is imperative that viewer stays at the same page when they hit the language switch button. Believe me, this simple thing is not obvious. (you can test by clicking the small flag at the top right corner in HOMA architect’s page). If your website has more than two languages, that switch button can turn into a drop menu.
Administration by language: If you run 2 languages, they have to be integrated into one admin account only. You will only need to login one time, upload one copy of media for each post, and you will not have to worry about consistency. That will take less server memory too. Having different admin accounts for each language will be true hell in all meanings. So, it would be best if you put it clear from the beginning: In the administrator page: Each post has field for picture insertion. Beside that, each language has its own field, but in the same post. Then you need an “add more language” button in case you need in the future.
Animations: Animations make the website look more friendly and active. Without them, viewing the web seems like reading a newspaper. However, the abuse of animation makes you website looks out of date. In homa-architects.com, we try to keep it as simple as possible. Beautiful pictures are selected for full screen width slides. Clients and Partners logos run in a basic conveyor style and stop at mouse hovering. These simple animations are simple but took really much effort from everyone.
Compatibility between your site and different web browsers and different devices. Make sure after you web is delivered; it displays the same on different browsers. It is possible the it performs perfectly in Chrome, but badly in IE. Don’t underestimate IE since it appears to be being brought back by Microsoft. Your website may run smoothly on PC while it bugs like devil on smart devices.
Media organization on host: It would be very convenient if the coding team allows you to create multiple folders and sub-folders in the media library. This is a long-term feature that is totally worth it when you add more and more pictures onto your website.
Post design tasks: First archive right after web completion. Scheduled archiving. Your website contains all your best showcases and its value increases with time. Hence, you sure want to have regular backups to eliminate all risks that can wipe out all your team’s work.
There are several small things that would make this blog too long. However, it could be helpful if you have them all in your to-do-list:

SEO
Protection against spam (Contact field could be a vulnerable area for spam robots to track your email address). Homa’s website uses a basic Google’s Captcha checking tool.
Operation and maintenance
Insurance
Privacy policy and copyright
And the most important thing at last:

In conclusion

A company’s website always need discussion between internal team and coding team during the whole process. Needless to say, the opinions of every team member helped us a lot in avoiding mistakes, and importantly, everybody is happy when we do it together. After the website is completed but before the official launch, it is a wise idea to send it to people you know that they are really good at some important factors to the website. This will make your website even better in look and in function. Don’t send it to too many people or you will get lost. The cute Homa architects website is completed thanks to feedback from our friends and clients. All opinions are seriously taken. They did make the website much more valuable.

After 4 months of non-stop work with talented and dedicated comrades, we finished our online home and are ready to invite you to visit. We hope that the website will connect us for even more collaborations in the future.

We want to thanks Haru-Rabit who magically transformed our abstract expectations into graphic language. She is a true graphic magician.

Thanks to coding team: elightup: They have accompanied Homa architects from the first coding steps. Thanks for their talent, courage and patience they had for us. Working with them has been an extraordinary experience. We would introduce elightup team to anyone looking for a high quality website.

Thank all of our friends and partners whose opinions helped us a lot in completing this website.

To those who are considering to build a website – you have our encouragement. We hope that our website building experiences shared above would be useful for you. If you decide to make one, share to us your own website building experiences

HOMA architects