Image code problem

Perch: 3.0.14, PHP: 7.0.13, MySQL: mysqlnd 5.0.12-dev - 20150407 - $Id: 241ae00989d1995ffcbbf63d579943635faf9972 $, with PDO
Server OS: WINNT, apache2handler
Installed apps: content (3.0.14), assets (3.0.14), categories (3.0.14), perch_blog (5.6.1), perch_forms (1.10), perch_twitter (4.0)
App runtimes: <?php $apps_list = [ ];
PERCH_LOGINPATH: /brave-pr/admin
PERCH_PATH: C:\MAMP\htdocs\brave-pr\admin
PERCH_CORE: C:\MAMP\htdocs\brave-pr\admin\core
PERCH_RESFILEPATH: C:\MAMP\htdocs\brave-pr\admin\resources
Image manipulation: GD Imagick
PHP limits: Max upload 2M, Max POST 8M, Memory: 128M, Total max file upload: 2M
F1: 3b606135b33e6a102526838f4152a807
Resource folder writeable: Yes
HTTP_HOST: localhost:81
DOCUMENT_ROOT: C:/MAMP/htdocs
REQUEST_URI: /brave-pr/admin/core/settings/diagnostics/
SCRIPT_NAME: /brave-pr/admin/core/settings/diagnostics/index.php

So I'm creating my first template, but when I try and add image or url code, it doesn't accept the code entered, the format is not correct and in the admin suite it shows a 'Template tag ID ‘image ’ contains disallowed characters', 'Template tag ID ‘alt ’ contains disallowed characters','Template tag ID ‘ url ’ contains disallowed characters'.

<section>
    <img src="<perch:content type=" image " id="image " label="Image " width="800 " />" alt="<perch:content type=" text " id="alt " label="Description " required="true " help="e.g. Photo of MD John Smith with his best wig on " title="true " />" />
    <ul>
        <li><a href="#">About.</a></li>
        <li><a href="#">Work.</a></li>
        <li><a href="#">Services.</a></li>
        <li><a href="#">Clients.</a></li>
        <li><a href="#">News.</a></li>
        <li><a href="#">Contact.</a></li>
    </ul>
</section>
<section>
    <h3>
        <perch:content id="heading" type="text" label="Heading" required="true" />
    </h3>
    <perch:content id="body" type="textarea" label="Body" markdown="true" editor="simplemde" />
</section>
<section>
    <h3>Brave tweets.</h3>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi dui turpis, cursus eget orci amet aliquam congue semper. Etiam eget ultrices risus nec tempor elit.</p>
</section>
<section>
    <h3>
        <perch:content id="heading" type="text" label="Heading" required="true" />
    </h3>
    <perch:content id="number" type="text" label="Telephone number" required="true" />
    <a href="<perch:content id=" url " type="text " label="Email Address " />">
        <perch:content id="link" type="text" label="Link Text" />
    </a>
    <br>
    <perch:content id="address" type="text" label="Poatal Address" required="true" />
    <ul class="icons">
        <li><a href="#" class="icon style2 fa-twitter"><span class="label">Twitter</span></a></li>
        <li><a href="#" class="icon style2 fa-facebook"><span class="label">Facebook</span></a></li>
        <li><a href="#" class="icon style2 fa-instagram"><span class="label">Instagram</span></a></li>
        <li><a href="#" class="icon style2 fa-linkedin"><span class="label">LinkedIn</span></a></li>
        <li><a href="#" class="icon style2 fa-envelope"><span class="label">Email</span></a></li>
    </ul>
</section>

Any help would be welcome. Thanks