Web Resources
Like anything in this world, a Website isn’t something you have to have professionally made—
HTML resources
The DIY Websiter should have a working knowledge of at least basic HTML. There are a number of “WYSIWYG” software packages on the market for building sites without all that bothersome coding—
Links
CSS resources
If HTML and Javascript are the body and engine of a Website, Cascading Stylesheets (CSS) are its detail paintjob. Style properties used in CSS determine what colors are used on a site, where things are in the layout, what kind of fonts you see, that sort of thing. They help make a lot of Websites nice(r) to look at. If you don’t use any CSS on your site, you might have a perfectly functioning site that looks, well, like this.
Stylesheets can be actual separate files that control your site’s styling, they can be “sub-files” within your HTML document, or they can be used “inline.” Often sites will use a combination of two or even all three methods. Separate stylesheet files, used along with some rudimentary Javascript or HTML conditional statements, also allow you the ability to customize your site’s appearance on different Web browsers.
Links
Blogs/Content management systems
Most Web logs, or “blogs,” on the Internet today are DIY operations utilizing one of several user-friendly blogging tools available to anyone in cyberspace. Some of these tools are free, some cost a bit, and for the most part they are easy to use. Some, like Blogger, work with an optional “WYSYWIG” interface that lets you type as if you were using a standard word processor (you can bypass this and type plain text and use your own HTML code too) and display the blog in one of several available pre-built template designs. Such blogs are typically hosted by the blog service, requiring no extra hosting or domain accounts. These are great for people who don’t want to mess with the look and feel of a blog but just want something simple that lets them post away at their whim.
Links
PHP resources
PHP is remarkable in a number of ways, starting with its origins. Initially created as a way to expand on what normal HTML code can do with forms and databases, the nascent language was called “Personal Home Page & Form Interpreter.” As more users started playing with it, PHP evolved and grew over the years into a far more robust programming language, and in 1997 was given the recursive “backronym” PHP Hypertext Processor (the grammar nerd in me wants to know if the initial “PHP” in that is still an initialism for Personal Home Page).
PHP is a server-side scripting language, meaning it does all its work before leaving the server and heading to your computer’s Web browser. It allows for integration of Web pages with MySql databases and is the platform most content management systems are written in. At a simpler level, PHP allows repetitive HTML code to be written only once and then called for remotely from different PHP files, which is great for maintaining a structure and theme across the breadth of a site. It also handles all the mathematic and variable-based functions you might need in a scripting language and all sorts of other things. A highly valuable and versatile part of many Web projects.
Links
JavaScript resources
JavaScript allows you, the Website DIY maverick, greater control over how things are displayed and/or accessed by your Web page. Scripting often utilizes variables and arrays for displaying data, event handlers for triggering actions or changes in the display, and mathematical functions for things like clocks and counters. It’s used for buttons, for “rollovers” (changes from one image to another when you move your mouse over it), even for some animations. JavaScript, being what’s called a client-
jQuery is another term you might have seen bandied about; it refers to an expanded mode of scripting and a library of script code that allows even more goodies to be incorporated into a site. Ultimately, it too is JavaScript.
Links
Web browsers
Web browsers are the virtual paper your Website is printed on. There are many of them available to use, but the Big Five are the ones you may be familiar with: Firefox, Chrome, Safari, Opera, and every designer’s least favorite, Internet Explorer. (Note: Microsoft has rebranded IE as “Edge” for newer versions, and it is an improvement over the hated IE.). Each browser has its own quirks and rendering protocols, but standards are becoming more widely accepted. IE is the one most likely to buck those standards, but even the new iterations of IE are at least trying to conform.
When building a site, it’s always good to test in multiple browsers and isolate the areas that behave differently from one to another. Usually the differences in rendering are minor, but not always—and you don’t want to find out after you’ve gone live that a third of your users are seeing a broken-looking page.
Right now, the most popular browser in use on desktops and laptops is Google’s Chrome, which overtook IE in 2012 and has steadily increased its share since; roughly half of Web surfers are using Chrome these days. Chrome is indeed a fine browser, but there have been issues with hardware compatibility in its latest couple of releases that have yet to be addressed, which may hurt its share in the short term. Mozilla’s Firefox is the second-most used for desktops and laptops and has a share of mobile as well. Safari no longer supports a Windows version, so its user share is limited to Mac users and Windows people running older iterations; similarly, IE has not supported a Mac version for several years now. Opera is perhaps underutilized, as it seems to be the fastest renderer of the bunch. Mobile platforms (e.g. phones and tablets) are dominated by Chrome and Safari, with Google and Apple preloading Android and iPhone devices with their company’s browsers.
Links
Search engine resources
Search engines are so commonplace today that “google” has become a verb, so I probably don’t need to explain what their purpose is. But how they operate and how to make your Website show up in a search engine’s listings can be mysterious topics. Without getting into too many details, there are a few key things one needs to keep in mind when coding for the benefit of a search engine: keywords, ALT text, and links. There are other items as well, but they are not universally recognized as important—
Keywords are both a META tag item and a more general term. The term refers to specific words or phrases someone might run a search for that you want to identify your site with (if your site was about Japanese professional baseball, your keywords might include “baseball, Japan, Nippon Professional Baseball, NPB, yakyuu, World Baseball Classic, Sadaharu Oh, Tokyo Giants, Chiba Marines, Central League, Pacific League, Kenta Maeda” and other terms someone might search for on the subject). You would use these keywords in your site’s text copy; where and how often they appear impact the page’s ranking in a search. Repetition can be your friend in this case, but it can also make for bad writing, so I generally don’t emphasize packing your copy with keywords—
ALT text is background code for images. You may want to use a graphic image in place of straight text for appearance purposes, but search engines can’t read your graphic. To compensate, you include alternative (ALT) text the engine will read behind the image (this is also useful for those weirdos who turn images off in their browsers).
As for links, well, this one you don’t have as much control over, and it may be the most important factor. Search rankings depend on how many links to your site exist elsewhere on the Internet. Simplistically speaking, the more sites that link to you, the more important the search engine thinks your site is. So once you become popular and get links in, your search ranking will improve and you can become more popular. It’s the cycle of cyberlife.
Another thing to consider if you use a CMS or blogging platform is how your URLs are formed. Generally, such an infrastructure will utilize URLs with parameters—something like http://someblog.com/index.php?itemid=104—and search engines may ignore parameters, making every single page in your blog index with the same URL. So there are ways of altering the URLs to make them unique and search-friendly—the above example might then become http://someblog.com/item/104/, which a search engine will log as a unique page. Better yet, it could become http://someblog.com/item/this-post-is-about-thunderstorms, substituting the post title for the post id number and giving search engines another high-value keyword hit.
Of course, not everyone wants their site to show up on Google searches, and there are also ways to hide your more private blog or site from search engines.
Links