Mac SEO Blog

Create effective 404 Page Not Found error trapping pages in EverWeb.

Have you ever tried to access a website page and got a ‘404 Page Not Found’ instead? It’s a problem that Internet users come across on a regular basis. ‘404 Page Not Found’ also has siblings such as

404 Error

404 Not Found

Error 404

The requested URL [URL] was not found on this server

HTTP 404

Error 404 Not Found

404 File or Directory Not Found

HTTP 404 Not Found

404 Page Not Found

A ‘404 Page Not Found’ message is in fact an HTTP (HyperText Transfer Protocol) standard response code. The ‘404’ response code can occur for many reasons when you’re trying to access a website page on a server e.g. the link to the page you are looking for is either dead or broken as the page has either been moved or removed. The message may also occur if you have simply mistyped the name of the web page in your browser’s search box.

Why Are ‘404’ Type Messages Important?

If a visitor to your website comes across a broken or dead link (e.g. you have moved, removed or renamed a page but not updated the link to it) they will get the standard ‘404’ type message. The visitor can click the back button in their browser to go back, or they could move away from your website and search elsewhere instead.

The important part of a ‘404’ message is how to direct your visitor to where you want them to go next if this error occurs e.g. back to your Home page. In this way you keep your visitor inside your website so they’re less likely to leave for a different website.

Capturing and redirecting visitors who get a ‘404’ message adds professionalism to your website. Even though many of us are Internet savvy, there are still many Internet users who will be baffled by ‘404’ type messages. Giving these visitors information on how and why the ‘404’ happened is both informative and educational.

What Can I Do About ‘404’ Type Messages?

The easiest way to control ‘404’ type messages is to create an error trapping page in EverWeb that captures the ‘404’ event and provides your visitor options on how to proceed. This ‘error trapping’ page can also tell the visitor why they have arrived there and not at the page they expected!

Making Your Own ‘404’ Error Trapping  Page

You can trap a ‘404’ error and redirect your visitor to an error trapping page where they navigate your website again. Here’s how to do it…

1. Create a new page in your EverWeb Project and give it an appropriate name e.g. ‘404 Page Not Found’. Do not include the page in any Navigation Menu. If you have mobile website pages in your Project also create a mobile version of your 404 error page too.
2. In your error trapping page, include a link to your Home page or include a Navigation Menu. In this way the visitor has a way to return to your website.
3. Try to include an explanation in simple language as to why the user has been directed to the page e.g.
   1. The page you are trying to access is no longer available or
   2. The link to the page your are trying to access is broken or not available or
   3. There is an unspecified problem
   4. Include a contact email address if visitors want to contact you about their problem
   5. Or just include all of the above!
4. Once you have finished the mobile version of the page, go to the Inspector Tab. In the ‘Mobile Settings’ section check the box for ‘This page is for mobile devices’. For the page you created for desktop environments, again go to the ‘Mobile Settings’ section. In ‘Mobile Page’ drop down select the mobile error trapping page. These steps will ensure that the visitor will get the right style of page if they get a ‘404’ type error.
5. If you have an EverWeb+Hosting account go to your Site Publishing Settings either by clicking on your Project name in the Web Page List, or by using the File-> Edit Publishing Settings menu. Check that the ‘Publish To:’ drop down box shows ‘EverWeb’. Scroll down the settings page until you get to Advanced Options. The only option in this section is ‘Not Found Page’. Use the drop down menu to select your 404 Page Not Found error page. That’s all there is to do!
6. If you do not have an EverWeb+Hosting account and use your own host provider, they should be able to tell you how to include a link to your ‘404’ error trapping page within their own Control Panel. Note also that your host provider may offer other alternatives for capturing and dealing with this type of error.
7. Once you have all the setup steps completed, publish your website. To test your error page, all you have to do is to type in the name of one of your websites web pages incorrectly. The error page should show up!

How Can I Avoid Getting ‘404’ Type Errors?

As always the best way to avoid your visitors getting ‘404’ type messages is by testing your website’s links. This is especially true if you have set up links by hand. You should also document your website and it’s links so that you always know where they are and where they should link to.

Have Fun With the ‘404’

404 error pages have come to be renowned for their humour, trying to bring a bit of a smile to the error message. There are lots of examples out there and even a website especially dedicated to the subject at http://www.404errorpages.com

If you have designed a fun ‘404’ page why not share it with us! And don’t forget there’s also a video walkthrough available on YouTube!

EverWeb on Social Media

You can also find EverWeb on the following social media platforms:

Facebook

Google+

Flipboard

YouTube

Twitter handle @ragesw

November marked EverWeb’s second anniversary since launch with a new beta test version  (1.9.5) available for testing. There are also blogs highlighting the new version 1.9 features, tips on masking and a special spotlight on websites for photographers… Enjoy this month’s Highlights and let us know if you have any comments, we’re here to help!

Happy Birthday EverWeb!

