CodeMason™ by DemeWebSolutions.com™ provides a focused visual workflow for inspecting a webpage, editing HTML and CSS, and moving toward standalone HTML export. This guide covers the basic workflow.
1. Open the CodeMason guest workspace
Start with the CodeMason Guest Workspace.
You do not need an account to begin inspecting and editing. This makes guest mode useful for learning the interface and deciding whether CodeMason fits your workflow.
2. Inspect the page
Load the page you want to examine and use the inspector to explore its structure, elements, and styles.
Before changing anything, understand the page:
- Identify the element you want to work on.
- Review its HTML structure.
- Examine the relevant styles.
- Consider how the element relates to the surrounding layout.
Inspect first. Edit second.
3. Edit HTML and CSS
Use CodeMason’s editing workspace to make HTML and CSS changes.
Work incrementally. Small, deliberate changes are easier to understand and review than changing many unrelated properties at once.
This workflow is particularly useful when experimenting with layout, typography, spacing, components, prototypes, or client-facing concepts.
4. Review your changes
Before treating the result as complete, review the page visually and confirm that your changes produced the intended result.
For deeper JavaScript, network, console, or browser-performance debugging, Chrome DevTools remains the appropriate companion tool.
5. Sign in when you are ready to export
Guest mode supports inspection and editing. When you want to move to the export stage, sign in through CodeMason.
CodeMason’s workflow is intentionally straightforward:
Inspect → Edit → Export
CodeMason Docs
Workspace and export guidance.
Pricing
Current plan information.
Who is CodeMason for?
CodeMason can fit designers, developers, agencies, site owners, and people learning visual web development who want a focused inspect/edit workflow rather than using deep browser-debugging tools for every task.
You can also enter through the DemeWebSolutions Freeware area.
Frequently Asked Questions
Do I need an account to use CodeMason?
An account is not required to start in the guest workspace for inspect and edit. Sign-in is required for export.
Is CodeMason the same thing as Chrome DevTools?
No. Chrome DevTools is a broad browser-development and debugging environment. CodeMason is a focused visual development workspace centered on inspection, editing, and export.
Where do I start?
Open the CodeMason Guest Workspace and begin with inspection.