WebConcept

by Daniel Honrade

Someone just finished his award winning, high performance site. This site, driven by high energy-generating contents, explosive animations, flashy images, electrifying videos, plus an outstanding design, is ready to spread like airborne virus around the globe. How do you create such a site? Or, rather, the question I should be asking is, "How do you hold those things or elements together, without detonating the site anytime soon?"

Read More ...

 

WebDesign

by Daniel Honrade

How should my site be designed? With millions of websites, each designed in a different way, somehow you will really have second thoughts on the first design you have choosen for your site. Right now, you have a list of some of the amazing websites you've found in the internet, but you just can't combine them to create your own. You like them individually and combining them won't work. So all that's left to you is a decision on which design you should follow.

Read More ...

 

Web
Development

by Daniel Honrade

Great Ideas, great design... next, how will you put this website online and make it functional to your heart's content? You may be stuck with it forever, a quick solution is to just pay or befriend a web developer to materialize your great website, whichever comes first... but, there's nothing like doing it yourself, ...works for me - site development is as fun as like watching movies of all types, it has some action, drama, comedy, mystery, horror... sometimes it's a personal thing, like putting a part of yourself into it.

Read More ...

 

Concept

Nowadays, anybody can create any kind of website, such as blog, ecommerce, forum, etc.... just by having an account in a web hosting company, without having to know much about the complexity of site development... I guess templating sites makes the whole process easy. At present, any imaginable type of site is being developed, published every second, that's how fast everying is happening in the web. It means that at least 5 million new sites are published, updated and billions of web pages are viewed daily... don't take my word for it, I am just speculating.

So now, the question is... how can your site fight with other similar sites on the web? (that is if visitors matter to you) SEO?... Search Engine Optimization or the Search Engine Black Arts (SEBA). Obviously yes, but that is just the beginning.

The real answer is the (good old fashioned) quality of content you have. It's really obvious, people may visit your site because of your superb, right out of the science lab SEO management BUT they will quickly get out and never return if your content is unoriginal, old and not really what they are looking for.

So, what's the big idea?

The central idea, the focus of the site. The reason for the site's existence. It's easier for your site to be remembered and understood for what it is, and not how much in it. It's like the glue concept that will hold things from falling apart.

Basic Types
Mistake in Concept

Design

After you wonder on some mystical, lovable, creative web designs in the internet, you might want to just review the basics of visual design. Start with the principles of design, they do also apply to web design, such as, Balance, Proportion, Rhythm, Emphasis, Unity. I guess these terms do speak for themselves, but if you still can't get it, you don't have to look far, just look at your face.

Normally, we have sets of eyes, ears, nosetrils... the left mirrors the right. In short, there's the Balance. Now depending on the sizes of these parts can make you beautiful or ugly, we call that Proportion. When a beautiful face, or any face just smiled at you, notice how the lips, eyes, cheeks, eyebrows,... just start to move in harmony, yes... you bet, that's Rhythm. There's always the one thing that's noticeable about one's face, whether his/her set of eyes, nose, lips... probably big or nice to look at... we call that Emphasis in design. Eyes, nose, lips, ears, cheeks, etc. are all placed on one's head, somewhat grouped by purpose... Unity, united to form a head.

So, I should say that a very principled head can be very attractive.

When designing a website, you have other reasons to place a mirror beside your computer aside from vanity, better yet, place a portrait of someone you admire for beauty, that's if she/he ain't you.

What kind of design?

Design should follow the concept. It should help to clarify the ideas or make the messages felt by the viewers... it's like setting the mood.

You don't need to put lots of images, colors just because others are doing it. If it doesn't help clarifying or these elements are unrelated to the concept, better not add them.

You don't need to put lots of visual effects, animation just because you know how to or just to impress your visitors. If it doesn't simplify navigation of the site, it's an awful way of wasting your visitors' time, and computer processing time.

General Types
Responsive Design

Development

It's a process or a set of steps to create a website. It can be simple or complex depending on the site's purpose and required functionalities.

You need get familiarized with some coding terms. It's like Breakfast, Lunch and Dinner of web development. We can easily remember these by dividing them into 2, and limiting your options to some popular open source projects (used for web building) and not trying to understand their differences with other available and similar projects. Let's learn some acronyms.

Front End Development

It is simply about the things that are happening in and needed for your local web browser.

  • HTML – hypertext markup language, you can actually create a website simply by using HTML but that would be boring. This provides the structure of your content, such as header, table, list, etc. Previous versions also provided some styling but that changed when CSS was introduced.
  • CSS – cascading stylesheets, you can literally have different designs for your site simply using different stylesheets and without touching your HTML. This is some kind of a dictionary of your site's design, it simply tells the web browser how your site should look like by reading its design property definitions.
  • Javascript – client (browser) scripting language, when structure and styling are not enough and you need some action. This now expands what you can do with your site, it can create HTML tags and CSS for you, interacts with your mouse, site content, browser type, and God knows what else.

The above 3 items are the basic things to understand for front end web development.

What's the back end?

This is knowing where your site is coming from when you type the url address or click search. Like in a restaurant, it has a waiter/waitress or someone who takes your orders... someone who serves you... a server. In the computer world, this server is very efficient in getting your orders, it even gets what you want from other restaurants in seconds, that's cool. Let's visualize this for a moment:

We have the main server which acts like a global telephone directory, it keeps track of everybody's number, it updates records, that way when you call your local friend's number, you won't be ringing your other friends around the world. There's a special feature on the directory number (or internet protocol adress or simply ip) which is the domain name system/service/server (DNS)... yes, you can substitute the unique name of your friend instead of his/her number, like www.danielhonrade.com instead of 76.191.97.75.

The next server in line is the webhosting server, or servers which contain the website files. These servers can be anywhere. And like your computer, it has softwares but faster hardware.

As a web developer, you should know these 3 backend sofware types:

  • Web Servers, like Apache – these manage the delivery of the web pages, it's like a file manager
  • Server Languages, like PHP – these create dynamic web pages, connect to databases, organize your html, javascripts, css, files, check security, process transaction with other sites, etc.
  • Databases, like MySQL – this is another way of storing large amount of content in an organized way, adding address to every piece of content and it can even relate contents in different ways.
Browsers
HTML5

Media - Images

Contact

Blogs

HTML5

When you just starting to feel comfortable with HTML4 with strict XHTML specifications, others are starting to make their websites HTML5 ready... like a never ending learning. Is this really a big deal?

No, don't worry... it won't be your problem. HTML5 or HTML4 or XHTML, your site will still be read by modern browsers. In other words, browsers are becoming more and more intelligent, and they do understand what you're doing with you're markups even if you don't post the W3 Doc specifications. As I see it, these W3 doc specifications are just for backward compatibility of browsers reading old codes. Well, why not just update those sites? It will save browsers, developers time and energy from maintaining these backward compatibility features.

We are in the age where dynamic content and markups are possible to live independently from each other (content is stored separately from markups). Millions of web pages are being published and updated daily using this method of separation. It's not anymore realistic and practical to maintain old standards for sites which have not been updated its system. We should not baby-sit these old sites, if they can't join us, let them die a natural death, otherwise these old standards will hold us back... it's like the IE6 curse.

HTML5 holds a promise of easier and user/developer friendly ways of dealing with media types such as audio, video, image, graphics, etc., which all have subtypes, and features that will simplify form creation, validation, and submission, and much more...

To know more about what you can actually do in using HTML5, visit this site:

www.html5demos.com

Responsive Design

Web design is mostly about your website looking great. You probably heard of “Responsive Design”, which is the new thing in web since “Ajax”. To make the story short, it is NOT enough that your design looks great on desktop. Web design adapting the screen sizes and device's functionalities, like IPHONE and IPAD, is now the major trend. It's NOT enough to shrink your design to a 320px-width screen, you have to relayout the whole thing, hide some things, change the navigation, etc., or in other words make your web design respond to different devices.

Welcome to responsive design movement, it's not anymore an advocacy, it's a requirement by your highly demanding "would be" clients in the years to come.

To know more and become expert on this topic, read this lengthy article below:

Responsive Web Design, most complete guide

Mistake in Concept

The general mistake that anybody has in mind when starting to create a website is not the site's concept itself but the concept of making money out of it... what?

A delusion that you have this unique idea of a website... all you need to do is pay a developer to create your prophesized site, have it SEOed or make it viral, after that, millions of people will visit your site to give you the endles flow of money. I know... I was also guilty and I met 4 more others thinking the same way.

All sites may or may not make money but it should not be the primary concept you should take.

The truth may be hard to accept but it's obvious...

It's not true, or the odds are high, that you will have a unique concept of a website that is not yet published. Maybe. But if you have, yours is at least 1 in a billion, that's amazingly unique.

It's not true that just by people visiting your site, you'll get your millions. No. You need active members with login accounts and not just visitors.

It's not true that creating a dynamic site, you just need to pay a developer. No. You need a team of designer/s, writers, developers... and endless development.

Don't think of money first, think of what you like to do and share. At least you'll enjoy what you're doing without getting frustrated when you're not getting any money along the way.

The thing is...

that when you enjoy something, you are more focused, great ideas can come naturally, your content will have quality, as a result, your site can be better than the others. And it's possible that more and more people will bookmark your site as a reference, then your site won't stop getting visitiors. There are no better visitors than comeback visitors, because they can multiply.

Browsers

To be a web developer, you have to see your website on different web browsers, luckily there are only 4 major browsers:

  • Firefox (23.6%*)
  • Chrome (20.6%*)
  • Safari (11.2%*)
  • Internet Explorer (34.2%*)

These browsers have some differences especially in interpreting cascading stylesheets or CSS (used to style your website). This problem has been going on ever since different software companies compete on web browsing dominance. As a result, web developers are burdened with spending lots of time trying to tweak codes to make websites look the same in all browsers.

*Browser Usage as of October 2011, source:

Wikipedia (Browser Wars)

General Types

For whatever purpose your site has, the look and feel of your site may fall under these categories:

  • Fancy
  • Corporate
  • Creative
  • Personal
  • Artistic
  • Hardworking
  • Simple
  • Flashy
  • Childish
  • Authoritative

Basic Types

Before wondering about the concept of your site, you may want to ponder on what type or types your site would fall under. There's no marriage contract that says, you should only stick to one type or else that's an adulterated website, as long as it serves your purposes, I think, it's fine to have as many as you need.

  • Blog
  • News
  • eCommerce
  • Wikki
  • Company
  • Social
  • Community
  • Government
  • NGO
  • School
  • and other specialized form of websites such as celebrity, porn, gambling sites