EverWeb was first released to the public in November 2013 and since launch has garnered great reviews from iMore, Tuaw, MacLife and more. The EverWeb team’s goal was to deliver frequent updates to keep pace with today’s rapidly moving tech landscape and to give you the features you wanted most. Now at version 1.9, you can see below that EverWeb’s added a wealth of features and enhancements since 1.0 but still remains the most user friendly website building product there is!  Here are just some of the features we’ve added since version 1.0…

• Master Pages
• Password protection features
• 404 page not found and 301 redirect features
• Powerful PayPal E-Commerce Widget
• Integrated video tutorials
• Direct to FTP Publishing
• Enhanced Image Gallery and Image Slider Widgets
• Retina Display support
• New UI for OS X Yosemite
• Alt Text support for better SEO
• Mask button in the Toolbar
• Google Fonts Support
• Header Text Widget
• Auto Save
• Navigation Menu Widget Enhancements
• Back Up Projects feature
• Duplicate Project feature
• Popup Window Hyperlinks
• Fixed Position and Full Width Support
• Enhanced Asset Management features
• Great SEO support for mobile websites
• Faster redirects for mobile websites
• Google optimised mobile websites
• Improved, faster publishing and uploading speeds
• Smaller, faster loading websites with improved caching
• Show/Hide Toolbar and Presentation Mode
• Over 40 Theme Templates included
• 17 built in widgets that extend EverWeb further
• Language support for Spanish, Japanese, German and Italian

…and there’s much, much more that we don’t have the space to include here!

To make sure you’re up to date with the latest version,  just launch EverWeb and select the ‘EverWeb-> Check for Update’ menu option. As we look forward already to 2016, there’s lots being planned for EverWeb’s third year, so stay in touch. Our ‘Keep up to date with EverWeb’ section below tells you how…

EverWeb Latest News

EverWeb version 1.9 was released the public in October. November saw a new version, EverWeb 1.9.5, enter beta test. It’s available from the EverWeb discussion forum if you want to test it out. The beta test version focuses on speed, memory efficiency and stability as well as including requested improvements. Remember not to use ‘live’ Projects with the beta version and to always back up your Project files when using beta test products!

Our Latest EverWeb Blog Posts

November’s Blogs focused on those small but important new features and enhancements that were included in EverWeb version 1.9. For photographers with their own websites, there’s a special focus blog on how to get the most out of your website. We always welcome your comments and feedback, so let us know what you think below!

EverWeb Highlights: October 2015

Improvements in EverWeb 1.9 You May Not Have Noticed

12 Ways To Improve Your Photography Website With EverWeb

Our Latest EverWeb Video Tutorials

EverWeb’s YouTube channel has two new videos explaining how to add a link to another website in the Navigation menu and how to use EverWeb’s masking feature to crop images within the product.

Linking To An External Webpage in EverWeb’s Navigation Menu

How to Mask An Image In EverWeb – Cropping images in EverWeb

Keep Up to Date With EverWeb

Keep up to date with EverWeb on social media. For the latest news, features, tutorials, blogs, comments and more just click on your choice below or use our Twitter handle @ragesw

Facebook

Google+

Flipboard

YouTube

Twitter handle @ragesw

Or leave a comment in the ‘Reply’ section below if you have any questions or want to know more…

One of the most important tools a photographer needs apart from a camera is a great website. Whether you are an amateur or a professional, your website represents you, your work, your passion and your personality. In a crowded market how can your photography stand out more amongst the crowd? Here are some EverWeb tips to help you out…

1. Use The EverWeb for Photographers Video Course

If you are just starting out with EverWeb, have a look at the ‘EverWeb for Photographers Video Course‘. The nine video course introduces you to EverWeb and the key features photographers need to get a website up and running quickly and easily.

2. Remember to include SEO!

This is a key element to remember and should always have a very high priority. Effectively used SEO will help your website be more visible on the Internet as it improves your chances of a higher ranking in search engine results. Make sure to complete your SEO using the ‘SEO For EverWeb Video Course‘.

3. Use Meaningful Image Names and ALT Text Descriptions

When shooting pictures, your camera will name photos sequentially e.g. IMG-0001. That’s not great for your SEO, so be sure to rename your images to something more meaningful before you bring them in to EverWeb. Use hyphens to separate each word as that’s better for search engines. And don’t forget to add in ALT Text for your images as well. ALT Text is a descriptive piece of text used to replace the image if it cannot be displayed, e.g. when you are in a reader only mode in your browser.

4. Use Watermarks and Copyright to Protect Your Work

Many photographers rightly complain that their images are ‘stolen’ from the Internet. The only practical way to stop this is to watermark your images before you bring them in to EverWeb. It’s also good to add a copyright to each of your web pages as another theft deterrent.

5. Show Off Your Personality

Photography is a very personal hobby or profession. Use this to your advantage when building your website. Design your website in such away that it shows your audience who you are, what makes you different from the crowd and what interests you most. Include a photo of yourself on your ‘About’ page, and consider making a blog about your work, experiences, where you’ve exhibited etc. There’s more information on blogging in EverWeb in the ‘How to Blog in EverWeb’ video tutorial.

