Web Design

This page focuses on web design from a gamedev perspective. This page is currently a work in progress.

Explanation of terms

HTML

HTML (Hypertext Markup Language) is the markup language used to create webpages. Specifically creating all of the text, images, and other elements in a page. Elements of a webpage are stored in tags written in angle brackets. Tags come in two types: ones that add content directly (e.g. <img />) and ones that surround content so it can be formatted (e.g <p>…</p>). Like most markup languages, it is stored in a plain text file but it has a .html or .htm extension. XHTML is HTML in XML format.

CSS

CSS (Cascading Style Sheets) is the style sheet language for the presentation of a web page (font, background and foreground colors, etc.). CSS can be embedded in an HTML document using the <style> tags or be stored in a separate .css file.

Javascript

Javascript is a scripting language that allows interactivity to webpages such as creating animations, showing/hiding parts of a page, communicating with the web server using AJAX, and even creating games. Like CSS, Javascript can be embedded in an HTML document using the <script> tag or be stored in a separate Javascript file.

Server-side scripting

Server-side scripts are scripts that the server runs and outputs to the client. In web development, server side scripting is used to create dynamic functionality to websites such as blogs, forums, wikis, etc. Examples of server-side scripting languages and frameworks include PHP, Ruby on Rails, ASP, Node.js, CGI, and Django.

FTP

FTP (File Transfer Protocol) is a networking protocol for transferring files from one computer to another. In web development, it is often used to upload files to the web server.

HTML editor

An HTML editor is a text editor with additional web-development related features such as an FTP client, a debugging console, and a built in web browser for live previews. They're essentially IDEs of the web development world and like IDEs, they are mostly for convenience. You can write HTML, CSS, Javascript, and server-side scripts on pretty much any text-editor available. Examples of HTML editors include Dreamweaver, Microsoft Visual Web Developer, and Google Web Designer.

CMS

A CMS (Content Management System) is a server-side program that makes it easier to create dynamic websites without hand-coding everything. They are often used for blogs and news sites, and take care of all of the back-end stuff that is going on the site. Examples of a CMS include WordPress, Drupal, and Joomla.

WYSIWYG

A WYSIWYG (What You See Is What You Get) editor is a program that allows you to create webpages without knowing HTML but instead using drag-n-drop. Many web hosts now offer a built-in WYSIWYG editors for creating pages and many word processors allow you to export to HTML, effectively making them WYSIWYG editors. WYSIWYG editors tend to be more limited compared to writing HTML or using a CMS and are usually limited to creating static pages.

Web host

A web host is a service that allows you to host your site on their servers. Most web hosting services charge a monthly fee to host your site, and most free web hosts are limited in their features (static sites only, no custom domains, etc.). If you don't have a spear computer that you can use as a server and/or don't have a constant internet connection, it is highly recommended that you use a web host as hosting your own server is hard to maintain, and can be expensive.

Creating a site for you and your game

  • You don't need to create a huge website for your game. A common mistake for game developers is to go all out when creating their game's site and include things like wikis, forums, etc. All you really need for you site is information about you game, videos and screenshots, where to buy/download it, links to social media, and information about the developer(s).
  • Your site should look professional and presentable, but doesn't have to be all fancy looking.
  • If your game is still in development, creating a development blog can help create hype for your game.
  • Keep the use of Javascript to a minimum. Remember that some people do browse the web with Javascript disabled. You should only use it if you have to.
  • Be sure to include your URL to your site when marketing your game including trailers and descriptions on distribution and marketing platforms.
  • Remember that your website can take time and money from your game.

See also

External links

Web development tutorials

Articles

HTML/CSS templates

Disregard everything above and read these

Unless otherwise stated, the content of this page is licensed under Creative Commons Attribution-ShareAlike 3.0 License