Design
I know you’re now excited to see your own website appearing in the internet. Let me then walk you through how to web design. This is now the time for you to make the looks of your website.
But before you start to learn how to web design, you must now decide on what niche you wanted to work on, grab a domain name and have a place to host your site.
First off, I wanted you to know that you don’t have to memorize those HTML things for you to be able to design your site. I myself has zero knowledge in those things when I first designed mine. I can say however that learning the basics as well is a good idea.
Ways on How to Web Design
1. Design You Site Where You Hosted It
If you want to save your self from all the troubles of designing your site then do it where you hosted it. In fact, almost every hosting sites out there has pre-designed templates that you can just use to build your site. You can go to Hostgator, 1&1, or Godaddy and with a little tweaking, you can have your site up and running.
However, if you want a more professional look for your site then I recommend going to Serif. They have more themes to choose from. They also have styles that are more dedicated to the kind of niche you will be working on in your site.
2. Use a Web Designing Software
If you want to make it yourself then that’s also cool. You can use any web designing software like Adobe Dreamweaver (not free), Joomla, or WordPress. You can also go to Serif and grab an easy to use web design from them.
I personally use WordPress and it works well for me. You can even grab a lot of wordpress themes out there for free. Though if you have some extra cash, you can also check out those paid ones if you like.
Choosing A Theme for Your Site
In choosing a theme for your site (or maybe making your own), avoid having a very complicated design. It takes a longer time for a site full of graphics to load so avoid that. Choose also a dark text over a light background for easy reading.
So that’s how simple it is actually on how to web design. Just try to mess around until you come up with the design you like.
When you’re done making the looks for your site, proceed to adding some contents to it.
Diploma in Web Designing
Course Contents
Web Design Fundamentals
1. Exploring Web Design
What is web design?
Site design
Information architecture
Interactive design
Scripting and programming
The multidisciplinary approach
2. Web Terminology
How the web works
What is a URL?
The DNS and why it matters
HTTP and web protocols
How does a browser work?
What is HTML?
HTML document structure
What is a DTD?
What is CSS?
What is XML?
RSS feeds
JPG, GIF, and PNG
What is JavaScript?
What is AJAX?
PHP, .NET, JSP, and ColdFusion
SQL
Content management systems
What is an API?
3. Getting Started
What should I learn first?
Getting online quickly
Tools for building sites
Additional tools for building sites
Designing for multiple browsers
Designing for accessibility
Progressive enhancement
Choosing a web host
Registering a domain name
Basic site structure
Adobe Photoshop CS3
1. Customizing the Interface
Overview of the interface
Arranging panels
Customizing keyboard shortcuts
Saving custom workspaces
2. Managing Digital Assets with Bridge
Overview of Bridge
The Bridge interface
Customizing Bridge
Organizing assets
Comparing assets with the Loupe
Stacking assets
Rotating, rearranging, and renaming
3. Layer Basics
Understanding layers
Creating layers
Layer stacking order
Deleting layers
Working with multiple layers
4. Color Basics
The decline of web-safe color
Using the Color Picker
Using swatches
Creating custom swatches
Recoloring images
Copying color as HTML
Color management
5. Type Basics
Vector-based type
Creating character type
Creating paragraph type
6. Creating a Web Graphic from Scratch
Storyboarding
Setting resolution, color mode, and bit depth
Combining images of different sizes
Combining images using Layer Masks
Combining images using Blend Modes and Opacity Adding and editing Smart Objects
Creating focus with Layer Styles
Saving source files
Resizing images for the web
Sharpening images for the web
7. The Save for Web Function
Understanding optimization and web formats
The Save for Web window
Optimizing JPEGs
Selective JPEG optimization
Optimizing GIFs
Locking colors
Selective GIF optimization
Optimizing PNGs
8. Creating Web Backgrounds
Designing web backgrounds
Defining and previewing
Optimizing and saving
Symmetrical backgrounds
Full-screen backgrounds
Using directional tiles
9. Creating Navigation
Horizontal navigation bars
Elliptical buttons
Smart Object buttons
Pill-shaped buttons
Tabbed navigation bars
Creating gel buttons
Navigation bars with icons
10. Optimizing Transparent Graphics
Understanding web graphic transparency
Optimizing transparent graphics
Optimizing transparent graphics on a patterned background
Optimizing transparent graphics with shadows and glows
Saving transparent graphics
Starting with a non-transparent image
Simulating transparency with JPEGs
11. Creating Animations
Creating animations from layer visibility
Tweening with opacity
Tweening with position and Layer Styles
Optimizing animated GIFs
Optimizing transparent animated GIFs
Animated slideshows
12. Slicing
Understanding slicing
Creating user slices
Creating layer-based slices
Adding slice options
Optimizing and saving slices
13. Rollover Graphics
Creating rollover graphics with layer comps
Optimizing layer comp rollovers
Installing the lynda.com rollover script
Exporting layer comp rollovers
Creating rollover graphics from layer visibility
Creating graphics for remote rollovers
14. Automation
Creating a web photo gallery
Creating a collaborative gallery
Creating a Flash-based web photo gallery
Using the Image Processor
Automating actions with the Image Processor
Creating PDF presentations
Zoomify
15. Integration with Other Adobe CS3 Applications
Photoshop files in Fireworks
Round-trip editing with Dreamweaver
Illustrator to Photoshop
Illustrator to Photoshop using Smart Objects
Layered Photoshop files in Flash
Adobe Illustrator CS3
1. Vectors Living in a World of Pixels
Using the Web New Document Profile
Basic web preferences
Anti-aliasing and Pixel Preview
2. Web Color
Color management settings
Web-safe colors and hexadecimal values
Pulling colors from kuler
Using the Color Guide with web-safe colors
Converting art to web-safe or limited colors
3. Layout and Design
Grid is good grid is great
Working with multiple crop areas
Making life easier with custom views
Making text look good on the web
Adding reflections
4. Web Slicing
Understanding web slicing
Object-based slicing
Manual slicing
User slices vs. auto slices
Applying settings to slices
Defining an image map
5. Save for Web and Devices
Optimizing web graphics
GIF JPG PNG and WBMP files
SWF and SVG files
The Color Table Image Size and Layers options
Optimizing to a specific file size
Editing output settings
Automating export with Actions
6. Creating Flash (SWF) Content
Creating and editing symbols
Specifying Flash text
Creating a simple animation
Exporting a SWF file
7. Working with Other Applications
Sending layers to Photoshop
Creating interactive PDF files with Acrobat
Moving content to Flash CS3
Moving images and layouts to Dreamweaver
Adobe Flash CS3
1. Flash Isn’t Just for Animation Anymore
Understanding What Flash Can Do
2. Getting Started
Bitmap vs. vector graphics
Understanding Flash file types
Exploring the Welcome screen
Creating a new Flash file
Exploring the Flash interface
Exploring the toolbar
Working with panels
Understanding the Flash animation workflow
3. Using the Drawing and Color Tools
Understanding lines, strokes, and fills
Drawing with the Pencil tool
Using the Oval and Rectangle tools
Using the PolyStar tool
Modifying lines and shapes
Modifying strokes and fills
Selecting lines, strokes, and fills
Using merge and object drawing
Grouping objects
Using the Free Transform tool
Understanding layers
Creating gradients
Drawing with the Pen tool
Using the Brush tool
4. Animating in Flash
Understanding the timeline
Setting document properties
Understanding keyframes and frames
Creating a frame with frame animation
Modifying the frame rate
Inserting and deleting frames
Using onion skinning
Selecting and moving frames
Copying and reversing frames
5. Creating Shape Tweens
Understanding shape tweens
Creating a shape tween
Using shape hints
Creating multiple shape tweens
Common shape tween pitfalls
6. Creating Symbols and Instances
Understanding symbols and instances
Symbol naming conventions
Creating graphic symbols
Editing symbols
Editing symbol instances
Using color styles
Animating graphic symbols
7. Motion Tweening
Shape tweening vs. motion tweening
Creating a basic motion tween
Applying easing
Using the custom easing controls
Editing multiple frames
Using a motion guide
Using timeline effects
Common motion tween pitfalls
8. Working with Bitmaps
Understanding the benefits of bitmaps
Importing and compressing bitmaps
Importing bitmap sequences
Converting bitmaps to vectors
Using basic masking
Using animated masks
Animating bitmaps
9. Working with Text
Understanding text field types
Creating, modifying, and formatting text
Creating fixed and variable-width text fields
Changing the orientation of a text field
Creating a hyperlink in a text field
Working with static text and device fonts
Using small type and aliased text
Animating text
10. Buttons
Understanding button states
Creating rollover buttons
Creating rollover buttons with text
Creating invisible buttons
11. MovieClips
Understanding MovieClips
Creating a MovieClip
Using animated graphic symbols vs. MovieClips
Animating a MovieClip symbol containing a nested animation
Creating an animated rollover button
12. Filters and Blend Modes
Understanding blend modes
Using blend modes
Understanding filters
Applying a filter to a button
Using filters with MovieClips
Colorizing a grayscale image
Animating with a blur filter and static text
Animating with the drop shadow filter
13. ActionScript 3.0 Basics
Understanding ActionScript 3.0
Stopping a movie from looping
Understanding events
Adding a listener to a button
Understanding functions
Writing a function
Using a button to stop an animation 03s
Using a button to play an animation
Using a button to navigate
14. Working with Sound
Importing sounds
Compressing sound
Creating background sound with sound effects
Modifying sound settings
Setting compression for narration
Synchronizing sound to narration cues
Adding sound to buttons
15. Working with Video
Importing video
Understanding video compression
Controlling playback
Building a custom video player
Using the Flash video encoder
Using the FLVPlayback component
Editing video
16. Publishing and Exporting
Understanding publishing options
Using Flash and HTML
Creating projectors
Modifying projectors
Exporting an animated GIF
Exporting static images
Saving publishing profiles
Optimizing movies
17. Integration
Importing Photoshop content
Importing Illustrator content
Integrating with Dreamweaver CS3
Adobe Dreamweaver CS3
1. Getting Started
HTML vs. XHTML
What is CSS?
What is XML?
What is DHTML?
What is JavaScript?
File naming conventions
What is an index page?
2. The Interface
Setting up your workspace
The Welcome screen
Windows and Mac differences
The Insert bar
The Property Inspector
The Document toolbar
The Document window
Panels and panel groups
Saving workspace layouts
Defining a default browser
3. Site Control
Defining a site
File and folder management
Understanding path structure
Adding content to a site
Creating a site map
4. Document Basics
Creating a new blank site
Creating and saving a new document
About DOCTYPE
Inserting images
Inserting text
Aligning text and images
Inserting meta tags
5. Linking
Link basics
Linking with Point to File
External links
Creating email links
Named anchors
Linking to a file
Image maps
6. CSS Essentials
About CSS
Anatomy of a style sheet
CSS and page properties
Moving an internal style sheet to an external style sheet
The CSS Styles panel
CSS selectors
Type selectors
ID selectors
Class selectors
Creating rollovers with pseudo-class selectors
7. Typography
CSS vs. the Font tag
Formatting text with the Property Inspector
What measurement should I use?
Managing white space with margins, padding, and line height
Using font lists
Aligning text
Creating lists
Creating Flash text
8. Tables
About tables
Tables in Code view
Creating and adding content to tables
Changing table borders with XHTML
Coloring tables with XHTML and CSS
Aligning table content
Sorting tables
Setting table widths
Creating rounded-corner tables
9. Layout
Dreamweaver’s layout tools
Tracing images
Adding AP div tags
Working with Layout Tables
Adjusting table widths and nesting tables
10. Designing for Devices
What is a device?
Attaching a printer-friendly style sheet
Styling for print
Adobe Device Central
11. Rollovers
Rollover rules
Creating simple rollovers
Creating disjointed rollovers
Creating navigation bars with multiple states
Creating Flash buttons
12. XHTML
Viewing the code
Editing in Code view
The Code toolbar
Working with Code Collapse
The Quick Tag Editor
Working with snippets
13. Forms
About forms
Adding text fields
Adding checkboxes and radio buttons
Adding lists and menus
Submitting form results
Styling form elements with CSS
14. Essential Behaviors
Opening a new browser window Creating a popup message
Validating text fields
Getting more behaviors
Removing extensions
15. Fireworks and Photoshop Integration
External image editor preferences
Built-in image editing tools
Roundtrip editing from Dreamweaver to Fireworks or Photoshop
Copying and pasting
16. Templates and Library Items
Templates in action
Creating a new template
Applying templates
Modifying a template Adding repeating regions Working with repeating regions
Adding optional regions
Creating a library item
Modifying a library item
17. Automation
Using the History panel
Saving History steps as commands
Using Find and Replace
18. Accessibility
W3C accessibility guidelines Accessibility preferences
Inserting accessible images
Inserting accessible tables
Inserting accessible form objects
19. Inserting Media Objects
About media objects Linking to audio and video files Embedding audio and video files Setting parameters
Inserting Flash content
Inserting Flash video
20. Getting Your Site Online
Getting site reports
Checking links sitewide
Signing up with Tripod
Entering remote info
Publishing your site
Updating and publishing pages
jebaranjan 