6. Use Social Media To Spread The Word

One of the best ways to spread the word about your photography is by social media. Choose carefully where you want to target your time and effort when promoting your work and pick one or two social media outlets to begin with. Facebook is usually a great place to start so use EverWeb’s ‘Facebook Like’ to add share and like options to your website. EverWeb also includes widgets for Pinterest and Google+.

There are dozens of other social media outlets you can use such as Tumblr, Twitter, Instagram, 500px and so on. Take a look at the social media platforms that interest  and add links to them in EverWeb so you have a two way interaction between your website and social media. Look out for  tools on these websites that help you integrate your website with theirs. For example, Instagram lets you add badges to your website (see screenshots below), just select the badge you want in Instagram. Copy the code generated to the clipboard and paste it into an EverWeb HTML Snippet Widget. In this example, you don’t see the Instagram badge until you publish your website, so start by inserting the badge on a test web page or in an inconspicuous place on one of your web pages to see how it looks.

Log in to your Instagram account and go to your settings. When you select the badge you want, copy the all of the code in the code box to the clipboard.

In EverWeb add an HTML Snippet widget to your page. In the Widget Settings paste the code from Instagram. The badge will only display when you publish your website.

7. Use EverWeb’s Image Gallery and Image Slider Widgets

EverWeb’s Image Gallery and Image Slider widgets give you many different options to display your images. Use these widgets to create image galleries and slideshows tailored to your audience. Always put similar content together on the same page and have all your photos sized the same, in the same orientation and in the same resolution as it’s more professional. If using a slideshow, try to avoid using the thumbnails feature so that you can maximize your screen real estate for each photo and keep the visitor focused at the same time. And don’t forget to use the EverWeb’s Fonts button to change the font type, size and style of the Image Gallery and Image Slider widgets.

If you need something more specific than the Image Slider and Image Gallery widgets, check out the EverWeb discussion forum and the 3rd Party Products section.

8. Use High Quality Images

Images are going to look their best at Retina display level. They will be shaper and more detailed. Take a look at the ‘Retina Ready Images’ video tutorial for all the details on ‘Making Images Retina Ready‘. High Quality also refers to your own quality of work. Show your best photos and not the average ones!

Image should always edited in a photo editor before you bring them in to EverWeb. Programs such as Photoshop, Pixelmator, Gimp and even Preview are all fit for purpose. Within EverWeb you may find that Masking is a handy option not to forget! Don’t forget to check the size of your image files as well as if they are too large  your page download speed will be severely affected. Use the ‘Assets List’ as a check (see below) and adjust your image file sizes in your photo editor as needed.

9. Sell Your Photos Using EverWeb’s E-Commerce Features

If you are a professional photographer, you may want to offer your photos for sale. In EverWeb the PayPal Widget acclaimed widget has been considerably expanded offering a wealth of options to choose from.

If you use stock photo websites such as Shutterstock or 123RF to sell your photos add a hyperlink to your website to take your visitors to your stock photo page or add a link to your Navigation Menu as shown in our ‘Linking To An External Webpage In EverWeb’s Navigation Menu‘ video,

10. Use The Assets List

The images you use in EverWeb are stored in the Project ’s Assets List. Use the Assets List to search for photos and to check image file properties such as image dimensions, file size and image resolution. If  your page it loading slowly when published check to see if the size of one or more of your images is causing the problem. If this is the case,  reduce the file size by adjusting the images size and resolution in your photo editor.

11. Making Your Photography Website Mobile

The world is an increasingly mobile space, so having a good presence on any mobile device is a must. Testing is really important here to make sure that your photographs download quickly. Slow loading websites are the main reason why people click away to another site!

12. Make Contact Easy!

Making contact with your target audience should be simple quick and easy. Make your contact page reflect this! EverWeb’s Contact Form is ideal as it’s clean and simple to use!

Are you a photographer with a website built using EverWeb? Do you have any tips or tricks to share? Let us know below!

Every new version of EverWeb brings new and improved features and EverWeb version 1.9 is no exception with it’s enhanced HTML5 publishing engine, Presentation Mode and new Hyperlinking options. Included with these marquee features, are a host of minor enhancements and feature adds based user feedback. Here’s a run down of the some of the small, but great, features of EverWeb 1.9…

Duplicate…

Although we covered this before in the blog ‘Getting the Best from Duplicating Projects in EverWeb 1.9‘ , it’s worth mentioning again! Many EverWeb users wanted an easy way to make a copy of an existing Project file and EverWeb 1.9 adds this feature to the Project Window. To duplicate a Project file, just click on the up/down arrows to the right of the Project file name and select ‘Duplicate…’ from the menu. The duplicate is created with the same name as the original Project file but with ‘Copy’ added at the end.

Send Project File to Support…

