Acme Co.

  • About
  • Benefits
  • Features
  • Pricing

Fancy websites shouldn't have to be so complicated.

Reduce overhead by using plain HTML, CSS and Javascript to create a product's or brand's landing page.

Learn more
Obligatory generic smartphone image

Improving My Understanding

It's never a bad idea to learn more about the inner workings of the web, beyond what brand-name frameworks and methodologies would provide. I may gain appreciation for the history of web technologies and the various compromises it made. In addition, I may leverage HTML more effectively to deliver web pages that are as semantically sensible as they are graphically fantastic.

Minding Users

In my youth, I had to work on limited quota through mobile data. Not only that, I had a laptop very much limited in resources, only having about 2 GB of RAM. Hence, I know that websites should optimize for that scenario. However there are more aspects that I must optimize other than simply less data usage, because if it were the only thing I care about, I would simply minify everything.

Accessibility is something to consider when creating a website. At the very least, contrast issues. As a graphic designer, I admittedly overlook this a lot. However, I think websites need more consideration since they live in small screens be it through a notebook laptop or a smartphone. Another way to complete the accessibility problem is by using semantic tags whenever possible, ensuring that if the website is accessed by something other than a web browser, assistive technologies may accurately convey the contents of the page.

Ultimately, a website is made by its' contents. Some measures which may satisfy the developer or the artist may not be desirable to me, a user, who wants to page to just load — things like loading screens and anti-FOUC measures — must not get in the way of whatever content I want to access.

Web users ultimately want to get at data quickly and easily. They don't care as much about attractive sites and pretty design.
Tim Berners-Lee

Implementing Design Considerations

Among the various ideas to define the relationship between HTML markup and CSS layout, one that I tend to agree the most is that CSS design should depend on the associated markup. This is simply due to the fact that graphical web browsers are not the only applications able to parse HTML.

I'm aware of the possible issues it may bring when it comes to scaling and maintaining the code, but my opinion is that nothing can't be fixed with adequate documentation. Therefore, I believe a good way of thinking about making websites that fulfill design soundness and user comfort might be as follows:

  • Writing the content first, because this is the most important part of any page where content is worth having. I would write the HTML as if I was writing for a command line display.
  • Designing the layout, adjust it around the content. I'd make it attractive, but not in a way that obstructs the content. I try to use the above user-minded considerations.
  • Implementing the layout to the content. This ensures that the site remains reasonably compatible when accessed using any device, while bringing normal users a fast experience.
Screenshot of an XML parsing error

About XHTML

XHTML was an effort by the W3C to bring strict error handling through the use of the XML parser. It wasn't very popular among developer circles.

Validate it here
Screenshot of code

Code tricks

One benefit of XHTML is leveraging CDATA to paste code samples without needing to escape anything:



int main(){
  printf("Hello!\n");
  return 0;
}
                  ]]>

What's the price?

Sample plans exist for example client's needs.

Starter

Rp100K per month
  • No credit card needed
  • 1 subdomain
  • 500 MB storage
Order

Pro

Rp500K per month
  • No credit card needed
  • 3 subdomains
  • 5 GB storage
Order

Ultimate

Rp800K per month
  • No credit card needed
  • 10 subdomains
  • 10 GB storage
Order

Footer

Insert something here, like other copy write text or legal disclaimers here...

The design of this sample design was very much inspired by the Pixfort Essentials theme, and aims to write a lighter alternative.

A big list of links

  • About
  • Contact
  • Blog
  • Whatever
  • Sales