Web Designing Course: Beginner to Advanced Level

Learn to work with layers in Photoshop: create new layers, shape selections, apply gradient fills, and arrange layer order by moving top, middle, and bottom layers.

Learn to use the marquee selection tool to create multiple selections with subtract and division options, apply feather from 0 to 10 pixels, and observe edge blur and color fills.

Learn how to create custom selections in a graphic design workflow using lasso tools, including freehand, polygonal, and magnetic options, to outline objects by drawing around edges.

Create a scene with sky, sun, clouds, and mountains, using fill colors and brush tools, and apply shading and lighting effects.

Create a sky background by adding a new layer named sky, then apply a linear gradient from dark blue to lighter blue, top to bottom, with an option to reverse.

Create the sun by drawing an ellipse on a new layer, fill it with a chosen color, then add a sun glow on another layer using a soft brush.

Create mountains with polygon shapes, fill dark tones, and add sunlit shading. Use layers to place shadows opposite the sun, then group the Caucasus mountains and add clouds.

Create clouds in a separate document using the pen tool to shape with anchor points and handles, then duplicate, transform, brush shading, and group them.

Create birds on a new layer, draw them with the pen, duplicate to form multiple birds, group the birds near the sun to complete the 2d scene final touch-ups.

Open an image in photoshop with file open or open as smart object. A background layer is locked until unlocked by double-click; smart object approach is introduced for next class.

Compare raster images and smart objects to show how resizing can cause pixelation in regular images, while smart objects preserve quality during transform operations.

Learn to remove a product image background by duplicating the image, using the pen tool to make a selection with a radius, and deleting the background for a clean output.

Learn to remove hair backgrounds by inspecting color channels, duplicating the blue channel, adjusting levels, and using refine edge with smart radius before exporting a layer mask.

Adjust brightness and contrast using levels, and tune midtones with the midpoint control. Apply presets or custom defaults, then fine-tune red, green, and blue channels for the desired look.

Create a glowing bulb in Photoshop using a shape layer and custom shapes on a black background. Center the bulb, then apply glow effects with adjustable color and opacity.

Learn to remove facial marks using the healing brush, healing brush two, and patch tool in image editing, duplicating areas, capturing the area, and painting corrections on new layers.

Learn to use the content aware tool to duplicate and relocate elements in an image, adjust structure and color settings, and move objects like a bird with enter to finalize.

Learn to brighten the image background and deepen shadows using the dodge and burn tools in Photoshop, painting with a brush and reviewing before-and-after results.

Learn to use the clone stamp tool to duplicate artwork, sample from a source, paint on new layers, transform and rotate the clone, and refine edges with masking.

Learn to install custom fonts in Photoshop by copying font files into Windows, then access them in Photoshop via the Character panel for new documents.

Explore typography in Photoshop by enabling the character panel, creating and formatting text, adjusting font, size, color, alignment, line height, and letter spacing, and applying clipping masks and shadows.

Learn to composite a car onto a road image in Photoshop using filters, smart objects, and blending modes, then apply lens flare, gradient effects, and screen blend mode with opacity.

Choose the right browser for web design by evaluating options like Chrome, Firefox, Opera, Safari, and Brave, test HTML5 support, and compare features like ad blocking, trackers, and privacy.

Choose the right code editor by evaluating language support, syntax highlighting, code completion, features, ease of use, and strong community support.

Learn to install and customize Visual Studio Code, download from code.visualstudio.com, choose the correct platform, install a GitHub theme, and begin building websites with HTML5 and CSS3.

Explore how HTML powers the web as the foundation for displaying words, images, media, and interactive forms. See how browsers read HTML markup tags to render content online.

Discover how HTML marks up content to guide the browser, how CSS styles pages with color and typography, and how JavaScript adds interactivity.

Explore how HTML acts as a declarative language that declares structure like headings, paragraphs, and images. While CSS provides controllable styling through rules, and JavaScript adds powerful behaviors.

Learn HTML syntax by using opening and closing tags to form HTML elements like P, H1, and article tags. Understand the Dom tree and nesting's role in accessibility.

Learn to use the HTML paragraph tag in practice, create multiple paragraphs with p tags, and preview results in a browser using VS Code and Emmet.

Learn to use h1 through h6 to mark up content with headings, create clickable headings on search pages, and apply emmet for accessible markup, aligning with Bootstrap and Material Design.

Learn how to use em and i for emphasis and bold and strong or b for emphasis in HTML, distinguishing semantic meaning from visual styling, with CSS as an alternative.

Create and structure lists in HTML using ul, ol, and dl, nest list items with li to build menus, sidebars, and step-by-step guides with dt and dd definitions.

Learn how inline elements like the b and m tags differ from block elements like h1, p, and ul in HTML, and how CSS can alter their display.

Learn to use HTML block quotes and inline quotes with blockquote, cite, and q tags to semantically cite authors. Build quotes with paragraphs and inline citations for clean browser rendering.

Explore how HTML uses the time tag and date time attributes to encode dates and times for computers, including formats, time zones, and semantic clarity.

Learn to use the kbd, code, pre, and br tags to display keyboard shortcuts and code, manage line breaks with br and pre formatting, and render HTML entities in examples.

Learn to use subscript, superscript, and the small tag in HTML to format formulas, code examples, and copyright notes, with sub and sup for semantic markup.

Explore global attributes in HTML, including class and id usage for styling and targeting, plus practical examples of jump menus, content editable regions, and lang and dir.

Explore how aria attributes add meaning to HTML for accessibility and test with browser accessibility tools in Chrome and Firefox. Use aria-label and aria-hidden to improve screen reader clarity.

Learn how HTML handles blank spaces, the pre and textarea tags, and how to insert extra spaces with   and line breaks with the br tag, plus code documentation with comments.

Explore the evolution of HTML capitalization from uppercase tags to lowercase, and learn that both forms work across thousands of websites with capitalized tags and billions with lowercase tags.

Explore the differences between short word tags and full word tags in html, shaped by early memory constraints. Learn which tags use closing tags and how browser support evolved.

Explore how non-breaking space (nbsp) elements control spacing in HTML, adding extra spaces and preventing line breaks, with examples showing five extra spaces and keeping 'Prime Inspire' on one line.

Explore how to create hyperlinks using the anchor tag, set the href attribute, and wrap links around text or images to connect pages, sections, and complex content like cards.

Explore absolute URLs by understanding Uniform Resource Locator, the role of http/https in domain addresses, and how anchor tag hrefs point to full web pages.

Explore how relative URLs connect pages within a website using anchor tags, forward slashes, and dot dot slash navigation to link between pages and parent folders.

Name every file by its purpose and content, using index.html for home pages and descriptive image and style names. Use hyphens instead of spaces for readability and SEO.

Build an accessible navigation bar using a ul with a navbar class inside a nav element, linking home, services, products, about, and contact. Add aria labels for accessibility.