There are some occasions where you need to send a Project file to the EverWeb Support Team. Prior to EverWeb 1.9 this was a manual process, but now it’s an integrated feature of EverWeb’s Project Window. If the Support Team asks you to send in a Project file, click on the up/down arrows to the right of the Project file name in the Project Window and select ‘Send Project File to Support…’. You’ll be asked to confirm that you need to send the file to Support. Clicking ‘Yes’ will upload it to a server and provide a link to be sent to the Support Team. Remember to only use this feature when asked to do so by the Support Team!

Pick Layer

This is a really useful little feature that can be easily missed! If you have objects that overlap or are on top of each other, such as a Navigation Menu widget on top of a coloured rectangle background shape, you have to move the top object to be able to access the object underneath. Then you would have to put the top object back in it’s original place afterwards. It’s time consuming and often requires accuracy. The new ‘Pick Layer’ option solves exactly this type of problem. Just secondary (right) click on the top object. At the bottom of the menu highlight ‘Pick Layer ->’. You will see all of the object layers available at that location from the top object down to the bottom object. Pick the ‘layer’  you want to work with it and it is then selected. That’s all there is to it – quick, simple and no fuss!

Pause on Hover

The Image Slider Widget gains a new ‘Pause on hover’ feature so that when a visitor mouses over the current slide in a slideshow, the slideshow pauses until the mouse is moved off the image. Just check the ‘Pause on Hover’ box in the Image Slider’s Widget Settings to activate this option.

Master Page and the ‘+’ Button

In the Inspector Window, the label ‘Master Template’ has been renamed to ‘Master Page’ for improved clarity.

In addition to the change of label, a ‘+’ button has been added directly to the right of the Master Page drop down selection box. The ‘+’ button allows you to add a new Master Page and customize it’s settings directly from the Inspector tab. This addition should make for more efficient work flow in the Editor Window.

New Theme Templates

There are seven new Theme Templates to enjoy in this release of EverWeb. Each new theme has six to eight different page styles included.

• Engagement
• Lavender
• Real Estate 2
• Simcoe
• Smart Watch
• Starry Night
• University

New Video Tutorials

A new video tutorial has been added for Favicon in the Site Publishing Settings screen.The video tutorial for the Image Slider has been updated as well as the Widget was significantly upgraded in EverWeb version 1.8. For more information on the Image Slider, you can also check out the blog ‘Update Your Website with EverWeb’s Updated Image Slider’.

Have you found small feature that’s been missed from our list? Let us know below!

October’s main highlight saw the release of the new EverWeb version 1.9. The latest version of EverWeb adds many under the hood features including an Enhanced HTML5 Publishing Engine for smaller, faster websites on both desktop and mobile. This and more to enjoy in this month’s Highlights edition…

EverWeb Latest News for October

EverWeb version 1.9 was released in late October with an Enhanced HTML5 Publishing Engine for faster, smaller websites. There are also some great UI enhancements such as a new Popup Window feature, Open In New Window feature, Presentation Mode and more! Check out the Blog ‘EverWeb 1.9 Released: Enhanced HTML5 Engine‘ for all the details!

Our Latest EverWeb Blog Posts

October’s Blogs focus on EverWeb version 1.9’s new Presentation Mode feature Duplicating a Project Features. There’s also in-depth blogs on how to get the best out of masking images in EverWeb, how to make a mobile website in three simple steps and much more! And feel free to comment or ask questions on any of the Blogs we feature!

EverWeb Highlights: September 2015

Building Mobile Websites in Just 3 Easy Steps

Creating Master Pages for EverWeb’s Theme Templates

Make Your Mark with Masking in EverWeb

EverWeb 1.9 Released: Enhanced HTML5 Publishing Engine

New User Interface Customisations in EverWeb 1.9

Getting the Best from Duplicating Projects in EverWeb version 1.9

Our Latest EverWeb Video Tutorials

EverWeb’s YouTube channel has four new videos to enjoy this month showcasing the new features of EverWeb version 1.9.

What’s New In EverWeb 1.9 – MacWebsite Builder

Cookie Consent Button Your EverWeb Website

Addon Domains for EverWeb+Hosting Accounts

Linking to a Popup Window In EverWeb

Keeping Up to Date With EverWeb

Keep up to date with EverWeb on the Internet! For the latest news, features, tutorials, blogs, comments and more just click on your choice below..

Facebook

Google+

Flipboard

YouTube

Or leave a comment below if you have any questions or want to know more…

When you launch EverWeb you are greeted by the Projects Window, the management centre for your EverWeb website Projects. From this window you can create new website projects, launch an existing website Project for editing and delete website Projects that are no longer needed. All of your the Projects you have already created are listed in the ‘Recent Projects’ list on the right of the window. You can sort the list using either ‘Sort By Name’ or ‘Sort By Last Modified’ date. These options are found  by clicking on the up/down arrows to the right of the words ‘Recent Projects’. On the bottom left side of the Projects Window, clicking on ‘Learn to how to use EverWeb’ takes you to a library of 47 tutorial videos to get you up and running fast if you are new to EverWeb.

Creating a Duplicate Project File

