Add Me!Close Menu Navigation

everything about the web. step-by-step. define. structure. design. build. beginner. intermediate. advanced.

Add Me!Open Categories Menu

Currently Browsing

build

Posted in build, intermediate

Intro to HTML 5

HTML 5 Introduction Most of the web standards curriculum is based on the last stable version of HTML — HTML 4.01. The HTML 4.01 spec was completed in 1999, over 10 years ago as of the time of this writing! But unless you’ve been hiding under a rock for the [...]

Posted in beginner, build

Image Optimization

Image Optimization GIF format A compressed file format for indexed images. It uses run-length encoding, which compresses a series of pixels of the same value (in the horizontal direction) as a single entry (e.g. 30 pixels of red), which saves space over specifying each pixel. This means that large blocks of [...]

Posted in beginner, build

HTML Basic Tags

HTML  – Basic Tags For the HTML tags below, please be sure you understand all tags outlined in the notes below.  Remember, if you have any questions on how to use the tag, please take a look at the example located here: HTML Example directory Also, note the name of each [...]

Posted in beginner, build

HTML Basics

HTML Basics Markup, the basis of every page HTML is a markup languages composed of elements, which contain attributes (some optional and some mandatory.) These elements are used to markup the various different types of content in documents, specifying what each bit of content is supposed to be rendered as [...]

Posted in beginner, build

Why Learn HTML?

Why learn HTML? Given that tools such as Dreamweaver exist, and allow you to create web pages without knowing HTML, you might ask “why learn HTML?” There are several reasons: Dreamweaver does not always do what you want. To get the page to look right, you often need to hand [...]

Creating a Contact Form

Creating a Contact Form Creating a simple contact form can be easy once you know the steps involved in creating one. Below is a how-to on creating the HTML/CSS for a contact form. Making the form active will require a script and is beyond the scope of the tutorial below. [...]

Making WordPress more like a CMS

Making WordPress more like a CMS (and less like a blog) . Install WordPress on your server Add a theme Set permalinks Use more pages and less posts. (Turn off comments) Add plugins Edit the CSS Edit the templates (php) Add social media icons Use widgets Customization 1. Installation on [...]

Code for 1, 2, and 3 CSS Column Layouts

Strategize your plan for the layout Below is the HTML and CSS “starter” code for each of the major column layouts. Normally your design will fall into one of these 3 main structures: 1, 2, or 3 column layout. From there your design may get more complex then the illustrations [...]

CSS Navigation Menu: Drop Down

CSS Navigation Menu: Drop Down Creating a Navigation Menu with drop downs is not hard once you understand the CSS. In this intermediate tutorial we’ll go through the necessary code; both HTML and CSS, you’ll need to understand to build this navigational menu and others like it. We’ll also show [...]

Posted in beginner, build

CSS Navigation Menu: Basic

CSS Navigation Menu: Basic Creating a Navigation Menu using CSS is not hard when you know the basic steps involved. In this basic tutorial we’ll go through the necessary code; both HTML and CSS,  you’ll need to understand to build this navigational menu and others like it. We’ll also show [...]

Posted in build, intermediate, video

VIDEO: Column CSS Layout: EHD (Parts 1- 2)

Column CSS Layout: EHD (Part 1-2) Part 1 covers organizing your files, creating an HTML and CSS file and linking the .css file, and adding content to a column web page including navigation, images, and text.  Part 2 covers adding CSS (presentation) to a column web page including styling navigation, [...]

VIDEO: Two Column CSS Layout (Parts 1- 2)

Two Column CSS Layout (Part 1-2) Part 1 covers organizing your files, creating an HTML and CSS file and linking the .css file, and adding content to a two column web page including navigation, images, and text.  Part 2 covers adding CSS (presentation) to a two column web page including [...]

Posted in beginner, build, video

VIDEO: One Column CSS Layout (Parts 1- 3)

One Column CSS Layout (Part 1-3) Part 1 covers organizing your files, creating an HTML and CSS file and linking the .css file in preparation for building a one column web page. Part 2 covers adding content to a one column web page including navigation, images and text.  Part 3 covers [...]

Posted in beginner, build, video

VIDEO: The Basics of CSS

The Basics of CSS This video tutorial covers the basics of CSS, what is CSS? Basic CSS Properties, Anatomy of CSS, and demonstrates how to link a CSS file in a basic HTML page using a simple text editor like TextEdit.

Posted in beginner, build, video

VIDEO: The Basics of HTML

The Basics of HTML This video tutorial covers the basics of HTML, what is HTML? Basic Tags, Anatomy of HTML tag, and demonstrates how to code a basic HTML page using a simple text editor like TextEdit.

Posted in beginner, build, video

VIDEO: File Organization (Website Directory Structure)

File Organization (Website Directory Structure) This video tutorial covers the basics of organizing your website files. Organize first before you start building your website.

Technical Production

Once the client has “signed off” on the design for the website, you can now get started on building the website in HTML/CSS. Notice that testing the site is necessary throughout the entire process of the technical production. Study the design comps (created in Photoshop), and take a few minutes [...]

Posted in beg-define, beginner, build

File Organization

Also know as Website Directory Structure. When building a website, it’s essential to create a directory (folder) structure correctly at the very start of your project. Referring to the example on the left, please note the following: Create a “root” (master) directory named final_project and inside it, create two folders. [...]

Posted in beg-define, beginner, build

Web File Naming Conventions

When creating your website, you must be very methodical when naming your files. First, never use spaces, uppercase letters, or any special characters in your file names. While your site may seem to work okay using an HTML editor (i.e. Dreamweaver) on your local computer, when you upload the website [...]

Search Engine Optimization

Basic Strategies – Five Basic Steps 1) Add Meta Tags 2) Add Home page title 3) Have “good” Home page content 4) Initiate link agreements with other websites 5) Submit site to search engines and directory services Step 1: Keywords Meta Tag Example from Starbucks Web site <meta name=”keywords” content=”Starbucks, [...]

 

February 2012
M T W T F S S
« Jan    
 12345
6789101112
13141516171819
20212223242526
272829