EverWeb version 1.9 introduces two new features to the Projects Window: ‘Send Project File to Support…’ and ‘Duplicate…’. Each feature is accessed by clicking on the up/down arrows the right of the Project file name (see screenshot above).

In this Blog we are going to take an in depth look at the ‘Duplicate…’ menu option. It’s a feature that’s ben requested by many EverWeb users so its great to see it in 1.9! There are many reasons why you will make a duplicate e.g. you may want a test version of a live Project file so you can safely try new features or functionality without experimenting on your live Project file. It’s also great for testing out new beta test features of EverWeb to see how your website Project can benefit from upcoming new versions of the product. Duplicating a Project file may also save you time and effort as you can create new websites quickly from ‘template’ Project files that you have set up already.

The ‘Duplicate’ function should not be used in place of backing up your Project file. Any Project file that you publish, or intend to publish, to the Web should be backed up using EverWeb’s backup feature from the EverWeb-> Preferences menu, or as part of your computer regular back up strategy.

When you click on ‘Duplicate’ EverWeb makes a copy of the Project file you selected and adds the word ‘copy’ to the end of the Project file name. As the duplicate is a new it appears at the top of the ‘Recent Projects’ list (if you are using the default Project sort order).  To change the duplicate Projects name, double click on the Project to open it. Next, double click on the Project Name in the Web Page List and enter the new name as desired. Press ‘Enter’ to finish.

When editing the Project file’s name, the Project’s Site Publishing Settings are also displayed at the same time. It’s a good opportunity to look at the  Publishing Settings to see if the publishing location is correct for the duplicate Project file. If you publish the duplicate Project to the same location as the original Project file location, EverWeb will warn you and ask you to confirm your action or cancel before publishing commences.

If you plan to re-purpose the duplicate Project file for another use, remember also to check out the Head/Footer section of the Publishing Settings for code that may cause problems, and also confirm that if using a Favicon it is the right one for your ‘new’ Project file.

Checking External Links and Widget Settings

When duplicating a Project file, check any external links that you are in your web pages and correct them, or remove them, if necessary  This may be important when using Social Media buttons that direct visitors to specific pages such as in Facebook, LinkedIn, Google+ etc. Check any hyperlinks in case you have any links to External URL’s that need to be modified or removed.

If your mobile web pages are contained in a separate EverWeb Project file you may need to review the Mobile Settings in the Page Settings tab of the Inspector Window to make sure that any external links are still valid. The same applies to any to any 404 Error Pages or 301 Redirects that you may have applied to your web pages.

Widgets are another source of links that should be checked and changed, even such things as addresses in the Google Maps should be checked to save you potential embarrassment!

Don’t forget to test out any links that you have changed in your Project file using Preview before going live.

Check Your Code

If you have any code inserted into your Project it’s worth checking it to make sure it applies to your duplicate Project. The HTML Snippets Widget, the Header/Footer code area in the Page Settings of the Inspector Window and the Head/Footer area in the Publishing Settings should all be reviewed in case the code it needs modification or removal. Whilst on the subject of code, if you have added any analytics to your website Project such as Google Analytics, you may need to create new Analytics for your ‘new’ Project file including a new verification code.

Check Anything that Uses an Email Address

Remember to check anywhere that an email address is used such as the PayPal Widget, Hyperlinks to an email message and the Contact Forms as email addresses may need review and amendment. You may also want to review any auto-reply messages that are sent when visitors such as the ‘Email Sent Success Message’ in the Contact Form Widget.

Assets Housekeeping

After duplicating a Project file you will probably edit it so that it is fit for it’s new purpose. Once you have made the changes you want it  remove any Assets that are no longer needed in the Project file. To do this, click on the Assets tab in the Inspector Window. Click on the up/down arrows to the right of the word ‘Assets’ which is just below the search box. From the menu that appears select ‘Find Unused Assets’ to locate any assets that are no longer needed and that can be deleted. Deleting unused assets will reduce the size of your Project file which is beneficial when you are editing and publishing your website.

EverWeb’s new Duplicate feature is a great time, cost and effort saver. Make sure that any re-purposed Project files are thoroughly checked so no legacy issues remain from the original Project file that are not intended to be there! Finally, as always don’t forget to test out your website using Preview before publishing.

EverWeb on Social Media

You can also find EverWeb on the following social media platforms:

Facebook

Google+

Flipboard

YouTube

Twitter handle @ragesw

EverWeb version 1.9 comes with new options to customize the User Interface (UI) to suit your needs when creating and editing your web pages. Before looking at the new version 1.9 features, it’s worth reviewing the UI features that can be found in previous EverWeb versions…

If screen real estate is at a premium, you can hide the Inspector Window on the right hand side of EverWeb’s UI. Use the menu command Window->Hide Inspector, or the keyboard shortcut Alt+Cmd+I (see screenshot below). Hiding the Inspector Window is especially useful when working with a small screen size laptop. The option only works whilst the Project is open. If you close the Project, or quit EverWeb, the Inspector Window will be visible by default the next time you open the Project.

The EverWeb UI with the Inspector Window hidden using shortcut key Cmd+Alt+I

If you want to hide the layout and object border lines so you can more easily see how your design is going to look, use the Window-> Hide Layout menu option or the Shift+Cmd+L keyboard shortcut. In addition to the layout and object border lines being hidden, all other markers such as Master Page object symbols (the black page symbol), the locked object Padlock symbol and grouped objects borders are also hidden. There is one exception to this which is the Hyperlinks Indicator. To turn off this indicator use the EverWeb-> Preferences-> General menu option.

As with ‘Hide Inspector’ if you close your Project or quit EverWeb, the settings will need to be reapplied next time you open the Project.

The new EverWeb version 1.9 introduces some new UI customisation features that can be used in conjunction to those described above. The first new UI customisation option is Presentation Mode which hides the Web Page List on the left of the screen, the Inspector Window on the right of the screen and the Toolbar at the bottom. Your current Layout and Hyperlink settings are unaffected.

Presentation Mode is ideal when you want to quickly review the look of your web page layout without using Preview. It’s also perfect when you have limited screen real estate available (see screenshot below). To activate Presentation Mode, select Window-> Presentation Mode from the menu, or use the Cmd+. (period) keyboard shortcut. When in Presentation Mode you can still edit the web page, use EverWeb’s menus and perform secondary clicks on objects as you would usually do. If you have turned off the layout boundary lines, you will notice that in Presentation Mode they become visible when you drag and drop an object around the Editor Window.

Presentation Mode in EverWeb 1.9 with the new University Theme ‘Home’ Template.

When Presentation Mode is selected, you have the ability to add back the Inspector Window and/or Toolbar to create a truly customised look to your work environment. To do so use the Window-> Show Inspector menu option (Cmd+Alt+I) and/or the Window-> Show Toolbar (Cmd+Alt+T) menu option.

EverWeb 1.9 with the Web Page List and the Inspector Windows hidden so that only the Toolbar is displayed.

If you only want the EverWeb UI to show Web Page List, and not the Toolbar or Inspector Window, first make sure Presentation Mode is off (use Cmd+. toggle to do this). Next unselect the Toolbar and the Inspector Window by the using the Cmd+Alt+T and Cmd+Alt+I commands respectively or by using their equivalent Window menu commands.

EverWeb 1.9 showing only the Web Page List

Presentation Mode is only valid per session. If you close the project or EverWeb, the setting will need to be applied again next time you open the project.

EverWeb version 1.9 also includes the often requested option to hide the Toolbar using the Window->Hide Toolbar menu option (or Cmd+Alt+T toggle). All Toolbar options are still available through the menus, with Preview being added to the File Menu in the EverWeb 1.9 release. The Hide Toolbar option is applied globally. Once applied, it remains in place and for ALL of your Projects even when you close and reopen them, or if you quit and relaunch EverWeb itself.

EverWeb version 1.9 with the Toolbar hidden using the shortcut key Cmd+Alt+T

EverWeb version 1.9’s new UI customisation options now let you display your workspace as you want it, quick and easy!

Summary of EverWeb’s UI Modes

• Hide Web Page List, Inspector Window & Toolbar = Presentation Mode (Cmd+.)
• Hide Inspector Window Only = Window-> Hide Inspector (Cmd+Alt+I)
• Hide Toolbar Only = Window-> Hide Toolbar (Cmd+Alt+T)
• Hide Web Page List Only = Presentation Mode + Window-> Show Inspector + Window-> Show Toolbar

Other Useful EverWeb UI Options

• Hide Layout = Window-> Hide Layout (Shift+Cmd+L)
• Hide Hyperlink Indicators = EverWeb-> Preferences-> General

The speed of your website is extremely important. It not just improves your visitor’s experience, but it also helps ensure higher search engine rankings.

Super Faster Websites With EverWeb 1.9

Over the last few months we worked on a new feature of EverWeb that combines all common assets uses on Master Pages into one directory. This means that your media files and styling information are only exported once resulting in;

1. Faster website publishing and uploading
2. Smaller websites
3. Faster loading websites due to browser caching. This means that for every subsequent visit to your website, they will load faster for your visitors. Also, each page visited by your customers will load faster

Plus we added a few more tricks to get your websites loading much faster;

1. Better support for retina displays using new HTML5 tags. This means modern browsers such as the latest versions of Safari, Chrome (for desktop and iOS) and Firefox, as well as many other browsers, will load your websites much faster and use less bandwidth.
2. Faster mobile redirects using optimized code that gets executed as the first instructions to your browsers so mobile pages gets redirected much faster than before. Plus we follow every one of Google’s recommendations for properly optimized mobile pages, without any additional work on your part!

EverWeb 1.9 also has these highlighted new features which we will discuss in more details in future blog posts. We also made a video tutorial outlining the new features for you.

We went even further with EverWeb 1.9 with some highly requested features and enhancements;

1. A new popup window option under the hyperlink tab so you can link to a page that pops up over the current page
2. A new presentation mode (Window menu->Presentation mode) to maximize the space given to the design canvas. This feature hides the web page list, toolbar and Inspector so smaller screens can see their entire website design
3. The ‘open in new window’ option under the hyperlinks tab now works for the link to ‘one of my pages’ and ‘to a file’ option. Now you can open PDF documents for example in a new window without any additional code or widgets

Easily Update To EverWeb 1.9

We’ve got a lot more packed into EverWeb 1.9. You can easily update by;

1. Launching EverWeb and going to the EverWeb menu at the top of your screen and selected ‘Check for Update’
2. Downloading EverWeb from the EverWeb website.

Remember, you won’t lose any previous data when updating since your website project files are stored elsewhere on your computer.

Do You Like EverWeb 1.9?

Tell us what you think, head over to our growing discussion forum and lets talk about the new features in EverWeb 1.9!

Helping Each Other

Oh and one more thing, we’re really obsessed with offering the best support! One big issue we found is that sometimes we need your website project files which can be BIG. So we built in a way to quickly share your project file with us. Simply click the little arrows in the projects window and select the ‘Send to RAGE Software Support’. Your project file will be automatically sent to us, no more using dropbox or other file transfer service.

EverWeb’s Mask tool is an easy way to hide part of an image without having to crop the image itself. Masking is great when you want to keep an image in tact. It’s also useful as you can reuse one image in a number of different ways so saving you time and effort. Here are some ideas on how you can get the most out of image masking…

First create a web page and style it as you wish. In the example below, we are using an online financial news service covering the Stock Market. The web page created has a newspaper style format. The web page illustrates that it’s been a good week on the Stock Market emphasising this by using the image of a bull to show a ‘bullish’ market.

Place the image you want to use on to the Editor Window by dragging and dropping it from it’s original source. Place and resize the image according to your own requirements.

The example web page shows the original image in the top right. Masks of the original image appear with different effects behind  behind the headline and in the second half of the page.

In our example, the complete image is shown in the top right of the page underneath the headline. We can now reuse the image in our news article. To do this, either select the image in the Editor Window and copy and paste it as many times as desired or drag and drop the image on to page as many times as you want from the Assets List.

These two methods use the same image file in the Assets List. Do not repeatedly drag and drop the image on to the Editor Window from it’s original source as all you will be doing is duplicating the file in the Assets List. It will also lead to slower page download speeds as well as you have to download multiple images and not just one image.

In our example, we want to isolate the bull in the picture and use just part of the image picture later on in the page. To do this, first select the image that you have copied. Next we will apply a mask.

Click on the ‘Mask’ button in the Toolbar at the bottom of the Editor Window. Alternatively, use Format-> Mask from the menu, or for speed, the shortcut key Shift+Cmd+M.

The Editor Window will now become somewhat opaque. This is the mask itself that covers the whole Editor Window. The square window at the centre of the image is the ‘unmasked’ area and is bordered with a dashed line. Notice that the image under the mask still has grab handles around it. This means that you can reposition the image  underneath the unmasked square. Click, hold and drag the image to where you want it, just make sure that when you start this operation that you do not click inside the unmasked square itself.

To move the unmasked square over the top of the masked image, click and hold the centre of the square and drag and drop it to the desired location. When you do this operation the unmasked square will then show grab handles around it.

If the unmasked square does not have grab handles around it, click once in the square. You will now be able to resize the unmasked square to show more or less of the underlying image. Click and drag the grab handle(s) to resize the square as you would do with any other object.

When finished, click in an area outside of the whole image. The masking will disappear and you will only see the part of the image that you defined in the mask. It’s important to remember to click outside of the whole image boundary for this to work correctly.

To remove the mask, select the masked image. The Mask button in the Toolbar will now be named as ‘Unmask’. Select this and the whole image will become visible again.

Masked objects are like any other objects and so can be moved, deleted, copied etc. You can add effects to the masked image using the Shape Options and Metrics Inspector options. In our example we have applied some Picture Frames,  changed the masked image shape style from a rectangle to an arrowhead and used the Full Width option to create the banner effect behind the headline.

Images can also be resized even when masked using the grab handles that appear when you select the image. As you do this, the mask will also change in size. This is useful if you find that your original masking was not ‘spot on’ and you need to do some slight readjustments without having to redo the complete mask.

In all other instances, if the masking is incorrect it’s best to unmask then apply the mask again. Additionally, avoid using ‘Undo’ and ‘Redo’ commands (e.g. if you resize the mask area then decide to undo the action) as this can have unexpected results. Finally, to mask successfully, do not move the masking square outside the boundaries of the original image as this may cause unexpected results.

The completed web page above includes four masked pictures and the original picture which should also save time on page download speeds. Masking is a excellent tool to use images in versatile ways whilst also adding design flair to your web pages.

Gone are the days when the word ‘template’ immediately conjured up pictures of really bad looking PowerPoint presentations! Today templates are design savvy. EverWeb has over 40 stylish theme templates in a wide variety of subjects for you to choose from.

All EverWeb themes include ‘Home’, ‘Contact’, ‘Photos’, ‘Videos’, ‘Blank’ and ‘Mobile’ template pages. Some themes also include a ‘Coming Soon’ and/or ‘Shop’ template.

As EverWeb organises template pages by theme, it’s quick and easy to develop a professional looking website in next to no time. All themes include EverWeb’s built in widgets, such as the Navigation Menu, Contact Form, Google map etc.

Template themes are a good way to learn about designing websites in EverWeb as well the exploring the product’s own feature set. For example, the ‘Aurora’ theme includes the ‘Full Width’ feature introduced in EverWeb version 1.8. Theme templates also help you test out your own ideas without the hassle of building test pages first from scratch.

Using EverWeb’s Template Themes

To use a theme template, just select the ‘Add Page’ button. Click on the theme of your choice from the list on the left, then click on the template you want to the right. Click the ‘Select’ button to add the template to the Web Page List (see below).

The EverWeb theme template selection dialog box

A theme template is only downloaded to your computer when you select it for use for the first time. When you select your theme template page, EverWeb automatically downloads the theme and then adds the page you selected to the Web Page List. Theme templates not yet downloaded to your computer are indicated by a down arrow within a circle icon to the right of the theme name. Pressing on the icon initiates a ‘manual’ download of the selected theme template.

Creating a Master Page to Use With Your Theme Template

If you have already added theme template pages, such as ‘Home’, ‘Photos’, ‘Contact’ etc., to your EverWeb Project, you can customize each as you would any other web page that you would create yourself. Some objects on your theme template pages use EverWeb’s built in Widgets. To access a widget’s customization features, click on the ‘Widget Settings’ cog in the Inspector Window.

If you find that you are making the same customisations for every page type e.g. changing the background color, using a Master Page instead would be better as it will save time and effort now and for any future customisations that may be needed. Here’s how you can quickly add a theme based Master Page to your template page…

In our example, we will be using the ‘Teacher’ template to build a website for our fictional teachers ‘Tim and Tim’, who provide tuition services for those with learning difficulties at their school.

1. If you have not done so already, create a website project. When you create a new Project you will be asked to add a page immediately. Scroll down the theme template list on the left and select the ‘Teacher’ theme.

2. Next, scroll down the right hand side of the dialog box which shows you the templates available for the chosen theme. Click on the  ‘Blank’ template page, then press the ‘Select’ button.

3. If the ‘Teacher’ theme template has not been downloaded already, EverWeb will do this automatically. The ‘Blank’ page incorporating the ‘Teacher’ theme will be added to your Web Page List.

4. To create our themed Master Page, click on the ‘Blank’ page name in the Web Page List and drag and drop it into the blue section above. This area is where Master pages are listed.

The blank ‘Teacher’ theme template added as a Master Page by dragging and dropping the ‘Blank’ page from the Web Page List into the blue area.

5. You will now see that a Master page called ‘Blank’ has been created. Double click on the name of the Master page, rename it and press enter to complete the renaming. Now customize the page as you wish. In our example, we have changed the background color, the text itself to ‘Tim & Tim Teaching’, the font size and style, added a YouTube social media button (or video learning) and moved the buttons to the left hand side, making them fixed position so that as the visitor scrolls up and down the page, the buttons stay in place. The Navigation Menu widget was also customized and centered with the rectangular shape resized. All these changes only took a few minutes to complete. You can see the results below…

6. You can now use this template on any new pages you create. To add a ‘Home’ page to our website project, first click in the grey area of the Web Page List. To add the ‘Teacher Home’ page theme template click on the ‘Add Page’ button and select the Teacher ‘Home’ page template style.

7. Once the ‘Home’ page has been added (shown below), go to the Inspector Window. In the ‘Page Settings’ tab, attach the Master Page that you created earlier using the drop down box beside ‘Master Page’. You will know that the Master Page has been attached as the ‘Home’ page background changes and some objects now have Master Page object symbols in their top right hand corner as shown by the black page symbol.

The default Teacher theme Home Page template.

8. Notice that you now have some objects on the page twice. One of the duplicates includes the Master Page object symbol in the top right hand corner. As you cannot delete this from the normal page, select the other duplicate and delete that one instead. Repeat the process until all duplicates are removed. Remember that some objects may lie completely on top of their Master Page counterparts, and also remember objects that may be in the footer of the page. Once you are finished, you have a restyled ‘Home’ page customized, but still based on the original Teacher theme (see screenshot below).

The completed Home page…

9. Repeat the process above until you have all of the pages you want. You can delete the ‘Blank’ page from the Web Page List as it was only needed to make the Master page.

Don’t forget to fill in the Page Settings tab so that you get the best SEO possible. Check out our previous Blog ‘How To Use EverWeb’s SEO Features‘ for more information. If you want to know more about Master Pages, take a look at our Blog ‘All You Need to Know About EverWeb Master Pages‘.

Finally, to see the results of your work, use Preview before you finally publish your website!